@font-face {
  font-family: es-icon;
  src: url(/static-dist/app/fonts/es-icon.eot);
  src: url(/static-dist/app/fonts/es-icon.eot#iefix) format("embedded-opentype"),
    url(/static-dist/app/fonts/es-icon.woff) format("woff"),
    url(/static-dist/app/fonts/es-icon.ttf) format("truetype"),
    url(/static-dist/app/fonts/es-icon.svg#es-icon) format("svg");
}

.course-bgBlue {
  background: #171f6c;
}

#task-create-type .es-icon-graphicclass,
#task-create-type .es-icon-videoclass,
#task-create-type .es-icon-videocam,
#task-create-type .es-icon-filedownload,
#sortable-list .es-icon-graphicclass,
#sortable-list .es-icon-book,
#sortable-list .es-icon-videoclass,
#sortable-list .es-icon-videocam,
#sortable-list .es-icon-filedownload,
.es-bar .bar-menu-top .es-icon-book,
.user-avatar-li .dropdown-menu .es-icon-mail {
  width: auto !important;
  height: auto !important;
  float: none !important;
  margin: 0 !important;
  background: none !important;
}

.es-icon {
  font-family: es-icon !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.es-icon-qrcode:before {
  content: "\E615";
}

.es-icon-search1:before {
  content: "\E6CD";
}

.es-icon-time:before {
  content: "\E69D";
}

.es-icon-likefill:before {
  content: "\E6CE";
}

.es-icon-like:before {
  content: "\E6CF";
}

#task-create-type .es-icon-videocam:before,
#sortable-list .es-icon-videocam:before {
  content: "\E678";
}

.es-icon-videocam:before {
  content: "\E66D";
}

.es-icon-home1:before {
  content: "\E6D0";
}

.es-icon-homefill:before {
  content: "\E6D1";
}

.es-icon-anonymous-iconfont:before {
  content: "\E666";
}

.es-icon-wenhao:before {
  content: "\E671";
}

.es-icon-dot:before {
  content: "\E68A";
}

.es-icon-add:before {
  content: "\E6D7";
}

.es-icon-close01:before {
  content: "\E68E";
}

.es-icon-view:before {
  content: "\E6A4";
}

.es-icon-youjian1:before {
  content: "\E6D6";
}

.es-icon-markzhuanhuan:before {
  content: "\E6C9";
}

.es-icon-icon_close_circle:before {
  content: "\E687";
}

.es-icon-focus:before {
  content: "\E69E";
}

.es-icon-angledoubleright:before {
  content: "\E67D";
}

.es-icon-angledoubleleft:before {
  content: "\E67E";
}

.es-icon-playcircleoutline:before {
  content: "\E66D";
}

.es-icon-zhongchuan:before {
  content: "\E7CC";
}

.es-icon-portrait:before {
  content: "\E65E";
}

.es-icon-accesstime:before {
  content: "\E658";
}

.es-icon-accountcircle:before {
  content: "\E668";
}

.es-icon-addbox:before {
  content: "\E65F";
}

.es-icon-checkbox:before {
  content: "\E660";
}

.es-icon-explore:before {
  content: "\E67F";
}

.es-icon-forum:before {
  content: "\E662";
}

.es-icon-history:before {
  content: "\E670";
}

.es-icon-removecircle:before {
  content: "\E66C";
}

.es-icon-thumbup:before {
  content: "\E659";
}

.es-icon-reply:before {
  content: "\E65A";
}

.es-icon-textsms:before {
  content: "\E657";
}

.es-icon-alarmon:before {
  content: "\E672";
}

.es-icon-assignment:before {
  content: "\E679";
}

.es-icon-assignmentind:before {
  content: "\E661";
}

.es-icon-keyboardarrowdown:before {
  content: "\E663";
}

.es-icon-keyboardarrowup:before {
  content: "\E664";
}

.es-icon-language:before {
  content: "\E65B";
}

.es-icon-link:before {
  content: "\E690";
}

.es-icon-livehelp:before {
  content: "\E680";
}

.es-icon-locallibrary:before {
  content: "\E66E";
}

.es-icon-loyalty:before {
  content: "\E65C";
}

.es-icon-mylibrarybooks:before {
  content: "\E67A";
}

.es-icon-mylocation:before {
  content: "\E669";
}

.es-icon-phone:before {
  content: "\E676";
}

.es-icon-permcontactcal:before {
  content: "\E66F";
}

.es-icon-publish:before {
  content: "\E66A";
}

.es-icon-removeredeye:before {
  content: "\E67B";
}

.es-icon-remove:before {
  content: "\E667";
}

.es-icon-addcircle:before {
  content: "\E66B";
}

.es-icon-search:before {
  content: "\E600";
}

.user-avatar-li .dropdown-menu .es-icon-mail:before {
  content: "\E601";
  font-size: 16px !important;
}

.es-icon-mail:before {
  content: "\E601";
  font-size: 20px;
}

/* .es-icon-mail {
    width: 19px;
    height: 22px;
    display: inline-block;
    margin-right:10px;
    background-image: -webkit-image-set(url('/static-dist/app/img/shenlan19/notice02_icon@2x.png') 2x);
}
.headerIndex .es-icon-mail{
    background-image: -webkit-image-set(url('/static-dist/app/img/shenlan19/notice01_icon@2x.png') 2x);
} */

.es-icon-personadd:before {
  content: "\E602";
}

.es-icon-person:before {
  content: "\E604";
}

.es-icon-arrowdropdown:before {
  content: "\E603";
}

.es-icon-drafts:before {
  content: "\E605";
}

.es-icon-notifications:before {
  content: "\E606";
}

.es-icon-notificationsoff:before {
  content: "\E607";
}

.es-icon-notificationson:before {
  content: "\E608";
}

#sortable-list .es-icon-book:before {
  content: "\E609";
}

.es-icon-book:before {
  /*content: "\E609"*/
}

.es-bar .bar-menu-top .es-icon-book:before {
  content: "\E609";
}

.es-icon-book {
  width: 13px;
  height: 12px;
  float: left;
  margin-right: 4px !important;
  background: url("/static-dist/app/img/2018/1.0/course_details/xiayixuexirenwu_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/course_details/xiayixuexirenwu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/course_details/xiayixuexirenwu_icon@2x.png") 2x);
}

.es-icon-bookmarkoutline:before {
  content: "\E60A";
}

.es-icon-bookmark:before {
  content: "\E60B";
}

#task-create-type .es-icon-graphicclass:before,
#sortable-list .es-icon-graphicclass:before {
  content: "\E60E";
}

.es-icon-graphicclass:before {
  content: "\E60E";
}

/* .es-icon-graphicclass {
    width: 16px;
    height: 17px;
    float: left;
    background: url('/static-dist/app/img/2018/1.0/public_class/download_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/public_class/download_icon.png') 1x, url('/static-dist/app/img/2018/1.0/public_class/download_icon@2x.png') 2x);
}

.new-dashboard-sidebar .task-item.active .es-icon-graphicclass {
    background: url('/static-dist/app/img/2018/1.0/public_class/download_active_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/public_class/download_active_icon.png') 1x, url('/static-dist/app/img/2018/1.0/public_class/download_active_icon@2x.png') 2x);
} */

.es-icon-description:before {
  content: "\E60F";
}

.es-icon-phone1:before {
  content: "\E610";
}

.es-icon-swaphoriz:before {
  content: "\E611";
}

.es-icon-audioclass:before {
  content: "\E60D";
}

.es-icon-flashclass:before {
  content: "\E612";
}

.es-icon-pptclass:before {
  content: "\E613";
}

#task-create-type .es-icon-videoclass:before,
#sortable-list .es-icon-videoclass:before {
  content: "\E614";
}

.es-icon-videoclass:before {
  /* content: "\E614" */
  content: "\E66D";
}

/* .es-icon-videoclass {
    width: 16px;
    height: 17px;
    float: right;
    background: url('/static-dist/app/img/2018/1.0/public_class/shipinbofang_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/public_class/shipinbofang_icon.png') 1x, url('/static-dist/app/img/2018/1.0/public_class/shipinbofang_icon@2x.png') 2x);
} */

.es-icon-crown:before {
  content: "\E616";
}

.es-icon-exit:before {
  content: "\E617";
}

.es-icon-arrowback:before {
  content: "\E618";
}

.es-icon-arrowdropup:before {
  content: "\E619";
}

.es-icon-arrowforward:before {
  content: "\E61A";
}

.es-icon-chevronleft:before {
  content: "\E61B";
}

.es-icon-chevronright:before {
  content: "\E61C";
}

.es-icon-refresh:before {
  content: "\E61D";
}

.es-icon-menu:before {
  content: "\E61E";
}

.es-icon-android:before {
  content: "\E61F";
}

.es-icon-apple:before {
  content: "\E620";
}

.es-icon-comment:before {
  content: "\E621";
}

.es-icon-favoriteoutline:before {
  content: "\E622";
}

.es-icon-favorite:before {
  content: "\E623";
}

.es-icon-flag:before {
  content: "\E624";
}

.es-icon-help:before {
  content: "\E625";
}

.es-icon-home:before {
  content: "\E626";
}

.es-icon-importexport:before {
  content: "\E627";
}

.es-icon-lock:before {
  content: "\E628";
}

.es-icon-noteadd:before {
  content: "\E629";
}

.es-icon-power:before {
  content: "\E62A";
}

.es-icon-setting:before {
  content: "\E62B";
}

.es-icon-share:before {
  content: "\E62C";
}

.es-icon-starhalf:before {
  content: "\E62D";
}

.es-icon-staroutline:before {
  content: "\E62E";
}

.es-icon-star:before {
  content: "\E62F";
}

.es-icon-studydone:before {
  content: "\E630";
}

.es-icon-study:before {
  content: "\E631";
}

.es-icon-toc:before {
  content: "\E632";
}

.es-icon-calendar:before {
  content: "\E633";
}

.es-icon-contentcopy:before {
  content: "\E634";
}

.es-icon-delete:before {
  content: "\E635";
}

.es-icon-done:before {
  content: "\E636";
}

.es-icon-edit:before {
  content: "\E637";
}

#task-create-type .es-icon-filedownload:before,
#sortable-list .es-icon-filedownload:before {
  content: "\E638";
}

.es-icon-filedownload:before {
  content: "\E638";
}

/* 
.es-icon-filedownload {
    width: 16px;
    height: 17px;
    float: right;
    background: url('/static-dist/app/img/2018/1.0/public_class/download_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/public_class/download_icon.png') 1x, url('/static-dist/app/img/2018/1.0/public_class/download_icon@2x.png') 2x);
}

.new-dashboard-sidebar .task-item.active .es-icon-filedownload {
    background: url('/static-dist/app/img/2018/1.0/public_class/download_active_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/public_class/download_active_icon.png') 1x, url('/static-dist/app/img/2018/1.0/public_class/download_active_icon@2x.png') 2x);
} */

.es-icon-fileupdate:before {
  content: "\E639";
}

.es-icon-help1:before {
  content: "\E63A";
}

.es-icon-infooutline:before {
  content: "\E63B";
}

.es-icon-info:before {
  content: "\E63C";
}

.es-icon-send:before {
  content: "\E63D";
}

.es-icon-today:before {
  content: "\E63E";
}

.course-learn-list .es-icon-today:before {
  content: "";
}

.course-learn-list .es-icon-today {
  width: 8px;
  height: 12px;
  float: left;
  margin-right: 4px !important;
  background: url("/static-dist/app/img/2018/1.0/course_details/xuexiyouxiaoqi_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/course_details/xuexiyouxiaoqi_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/course_details/xuexiyouxiaoqi_icon@2x.png") 2x);
}

.class-sidebar .class-signin {
  padding: 0 !important;
}

.es-icon-viewlist:before {
  content: "\E63F";
}

.es-icon-viewmodule:before {
  content: "\E640";
}

.es-icon-visibilityoff:before {
  content: "\E641";
}

.es-icon-visibility:before {
  content: "\E642";
}

.es-icon-administrator:before {
  content: "\E643";
}

.es-icon-qq:before {
  content: "\E644";
}

.es-icon-qzone:before {
  content: "\E645";
}

.es-icon-renren:before {
  content: "\E646";
}

.es-icon-weibo:before {
  content: "\E65D";
}

.es-icon-weixin:before {
  content: "\E647";
}

.es-icon-done1:before {
  content: "\E649";
}

.es-icon-undone:before {
  content: "\E64A";
}

.es-icon-whatshot:before {
  content: "\E64B";
}

.es-icon-people:before {
  /*content: "\E64D"*/
}

.es-icon-school:before {
  content: "\E64C";
}

.es-icon-groupadd:before {
  content: "\E64E";
}

.es-icon-recentactors:before {
  content: "\E64F";
}

.es-icon-doneall:before {
  content: "\E650";
}

.es-icon-findinpage:before {
  content: "\E651";
}

.es-icon-headset:before {
  content: "\E652";
}

.es-icon-landscape:before {
  content: "\E653";
}

.es-icon-assignment1:before {
  content: "\E654";
}

.es-icon-accountwallet:before {
  content: "\E655";
}

.es-icon-dashboard:before {
  content: "\E656";
}

.es-icon-web:before {
  content: "\E67C";
}

.es-icon-check:before {
  content: "\E60C";
}

.es-icon-doing:before {
  content: "\E648";
}

.es-icon-diqiu:before {
  content: "\E6C5";
}

.es-icon-icattachfileblack24px:before {
  content: "\E681";
}

.es-icon-morehoriz:before {
  content: "\E665";
}

.es-icon-introduction1:before {
  content: "\E673";
}

.es-icon-introduction2:before {
  content: "\E674";
}

.es-icon-introduction3:before {
  content: "\E675";
}

.es-icon-videoplay:before {
  content: "\E677";
}

.es-icon-chatcircle:before {
  content: "\E682";
}

.es-icon-locationcircle:before {
  content: "\E683";
}

.es-icon-warning:before {
  content: "\E685";
}

.es-icon-eventnote:before {
  content: "\E686";
}

.es-icon-localplay:before {
  content: "\E684";
}

.es-icon-money:before {
  content: "\E688";
}

.es-icon-writefill:before {
  content: "\E760";
}

.es-icon-write:before {
  content: "\E761";
}

.es-icon-lock1:before {
  content: "\E689";
}

.es-icon-iccheckcircleblack24px:before {
  content: "\E68B";
}

.course-freelearn-section .es-icon-iccheckcircleblack24px {
  width: 12px;
  height: 12px;
  float: left;
  margin-right: 4px !important;
  background: url("/static-dist/app/img/2018/1.0/course_details/yiwanchengjindu_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/course_details/yiwanchengjindu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/course_details/yiwanchengjindu_icon@2x.png") 2x);
}

.course-freelearn-section .es-icon-iccheckcircleblack24px:before {
  content: "";
}

.es-icon-viewcomfy:before {
  content: "\E68C";
}

.es-icon-loading:before {
  content: "\E68D";
}

.es-icon-calendarok:before {
  content: "\E6A5";
}

.es-icon-self:before {
  content: "\E6C4";
}

.es-icon-trophy:before {
  content: "\E691";
}

.es-icon-iconfontjigou:before {
  content: "\E6D8";
}

.es-icon-arrowdropleft:before {
  content: "\E68F";
}

.es-icon-hd:before {
  content: "\E6BB";
}

.es-icon-activity:before {
  content: "\E692";
}

.es-icon-column:before {
  content: "\E693";
}

.es-icon-answer:before {
  content: "\E694";
}

.es-icon-comment1:before {
  content: "\E695";
}

.es-icon-exam:before {
  content: "\E696";
}

.es-icon-topic:before {
  content: "\E697";
}

.es-icon-target:before {
  content: "\E698";
}

.es-icon-homework:before {
  content: "\E699";
}

.es-icon-speed:before {
  content: "\E69A";
}

.es-icon-lesson:before {
  content: "\E69B";
}

.es-icon-addcircle1:before {
  content: "\E69C";
}

.es-icon-friends:before {
  content: "\E69F";
}

.es-icon-assessment:before {
  content: "\E6A0";
}

.es-icon-assignment2:before {
  content: "\E6A1";
}

.es-icon-analysis:before {
  content: "\E6A2";
}

.es-icon-download:before {
  content: "\E6A3";
}

.es-icon-share1:before {
  content: "\E6CC";
}

.es-icon-change:before {
  content: "\E6BC";
}

.es-icon-icmorevertblack24px:before {
  content: "\E6A6";
}

.es-icon-data-order:before {
  content: "\E6A7";
}

.es-icon-zanting:before {
  content: "\E6A8";
}

.es-icon-huikanshimiao:before {
  content: "\E6A9";
}

.es-icon-quanping:before {
  content: "\E6AA";
}

.es-icon-bofang:before {
  content: "\E6AC";
}

.es-icon-tuichuquanping:before {
  content: "\E6AD";
}

.es-icon-lubogongkaike:before {
  content: "\E6B0";
}

.es-icon-putongkecheng:before {
  content: "\E6B1";
}

.es-icon-zhibokecheng:before {
  content: "\E6B2";
}

.es-icon-zhibokecheng2:before {
  content: "\E6B3";
}

.es-icon-zanting1:before {
  content: "\E6C6";
}

.es-icon-ting:before {
  content: "\E6B8";
}

.es-icon-sun:before {
  content: "\E6C3";
}

.es-icon-sousuo:before {
  content: "\E6B4";
}

.es-icon-yulan:before {
  content: "\E6B5";
}

.es-icon-xinxi:before {
  content: "\E6B6";
}

.es-icon-cuowu:before {
  content: "\E6B7";
}

.es-icon-yidong:before {
  content: "\E6B9";
}

.es-icon-huakuai:before {
  content: "\E6BA";
}

.es-icon-iconvolumelow:before {
  content: "\E6BD";
}

.es-icon-iconvolumehigh:before {
  content: "\E6BE";
}

.es-icon-player-volume-mute:before {
  content: "\E6BF";
}

.es-icon-forward5:before {
  content: "\E6AB";
}

.es-icon-forward10:before {
  content: "\E6AE";
}

.es-icon-replay5:before {
  content: "\E6AF";
}

.es-icon-replay10:before {
  content: "\E6C0";
}

.es-icon-rewardsolid:before {
  content: "\E6C2";
}

.es-icon-zhouqikechengtubiao1:before {
  content: "\E6C1";
}

.es-icon-newshotfill:before {
  content: "\E7C4";
}

.es-icon-newshot:before {
  content: "\E7C5";
}

.es-icon-qiehuan:before {
  content: "\E6D3";
}

.es-icon-icon-calendar-o:before {
  content: "\E6CA";
}

.es-icon-remen:before {
  content: "\E6CB";
}

.es-icon-subtitle:before {
  content: "\E783";
}

.es-icon--check-circle:before {
  content: "\E6C7";
}

.es-icon-undone-check:before {
  content: "\E6C8";
}

/* .new-dashboard-sidebar .task-item .es-icon-undone-check:before {
    content: '';
} */

/* .new-dashboard-sidebar .task-item .es-icon-undone-check {
    width: 12px;
    height: 12px;
    border: 1px solid #979797;
    border-radius: 50%;
    position: absolute;
    top: 14px;
    left: 10px; 
}  */

.new-dashboard-sidebar .task-item .right-menu {
  color: #9298bf;
}

.es-icon-share_fill:before {
  content: "\E6D2";
}

.es-icon-assignment-turned-in:before {
  content: "\E6D9";
}

.es-icon-zhuce:before {
  content: "\E6D4";
}

.es-icon-denglu:before {
  content: "\E6D5";
}

.es-icon-cloud-ask:before {
  content: "\E95A";
}

/*! define jquery-plugin/select2/3.4.1/select2-debug.css */

.select2-container {
  margin: 0;
  padding: 0;
  border: none;
  position: relative;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: middle;
}

.select2-container,
.select2-drop,
.select2-search,
.select2-search input {
  -khtml-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.select2-container .select2-choice {
  display: block;
  height: 26px;
  padding: 0 0 0 8px;
  overflow: hidden;
  position: relative;
  border: 1px solid #ccc;
  white-space: nowrap;
  line-height: 26px;
  color: #444;
  text-decoration: none;
  border-radius: 4px;
  background-clip: padding-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #fff;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  /* :-webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(.5, #fff)); */
  /* :-webkit-linear-gradient(center bottom, #eee 0, #fff 50%); */
  /* :-moz-linear-gradient(center bottom, #eee 0, #fff 50%); */
  /* :-o-linear-gradient(bottom, #eee 0, #fff 50%); */
  /* :-ms-linear-gradient(top, #fff 0, #eee 50%); */
  /* :progid: DXImageTransform.Microsoft.gradient(startColorstr ="#fff", endColorstr ="#eee", GradientType = 0); */
  /* :linear-gradient(top, #fff, #eee 50%) */
}

.select2-container.select2-drop-above .select2-choice {
  border-bottom-color: #aaa;
  border-radius: 0 0 4px 4px;
  background-image: -ms-linear-gradient(top, #eee 0, #fff 90%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#eeeeee", GradientType=0);
  background-image: linear-gradient(top, #eee, #fff 90%);
}

.select2-container.select2-allowclear .select2-choice .select2-chosen {
  margin-right: 42px;
}

.select2-container .select2-choice>.select2-chosen {
  margin-right: 26px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
}

#labelBox span {
  margin-top: 5px;
  color: red;
  display: inline-block;
  padding: 5px 30px;
  border: 1px dashed red;
  margin-right: 10px;
  position: relative;
}

#labelBox span i {
  font-style: normal;
  position: absolute;
  top: 0;
  right: 0;
  font-size: 20px;
  width: 20px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  cursor: pointer;
}

.select2-container .select2-choice abbr {
  display: none;
  width: 12px;
  height: 12px;
  position: absolute;
  right: 24px;
  top: 8px;
  font-size: 1px;
  text-decoration: none;
  border: 0;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAACLElEQVR42u3Zz0sUYRzH8bUISoyF1i5iXSooyYgOEXapZNYNojwU/aAfUAT9A4YhUgdxt1To0KFIBCMIvEcUEXntUtivpYuUhYFIdDBMmD69he/hObgsbSnb13ngdZjZhX3eO8/MDrMpSctKErwsg//HUSgU7uNYsB3hHla4CybqEoRPaMJGFCEMewxuxnsIk5iALPqg1yVdj9eQGUdjiuE1eAs+QOYztrsMJqwFk8EyHguW95klD+ZD08gsYvBFCBPYgHXBOT1UNpg3ncQpnAicRbrCCQ3j8SIf5QvYEWxvxnlb0mWDr0MIvcOaCiayC78gRKmlH+WDbaIjkJnDzgq/+VHIvMWqag3ehBkIAxXGdkAIDVRlsE24H9//4ty9hju4Hej710c5m83WYging32HMYjMnwSvx75UlQ+iOiDEaEMLZiA8dPc7TFQDnkGYxQ8Iz9Hs8k4riqIa4l5ApojVbm8tiduPL5CZRs5lMGFH8DNYxo+C5d3tMfgohJeow0qMQujxuqRb0RBsZ3DA2ZIuP5LgJDgJToKr4ZHOWjTOy+fzNa6DiezCFGReod1lMGF3IYzjMm5B5rirYIJyEJ4iHezfjW+YRr2n4EHE2LrAa1cg5DwFj2DWLlKljn67p+B+CIdKPAaOsddTcBOEKbTZvjp0Qvjo8Sp9DjJFfIVMjBsef4f34AHeYAxX0VfqMbDnfw97IXMTta6DLbobcxBa3Qdb9BPE2LZQ8G98530ecQi/2QAAAABJRU5ErkJggg==) 100% 0 no-repeat;
  cursor: pointer;
  outline: 0;
}

.select2-container.select2-allowclear .select2-choice abbr {
  display: inline-block;
}

.select2-container .select2-choice abbr:hover {
  background-position: right -11px;
  cursor: pointer;
}

.select2-drop-undermask {
  background-color: transparent;
}

.select2-drop-mask,
.select2-drop-undermask {
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9998;
  filter: alpha(opacity=0);
}

.select2-drop-mask {
  background-color: #fff;
  opacity: 0;
}

.select2-drop {
  width: 100%;
  margin-top: -1px;
  position: absolute;
  z-index: 9998;
  top: 100%;
  background: #fff;
  color: #000;
  border: 1px solid #aaa;
  border-top: 0;
  border-radius: 0 0 4px 4px;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}

.select2-drop-auto-width {
  border-top: 1px solid #aaa !important;
  border-bottom: 1px solid #aaa !important;
  width: auto;
}

.select2-drop-auto-width .select2-search {
  padding-top: 4px;
}

.select2-drop.select2-drop-above {
  margin-top: 1px;
  border-top: 1px solid #aaa;
  border-bottom: 0;
  border-radius: 4px 4px 0 0;
  box-shadow: 0 -4px 5px rgba(0, 0, 0, 0.15);
}

.select2-drop-active {
  border: 1px solid #aaa;
  border-top: none;
}

.select2-drop.select2-drop-above.select2-drop-active {
  border-top: 1px solid #aaa;
}

.select2-container .select2-choice .select2-arrow {
  display: inline-block;
  width: 18px;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  border-radius: 0 4px 4px 0;
  background-clip: padding-box;
  /* :#ccc; */
  /* :-webkit-gradient(linear, left bottom, left top, color-stop(0, #ccc), color-stop(.6, #eee)); */
  /* :-webkit-linear-gradient(center bottom, #ccc 0, #eee 60%); */
  /* :-moz-linear-gradient(center bottom, #ccc 0, #eee 60%); */
  /* :-o-linear-gradient(bottom, #ccc 0, #eee 60%); */
  /* :-ms-linear-gradient(top, #ccc 0, #eee 60%); */
  /* :progid: DXImageTransform.Microsoft.gradient(startColorstr ="#eee", endColorstr ="#ccc", GradientType = 0); */
  /* :linear-gradient(top, #ccc, #eee 60%) */
}

.select2-container .select2-choice .select2-arrow b {
  display: block;
  width: 100%;
  height: 100%;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAACLElEQVR42u3Zz0sUYRzH8bUISoyF1i5iXSooyYgOEXapZNYNojwU/aAfUAT9A4YhUgdxt1To0KFIBCMIvEcUEXntUtivpYuUhYFIdDBMmD69he/hObgsbSnb13ngdZjZhX3eO8/MDrMpSctKErwsg//HUSgU7uNYsB3hHla4CybqEoRPaMJGFCEMewxuxnsIk5iALPqg1yVdj9eQGUdjiuE1eAs+QOYztrsMJqwFk8EyHguW95klD+ZD08gsYvBFCBPYgHXBOT1UNpg3ncQpnAicRbrCCQ3j8SIf5QvYEWxvxnlb0mWDr0MIvcOaCiayC78gRKmlH+WDbaIjkJnDzgq/+VHIvMWqag3ehBkIAxXGdkAIDVRlsE24H9//4ty9hju4Hej710c5m83WYging32HMYjMnwSvx75UlQ+iOiDEaEMLZiA8dPc7TFQDnkGYxQ8Iz9Hs8k4riqIa4l5ApojVbm8tiduPL5CZRs5lMGFH8DNYxo+C5d3tMfgohJeow0qMQujxuqRb0RBsZ3DA2ZIuP5LgJDgJToKr4ZHOWjTOy+fzNa6DiezCFGReod1lMGF3IYzjMm5B5rirYIJyEJ4iHezfjW+YRr2n4EHE2LrAa1cg5DwFj2DWLlKljn67p+B+CIdKPAaOsddTcBOEKbTZvjp0Qvjo8Sp9DjJFfIVMjBsef4f34AHeYAxX0VfqMbDnfw97IXMTta6DLbobcxBa3Qdb9BPE2LZQ8G98530ecQi/2QAAAABJRU5ErkJggg==) no-repeat 0 1px;
}

.select2-search {
  display: inline-block;
  width: 100%;
  min-height: 26px;
  margin: 0;
  padding-left: 4px;
  padding-right: 4px;
  position: relative;
  z-index: 10000;
  white-space: nowrap;
}

.select2-search input {
  width: 100%;
  height: auto !important;
  min-height: 26px;
  padding: 4px 20px 4px 5px;
  margin: 0;
  outline: 0;
  font-family: sans-serif;
  font-size: 1em;
  border: 1px solid #aaa;
  border-radius: 0;
  box-shadow: none;
  background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAACLElEQVR42u3Zz0sUYRzH8bUISoyF1i5iXSooyYgOEXapZNYNojwU/aAfUAT9A4YhUgdxt1To0KFIBCMIvEcUEXntUtivpYuUhYFIdDBMmD69he/hObgsbSnb13ngdZjZhX3eO8/MDrMpSctKErwsg//HUSgU7uNYsB3hHla4CybqEoRPaMJGFCEMewxuxnsIk5iALPqg1yVdj9eQGUdjiuE1eAs+QOYztrsMJqwFk8EyHguW95klD+ZD08gsYvBFCBPYgHXBOT1UNpg3ncQpnAicRbrCCQ3j8SIf5QvYEWxvxnlb0mWDr0MIvcOaCiayC78gRKmlH+WDbaIjkJnDzgq/+VHIvMWqag3ehBkIAxXGdkAIDVRlsE24H9//4ty9hju4Hej710c5m83WYging32HMYjMnwSvx75UlQ+iOiDEaEMLZiA8dPc7TFQDnkGYxQ8Iz9Hs8k4riqIa4l5ApojVbm8tiduPL5CZRs5lMGFH8DNYxo+C5d3tMfgohJeow0qMQujxuqRb0RBsZ3DA2ZIuP5LgJDgJToKr4ZHOWjTOy+fzNa6DiezCFGReod1lMGF3IYzjMm5B5rirYIJyEJ4iHezfjW+YRr2n4EHE2LrAa1cg5DwFj2DWLlKljn67p+B+CIdKPAaOsddTcBOEKbTZvjp0Qvjo8Sp9DjJFfIVMjBsef4f34AHeYAxX0VfqMbDnfw97IXMTta6DLbobcxBa3Qdb9BPE2LZQ8G98530ecQi/2QAAAABJRU5ErkJggg==) no-repeat 100% -22px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAACLElEQVR42u3Zz0sUYRzH8bUISoyF1i5iXSooyYgOEXapZNYNojwU/aAfUAT9A4YhUgdxt1To0KFIBCMIvEcUEXntUtivpYuUhYFIdDBMmD69he/hObgsbSnb13ngdZjZhX3eO8/MDrMpSctKErwsg//HUSgU7uNYsB3hHla4CybqEoRPaMJGFCEMewxuxnsIk5iALPqg1yVdj9eQGUdjiuE1eAs+QOYztrsMJqwFk8EyHguW95klD+ZD08gsYvBFCBPYgHXBOT1UNpg3ncQpnAicRbrCCQ3j8SIf5QvYEWxvxnlb0mWDr0MIvcOaCiayC78gRKmlH+WDbaIjkJnDzgq/+VHIvMWqag3ehBkIAxXGdkAIDVRlsE24H9//4ty9hju4Hej710c5m83WYging32HMYjMnwSvx75UlQ+iOiDEaEMLZiA8dPc7TFQDnkGYxQ8Iz9Hs8k4riqIa4l5ApojVbm8tiduPL5CZRs5lMGFH8DNYxo+C5d3tMfgohJeow0qMQujxuqRb0RBsZ3DA2ZIuP5LgJDgJToKr4ZHOWjTOy+fzNa6DiezCFGReod1lMGF3IYzjMm5B5rirYIJyEJ4iHezfjW+YRr2n4EHE2LrAa1cg5DwFj2DWLlKljn67p+B+CIdKPAaOsddTcBOEKbTZvjp0Qvjo8Sp9DjJFfIVMjBsef4f34AHeYAxX0VfqMbDnfw97IXMTta6DLbobcxBa3Qdb9BPE2LZQ8G98530ecQi/2QAAAABJRU5ErkJggg==) no-repeat 100% -22px,
    linear-gradient(top, #fff 85%, #eee 99%);
}

.select2-drop.select2-drop-above .select2-search input {
  margin-top: 4px;
}

.select2-search input.select2-active {
  background: #fff url(/static-dist/app/img/select2-spinner.gif) no-repeat 100%;
  background: url(/static-dist/app/img/select2-spinner.gif) no-repeat 100%,
    linear-gradient(top, #fff 85%, #eee 99%);
}

.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
  border: 1px solid #aaa;
  outline: none;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.select2-dropdown-open .select2-choice {
  border-bottom-color: transparent;
  box-shadow: inset 0 1px 0 #fff;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  background-color: #eee;
  background-image: -ms-linear-gradient(top, #fff 0, #eee 50%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#eeeeee", endColorstr="#ffffff", GradientType=0);
  background-image: linear-gradient(top, #fff, #eee 50%);
}

.select2-dropdown-open.select2-drop-above .select2-choice,
.select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #aaa;
  border-top-color: transparent;
  background-image: -ms-linear-gradient(bottom, #fff 0, #eee 50%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#eeeeee", endColorstr="#ffffff", GradientType=0);
  background-image: linear-gradient(bottom, #fff, #eee 50%);
}

.select2-dropdown-open .select2-choice .select2-arrow {
  background: transparent;
  border-left: none;
  filter: none;
}

.select2-dropdown-open .select2-choice .select2-arrow b {
  background-position: -18px 1px;
}

.select2-results {
  max-height: 200px;
  padding: 0 0 0 4px;
  margin: 4px 4px 4px 0;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.select2-results ul.select2-result-sub {
  margin: 0;
  padding-left: 0;
}

.select2-results ul.select2-result-sub>li .select2-result-label {
  padding-left: 20px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub>li .select2-result-label {
  padding-left: 40px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub>li .select2-result-label {
  padding-left: 60px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub>li .select2-result-label {
  padding-left: 80px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub>li .select2-result-label {
  padding-left: 100px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub>li .select2-result-label {
  padding-left: 110px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub>li .select2-result-label {
  padding-left: 120px;
}

.select2-results li {
  list-style: none;
  display: list-item;
  background-image: none;
}

.select2-results li.select2-result-with-children>.select2-result-label {
  font-weight: 700;
}

.select2-results .select2-result-label {
  display: inline-block;
  width: 100%;
  padding: 3px 7px 4px;
  margin: 0;
  cursor: pointer;
  min-height: 1em;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.select2-results .select2-highlighted {
  background: #3875d7;
  color: #fff;
}

.select2-results li em {
  background: #feffde;
  font-style: normal;
}

.select2-results .select2-highlighted em {
  background: transparent;
}

.select2-results .select2-highlighted ul {
  background: #fff;
  color: #000;
}

.select2-results .select2-no-results,
.select2-results .select2-searching,
.select2-results .select2-selection-limit {
  background: #f4f4f4;
  display: list-item;
}

.select2-results .select2-disabled.select2-highlighted {
  color: #666;
  background: #f4f4f4;
  display: list-item;
  cursor: default;
}

.select2-results .select2-disabled {
  background: #f4f4f4;
  display: list-item;
  cursor: default;
}

.select2-results .select2-selected {
  display: none;
}

.select2-more-results.select2-active {
  background: #f4f4f4 url(/static-dist/app/img/select2-spinner.gif) no-repeat 100%;
}

.select2-more-results {
  background: #f4f4f4;
  display: list-item;
}

.select2-container.select2-container-disabled .select2-choice {
  background-color: #f4f4f4;
  background-image: none;
  border: 1px solid #ddd;
  cursor: default;
}

.select2-container.select2-container-disabled .select2-choice .select2-arrow {
  background-color: #f4f4f4;
  background-image: none;
  border-left: 0;
}

.select2-container.select2-container-disabled .select2-choice abbr {
  display: none;
}

.select2-container-multi .select2-choices {
  height: auto !important;
  height: 1%;
  margin: 0;
  padding: 0;
  position: relative;
  border: 1px solid #aaa;
  cursor: text;
  overflow: hidden;
  background-color: #fff;
  background-image: linear-gradient(top, #eee 1%, #fff 15%);
}

.select2-locked {
  padding: 3px 5px !important;
}

.select2-container-multi .select2-choices {
  min-height: 26px;
}

.select2-container-multi.select2-container-active .select2-choices {
  border: 1px solid #aaa;
  outline: none;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.select2-container-multi .select2-choices li {
  float: left;
  list-style: none;
}

.select2-container-multi .select2-choices .select2-search-field {
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.select2-container-multi .select2-choices .select2-search-field input {
  padding: 5px;
  margin: 1px 0;
  font-family: sans-serif;
  font-size: 100%;
  color: #666;
  outline: 0;
  border: 0;
  box-shadow: none;
  background: transparent !important;
}

.select2-container-multi .select2-choices .select2-search-field input.select2-active {
  background: #fff url(/static-dist/app/img/select2-spinner.gif) no-repeat 100% !important;
}

.select2-default {
  color: #999 !important;
}

.select2-container-multi .select2-choices .select2-search-choice {
  padding: 3px 5px 3px 18px;
  margin: 3px 0 3px 5px;
  position: relative;
  line-height: 13px;
  color: #333;
  cursor: default;
  border: 1px solid #aaa;
  border-radius: 3px;
  box-shadow: inset 0 0 2px #fff, 0 1px 0 rgba(0, 0, 0, 0.05);
  background-clip: padding-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #e4e4e4;
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#eeeeee", endColorstr="#f4f4f4", GradientType=0);
  background-image: linear-gradient(top,
      #f4f4f4 20%,
      #f0f0f0 50%,
      #e8e8e8 52%,
      #eee);
}

.select2-container-multi .select2-choices .select2-search-choice .select2-chosen {
  cursor: default;
}

.select2-container-multi .select2-choices .select2-search-choice-focus {
  background: #d4d4d4;
}

.select2-search-choice-close {
  display: block;
  width: 12px;
  height: 13px;
  position: absolute;
  right: 3px;
  top: 4px;
  font-size: 1px;
  outline: none;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAACLElEQVR42u3Zz0sUYRzH8bUISoyF1i5iXSooyYgOEXapZNYNojwU/aAfUAT9A4YhUgdxt1To0KFIBCMIvEcUEXntUtivpYuUhYFIdDBMmD69he/hObgsbSnb13ngdZjZhX3eO8/MDrMpSctKErwsg//HUSgU7uNYsB3hHla4CybqEoRPaMJGFCEMewxuxnsIk5iALPqg1yVdj9eQGUdjiuE1eAs+QOYztrsMJqwFk8EyHguW95klD+ZD08gsYvBFCBPYgHXBOT1UNpg3ncQpnAicRbrCCQ3j8SIf5QvYEWxvxnlb0mWDr0MIvcOaCiayC78gRKmlH+WDbaIjkJnDzgq/+VHIvMWqag3ehBkIAxXGdkAIDVRlsE24H9//4ty9hju4Hej710c5m83WYging32HMYjMnwSvx75UlQ+iOiDEaEMLZiA8dPc7TFQDnkGYxQ8Iz9Hs8k4riqIa4l5ApojVbm8tiduPL5CZRs5lMGFH8DNYxo+C5d3tMfgohJeow0qMQujxuqRb0RBsZ3DA2ZIuP5LgJDgJToKr4ZHOWjTOy+fzNa6DiezCFGReod1lMGF3IYzjMm5B5rirYIJyEJ4iHezfjW+YRr2n4EHE2LrAa1cg5DwFj2DWLlKljn67p+B+CIdKPAaOsddTcBOEKbTZvjp0Qvjo8Sp9DjJFfIVMjBsef4f34AHeYAxX0VfqMbDnfw97IXMTta6DLbobcxBa3Qdb9BPE2LZQ8G98530ecQi/2QAAAABJRU5ErkJggg==) 100% 0 no-repeat;
}

.select2-container-multi .select2-search-choice-close {
  left: 3px;
}

.select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close,
.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover {
  background-position: right -11px;
}

.select2-container-multi.select2-container-disabled .select2-choices {
  background-color: #f4f4f4;
  background-image: none;
  border: 1px solid #ddd;
  cursor: default;
}

.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
  padding: 3px 5px;
  border: 1px solid #ddd;
  background-image: none;
  background-color: #f4f4f4;
}

.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close {
  display: none;
  background: none;
}

.select2-result-selectable .select2-match,
.select2-result-unselectable .select2-match {
  text-decoration: underline;
}

.select2-offscreen,
.select2-offscreen:focus {
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  border: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: absolute;
  outline: 0;
  left: 0;
}

.select2-display-none {
  display: none;
}

.select2-measure-scrollbar {
  position: absolute;
  top: -10000px;
  left: -10000px;
  width: 100px;
  height: 100px;
  overflow: scroll;
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 144dpi) {

  .select2-container .select2-choice .select2-arrow b,
  .select2-container .select2-choice abbr,
  .select2-search-choice-close,
  .select2-search input {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAABQCAYAAADSm7GJAAADFElEQVR42u2dsW4TQRBAI0ERCYpDpAUdJX/hAlxQ3SekovYXIIvKEiBRIUF1lHT+BP+Br0TCCCsFLW5cmCS3jKWNNFrdZu+EOG7sd9Irkl0p8r3s7Mzs5XLinIMD5uhvAIIBwYBgaMnNNZvNyj0nkUvPQbAdtDjnCSU3zkGwEbS4iOToHATbE6wptVwEGyUhcaW/JkTbT7JcCpIse4K7SC4pk4wRXreE5ZUMUwezgh03lT0YyKKBOhjoZHUi1oCf7mkYohd9ACVFrj50HgxzmtQifKwF15L1fxC8UD9/EQxzHtxC8KiD4FHPNWMhuIACwd33h3kLuXOZ2mc4yyLRZS1kCG6H3uc2Mbl+LO9Z8FRwEaYINnpDdWKVIEdwC/QVC4l97nk6sUqwQHA3wbGEa9Sj4CCxSlIguHtZMg8Tq/4Edy/bLNXB4/G4FKJ1sJ7zTwTrhMuTU3f+NVqc84SSG+bEJR99a3BoaHERybE5HDYYFKwptVwEGyUhcRX5PufBRoiH4Tg80WFMcBfJPJNljfC6JSzzVCUrGMHswUAWDdTBQCcLOveiCdEBnCYBb9kBBAOCAcGAYEDw0XP0NwDBgGBAMCAYEAwIHvD7QzJhIlSCE2rF0o9lav4eBBt5JWHR8EfzdYATfgkFgg2g5J4LdSD1WrjyXDeIPkfwsNErV6/Y38J34aXwWHgkvBJWwi74RSgQPGD8nrtRwrbCe+G0YX9+KHzyc2rPRsgQPFzBEyVrJ7xLvNTsjvBBuFQreYLg4Qpeqv32m3BP+YxJPhUulOAKwQMl2HsnymNK8mudeCF44IK9rCcdBD8XrhBsS/BTBBOibwTPCNEGCFqSX4X7LeSeCRdK8BLBwy6TdIPjo3A3kUF/pkyy1+ioPVsv8KxB7gPhi7BVcndCpqYheKCtSt1+vBR+CG+EZ8IL4a3wU69cRYlgC4cN4UFD/LDBNVAi2NZxYa0Ixe5ikhFs58B/2SC48mOZUMYkI/jw/61diWDzgtOSEWxdcFpyhWDTgtOSEWxccCgZwfZJ9akrJXiKYEDwMfAHMSYobVemsdsAAAAASUVORK5CYII=) !important;
    background-repeat: no-repeat !important;
    background-size: 60px 40px !important;
  }

  .select2-search input {
    background-position: 100% -21px !important;
  }
}

.select2-result-text {
  white-space: nowrap;
  display: inline-block;
  width: 75%;
}

.select2-tree-icon {
  display: inline-block;
  width: 14px;
  color: #333;
}

.es-box-shadow {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.no-padding20.courseshow-img p {
  padding: 0;
}

.group-page .group-post-list .metas {
  font-size: 12px;
  color: #999;
  margin-bottom: 10px;
}

.group-page .group-post-list .metas .floor {
  float: right;
}

.group-page .group-post-list .content {
  margin-bottom: 20px;
  word-break: break-all;
}

.group-page .group-post-list .actions {
  text-align: right;
  font-size: 12px;
  margin: 5px 0;
}

.group-page .group-post-list .well {
  background: #f9f9f9;
}

.group-page .group-post-list .well .actions {
  text-align: left;
  margin: 15px 0;
}

.group-page .group-logo-sm {
  width: 50px;
  height: 50px;
}

.group-page .hideContent {
  border: 1px solid #999;
  padding: 10px;
}

.group-page .hideContent h4 {
  color: #999;
  text-align: center;
  font-size: 14px;
}

.thread-list .media-object {
  width: 36px;
}

.thread-list .title {
  vertical-align: middle;
}

.thread-list .metas {
  font-size: 12px;
  color: #999;
}

.thread-list .metas .userImg {
  vertical-align: bottom;
}

.thread-list .metas .divider {
  margin: 0 5px;
  color: #ccc;
}

.group-media-sm {
  margin-bottom: 15px;
}

.group-media-sm .media-object {
  width: 60px;
  height: 60px;
}

.userpage-header .media {
  padding-top: 25px;
  padding-bottom: 25px;
}

.userpage-header .media-left {
  padding-right: 30px;
}

@media (max-width: 767px) {
  .userpage-header .media-left {
    display: block;
    text-align: center;
    margin-bottom: 30px;
    padding-right: 0;
  }

  /* 优惠券的取消按钮 */
  .order-item-detail .coupon-code-input a {
    display: none;
  }
}

.userpage-header .avatar-bg {
  position: relative;
  display: inline-block;
}

.userpage-header .media-left .icon-user-status {
  position: absolute;
  bottom: 0;
  right: 8px;
}

.userpage-header h2 {
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 28px;
}

.userpage-header h2 small {
  font-size: 16px;
  color: #096;
}

.userpage-header .actions {
  float: right;
}

.course-title {
  line-height: 32px;
  margin: 8px 0 16px;
}

#course-student-list .media {
  position: relative;
}

#course-student-list .media .progress {
  position: absolute;
  top: 12px;
  left: 180px;
  width: 150px;
  margin: 0;
}

.announcement-list li .action {
  visibility: hidden;
}

.announcement-list li:hover .action {
  visibility: visible;
}

.thread {
  margin-bottom: 50px;
  overflow-x: auto;
  overflow-y: hidden;
}

.thread-header {
  margin-bottom: 15px;
}

.thread-title {
  margin: 0;
  margin-bottom: 5px;
}

.thread-event-title,
.thread-title {
  font-size: 20px;
  line-height: 36px;
  padding: 0;
  word-wrap: break-word;
  overflow: hidden;
}

.thread-event-title {
  margin: 0;
}

.thread-event-title-bar {
  margin-top: 10px;
}

.thread-metas {
  color: #999;
  font-size: 12px;
}

.thread-body {
  margin-bottom: 15px;
  word-wrap: break-word;
  overflow: hidden;
}

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

.thread-footer {
  text-align: right;
}

.thread-posts-heading {
  font-size: 18px;
  padding-bottom: 10px;
  border-bottom: 3px solid #eee;
  margin-bottom: 20px;
  color: #000;
}

.thread-posts-heading .glyphicon {
  color: #ccc;
  font-size: 12px;
  margin-right: 5px;
}

.thread-post {
  overflow: visible;
}

.show-user {
  color: #bdb76b;
  font-size: 18px;
}

.thread-post pre,
.thread pre {
  overflow-x: scroll;
  word-wrap: normal;
}

.thread-post-dropdown {
  float: right;
  position: relative;
}

.thread-post-dropdown .dropdown-toggle {
  text-decoration: none;
}

.thread-post .thread-post-dropdown .dropdown-toggle {
  visibility: hidden;
}

.thread-post:hover .thread-post-dropdown .dropdown-toggle {
  visibility: visible;
}

.thread-post-action {
  text-align: right;
  font-size: 14px;
  /* 
    visibility: hidden */
}

.thread-post:hover .thread-post-action {
  visibility: visible;
}

.thread-list-small {
  font-size: 13px;
}

.thread-list-small .metas {
  font-size: 12px;
  color: #999;
}

.thread-list-small .metas a {
  color: #777;
}

.thread-list-small .thread-item-body {
  padding-left: 10px;
  padding-right: 10px;
}

.thread-list-small .thread-item-body .title-icon {
  display: inline-block;
  width: 20px;
}

.thread-list-small .thread-item-body .title-icon i {
  font-size: 14px;
}

.thread-show .thread-breadcrumb {
  font-size: 13px;
  margin-bottom: 6px;
}

.thread-show .thread-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
  color: inherit;
  font-weight: 700;
  line-height: 1;
  display: inline;
}

.thread-show .thread-metas {
  margin-top: 6px;
}

.thread-post-list .metas {
  font-size: 13px;
}

.thread-post-list .metas .nickname {
  font-weight: 700;
}

.thread-post-list .user-avatar img {
  width: 48px;
  height: 48px;
}

.thread-post-list .thread-post-interaction {
  font-size: 13px;
}

.thread-post-list .thread-post-interaction .interaction {
  margin-right: 10px;
}

.thread-subpost-list .user-avatar img {
  width: 32px;
  height: 32px;
}

.thread-subpost-container {
  margin-top: 10px;
  padding: 10px;
  background-color: #fdfdfd;
  border-radius: 3px;
  border: 1px solid #fdfdfd;
}

.thread-subpost-morebar {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 13px;
}

.thread-subpost-form {
  margin-top: 10px;
}

.thread-subpost-list .thread-subpost {
  margin-top: 10px;
  padding-bottom: 10px;
  border-color: #f6f6f6;
}

.thread-subpost-list .thread-subpost:first-child {
  margin-top: 0;
}

.thread-subpost-list .thread-subpost:last-child {
  padding-bottom: 0;
}

.thread-post-list .thread-post .thread-post-manage-dropdown {
  visibility: hidden;
}

.thread-post-list .thread-post:hover .thread-post-manage-dropdown {
  visibility: visible;
}

.thread-post-list .thread-post:hover .thread-subpost .thread-post-manage-dropdown {
  visibility: hidden;
}

.thread-post-list .thread-subpost:hover .thread-post-manage-dropdown {
  visibility: visible !important;
}

.live-label {
  font-size: 12px;
  font-weight: 400;
}

.live-course-item-list-multi h3 {
  font-size: 16px;
  font-weight: 400;
  line-height: 36px;
  text-indent: 15px;
  background: #f3f3f3;
  color: #777;
  border-bottom: 1px solid #e3e3e3;
  margin: 20px 0;
}

.live-course-item-list-multi h3 strong {
  color: #555;
}

.live-course-item-list-multi ul {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-right: 0;
}

.live-course-item-list-multi ul li {
  margin-left: 20px;
  background: #f3f3f3;
  line-height: 40px;
  margin-bottom: 15px;
  color: #777;
  border-bottom: 1px solid #e3e3e3;
}

.live-course-item-list-multi ul li .item-content {
  overflow: hidden;
  height: 40px;
  line-height: 40px;
  float: left;
  padding-left: 15px;
}

.live-course-item-list-multi .item-content .item-title {
  font-weight: 700;
  width: 100%;
  height: 36px;
  overflow: hidden;
}

.live-course-item-list-multi ul li .item-status {
  float: right;
  padding-right: 15px;
}

.live-course-item-list-multi ul li:hover {
  background: #ccc;
}

.live-course-item-list-multi ul li .item-free {
  color: #3c763d;
  text-indent: 15px;
}

.live-course-list div.course-about {
  margin: 0 0 5px;
}

.live-course-list .live-course-lesson {
  font-size: 12px;
  margin-bottom: 5px;
  color: #777;
}

.live-course-list .live-course-lesson .live-time {
  color: #428bca;
}

.live-rating-course .first-rating {
  display: block;
}

.live-rating-course .other-rating {
  display: none;
}

.live-rating-course .rank_num {
  display: inline-block;
  background-color: #66bc4e;
  color: #fff;
  width: 20px;
  height: 20px;
  text-align: center;
  float: left;
  margin-right: 10px;
}

.lesson-dashboard-page {
  background: #fff;
}

.lesson-dashboard {
  position: fixed;
  background: #fff;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #e5e5e5;
}

.lesson-dashboard .dashboard-content {
  position: absolute;
  top: 0;
  left: 20px;
  right: 80px;
  bottom: 0;
}

.lesson-dashboard-open .dashboard-content {
  right: 440px;
}

.lesson-dashboard .toolbar {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 60px;
  border-left: 1px solid #e9e9e9;
  color: #666;
  background: #fff;
}

.lesson-dashboard-open .toolbar {
  width: 420px;
}

.lesson-dashboard .toolbar-nav {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 60px;
  border-left: 1px solid #e9e9e9;
  background: #363e45;
}

.lesson-dashboard .toolbar-pane-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 60px;
  bottom: 0;
  overflow: hidden;
  background-color: #fff;
}

.ps-container .ps-scrollbar-y-rail {
  visibility: hidden\9;
  z-index: 1;
}

.ps-container.hover .ps-scrollbar-y-rail,
.ps-container:hover .ps-scrollbar-y-rail {
  visibility: visible\9;
}

.lesson-dashboard .toolbar-pane-container .ps-container .ps-scrollbar-y {
  right: 0;
}

.lesson-dashboard .toolbar-pane-container .ps-container .ps-scrollbar-x {
  display: none;
}

@media (max-width: 1024px) {
  .lesson-dashboard-open .dashboard-content {
    right: 360px;
  }

  .lesson-dashboard-open .toolbar {
    width: 360px;
  }
}

@media (max-width: 767px) {

  .lesson-dashboard-open .dashboard-content,
  .lesson-dashboard .dashboard-content {
    right: 20px;
  }

  .lesson-dashboard .toolbar {
    display: none;
  }
}

.lesson-dashboard .toolbar-nav-stacked {
  margin: 0;
  padding: 0;
  list-style: none;
}

.lesson-dashboard .toolbar-nav-stacked li a {
  padding: 8px 0;
  margin-bottom: 5px;
  text-align: center;
  display: inline-block;
  width: 100%;
  color: #ccc;
  text-decoration: none;
}

.lesson-dashboard .toolbar-nav-stacked li a:hover {
  background: #aaa;
  color: #fff;
}

.lesson-dashboard .toolbar-nav-stacked li a .glyphicon {
  display: block;
  margin-bottom: 5px;
}

.lesson-dashboard .toolbar-nav-stacked li.active a {
  background-color: #999;
  color: #fff;
}

.lesson-dashboard #lesson-toolbar-secondary {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.lesson-dashboard #lesson-toolbar-secondary .hide-pane {
  text-align: center;
}

.lesson-dashboard #lesson-toolbar-secondary .hide-pane .glyphicon {
  display: inline;
}

.lesson-dashboard .dashboard-header {
  position: absolute;
  left: 130px;
  top: 0;
  height: 40px;
}

.lesson-dashboard .dashboard-header .item-navbar {
  font-size: 16px;
  line-height: 40px;
  color: #999;
}

.lesson-dashboard .dashboard-header .item-navbar span {
  cursor: pointer;
}

.lesson-dashboard .dashboard-header .item-navbar span:hover {
  color: #666;
}

.lesson-dashboard .dashboard-body {
  position: absolute;
  top: 50px;
  bottom: 50px;
  width: 100%;
}

.lesson-dashboard .dashboard-footer {
  position: absolute;
  bottom: 10px;
  width: 100%;
}

.lesson-dashboard .dashboard-footer .disabled {
  pointer-events: auto;
}

.lesson-dashboard .title-group {
  line-height: 40px;
  height: 50px;
  word-break: break-all;
  overflow: hidden;
}

.lesson-dashboard .title-group .divider {
  color: #999;
  margin: 0 3px;
}

.lesson-dashboard .title-group .chapter-label {
  font-size: 16px;
  color: #999;
}

.lesson-dashboard .title-group .item-label {
  margin-right: 5px;
}

.lesson-dashboard .title-group .item-label,
.lesson-dashboard .title-group .item-title {
  font-size: 16px;
}

.lesson-dashboard .lesson-content {
  height: 100%;
  position: relative;
}

.lesson-dashboard .lesson-content-audio {
  overflow: hidden;
}

.lesson-dashboard .lesson-content-audio .mejs-container {
  margin: 0 auto;
  margin-top: 100px;
  display: block;
}

.lesson-dashboard .lesson-content-text {
  overflow: hidden;
}

.lesson-dashboard .lesson-content-text .ps-scrollbar-x {
  display: none;
}

.lesson-dashboard .lesson-content-text .ps-scrollbar-y {
  right: 0;
}

.lesson-dashboard .lesson-content-text-body {
  background: #fff;
  max-width: 750px;
  margin: 0 auto;
  padding: 20px;
  word-wrap: break-word;
  overflow: hidden;
}

.lesson-dashboard .lesson-content-text-body img {
  max-width: 100%;
}

.lesson-dashboard .lesson-content-text-body blockquote p {
  font-size: 14px;
}

.lesson-dashboard .nav-btn {
  position: absolute;
  border-radius: 0;
  z-index: 1000;
  padding: 3px 10px;
}

.lesson-dashboard .back-course-btn {
  left: 0;
  top: -1px;
}

.lesson-dashboard .prev-lesson-btn {
  left: 90px;
  top: -1px;
}

.lesson-dashboard .next-lesson-btn {
  left: 90px;
  bottom: -1px;
}

.lesson-dashboard .question-list-pane {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  overflow: hidden;
}

.float-consult {
  position: fixed;
  right: 0;
  top: 50%;
  visibility: hidden;
  z-index: 999;
}

.float-consult .popover {
  width: 250px;
  color: #444;
  cursor: default;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

.float-consult .popover .qrcode {
  max-width: 220px;
}

.float-consult .consult-contents {
  display: none;
}

@font-face {
  font-family: consultfont;
  src: url(/static-dist/app/fonts/consult-font.eot);
  src: url(/static-dist/app/fonts/consult-font.eot?#iefix) format("embedded-opentype"),
    url(/static-dist/app/fonts/consult-font.woff) format("woff"),
    url(/static-dist/app/fonts/consult-font.ttf) format("truetype"),
    url(/static-dist/app/fonts/consult-font.svg#consultfont) format("svg");
}

.float-consult .icon {
  font-family: consultfont !important;
  font-size: 20px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}

.float-consult .icon-phone:before {
  content: "\E600";
}

.float-consult .icon-email:before {
  content: "\E601";
}

.float-consult .icon-qq:before {
  content: "\E603";
}

.float-consult .icon-weixin:before {
  content: "\E606";
}

.float-consult .icon-qqgroup:before {
  content: "\E608";
}

#float-consult h3.popover-title {
  padding: 8px 14px;
}

.float-consult-qq-btn .popover img {
  width: 25px;
  height: 25px;
}

.float-consult-qq-btn .popover p {
  margin: 0 0 6px;
}

.float-consult .btn {
  padding: 6px 12px;
  border-radius: 0;
  color: #fff;
}

.float-consult .btn:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.float-consult .btn:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.float-consult .btn-consult-warning {
  background: #ff8a0c;
  border-color: #ee7900;
}

.float-consult .btn-consult-warning:hover {
  background: #ee7900;
  border-color: #dd6800;
}

.float-consult .btn-consult-danger {
  background: #e83d2c;
  border-color: #d72c1b;
}

.float-consult .btn-consult-danger:hover {
  background: #d72c1b;
  border-color: #c61b0a;
}

.conversation-list .media-heading {
  font-size: 14px;
  margin-bottom: 10px;
}

.conversation-list .media {
  cursor: pointer;
}

.conversation-list .media .actions {
  visibility: hidden;
}

.conversation-list .media:hover .actions {
  visibility: visible;
}

.conversation-list .conversation-footer {
  color: #999;
  font-size: 13px;
}

.message-reply-form {
  margin-bottom: 30px;
}

.notification-list .media-object {
  color: #999;
  font-size: 20px;
}

.notification-list .notification-body {
  margin-bottom: 6px;
}

.notification-list .notification-footer {
  font-size: 12px;
  color: #999;
}

.notification-list blockquote {
  font-size: 13px;
  padding: 5px 10px;
  margin: 5px 0;
  color: #666;
}

.message-list .media {
  border-bottom: none;
}

.message-list .media>.pull-left {
  margin-right: 0;
}

.message-list .media>.pull-right {
  margin-left: 0;
}

.message-list .popover {
  position: relative;
  display: block;
  margin: 0 20px;
  max-width: 100%;
}

.message-list .message-me .popover {
  margin-left: 70px;
  background: #fafafa;
}

.message-list .message-she .popover {
  margin-right: 70px;
}

.message-list .popover .arrow {
  top: 24px;
}

.message-list .message-me .popover .arrow:after {
  border-left-color: #fafafa;
}

.message-list .message-content {
  margin-bottom: 10px;
}

.message-list .message-footer {
  font-size: 12px;
}

.message-list .message-actions {
  float: right;
  visibility: hidden;
}

.message-list .media:hover .message-actions {
  visibility: visible;
}

.notebook-list .media {
  cursor: pointer;
}

.notebook-list .media-object {
  max-width: 150px;
}

.notebook-list .notebook-metas {
  color: #999;
  margin: 5px 0 10px;
}

.notebook-list .media .notebook-go {
  visibility: hidden;
}

.notebook-list .media:hover .notebook-go {
  visibility: visible;
}

.notebook-heading {
  line-height: 48px;
  background: #f3f3f3;
  padding: 8px;
  border: 1px solid #ccc;
}

.notebook-heading .notebook-back-btn {
  margin: 11px 10px 0 0;
}

.notebook-heading .notebook-icon {
  width: 80px;
  height: 45px;
}

.notebook-body {
  border: 1px solid #ccc;
  border-top-width: 0;
}

.notebook-note {
  padding: 15px;
  border-bottom: 1px solid #e3e3e3;
}

.notebook-note:hover {
  background: #f6f6f6;
}

.notebook-note-collapsed {
  cursor: pointer;
}

.notebook-note .notebook-note-summary {
  display: none;
}

.notebook-note-collapsed .notebook-note-summary,
.notebook-note .notebook-note-body {
  display: block;
}

.notebook-note-collapsed .notebook-note-body {
  display: none;
}

.notebook-note-heading {
  margin-bottom: 8px;
  font-weight: 700;
  color: #444;
}

.notebook-note-length {
  font-weight: 400;
  color: #999;
  font-size: 12px;
}

.notebook-note-collapse-bar {
  background: #eee;
  text-align: center;
  color: #999;
  cursor: pointer;
}

.notebook-note-actions {
  margin: 5px 0;
}

.note-list .like {
  cursor: pointer;
}

.note-list .like em {
  font-style: normal;
  font-weight: 400;
}

.note-list .like:hover,
.note-list .liked {
  color: #eb7350;
}

.es-row-wrap {
  margin-bottom: 20px;
  background: #fff;
  border: 1px solid #e4ecf3;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.es-row-wrap .row {
  margin-left: 10px;
  margin-right: 10px;
}

.es-row-wrap .page-header {
  margin-top: 25px;
}

.es-row-wrap .page-header h1 {
  font-size: 24px;
}

.es-row-wrap h1 {
  word-break: break-all;
}

.lt-ie9 .es-row-wrap {
  border: 1px solid #e1e1e1;
}

.course-grids {
  margin: 0 -15px 0 0;
  padding: 0;
  list-style: none;
}

.classroomPicture {
  width: 40px;
  height: 40px;
}

.course-grid {
  display: inline-block;
  vertical-align: top;
  margin: 15px 15px 15px 0;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
}

.course-grid:hover .course-grid-mask {
  opacity: 1;
  filter: alpha(opacity=100);
  transition: all 0.3s ease;
}

.course-grid:hover .course-grid-mask .course-grid-btn-learn {
  margin-top: 22%;
  transition: all 0.3s ease;
}

.course-grid-img {
  position: relative;
  overflow: hidden;
}

.course-grid-img .course-grid-mask {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.4);
  transition: all 0.3s ease;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  opacity: 0;
  filter: alpha(opacity=0);
}

.course-grid-img .course-grid-mask .course-grid-btn-learn {
  margin-top: 80%;
  transition: all 0.3s ease;
}

.course-grid .course-label {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 12px;
}

.course-grid .belong-classroom {
  top: 103px;
  left: 0;
  right: 0;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.1);
}

.course-grid .grid-body {
  position: relative;
  width: 204px;
  display: block;
  overflow: hidden;
  text-decoration: none;
  border-radius: 3px;
  color: #353535;
}

.course-grid .grid-body:hover {
  text-decoration: none;
}

.related-course-grid {
  margin: 0 15px 15px 0;
}

@media (min-width: 1200px) {
  .related-course-grid {
    margin-bottom: 0;
  }

  .course-grid .grid-body {
    /* width: 254px */
    width: 237px;
  }

  .related-course-grid .grid-body {
    width: 213px;
  }
}

@media (min-width: 980px) and (max-width: 1199px) {
  .related-course-grid .grid-body {
    width: 263px;
  }
}

@media (min-width: 768px) and (max-width: 979px) {
  .related-course-grid .grid-body {
    width: 306px;
  }
}

.course-grid .title {
  display: block;
  padding: 10px;
  line-height: 20px;
}

.course-grid .metas {
  display: block;
  margin: 0 10px;
  padding: 10px 0;
  overflow: hidden;
  text-align: center;
  font-size: 12px;
  border-top: 1px solid #eee;
  color: #9b9b9b;
  line-height: 1.2;
}

.course-grid .metas .price-col {
  float: left;
  text-align: left;
}

.course-grid .metas .meta-label {
  display: block;
  color: #999;
}

.course-grid .price-block {
  text-align: left;
  padding: 6px 0;
}

.course-grid .metas .price-num {
  padding-top: 2px;
  font-size: 15px;
  font-weight: 700;
  color: #e57259;
  display: block;
}

.course-grid .metas .review-col {
  display: inline-block;
}

.course-grid .metas .student-col {
  float: right;
  text-align: right;
}

.course-grid .metas .student-num {
  display: block;
  margin-top: 5px;
  font-size: 13px;
}

.course-grid .teacher {
  margin: 0 10px 10px;
  padding-top: 10px;
  border-top: 1px solid #eee;
  display: block;
}

.course-grid .teacher .thumb {
  width: 30px;
  height: 30px;
  float: left;
  font-size: 12px;
  margin-right: 8px;
}

.course-grid .teacher .nickname {
  font-size: 12px;
}

.course-grid .teacher .user-title {
  font-size: 12px;
  color: #777;
}

.course-grid .learn-status {
  margin: 0 10px 15px;
}

.course-grid .learn-status .progress {
  margin-bottom: 15px;
}

.course-grid .learn-status .action {
  text-align: center;
}

.course-wide-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.course-wide-list .course-item {
  border: 1px solid #ddd;
  margin-bottom: 20px;
  border-radius: 5px;
}

.course-wide-list .course-item:hover {
  background: #f9f9f9;
}

.course-wide-list .course-picture-link {
  float: left;
}

.course-wide-list .course-picture {
  width: 230px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.course-wide-list .course-body {
  margin: 15px 15px 0 245px;
}

.courses-selected .course-body {
  margin: 15px 15px 0 300px;
}

@media (max-width: 600px) {
  .course-wide-list .course-picture-link {
    float: none;
    display: block;
  }

  .course-wide-list .course-picture {
    display: block;
    width: 100%;
  }

  .course-wide-list .course-body {
    margin-left: 15px;
    margin-bottom: 15px;
  }
}

.course-wide-list .course-price-info {
  float: right;
}

.course-wide-list .course-title {
  margin: 10px 0;
  word-break: break-all;
}

.course-wide-list .course-title a {
  color: #555;
  font-weight: 700;
}

.course-wide-list .course-about {
  margin: 0 0 15px;
  color: #666;
}

.course-wide-list .teacher {
  float: left;
  width: 180px;
}

.course-wide-list .teacher-avatar {
  float: left;
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 3px;
  margin-right: 5px;
}

.course-wide-list .teacher-nickname {
  font-size: 12px;
  font-weight: 700;
  color: #555;
}

.course-wide-list .teacher-title {
  color: #777;
  font-size: 12px;
}

.course-wide-list .course-metas {
  float: right;
  text-align: right;
  margin-top: 10px;
}

.course-wide-list .course-price {
  color: #e57259;
  font-size: 16px;
}

.course-wide-list .divider {
  width: 1px;
  border-left: 1px solid #ccc;
  margin: 0 5px;
}

.page-message-container {
  /*width: 700px;*/
  margin: 0 auto;
  margin-bottom: 40px;
}

@media (max-width: 767px) {
  .page-message-container {
    width: 100%;
  }
}

.modal .page-message-container {
  width: auto;
  margin: 20px;
}

.page-message-panel {
    border-radius: 4px;
    border: 1px solid #e4ecf3;
    background: #ffffff;
    height: 366px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.modal .page-message-panel {
  border: none;
}

.page-message-heading {
  margin-bottom: 19px;
}
.page-message-heading img {
    width: 184px;
    height: 88px;
}

.page-message-title {
  margin: 0;
  padding: 0;
  text-align: center;
  color: #31363f;
  font-weight: 400;
  font-size: 16px;
  line-height: 21px;

}

.page-message-body {
    margin-top: 10px;
    color: #909eab;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
}

.promoted-teacher {
  text-align: center;
}

.promoted-teacher .avatar {
  width: 80px;
  height: 80px;
  border: 3px solid #f5f5f5;
  border-radius: 50px;
  display: inline-block;
}

.promoted-teacher .nickname {
  margin-top: 5px;
  display: block;
  color: #333;
  text-decoration: none;
}

.promoted-teacher .title {
  margin-top: 3px;
  color: #777;
}

.promoted-teacher .about {
  margin: 5px 0;
  padding-top: 5px;
  text-align: left;
  font-size: 13px;
  color: #555;
  border-top: 1px dashed #ccc;
}

.promoted-teacher .more {
  text-align: right;
  font-size: 12px;
}

.vip-item {
  border: 1px solid #e1e1e1;
  background: #fff;
}

.vip-lists li {
  margin-bottom: 20px;
}

.vip-item h3,
.vip-item p {
  color: #555;
}

@media (max-width: 767px) {
  .vip-item h3 {
    padding: 0 10px;
    margin-top: 10px;
    font-size: 14px;
    text-align: center;
  }
}

.vip-item h4 {
  color: #e57259;
  text-decoration: none;
  text-align: center;
}

.vip-item img {
  width: 120px;
  height: 120px;
  margin: 10px 20px;
  border-radius: 50%;
}

@media (max-width: 767px) {
  .vip-item img {
    margin: 10px auto;
  }
}

.vip-item a {
  overflow: hidden;
}

.vip-price {
  margin-top: 20px;
}

@media (max-width: 767px) {
  .vip-price {
    margin-top: 0;
  }
}

.homepage .news li em {
  width: 85px;
  float: right;
  text-align: right;
  font-style: normal;
  color: #a9a9a9;
}

.homepage .news ul.row {
  margin-right: -10px;
  margin-left: -10px;
  padding-left: 0;
  list-style: none;
}

.homepage .news li span {
  color: #428bca;
  margin-right: 10px;
  text-decoration: none;
}

.homepage .news li a {
  color: #222;
  display: block;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.homepage .teachers ul,
.homepage .vip ul {
  padding-left: 0;
  list-style: none;
}

.homepage .teachers ul li,
.homepage .vip ul li {
  padding-right: 10px;
  padding-left: 10px;
}

@media (max-width: 767px) {

  .homepage .teachers ul li,
  .homepage .vip ul li {
    padding-right: 5px;
    padding-left: 5px;
  }
}

.homepage .hot-group img {
  width: 58px;
  height: 58px;
}

.site-navbar {
  border-radius: 0;
  background-color: #363e45;
  z-index: 1024;
}

.site-navbar .navbar-brand {
  color: #fff;
}

.site-navbar .navbar-brand-logo {
  margin-left: -10px;
  padding-left: 15px;
  padding-right: 15px;
  float: left;
}

.site-navbar .navbar-brand-logo img {
  height: 50px;
}

.site-navbar .navbar-nav>li>a {
  color: #fff;
}

.site-navbar .navbar-nav>li>a:focus,
.site-navbar .navbar-nav>li>a:hover {
  background-color: #3a485d;
}

.site-navbar .navbar-nav>.active>a,
.site-navbar .navbar-nav>.active>a:focus,
.site-navbar .navbar-nav>.active>a:hover,
.site-navbar .navbar-nav>.open>a,
.site-navbar .navbar-nav>.open>a:focus,
.site-navbar .navbar-nav>.open>a:hover {
  color: #fff;
  background-color: #3a485d;
}

.site-navbar .badge-container {
  position: relative;
}

.site-navbar .badge-container .badge {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 11px;
  background: #f60;
  padding: 2px 5px;
  border-radius: 12px;
}

.toolbar-nav .glyphicon-download-alt .badge {
  padding: 1px 5px;
  position: absolute;
  font-style: normal;
  color: #999;
  background-color: #ddd;
}

.site-navbar .mobile-badge-container .badge {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 11px;
  background: #5bc0de;
  padding: 2px 5px;
  border-radius: 12px;
}

.latest-review-list {
  font-size: 13px;
}

.latest-review-list .author-nickname {
  color: #555;
}

.latest-review-list .author-picture-link {
  float: left;
  margin: 0 10px 5px 0;
}

.latest-review-list .author-picture {
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 3px;
}

.latest-review-list .review-content {
  font-size: 13px;
  color: #999;
  word-wrap: break-word;
  overflow: hidden;
}

.latest-review-list .review-footer {
  text-align: right;
  margin-top: 5px;
}

.latest-review-list .course-title {
  color: #555;
  font-size: 12px;
}

.latest-review-list .divider {
  width: 1px;
  border-left: 1px solid #ccc;
  margin: 0 5px;
}

a.link-muted {
  color: #919191;
}

.btn-muted {
  color: #999;
}

.clear-modal-dialog .modal-body {
  padding: 30px;
}

.clear-modal-dialog .close {
  position: absolute;
  top: 20px;
  right: 20px;
  float: none;
  z-index: 1060;
}

.homepage-feature-slides {
  z-index: 0;
}

.question-set-item:first-child {
  border: none;
}

.list-group-panel .list-group-item.active,
.list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #46c37b;
  font-weight: 700;
  border-left: 3px solid #46c37b;
}

.status-side ul {
  padding-left: 0;
  list-style: none;
}

.status-side li {
  overflow: hidden;
}

.status-side li img {
  width: 50px;
  height: 50px;
}

.page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #46c37b;
}

.homepage-feature {
  border-radius: 4px;
  border: 1px solid #e4ecf3;
}

.watermark.active {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: center;
  display: none;
  position: absolute;
  width: 500px;
  height: 20px;
  vertical-align: middle;
  opacity: 0.8;
}

.page {
  padding: 15px;
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  font-size: 13px;
}

.rmb {
  color: #f40;
  font-weight: 700;
  font-style: normal;
}

.tags {
  line-height: 30px;
}

.tags a {
  font-size: 12px;
}

.comment-list .comment .comment-delete-btn {
  visibility: hidden;
}

.comment-list .comment-operated:hover .comment-delete-btn {
  visibility: visible;
}

.text-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.text-list li {
  border-bottom: 1px solid #e3e3e3;
  padding: 8px 0;
}

.money {
  color: #f40;
  font-size: 22px;
}

.avatar-small {
  width: 50px;
  height: 50px;
}

.avatar-medium {
  width: 120px;
  height: 120px;
}

.origin-price {
  font-size: 12px;
}

.nav-course-buy-btn {
  padding-bottom: 8px;
  padding-top: 8px;
}

.question-num {
  display: inline-block;
  width: 25px;
}

.panel.testpaper-question-block .testpaper-question {
  position: relative;
}

.panel.testpaper-question-block .panel-body {
  position: relative;
  z-index: 1;
}

.lt-ie8 .hidden-lt-ie8,
.visible-lt-ie8 {
  display: none !important;
}

.lt-ie8 .visible-lt-ie8 {
  display: block !important;
}

.user-simple-list .media-body {
  vertical-align: middle;
  line-height: 48px;
}

.user-avatar-link img {
  width: 48px;
  height: 48px;
}

.user-grids {
  letter-spacing: -4px;
  zoom: 1;
  margin: 0;
  padding: 0;
}

.user-grids li {
  list-style: none;
  text-align: center;
  display: inline-block;
  letter-spacing: 0;
  width: 23%;
  margin: 8px 1%;
  font-size: 12px;
  vertical-align: top;
  height: 40px;
  overflow: hidden;
}

.user-grids li p {
  margin-bottom: 0;
  word-wrap: break-word;
  word-break: normal;
}

.user-grids .user-avatar-link {
  margin-bottom: 5px;
}

.user-grids .user-link {
  display: block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.container .vjs-default-skin .vjs-big-play-button {
  top: 50%;
  left: 50%;
  margin-top: -40px;
  margin-left: -50px;
  width: 100px;
  height: 80px;
}

.type-hidden {
  display: block !important;
  height: 0 !important;
  border: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  padding: 0 !important;
  margin: 0 !important;
}

.border-radius-none {
  border-radius: 0 !important;
}

.es-icon {
  line-height: 1;
}

body {
  background: #f5f8fa;
  word-wrap: break-word;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* body.bg-blank {
    background-color: #fff
} */

html.nav-active,
html.nav-active body {
  position: relative;
  overflow: hidden;
  height: 100%;
}

.es-wrap.nav-active {
  transition: all 0.3s ease;
  transform: translate3d(250px, 0, 0);
  -webkit-transform: translate3d(250px, 0, 0);
  -o-transform: translate3d(250px, 0, 0);
  -moz-transform: translate3d(250px, 0, 0);
}

.html-mask.active {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.2);
  -webkit-backface-visibility: hidden;
}

#content-container {
  margin: 0px auto 30px;
  min-height: 400px;
}

.body-wrap {
  /*background-color: #F5F8FA;*/
}

@media (max-width: 767px) {
  #content-container {
    min-height: 482px;
    /* margin-top:60px; */
  }
}

.caret {
  border-top: 4px solid;
}

.tooltip {
  min-width: 40px;
}

.affix,
.affix-bottom {
  z-index: 1;
}

.cke_chrome {
  border-radius: 4px;
  border-color: #e1e1e1 !important;
  box-shadow: none !important;
}

.editor-text img {
  max-width: 100% !important;
  height: auto !important;
}

.webuploader-element-invisible {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
}

.short-long-text .short-text {
  cursor: pointer;
}

.short-long-text .long-text {
  cursor: pointer;
  display: none;
}

.section-gray,
.section-gray .text-line h5>span {
  background-color: #f5f8fa !important;
}

.section-wihte,
.section-wihte .text-line h5>span {
  background-color: #fff !important;
}

.divider-line {
  border-bottom: 1px solid #f5f5f5;
}

.h400 {
  min-height: 400px;
}

.empty {
  text-align: center;
  color: #c1c1c1;
  padding: 20px 0;
}

.empty.thread-empty {
  font-size: 14px;
  color: #6b778e;
  text-align: center;
  line-height: 22px;
}

.empty.thread-empty>a {
  color: #005bab;
  text-decoration: underline;
}

a.transition,
a.transition:hover {
  transition: all 0.3s ease;
}

.underline,
.underline:hover {
  text-decoration: underline !important;
}

.ellipsis,
.text-overflow {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.navbar {
  margin-bottom: 0;
  z-index: 99;
  border-radius: 0;
}

.navbar-collapse {
  border-top: none;
}

.es-header {
  background: #212121;
  height: 60px;
  border: none;
  padding: 0 20px;
}

@media (min-width: 768px) {
  header .header-box {
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
  }
}

.es-header .container {
  position: relative;
}

.es-header .collapse {
  display: block;
}

@media (max-width: 767px) {
  .es-header .navbar-header {
    text-align: center;
    float: none;
  }

  .es-header .navbar-header .navbar-brand {
    display: inline-block;
    float: none;
  }
}

.es-header .navbar-header .navbar-brand {
  height: 60px;
  line-height: 50px;
  /*padding: 16px 24px 0 10px !important;*/
  color: #fff;
  font-size: 0;
}

.es-header .navbar-header .navbar-brand .logo {
  width: 130px;
  height: 40px;
  background: url("/static-dist/app/img/2018/1.0/common/logo.png?v=0") no-repeat center;
  background-size: contain;
  margin-top: 10px;
  /* margin-right: 70px; */
}

@media (max-width: 768px) {
  .es-header .navbar-header .navbar-brand .logo {
    margin-top: 0px;
  }
}

.es-header .navbar-header .navbar-brand .logo-text {
  font-size: 12px;
  color: #7f868e;
  line-height: 12px;
  display: block;
  margin-top: 4px;
}

@media (max-width: 767px) {
  .es-header .navbar-header .navbar-brand {
    padding: 10px;
    line-height: 40px;
  }
}

/* .es-header .navbar-header .navbar-brand>img {
    height: 50px;
    width: auto
} */

@media (max-width: 767px) {
  .es-header .navbar-header .navbar-brand>img {
    height: 40px;
  }
}

@media (max-width: 991px) {
  .es-header .nav.navbar-nav {
    margin-left: 0;
    margin-right: 0;
  }

  .recommend-teacher-new::before,
  .recommend-teacher-new::after,
  .open-course-list-section::before,
  .open-course-list-section::after,
  .recommend-student.indexstu-evaluate:before,
  .recommend-student.indexstu-evaluate:after {
    display: none !important;
  }

  /* 学员评价 */
  .studentPc {
    display: none !important;
  }

  .studentRem {
    display: block !important;
  }

  .studentRem .allTalk .allTalk-box {
    margin-right: 0px;
  }
}

.es-header .nav.navbar-nav>li>a {
  padding: 20px 30px;
  line-height: 20px;
  color: #c1c1c1;
  background: none;
  transition: all 0.3s ease;
}

@media (max-width: 1199px) {
  .es-header .nav.navbar-nav>li>a {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media (max-width: 991px) {
  .es-header .nav.navbar-nav>li>a {
    padding-left: 10px;
    padding-right: 10px;
  }
}

.es-header .nav.navbar-nav>li.active>a,
.es-header .nav.navbar-nav>li.open.active>a,
.es-header .nav.navbar-nav>li.open>a,
.es-header .nav.navbar-nav>li.open>a:focus,
.es-header .nav.navbar-nav>li.open>a:hover,
.es-header .nav.navbar-nav>li>a:focus,
.es-header .nav.navbar-nav>li>a:hover {
  background: none;
  color: #fff;
  transition: all 0.3s ease;
}

.es-header .nav.navbar-nav>li.active>a {
  color: #005BAC !important;
  /* 新年皮肤 */
  /* color: #e8543b !important; */
}

.es-header .nav.navbar-nav .navbar-toggle {
  padding: 5px 15px;
  background: #1abc9c;
}

.es-header .nav.navbar-nav .navbar-toggle .icon-bar {
  background: #fff;
}

.es-header .navbar-form {
  margin: 15px 18px 15px 10px;
}

@media (max-width: 1199px) {
  .es-header .navbar-form {
    margin: 15px 0;
  }
}

.active-nav-wrap {
  position: absolute;
  right: 165px;
  top: 15px;
}

.active-nav-wrap img {
  width: 120px;
  height: 28px;
}

@media (max-width: 992px) {
  .active-nav-wrap {
    right: 105px;
  }
}

@media (max-width: 768px) {
  .active-nav-wrap {
    display: none;
    right: 65px;
  }
}

.navbar-mobile {
  position: absolute;
  top: 0;
  left: 0;
}

.navbar-mobile .navbar-more {
  position: relative;
  padding: 20px 10px;
  line-height: 20px;
  display: block;
  color: #fff;
  z-index: 1001;
}

.navbar-mobile .nav-mobile {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 250px;
  overflow-x: hidden;
  overflow-y: auto;
  background: #3f3f3f;
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}

.navbar-mobile .nav {
  float: none;
  text-align: left;
  padding: 0 20px;
}

.navbar-mobile .dropdown-menu>li>a {
  color: #fff;
}

.navbar-mobile .navbar-form {
  width: 80%;
  margin: 60px auto 20px;
}

.navbar-mobile .navbar-form .form-control {
  width: 100%;
}

.navbar-form {
  margin: 10px;
  box-shadow: none;
}

@media (max-width: 767px) {
  .navbar-form {
    margin-left: 0;
    margin-right: 0;
  }
}

.navbar-form .form-group {
  position: relative;
}

.navbar-form .form-control {
  height: 40px;
  width: 220px;
  border-radius: 20px;
  line-height: 28px;
  padding: 0 62px 0 18px;
  transition: all 0.3s ease;
  border-color: #fff;
}

.navbar-form .form-control.active {
  width: 220px;
}

.navbar-form .button {
  position: absolute;
  right: 2px;
  top: 6px;
  border: none;
  background: none;
}

.nav>li.nav-more li .dropdown-menu {
  left: 100%;
  top: 0;
}

.nav>li.nav-more.open li:hover .dropdown-menu {
  display: block;
}

.nav>li.nav-more .open.active>a,
.nav>li.nav-more .open>a,
.nav>li.nav-more .open>a:focus,
.nav>li.nav-more .open>a:hover {
  background: #46c37b !important;
  color: #fff !important;
}

.navbar-user {
  z-index: 1;
  position: absolute;
  top: 0;
  right: 20px;
}

@media (max-width: 767px) {
  .navbar-user {
    right: 5px;
  }
}

@media (min-width: 768px) {
  .navbar-user.left {
    right: 0;
    height: 100%;
  }
}

.nav.user-nav {
  float: right;
}

.nav.user-nav>li {
  float: left;
  height: 60px;
}

.nav.user-nav>li>a {
  display: block;
  padding: 20px 10px;
  color: #c1c1c1;
  transition: all 0.3s ease;
}

/*@media (max-width:1199px) {
.nav.user-nav>li>a {
padding: 20px 10px
}

}*/

.nav.user-nav li:nth-last-of-type() a {
  padding-right: 0 !important;
}

.nav.user-nav>li>a.dropdown-toggle {
  padding: 15px 10px;
}

@media (max-width: 991px) {
  .nav.user-nav>li>a.dropdown-toggle {
    padding: 15px 5px;
  }
}

.user-nav {
  /*width: 140px !important;*/
}

.nav.user-nav>li>a:focus,
.nav.user-nav>li>a:hover {
  color: #fff;
  background: none;
  transition: all 0.3s ease;
}

.nav.user-nav>li>a.hasmessage {
  position: relative;
  display: block;
}

.nav.user-nav>li>a.hasmessage>.dot {
  position: absolute;
  display: block;
  width: 5px;
  height: 5px;
  /* top: 21px; */
  top: 0px;
  right: 8px;
  font-size: 20px;
  border-radius: 50%;
  background-color: #e83d2c;
}

@media (min-width: 1200px) {
  .nav.user-nav .user-avatar-li .dropdown-menu {
    margin-right: -50px;
  }
}

.nav.user-nav .dropdown-menu,
.mobile header .dropdown-menu {
  width: 160px;
  background: #fff;
  left: auto;
  right: 0;
}

.nav.user-nav .messageNotification {
  width: 280px;
  height: 400px;
}

.nav.user-nav .dropdown-menu>li,
.mobile header .dropdown-menu>li {
  width: 100%;
}

.nav.user-nav .dropdown-menu>li>a,
.mobile header .dropdown-menu>li>a {
  padding-left: 10px;
}

.nav.user-nav .dropdown-menu>li>a:hover .num,
.mobile header .dropdown-menu>li>a:hover .num {
  background: #fff;
  color: #46c37b;
  transition: all 0.3s ease;
}

.nav.user-nav .dropdown-menu>li i,
.mobile-header .dropdown-menu>li i {
  padding: 0 10px;
}

.nav.user-nav .dropdown-menu>li .num,
.mobile header .dropdown-menu>li .num {
  background: #999;
  padding: 0 10px;
  border-radius: 20px;
  color: #fff;
  transition: all 0.3s ease;
}

/* .es-footer {
    position: relative
} */
/* .es-footer img {
    position: relative;
    top: -2px;
    padding-right: 2px;
} */
.es-footer .policeimg {
  position: relative;
  padding-left: 24px;
}

.es-footer .policeimg::before {
  width: 20px;
  height: 29px;
  position: absolute;
  content: "";
  left: 0;
  top: -3px;
  background: url(/static-dist/app/img/shenlan19/beian_pic19.png) no-repeat 0 0;
  background-size: 20px 20px;
}

.footer-default .es-footer {
  background: #293041;
}

.footer-default .es-footer .copyright {
  max-width: 1080px;
  margin: 0 auto;
  border-top: 1px solid #343d51;
}

.footer-index .es-footer .copyright {
  max-width: 1080px;
  margin: 0 auto;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.es-footer .copyright {
  text-align: center;
  padding: 15px 0;
  line-height: 30px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 767px) {
  .es-footer .copyright {
    padding: 10px 0;
    line-height: 20px;
  }
}

.es-footer .copyright a {
  color: rgba(255, 255, 255, 0.6);
  transition: all 0.3s ease;
}

.es-footer .copyright a:hover {
  transition: all 0.3s ease;
  color: #fff;
}

/* 首页底部的背景图片 */
.footer-index {
  /* background: url("/static-dist/app/img/shenlan19/bowen_bg_pic.png") no-repeat;
    background-position: bottom center;
    padding-top: 154px; */
  position: relative;
  background: linear-gradient(60deg,
      rgba(84, 58, 183, 1) 0%,
      rgba(0, 172, 193, 1) 100%);
}

@media (max-width: 767px) {
  .footer-index {
    padding-top: 0px;
  }

  .m-wave {
    display: none;
  }
}

.footer-default .es-footer-link {
  background: #293041;
}

.es-footer-link {
  /* background: #293041; */
  padding: 30px 0 0px 0;
  /* border-bottom: 1px solid #343D51; */
}

.es-footer-link .col-md-4 a {
  display: block;
  text-align: left;
}

.es-footer-link .col-md-4 a img {
  width: 192px;
  height: 56px;
}

@media (max-width: 767px) {
  .es-footer-link {
    padding: 20px 0;
  }
}

/* 底部导航 */
.footer-main .slxy-link {
  white-space: nowrap;
}

.footer-main .slxy-link .slxy-link-item {
  margin-right: 20px;
  color: rgba(255, 255, 255, 0.6);
  white-space: nowrap;
  display: inline-block;
  min-width: 62px;
}

.footer-main .slxy-link .slxy-link-item a,
.footer-main .slxy-link .slxy-link-item span {
  color: #fff;
}

/* 底部导航end */
.footer-main .link-item {
  width: 25%;
  float: left;
  padding: 0 10px;
  margin-top: 30px;
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  .footer-main .link-item {
    width: 33.33%;
    padding: 0 5px;
  }
}

.footer-main .title {
  font-size: 14px;
  color: #f8f8f8;
  font-weight: 400;
  margin-bottom: 6px;
}

@media (max-width: 767px) {
  .footer-main h3 {
    font-size: 16px;
    margin-bottom: 20px;
  }
}

.footer-main ul {
  padding: 0;
  margin-bottom: 0;
  list-style-type: none;
}

.footer-main ul li {
  margin-right: 20px;
  font-size: 13px;
  display: inline-block;
  color: rgba(255, 255, 255, 0.6);
}

.footer-main ul li:hover {
  color: #fff;
}

@media (max-width: 767px) {
  .footer-main ul li {
    margin-top: 10px;
  }
}

@media (max-width: 992px) {
  .footer-twoCode {
    display: none;
  }
}

.footer-twoCode {
  margin-top: 91px;
  margin-left: 53px;
}

.footer-twoCode .img-wrap {
  display: inline;
  width: 93px;
  float: right;
  text-align: center;
}

.footer-twoCode img {
  width: 90px;
  height: 90px;
}

.footer-twoCode .imggz {
  margin-right: 30px;
}

.footer-twoCode .img-wrap span {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  padding-top: 6px;
  display: inline-block;
  width: 93px;
  text-align: center;
}

.footer-main {
  float: right;
  margin-top: 91px;
  margin-left: 77px;
}

.footer-main a {
  color: rgba(255, 255, 255, 0.6);
  transition: all 0.3s ease;
}

.footer-main a:hover {
  color: #fff;
  transition: all 0.3s ease;
}

.footer-logo {
  margin-top: 20px;
  text-align: center;
}

.footer-logo {
  text-align: left;
}

.footer-logo>a>img {
  width: 172px;
  height: 50px;
  margin-bottom: 19px;
}

.footer-logo .introduction {
  color: rgba(255, 255, 255, 0.6);
  text-align: justify;
  width: 300px;
  line-height: 24px;
}

.footer-logo .footer-sns {
  margin-top: 30px;
  display: none;
}

.footer-logo .footer-sns>a {
  display: inline-block;
}

.footer-logo .footer-sns i {
  display: block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: 0 10px;
  font-size: 24px;
  vertical-align: middle;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  transition: all 0.3s ease;
}

.footer-logo .footer-sns i:hover {
  transition: all 0.3s ease;
}

.footer-logo .footer-sns i.es-icon-weibo {
  background: #e6162d;
}

.footer-logo .footer-sns i.es-icon-weibo:hover {
  background: #c4000b;
}

.footer-logo .footer-sns i.es-icon-weixin {
  background: #1ec354;
}

.footer-logo .footer-sns i.es-icon-weixin:hover {
  background: #00a132;
}

.footer-logo .footer-sns i.es-icon-apple {
  background: #3793f1;
}

.footer-logo .footer-sns i.es-icon-apple:hover {
  background: #1571cf;
}

.footer-logo .footer-sns i.es-icon-android {
  background: #78c257;
}

.footer-logo .footer-sns i.es-icon-android:hover {
  background: #56a035;
}

@keyframes rotate {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.5);
  }

  to {
    transform: scale(1);
  }
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.5);
  }

  to {
    -webkit-transform: scale(1);
  }
}

@-webkit-keyframes loader-scale {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  45% {
    -webkit-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes loader-scale {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  45% {
    -webkit-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0.7;
  }

  80% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

.card-loader {
  color: #919191;
  line-height: 20px;
  text-align: center;
}

.loader-inner>span {
  background-color: #46c37b;
  width: 5px;
  height: 5px;
  border-radius: 100%;
  margin: 2px;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  display: inline-block;
}

.loader-inner>span:nth-child(1) {
  -webkit-animation: loader-scale 0.75s 0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
  animation: loader-scale 0.75s 0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.loader-inner>span:nth-child(2) {
  -webkit-animation: loader-scale 0.75s 0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
  animation: loader-scale 0.75s 0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.loader-inner>span:nth-child(3) {
  -webkit-animation: loader-scale 0.75s 0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
  animation: loader-scale 0.75s 0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

@-webkit-keyframes nextshake {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-2px);
  }

  50% {
    -webkit-transform: translateY(2px);
  }

  to {
    opacity: 1;
    -webkit-transform: translateY(-2px);
  }
}

@keyframes nextshake {
  0% {
    opacity: 1;
    transform: translateY(-2px);
  }

  50% {
    transform: translateY(2px);
  }

  to {
    opacity: 1;
    transform: translateY(-2px);
  }
}

.es-transup,
.es-transup:hover {
  transition: all 0.3s ease;
}

.es-transup:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(359deg);
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(359deg);
  }
}

/*!
* animate.css -http: //daneden.me/animate
* Version - 3.5.1 * Licensed under the MIT license - http: //opensource.org/licenses/MIT
* * Copyright (c) 2016 Daniel Eden */

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.bounceIn,
.animated.bounceOut,
.animated.flipOutX,
.animated.flipOutY {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
}

@-webkit-keyframes bounce {

  0%,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes bounce {

  0%,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {

  0%,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

@keyframes flash {

  0%,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

@keyframes rubberBand {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {

  0%,
  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {

  0%,
  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
    transform: translate3d(-25%, 0, 0) rotate(-5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
    transform: translate3d(20%, 0, 0) rotate(3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
    transform: translate3d(-15%, 0, 0) rotate(-3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
    transform: translate3d(10%, 0, 0) rotate(2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
    transform: translate3d(-5%, 0, 0) rotate(-1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
    transform: translate3d(-25%, 0, 0) rotate(-5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
    transform: translate3d(20%, 0, 0) rotate(3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
    transform: translate3d(-15%, 0, 0) rotate(-3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
    transform: translate3d(10%, 0, 0) rotate(2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
    transform: translate3d(-5%, 0, 0) rotate(-1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {

  0%,
  11.1%,
  to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {

  0%,
  11.1%,
  to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceIn {

  0%,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

@keyframes bounceIn {

  0%,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInRight {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@keyframes bounceInUp {

  0%,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 1;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 1;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotateY(-1turn);
    transform: perspective(400px) rotateY(-1turn);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
    transform: perspective(400px) translateZ(150px) rotateY(-170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotateY(-1turn);
    transform: perspective(400px) rotateY(-1turn);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    transform: perspective(400px) translateZ(150px) rotateY(-190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
    transform: perspective(400px) translateZ(150px) rotateY(-170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-20deg);
    transform: perspective(400px) rotateX(-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotateX(-5deg);
    transform: perspective(400px) rotateX(-5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-20deg);
    transform: perspective(400px) rotateX(-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotateX(-5deg);
    transform: perspective(400px) rotateX(-5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-20deg);
    transform: perspective(400px) rotateY(-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotateY(-5deg);
    transform: perspective(400px) rotateY(-5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-20deg);
    transform: perspective(400px) rotateY(-20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotateY(-5deg);
    transform: perspective(400px) rotateY(-5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotateX(-20deg);
    transform: perspective(400px) rotateX(-20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotateX(-20deg);
    transform: perspective(400px) rotateX(-20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotateY(-15deg);
    transform: perspective(400px) rotateY(-15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotateY(-15deg);
    transform: perspective(400px) rotateY(-15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  0% {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  0% {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  0% {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

@-webkit-keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
    transform: translate3d(-100%, 0, 0) rotate(-120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
    transform: translate3d(-100%, 0, 0) rotate(-120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

@-webkit-keyframes rollOut {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
    transform: translate3d(100%, 0, 0) rotate(120deg);
  }
}

@keyframes rollOut {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
    transform: translate3d(100%, 0, 0) rotate(120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInUp {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

/* 我的学习，新增课程有效期 */
.course-limit-data {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  color: #fff;
  padding-left: 7px;
  font-size: 12px;
  background-image: linear-gradient(180deg,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.85) 100%);
  border-radius: 0 0 6px 6px;
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  0% {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@keyframes slideInDown {
  0% {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  0% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@keyframes slideInLeft {
  0% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  0% {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@keyframes slideInRight {
  0% {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  0% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@keyframes slideInUp {
  0% {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

.bg-graynew {
  background-color: #323a53 !important;
}

.bg-gray {
  background-color: #919191 !important;
}

.bg-gray-lighter {
  background-color: #eee;
}

.bg-color {
  background-color: #fafafa !important;
}

.bg-border-color {
  background-color: #e4ecf3 !important;
}

.bg-danger {
  background-color: #e83d2c !important;
}

.bg-primary {
  background-color: #46c37b !important;
}

.bg-success {
  background-color: #70d445 !important;
}

.bg-warning {
  background-color: #ff8a0c !important;
}

.border-gray {
  border-color: #e4ecf3 !important;
}

.border-top-gray-lighter {
  border-top: 1px solid #f5f5f5;
}

.color-warning {
  color: #ff8a0c !important;
}

.color-success {
  color: #70d445 !important;
}

.color-info {
  color: #2db7f5 !important;
}

.color-common {
  color: #3385ff !important;
}

.color-danger {
  color: #e83d2c !important;
}

.color-yellow {
  color: #fbc02d !important;
}

.gray-darker {
  color: #313131 !important;
}

.gray-dark {
  color: #616161 !important;
}

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

.gray-medium {
  color: #c1c1c1 !important;
}

.gray-light {
  color: #e1e1e1 !important;
}

.gray-lighter {
  color: #f5f5f5 !important;
}

.mt0 {
  margin-top: 0 !important;
}

.mt5 {
  margin-top: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.pd56 {
  padding-top: 56px;
}

.mr0 {
  margin-right: 0 !important;
}

.mr5 {
  margin-right: 5px !important;
}

.mr10 {
  margin-right: 10px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb5 {
  margin-bottom: 5px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.ml0 {
  margin-left: 0 !important;
}

.ml5 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml60 {
  margin-left: 60px !important;
}

.mh0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.mh5 {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.mh10 {
  margin-left: 10px !important;
  margin-right: 10px !important;
}

.mh20 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.mv0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.mv5 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

.mv10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.mv20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.pt0 {
  padding-top: 0 !important;
}

.pt5 {
  padding-top: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pr0 {
  padding-right: 0 !important;
}

.pr5 {
  padding-right: 5px !important;
}

.pr10 {
  padding-right: 10px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.pr55 {
  padding-right: 55px !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.pb5 {
  padding-bottom: 5px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pl0 {
  padding-left: 0 !important;
}

.pl5 {
  padding-left: 5px !important;
}

.pl10 {
  padding-left: 10px !important;
}

.pl20 {
  padding-left: 20px !important;
}

.ph0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.ph5 {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.ph10 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.ph20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.pv0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.pv5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.pv10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pv20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.mts {
  margin-top: 5px !important;
}

.mtm {
  margin-top: 10px !important;
}

.mtl {
  margin-top: 20px !important;
}

.mrs {
  margin-right: 5px !important;
}

.mrm {
  margin-right: 10px;
}

.mrl {
  margin-right: 20px;
}

.mbs {
  margin-bottom: 5px !important;
}

.mbm {
  margin-bottom: 10px !important;
}

.mbl {
  margin-bottom: 20px !important;
}

.mls {
  margin-left: 5px !important;
}

.mlm {
  margin-left: 10px !important;
}

.textareaPre {
  white-space: pre-wrap !important;
  /* white-space: pre-line !important; */
}

.es-footer .container .mlm {
  margin-left: 0 !important;
}

.es-footer .container .mts {
  display: inline-block;
  margin-left: 15px !important;
}

.es-footer .container .mts span {
  padding-left: 15px;
  padding-right: 15px;
}

.slxy-login-tip {
  font-size: 12px;
  line-height: 20px;
  margin-bottom: px;
  margin-top: -10px;
  color: rgba(0, 0, 0, 0.3);
}

.mobile-login-tip {
  font-size: 12px;
  color: #909eab;
  text-align: center;
  padding-top: 50px;
}

.mobile-login-tip>a {
  color: #3385ff;
  /* font-weight: 500; */
}

.mll {
  margin-left: 20px !important;
}

.mhs {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.mhm {
  margin-left: 10px !important;
  margin-right: 10px !important;
}

.mhl {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.mvs {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

.mvm {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.mvl {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.pts {
  padding-top: 5px !important;
}

.ptm {
  padding-top: 10px !important;
}

.ptl {
  padding-top: 20px !important;
}

.prs {
  padding-right: 5px !important;
}

.prm {
  padding-right: 10px !important;
}

.prl {
  padding-right: 20px !important;
}

.pbs {
  padding-bottom: 5px !important;
}

.pbm {
  padding-bottom: 10px !important;
}

.pbl {
  padding-bottom: 20px !important;
}

.pls {
  padding-left: 5px !important;
}

.plm {
  padding-left: 10px !important;
}

.pll {
  padding-left: 20px !important;
}

.phs {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.phm {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.phl {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.pvs {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.pvm {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pvl {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.text-normal {
  font-weight: 400 !important;
}

.text-centerBlod {
  font-weight: 500 !important;
}

.text-blod {
  font-weight: 700 !important;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

.text-12 {
  font-size: 12px !important;
}

.text-14 {
  font-size: 14px !important;
}

.text-16 {
  font-size: 16px !important;
}

.text-18 {
  font-size: 18px !important;
}

.text-20 {
  font-size: 20px !important;
}

.text-22 {
  font-size: 22px !important;
}

.text-24 {
  font-size: 24px !important;
}

.text-sm {
  font-size: 12px !important;
}

.text-md {
  font-size: 14px !important;
}

.text-lg {
  font-size: 16px !important;
}

.text-xlg {
  font-size: 18px !important;
}

.cursor-default {
  cursor: default;
}

.link-darker {
  color: #313131 !important;
  cursor: pointer;
}

.link-dark,
.link-darker,
.link-darker:hover {
  transition: all 0.3s ease;
}

.link-dark {
  cursor: pointer;
  color: #616161 !important;
}

.link-dark:hover,
.link-gray {
  transition: all 0.3s ease;
}

.link-gray {
  cursor: pointer;
  color: #919191 !important;
}

.link-gray:hover,
.link-light {
  transition: all 0.3s ease;
}

.link-light {
  cursor: pointer;
  color: #e1e1e1 !important;
}

.link-light:hover,
.link-lighter {
  transition: all 0.3s ease;
}

.link-lighter {
  cursor: pointer;
  color: #f5f5f5 !important;
}

.link-lighter:hover,
.link-medium {
  transition: all 0.3s ease;
}

.link-medium {
  cursor: pointer;
  color: #c1c1c1 !important;
}

.link-medium:hover,
.link-white {
  transition: all 0.3s ease;
}

.link-white {
  cursor: pointer;
  color: #fff !important;
}

.link-primary,
.link-white:hover {
  transition: all 0.3s ease;
}

.link-primary {
  cursor: pointer;
}

.link-primary:hover {
  transition: all 0.3s ease;
}

.inline-block {
  display: inline-block !important;
}

.vertical-top {
  vertical-align: top !important;
}

.vertical-middle {
  vertical-align: middle !important;
}

.vertical-bottom {
  vertical-align: bottom !important;
}

.controls .select2-container {
  margin-left: 0;
  margin-right: 0;
  border: 0;
  padding: 0;
  float: none;
}

.controls .select2-container-multi .select2-choices {
  background-image: none;
  filter: none;
  height: 34px;
  min-height: 34px;
  line-height: 20px;
  border-radius: 4px;
  border: 1px solid #e1e1e1;
  transition: border 0.2s linear, box-shadow 0.2s linear;
}

.select2-container-multi.select2-container-active .select2-choices,
.select2-drop.select2-drop-above {
  box-shadow: none !important;
}

.controls .select2-container-multi .select2-choices .select2-search-field input {
  min-height: 30px;
}

.controls .select2-container-multi .select2-choices .select2-search-choice {
  margin-top: 5px;
  background-image: none;
  background-color: #f1f1f1;
  border-color: #ddd;
}

.form-group .select2-container .select2-choice {
  height: 34px;
  line-height: 34px;
}

.form-group .select2-container .select2-choice .select2-arrow b,
.form-group .select2-container .select2-choice abbr,
.form-group .select2-search-choice-close,
.form-group .select2-search input {
  background-size: 60px 50px !important;
}

.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover {
  background-position: right -15px;
}

.member-item .course-picture {
  float: left;
}

.member-item .course-view {
  float: right;
  margin: 10px;
  visibility: hidden;
}

.member-item:hover .course-view {
  visibility: visible;
}

.lastest-member-list .member-picture-link {
  float: left;
  margin: 0 10px 5px 0;
}

.lastest-member-list .media {
  padding-bottom: 0;
}

.lastest-member-list .member-picture {
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 3px;
}

.lastest-member-list .member-nickname {
  color: #555;
}

.lastest-member-list .member-title {
  color: #777;
  font-size: 12px;
}

.memberzone {
  min-height: 450px;
}

.vip-banner {
  padding: 20px 0;
}

.vip-banner .vip-banner-thumb {
  float: left;
  width: 870px;
}

@media (max-width: 1199px) {
  .vip-banner .vip-banner-thumb {
    width: 720px;
  }
}

@media (max-width: 991px) {
  .vip-banner .vip-banner-thumb {
    width: 100%;
  }
}

.vip-banner .vip-banner-thumb img {
  width: 100%;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

@media (max-width: 991px) {
  .vip-banner .vip-banner-thumb img {
    border-radius: 4px;
  }
}

.vip-user {
  float: left;
  width: 270px;
  height: 350px;
  padding: 30px 20px;
  background-color: #fff;
  text-align: center;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

@media (max-width: 1199px) {
  .vip-user {
    padding: 10px;
    width: 220px;
    height: 290px;
  }
}

.vip-user .user-avatar {
  position: relative;
  display: inline-block;
}

.vip-user .user-avatar>img {
  border-radius: 50%;
  width: 100px;
  height: 100px;
}

@media (max-width: 1199px) {
  .vip-user .user-avatar>img {
    width: 90px;
    height: 90px;
  }
}

.vip-user .user-avatar .icon-user-status {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: #a1a1a1;
}

.vip-cat {
  text-align: center;
  margin-bottom: 20px;
}

.vip-cat .nav-pills {
  display: inline-block;
}

.vip-cat .nav-pills li {
  margin: 0 20px;
}

.vip-wide-item {
  width: 940px;
  height: 200px;
  padding: 30px 20px !important;
  margin: 0 auto 30px !important;
}

@media (max-width: 991px) {
  .vip-wide-item {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .vip-wide-item {
    height: auto;
  }
}

.vip-wide-item .vip-thumb {
  float: left;
  width: 14%;
  text-align: center;
  margin-top: 15px;
  padding-right: 20px;
}

@media (max-width: 991px) {
  .vip-wide-item .vip-thumb {
    width: 18%;
  }
}

@media (max-width: 767px) {
  .vip-wide-item .vip-thumb {
    width: 100%;
    margin-top: 0;
    margin-bottom: 20px;
  }
}

.vip-wide-item .vip-thumb img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.vip-wide-item .vip-info {
  float: left;
  width: 29%;
  height: 140px;
  padding: 10px;
  border-radius: 4px;
  text-align: center;
  background-color: #f5f5f5;
}

@media (max-width: 991px) {
  .vip-wide-item .vip-info {
    width: 54%;
    padding: 10px;
  }
}

@media (max-width: 767px) {
  .vip-wide-item .vip-info {
    width: 100%;
    margin-bottom: 20px;
  }
}

.vip-wide-item .vip-info .name {
  color: #313131;
}

.vip-wide-item .vip-info .price {
  color: #919191;
  font-size: 12px;
  margin-bottom: 0;
}

.moblie-fixed-zero {
  display: none;
}

.m-down-time {
  display: none;
}

@media (max-width: 768px) {
  .m-go-apply-chapter-box {
    float: right;
    margin-right: 130px;
    margin-top: 8px;
  }

  .m-go-apply-chapter-box-no-user {
    float: right;
    margin-right: 130px;
  }

  .m-down-time {
    display: block;
  }

  .course-ctiy {
    margin-left: 16px !important;
  }

  /* .m-fixed-bottom-zero {
        display: block !important;
        background: #FFFFFF !important;
        left: 0;
    } */
  .fixed-bottom-zero {
    background: #ffffff !important;
    left: 0;
  }

  .pc-btn-open {
    display: none !important;
  }

  .moblie-fixed-bottom-zero {
    margin: 0 auto;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 18;
    background: #ffffff;
    box-shadow: 0 -4px 8px 0 rgb(179 179 179 / 20%);
    color: #fff;
  }

  .moblie-fixed-bottom-zero .cd-button.go-apply {
    max-width: unset;
    min-width: unset;
    padding: 0;
    line-height: 44px;
  }

  /* 购物车底部状态的更新，故隐藏 */
  /* .moblie-fixed-zero {
        display: flex;
        padding: 0 20px;
    } */
  .course_not_login.cd-button.go-apply,
  .go-apply.remindbtn.m-btn-go-apply {
    width: 100% !important;
    height: 44px !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  .remindbtn.m-btn-go-apply {
    padding: 0 !important;
    line-height: 44px;
  }

  .fixed-bottom-zero .cd-button.go-threads {
    background: #4a90e2;
    color: #ffffff;
    width: 140px;
    height: 44px;
    padding: 0;
    line-height: 44px;
    margin-top: 10px;
  }

  .fixed-bottom-zero .ptip-m {
    font-family: MicrosoftYaHeiUI;
    font-size: 14px;
    color: #718098;
    letter-spacing: 0;
    font-weight: 400;
    padding-bottom: 10px;
  }

  .bottom-price-increase {
    display: block !important;
    width: 100%;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #5c3500;
    letter-spacing: 0;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute;
    /* top: 5vw; */
    top: -35px;
    left: 0;
    opacity: 0.9;
    background-color: #ffd7ab;
  }

  .flowers-payment {
    display: block !important;
    position: absolute;
    top: 5vw;
  }

  .bottom-price-increase .increase-text {
    padding-left: 17px;
  }

  .flowers-currentPrice {
    /* display: none !important; */
    position: absolute;
    left: 10px;
    top: 4vw;
    color: #a7b2c3;
  }

  .pc-flowers-icon {
    display: none;
  }

  .m-flowers-icon {
    display: inline-block !important;
  }

  .pc-ptip-flowers {
    display: none !important;
  }
}

.m-flowers-icon {
  display: none;
}

.pc-ptip-flowers {
  display: block;
  color: #fff;
}

/* .bottom-price-increase .increase-text {
    font-family: MicrosoftYaHeiUI-Bold;
    font-size: 12px;
    color: #FFFF00;
    letter-spacing: 0;
    font-weight: 700;
} */

.vip-wide-item .vip-info .price span {
  font-size: 18px;
  margin-right: 5px;
  color: #e83d2c;
}

.vip-wide-item .vip-info .number {
  font-size: 12px;
  margin: 10px auto;
}

.vip-wide-item .vip-content {
  float: left;
  width: 45%;
  margin: 10px 0;
  height: 120px;
  font-size: 12px;
  line-height: 20px;
  padding: 0 20px;
  overflow: hidden;
  color: #313131;
}

@media (max-width: 991px) {
  .vip-wide-item .vip-content {
    display: none;
  }
}

.vip-wide-item .vip-content p {
  margin: 0;
}

.vip-wide-item .vip-item-footer {
  float: right;
  width: 12%;
  margin-top: 53px;
  text-align: center;
}

@media (max-width: 991px) {
  .vip-wide-item .vip-item-footer {
    width: 25%;
  }
}

@media (max-width: 767px) {
  .vip-wide-item .vip-item-footer {
    margin-top: 0;
    width: 100%;
  }

  .vip-wide-item .vip-item-footer .btn {
    display: block;
  }
}

.vip-item-list {
  background-color: #fafafa;
  padding-bottom: 15px;
}

.vip-swiper-container,
.vip-swiper-item {
  position: relative;
}

.vip-swiper-item {
  padding: 20px 50px !important;
  margin-bottom: 30px;
  background-color: #fff;
  border-radius: 4px;
}

@media (max-width: 1199px) {
  .vip-swiper-item {
    padding: 20px !important;
  }
}

.vip-swiper-item .vip-thumb {
  text-align: center;
  margin: 0 auto 15px;
}

.vip-swiper-item .vip-thumb img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.vip-swiper-item .vip-info {
  text-align: center;
  height: 140px;
  padding: 15px;
  margin-bottom: 15px;
  border-radius: 4px;
  background-color: #f5f5f5;
}

.vip-swiper-item .vip-info .name {
  font-size: 16px;
  color: #313131;
}

.vip-swiper-item .vip-info .price {
  color: #919191;
  font-size: 12px;
  margin-bottom: 0;
}

.vip-swiper-item .vip-info .price span {
  font-size: 18px;
  margin-right: 5px;
  color: #e83d2c;
}

.vip-swiper-item .vip-info .number {
  font-size: 12px;
  margin: 10px auto;
}

.vip-swiper-item .vip-content {
  font-size: 12px;
  line-height: 18px;
  height: 90px;
  overflow: hidden;
  margin-bottom: 15px;
  color: #313131;
}

.vip-swiper-item .vip-content p {
  margin: 0;
}

.vip-filer {
  background-color: #fff;
  padding-bottom: 40px;
}

.vip-new-member {
  background-color: #fafafa;
  padding: 10px 0 30px;
  text-align: center;
}

.vip-new-member .text-line {
  padding-bottom: 30px;
}

.vip-new-member .title {
  font-size: 32px;
  color: #fff;
  margin-bottom: 50px;
}

.vip-new-member .member-list {
  margin-bottom: 30px;
}

.vip-new-member .member-list img {
  display: inline-block;
  margin: 15px;
  border: 4px solid #fff;
  height: 80px !important;
  width: 80px !important;
  transition: all 0.3s ease;
}

.vip-new-member .member-list img:hover {
  transition: all 0.3s ease;
}

.bootstrap-notify-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  border-radius: 0;
  text-align: center;
  z-index: 2000;
  padding: 10px;
  margin: 0;
}

.bootstrap-notify-bar .close {
  margin-left: 10px;
}

.course-item-list-multi h3,
.course-item-list-multi h4 {
  font-size: 16px;
  font-weight: 400;
  line-height: 36px;
  text-indent: 15px;
  background: #f3f3f3;
  color: #777;
  border-bottom: 1px solid #e3e3e3;
  margin: 20px 0;
}

.course-item-list-multi h3 strong,
.course-item-list-multi h4 strong {
  color: #555;
}

.course-item-list-multi h4 {
  margin: 20px 0 20px 20px;
}

.course-item-list-multi ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.course-item-list-multi .item-object {
  position: relative;
  width: 64px;
  height: 54px;
  background-color: #1abc9c;
  float: left;
  margin-bottom: 20px;
  border-radius: 5px;
  border: 1px solid #16a085;
  text-align: center;
}

.course-item-list-multi .item-object:hover {
  box-shadow: 0 1px 3px #333;
}

.course-item-list-multi .item-object .item-icon {
  width: 36px;
  height: 36px;
  display: inline-block;
}

.course-item-list-multi .item-object-live {
  background-color: #f8a269;
  border-color: #da9078;
}

.course-item-list-multi .item-object-audio {
  background-color: #fbcf4b;
  border-color: #dca83f;
}

.course-item-list-multi .item-object-text {
  background-color: #9b59b6;
  border-color: #8e44ad;
}

.course-item-list-multi .item-object-courseware {
  background-color: #ae0073;
  border-color: #8e055f;
}

.course-item-list-multi .item-object-testpaper {
  background-color: #95a5a6;
  border-color: #7f8c8d;
}

.course-item-list-multi .item-object-ppt {
  background-color: #f58043;
  border-color: #b34330;
}

.course-item-list-multi .item-object-pdf {
  background-color: #b70b3b;
  border-color: #970c33;
}

.course-item-list-multi .item-object-doc {
  background-color: #38adca;
  border-color: #29859a;
}

.course-item-list-multi .item-object-xls {
  background-color: #75d073;
  border-color: #39872d;
}

.course-item-list-multi .item-object .item-length {
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  width: 100%;
  color: #fff;
  font-size: 12px;
  background: #666;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1;
  line-height: 16px;
  border-radius: 0 0 5px 5px;
  display: block;
}

.course-item-list-multi .item-object i {
  margin-top: 8px;
  font-size: 24px;
  color: #fff;
}

.course-item-list-multi .item-object .item-free {
  background: url("/static-dist/app/img/old/course-item-free.gif") 0 0 no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  width: 38px;
  height: 38px;
  margin-left: -1px;
  margin-top: -1px;
}

.course-item-list-multi .item-body {
  margin-left: 72px;
}

.course-item-list-multi .item-seq-name {
  color: #999;
  font-weight: 700;
  margin-bottom: 3px;
}

.course-item-list-multi .item-title {
  font-weight: 700;
  width: 100%;
  height: 36px;
  overflow: hidden;
}

.course-item-list-multi .live-item .item-title {
  height: 18px;
}

.sortable-list li .sort-handle {
  color: #ccc;
  display: inline-block;
  float: left;
  cursor: pointer;
  margin-right: 5px;
}

.sortable-list li .sort-handle:hover {
  color: #666;
}

.sortable-list li:hover .sort-handle {
  visibility: visible;
  color: #999;
}

.question-stem-fill-blank {
  padding-left: 15px;
  padding-right: 15px;
  border-bottom: 1px solid #999;
  color: #aaa;
}

.testpaper-titlebar {
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}

.testpaper-title {
  float: left;
  font-size: 24px;
  font-weight: 600;
  color: #444;
}

.testpaper-status {
  margin-top: 20px;
  float: right;
}

.homwork-status .label,
.testpaper-status .label {
  padding: 5px 25px;
  border-radius: 3px;
  font-size: 100%;
}

.testpaper-description {
  color: #444;
  font-size: 14px;
}

.testpaper-description img {
  max-width: 100%;
}

.testpaper-metas {
  color: #666;
  font-size: 12px;
  margin-bottom: 20px;
}

.testpaper-result-total {
  width: 160px;
  float: left;
  margin-right: 20px;
  text-align: center;
  color: #f60;
}

@media (max-width: 767px) {
  .testpaper-result-total {
    float: none;
    width: 100%;
  }
}

.testpaper-result-total .well {
  padding-top: 33px;
  padding-bottom: 34px;
}

.testpaper-result-total-score {
  font-size: 40px;
  margin-bottom: 10px;
}

.testpaper-result-total-score small {
  font-size: 16px;
}

.testpaper-result-table td,
.testpaper-result-table th {
  text-align: center;
  font-weight: 400;
}

.testpaper-result-table>thead>tr>th {
  border-bottom: 1px;
}

.testpaper-result-table .text-score {
  color: #f60;
}

.testpaper-navbar.affix {
  position: static;
}

@media (min-width: 768px) {
  .testpaper-navbar.affix {
    z-index: 1030;
    position: fixed;
    margin-left: -11px;
    top: 0;
    width: 720px;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);
  }
}

@media (min-width: 992px) {
  .testpaper-navbar.affix {
    width: 940px;
  }
}

@media (min-width: 1200px) {
  .testpaper-navbar.affix {
    width: 1140px;
  }
}

.testpaper-question {
  position: relative;
  margin-bottom: 50px;
  font-size: 14px;
  border-top: 1px solid #ccc;
  padding-top: 20px;
}

.panel .testpaper-question:first-child {
  border-top: none;
}

.modal .testpaper-question {
  border-top: none;
  padding-top: 0;
}

.testpaper-question-main {
  float: left;
  margin-left: 50px;
}

.testpaper-question-seq-wrap {
  float: left;
  width: 40px;
  margin-right: 10px;
  text-align: center;
}

.testpaper-question-seq {
  font-size: 20px;
  color: #3a87ad;
}

.question-score,
.testpaper-question-score {
  font-size: 12px;
  color: #aaa;
  border: 1px solid #ccc;
  padding: 0 1px;
  border-radius: 5px;
  background: #f6f6f6;
  display: inline-block;
}

.testpaper-question-stem {
  padding-bottom: 10px;
  border-bottom: 1px dashed #ddd;
  margin-bottom: 10px;
  overflow: hidden;
  zoom: 1;
}

.testpaper-question-stem-material img,
.testpaper-question-stem img {
  max-width: 100%;
}

.testpaper-question-choices {
  margin-left: 50px;
  padding-left: 0;
  list-style: none;
  border-bottom: 1px dashed #ddd;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.testpaper-question-choices img {
  max-width: 100%;
}

.testpaper-question-choices li {
  position: relative;
  padding: 6px 0 6px 36px;
}

.testpaper-question-choices li p {
  margin-bottom: 0;
}

.testpaper-question-choices li:hover {
  background: #eee;
  cursor: pointer;
}

.testpaper-question-choice-index {
  position: absolute;
  top: 6px;
  left: 6px;
  color: #999;
}

.testpaper-question-choice-right,
.testpaper-question-choice-right .testpaper-question-choice-index {
  color: #3c763d;
}

.question-text-success {
  color: #0b900d;
}

.question-text-danger {
  color: #ea1d19;
}

.testpaper-question-choice-inputs {
  margin-left: 50px;
  float: left;
}

.testpaper-question-choice-inputs label {
  padding: 8px 20px 8px 30px;
  display: inline-block;
}

.testpaper-question-choice-inputs label.active,
.testpaper-question-choice-inputs label:hover,
.testpaper-question-determine-inputs label.active,
.testpaper-question-determine-inputs label:hover {
  background: #eee;
}

.testpaper-question-fill-inputs {
  margin-left: 50px;
}

.testpaper-question-fill-inputs input {
  margin-bottom: 10px;
}

.homework-question-fill ul,
.testpaper-question-fill .testpaper-question-result ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.testpaper-question-determine-inputs {
  margin-left: 50px;
  float: left;
}

.testpaper-question-determine-inputs label {
  padding: 8px 20px 8px 30px;
  display: inline-block;
}

.testpaper-question-essay-inputs {
  margin-left: 50px;
  margin-bottom: 10px;
}

.testpaper-question-essay .testpaper-question-result {
  float: none;
}

.question-essay .question-body img,
.testpaper-question-essay .testpaper-question-result img {
  max-width: 100%;
}

.testpaper-question-result {
  margin-left: 50px;
  float: left;
}

.homework-question-result {
  margin-left: 5px;
  float: left;
}

.homework-question-result-title,
.question-result-title,
.testpaper-question-result-title {
  margin-bottom: 5px;
  color: #666;
}

.homework-question-result-suggested,
.testpaper-question-result-suggested {
  margin-bottom: 20px;
}

.testpaper-question-analysis {
  margin-left: 50px;
}

.testpaper-question-analysis img {
  max-width: 100%;
}

.testpaper-card .btn-index {
  font-size: 12px;
  padding: 0;
  width: 24px;
  height: 24px;
  line-height: 24px;
  display: inline-block;
  margin: 0 5px 5px 0;
}

.testpaper-card-explain .btn-index {
  width: 12px;
  height: 12px;
  font-size: 12px;
  margin: 0 3px 5px 0;
}

.testpaper-card-explain small {
  margin-right: 8px;
}

.testpaper-card-timer {
  color: #3a87ad;
  font-size: 20px;
}

.testpaper-card.affix {
  position: static;
  top: 0;
}

@media (max-width: 767px) {

  .testpaper-card.affix,
  .testpaper-card.affix-bottom {
    position: relative !important;
    top: 0 !important;
  }
}

@media (min-width: 992px) {

  .testpaper-card.affix,
  .testpaper-card.affix-bottom {
    width: 220px;
  }

  .testpaper-card.affix {
    position: fixed;
    top: 0;
  }

  .testpaper-card.affix-bottom {
    position: absolute;
  }
}

@media (min-width: 1200px) {

  .testpaper-card.affix,
  .testpaper-card.affix-bottom {
    width: 270px;
  }
}

.homwork-choice-index {
  margin-right: 20px;
  float: left;
}

.question-choices-inputs label {
  padding: 8px 20px 8px 30px;
  display: inline-block;
}

.question-choices-inputs label.active,
.question-choices-inputs label:hover {
  background: #eee;
}

.question-fill-inputs input {
  margin-bottom: 10px;
}

.question-set-item-side {
  text-align: center;
}

.question-set-item-seq {
  font-size: 20px;
  color: #3a87ad;
}

.question-set-heading {
  position: relative;
}

.question-set-type {
  position: absolute;
  top: 20px;
  left: 8px;
  background: #00e0ff;
  color: #fff;
  padding: 3px 15px;
  font-weight: 700;
  font-size: 16px;
  border-radius: 3px;
}

.question-set-title {
  margin-top: 5px;
  margin-left: 80px;
  margin-bottom: 10px;
  font-size: 20px;
}

.question-set-description {
  margin-left: 80px;
  color: #999;
}

@media (min-width: 992px) {

  .question-set-card.affix,
  .question-set-card.affix-bottom {
    width: 220px;
  }

  .question-set-card.affix {
    position: fixed;
    top: 0 !important;
  }

  .question-set-card.affix-bottom {
    position: absolute;
  }
}

@media (min-width: 1200px) {

  .question-set-card.affix,
  .question-set-card.affix-bottom {
    width: 270px;
  }
}

.question-set-card .question-index {
  display: inline-block;
  border: 1px solid #ccc;
  width: 28px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  margin-right: 5px;
  margin-bottom: 5px;
  border-bottom-width: 2px;
  text-decoration: none;
  color: #888;
}

.question-set-card .question-index:hover {
  background: #eee;
}

.question-set-card .question-index-active {
  background: #eee;
  border-color: #aaa;
}

.question-set-card .panel-heading {
  line-height: 30px;
}

a.homework-essay-textarea-pack-up {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
  color: #999;
}

.homework-status {
  margin-top: 20px;
  float: right;
}

.homework-status .label {
  padding: 5px 25px;
  border-radius: 3px;
  font-size: 100%;
}

.quality-switcher-control {
  margin: 10px 0;
  display: none;
}

.quality-switcher-control-open {
  display: block;
}

.quality-switcher .quality-actions {
  margin-top: 10px;
}

.ui-autocomplete {
  border: 1px solid #ccc;
  background-color: #fff;
  box-shadow: 2px 2px 3px #eee;
  z-index: 9999 !important;
}

.ui-autocomplete-ctn {
  margin: 0;
  padding: 0;
}

.ui-autocomplete-item {
  width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 30px;
  padding: 0 10px;
  cursor: default;
}

.ui-autocomplete-item-hover {
  background: #f2f2f2;
}

.ui-autocomplete-item-hl {
  background: #f6ff94;
}

.noUi-target {
  background-color: transparent;
  box-shadow: none;
  border: none;
}

.noUi-horizontal {
  width: 300px;
  height: 4px;
}

.noUi-horizontal .noUi-handle {
  height: 14px;
  width: 14px;
  left: -7px;
  top: -5px;
  background-color: #fff;
  box-shadow: none;
  border-radius: 50%;
}

.noUi-horizontal .noUi-handle:after,
.noUi-horizontal .noUi-handle:before {
  display: none;
}

.noUi-horizontal .noUi-handle:hover .score-tooltip .tooltip {
  opacity: 1;
  filter: alpha(opacity=100);
}

.noUi-horizontal .noUi-handle .score-tooltip {
  position: absolute;
  top: -34px;
  left: 0;
  width: 150px;
  margin-left: -75px;
  text-align: center;
}

.noUi-horizontal .noUi-handle .score-tooltip .tooltip {
  position: relative;
  display: inline-block;
}

.noUi-horizontal .noUi-tooltip {
  bottom: -33px;
  background-color: transparent;
  border-color: transparent;
}

.noUi-base {
  background-color: #e1e1e1;
  height: 4px;
  border-radius: 4px;
  border: none;
  box-shadow: none;
}

.noUi-connect {
  border-radius: 4px;
  box-shadow: none;
}

.ckeditor-balloon-uploader .balloon-filelist ul {
  max-height: 200px !important;
}

.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  -webkit-transition-property: -webkit-transform, left, top;
  -webkit-transition-duration: 0s;
  -webkit-transform: translateZ(0);
  -webkit-transition-timing-function: ease;
  -moz-transition-property: -moz-transform, left, top;
  -moz-transition-duration: 0s;
  -moz-transform: translateZ(0);
  -moz-transition-timing-function: ease;
  -o-transition-property: -o-transform, left, top;
  -o-transition-duration: 0s;
  -o-transform: translateZ(0);
  -o-transition-timing-function: ease;
  -o-transform: translate(0);
  -ms-transition-property: -ms-transform, left, top;
  -ms-transition-duration: 0s;
  -ms-transform: translateZ(0);
  -ms-transition-timing-function: ease;
  transition-property: transform, left, top;
  transition-duration: 0s;
  transform: translateZ(0);
  transition-timing-function: ease;
  box-sizing: border-box;
}

.swiper-free-mode>.swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-slide {
  float: left;
  box-sizing: border-box;
}

.swiper-hidden {
  visibility: hidden !important;
  height: 0 !important;
}

.swiper-hidden:first-child {
  visibility: visible !important;
  height: 100% !important;
}

.arrow-left,
.arrow-right {
  position: absolute;
  top: 50%;
  margin-top: -25px;
  color: #dbdbdb;
  transition: all 0.3s ease;
}

.arrow-left>i,
.arrow-right>i {
  font-size: 50px;
}

.arrow-left:focus,
.arrow-right:focus {
  color: #dbdbdb;
}

.arrow-left:hover,
.arrow-right:hover {
  color: #616161;
  transition: all 0.3s ease;
}

.arrow-left {
  left: -50px;
}

.arrow-right {
  right: -50px;
}

.swiper-wp8-horizontal {
  -ms-touch-action: pan-y;
}

.swiper-wp8-vertical {
  -ms-touch-action: pan-x;
}

.text-line {
  position: relative;
  padding: 36px 0;
  text-align: center;
}

.course-list-section .new-text-line {
  padding: 40px 0 42px 0;
}

.course-list-section .new-text-line h5 {
  background-color: #f9f9f9;
}

@media (max-width: 767px) {
  .text-line {
    padding: 20px 0;
  }
}

.text-line.gray h5>span {
  background: #f5f8fa;
}

.dynamic-section .text-line.gray h5>span {
  background-color: #f7f7f7;
}

.dynamic-section .text-line.gray h5 {
  margin-top: 4px;
  margin-bottom: 40px;
}

.text-line.small {
  padding: 10px 0;
}

.text-line.small h5 {
  font-size: 14px;
}

.text-line.small h5>span {
  padding: 0 20px;
}

.text-line .line {
  display: none;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #e1e1e1;
  margin-top: -1px;
  z-index: -1;
}

.text-line h5 {
  position: relative;
  margin-bottom: 20px;
  font-size: 32px;
  z-index: 1;
  color: #313131;
}

@media (max-width: 767px) {
  .text-line h5 {
    font-size: 16px;
  }
}

.text-line h5>i {
  padding-left: 20px;
  background: #fff;
}

.text-line h5>span {
  padding: 0 40px;
}

.text-line .subtitle {
  font-size: 16px;
  color: #919191;
}

@media (max-width: 767px) {
  .text-line .subtitle {
    font-size: 14px;
  }
}

.panel-default {
  padding: 0 15px;
  border-color: #e4ecf3;
}

@media (max-width: 767px) {
  .panel-default {
    padding: 0 10px;
  }
}

.panel-default>.panel-heading {
  position: relative;
  font-size: 16px;
  padding: 10px 0;
  line-height: 30px;
  background: #fff;
  border-bottom: 1px solid #e6e8eb;
}

.panel-default>.panel-heading .panel-title {
  padding: 10px 0;
  font-size: 16px;
  color: #3f4a54;
}

.panel-default>.panel-heading .panel-title>i {
  display: none;
}

.panel-default>.panel-heading .more {
  position: absolute;
  top: 23px;
  right: 0;
  transition: all 0.3s ease;
  font-size: 14px;
  color: #c1c1c1;
  line-height: 19px;
}

@media (max-width: 767px) {
  .panel-default>.panel-heading .more {
    top: 8px;
  }
}

.panel-default>.panel-heading .more:hover {
  color: #616161;
  transition: all 0.3s ease;
}

.panel-default>.panel-heading .panel-bar {
  position: absolute;
  top: 7px;
  right: 0;
  display: block;
}

.panel-default>.panel-footer {
  padding: 15px 0;
  background: none;
}

.panel-default>.panel-body {
  position: relative;
  /* padding: 34px 0 */
  padding: 20px 0 34px;
}

.panel-primary>.panel-heading {
  color: #fff;
}

.panel-primary>.panel-body {
  background: #fafafa;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.panel-gray {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.panel-gray>.panel-heading {
  background-color: #f5f5f5;
  color: #313131;
}

.panel-gray>.panel-body {
  background: #fff;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.panel-page {
  padding: 45px 50px 50px;
  min-height: 500px;
}

@media (max-width: 767px) {
  .panel-page {
    padding: 15px;
    min-height: 300px;
  }

  .panel-default>.panel-body {
    padding: 15px 0 0;
  }

  .panel-body .cd-tabs {
    margin-bottom: 10px;
  }

  .panel-body .cd-tabs>li+li {
    margin-left: 20px;
  }
}

.panel-page .panel-heading {
  background: transparent;
  border-bottom: none;
  margin: 30px 0 30px;
  padding: 0;
}

.panel-page .panel-heading h2 {
  font-size: 25px;
  margin-top: 0;
}

.es-section {
  background: #fff;
  /* padding: 15px; */
  padding: 20px;
  margin-bottom: 20px;
  border-radius: 4px;
  border: 1px solid #e4ecf3;
}

.es-section.section-lg {
  min-height: 400px;
}

.es-section .section-header {
  position: relative;
  margin-bottom: 20px;
  border-bottom: 1px solid #f5f5f5;
}

.es-section .section-header h1 {
  margin-top: 5px;
  margin-bottom: 20px;
  font-size: 20px;
}

.es-section .section-header h3 {
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 16px;
}

.es-section .section-header .more {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  color: #919191;
  transition: all 0.3s ease;
}

.es-section .section-header .more:hover {
  color: #616161;
  transition: all 0.3s ease;
}

.es-section .section-header .more>i {
  font-size: 24px;
}

.nav.nav-tabs {
  position: relative;
  margin-bottom: 25px;
  border-color: #f5f5f5;
}

.nav.nav-tabs .highlight {
  position: absolute;
  bottom: -1px;
}

.user-tabs-ul .highlight {
  border-bottom: 0px !important;
}

.user-tabs-ul .active a {
  position: relative;
}

.user-tabs-ul .active a:after {
  content: "";
  border-bottom: 2px solid #005bac;
  height: 2px;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
}

@media (max-width: 767px) {
  .nav.nav-tabs .highlight {
    display: none;
  }
}

.nav.nav-tabs>li {
  margin-bottom: 0;
}

.nav.nav-tabs>li>a {
  border: none;
  margin-right: 0;
  color: #313131;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.3s ease;
  padding: 5px 24px 15px;
}

@media (max-width: 1199px) {
  .nav.nav-tabs>li>a {
    padding: 5px 10px 10px;
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .nav.nav-tabs>li>a {
    padding: 8px;
  }
}

.nav.nav-tabs>li>a:focus,
.nav.nav-tabs>li>a:hover {
  background: none;
}

.nav.nav-tabs>li>a small {
  color: #919191;
}

.nav.nav-tabs>li.active>a,
.nav.nav-tabs>li:hover>a {
  border: none;
  background: none;
  transition: all 0.3s ease;
}

@media (max-width: 767px) {

  .nav.nav-tabs>li.active>a,
  .nav.nav-tabs>li:hover>a {
    border: none;
  }
}

.nav.nav-tabs .badge,
.nav.nav-tabs>li.active>a .badge,
.nav.nav-tabs>li:hover>a .badge {
  transition: all 0.3s ease;
}

.nav.nav-tabs .badge {
  margin-left: 5px;
  background-color: #919191;
}

.nav-btn-tab {
  position: relative;
  padding-right: 80px;
  border-bottom: 1px solid #f5f5f5;
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  .nav-btn-tab {
    padding-right: 0;
  }
}

.nav-btn-tab .nav.nav-tabs {
  border: none;
  margin-bottom: 0;
}

.nav-btn-tab .btnbar {
  position: absolute;
  top: 0;
  right: 0;
}

.pager>li>a {
  color: #616161;
  background-color: #f5f5f5;
  border-color: #dcdcdc;
}

.pager>li>a.active,
.pager>li>a:focus,
.pager>li>a:hover {
  background-color: #e8e8e8;
}

.pager .disabled>a,
.pager .disabled>a:focus,
.pager .disabled>a:hover,
.pager .disabled>span {
  background-color: #fafafa;
  border-color: #f5f5f5;
  color: #c7c7c7;
}

.media-list .media {
  border-bottom: 1px solid #f5f5f5;
  padding-bottom: 15px;
}

.media-list .media:last-child {
  border-bottom: none;
}

.media-list .media-body .bullet {
  padding: 0 3px;
  font-size: 75%;
  color: #ccc;
  line-height: 1.4;
}

.media-list .empty-item {
  text-align: center;
  color: #999;
}

.media-body {
  word-break: break-all;
}

.media-left {
  padding-right: 15px;
}

.media .media-object-small img {
  width: 48px;
  height: 48px;
  border-radius: 4px;
}

.media-default .media-body>.title {
  margin-bottom: 10px;
}

.media-default .media-body>.content,
.media.media-number-o .media-body {
  color: #919191;
}

.media.media-number,
.media.media-number-o {
  padding-bottom: 5px;
}

.media.media-number-o .media-left,
.media.media-number .media-left {
  position: relative;
  color: #919191;
}

.media.media-number-o .media-left .num,
.media.media-number .media-left .num {
  display: block;
  width: 20px;
  height: 20px;
  line-height: 18px;
  text-align: center;
  border: 1px solid #919191;
  border-radius: 50%;
}

.media.media-number-o:last-child,
.media.media-number:last-child {
  border-bottom: none;
}

.media-hot-comment .comments-info {
  margin-top: 5px;
  padding-left: 50px;
  font-size: 12px;
  color: #c1c1c1;
  min-height: 34px;
}

.media-hot-comment .comments-content {
  padding: 10px;
  margin: 10px 0;
  background: #f5f5f5;
  color: #919191;
  line-height: 25px;
  border: 1px solid #f1f1f1;
}

.media-comment .media-left img,
.media-subcomment .media-left img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
}

.media-comment .media-body,
.media-subcomment .media-body {
  position: relative;
  padding-bottom: 15px;
}

.media-comment .reply-link,
.media-subcomment .reply-link {
  position: absolute;
  top: 28px;
  right: 10px;
  font-size: 12px;
  color: #919191;
  transition: all 0.3s ease;
}

.media-comment .reply-link:hover,
.media-subcomment .reply-link:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.media-comment .title,
.media-subcomment .title {
  color: #919191;
  margin-bottom: 5px;
}

.media-comment .title a,
.media-subcomment .title a {
  margin-right: 5px;
}

.media-comment .title .date,
.media-subcomment .title .date {
  margin-left: 5px;
}

.media-comment .comment-sns i,
.media-subcomment .comment-sns i {
  margin-right: 5px;
}

.media-comment .comment-sns a,
.media-subcomment .comment-sns a {
  color: #919191;
  transition: all 0.3s ease;
  margin-right: 10px;
}

.media-comment .comment-sns a:hover,
.media-subcomment .comment-sns a:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.media-comment .media-body {
  border-bottom: 1px solid #f5f5f5;
}

.subcomments {
  margin-left: 20px;
  padding-left: 10px;
  background-color: #f5f5f5;
}

.media-evaluate .media-body {
  padding-bottom: 15px;
  border-bottom: 1px solid #f5f5f5;
}

.media-evaluate .title {
  color: #919191;
  margin-bottom: 5px;
}

.media-evaluate .title a {
  margin-right: 5px;
}

.media-evaluate .title .date {
  margin-left: 5px;
}

.media-evaluate .actions {
  margin-top: 10px;
}

.media-evaluate .actions .show-full-btn,
.media-evaluate .actions .show-short-btn {
  visibility: hidden;
}

.media-evaluate:hover .actions .show-full-btn,
.media-evaluate:hover .actions .show-short-btn {
  visibility: visible;
}

.media-group-list {
  margin-top: -20px;
}

.media-group {
  margin-top: 20px;
}

@media (max-width: 767px) {
  .media-group {
    margin-top: 15px;
  }
}

.media-group:first-child {
  margin-top: 20px;
}

@media (max-width: 767px) {
  .media-group:first-child {
    margin-top: 15px;
  }
}

@media (max-width: 767px) {
  .media-group .avatar-square-md {
    width: 40px !important;
    height: 40px !important;
  }
}

.media-group .title {
  height: 20px;
  overflow: hidden;
  margin: 5px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 767px) {
  .media-group .title {
    margin: 0;
  }
}

.media-group .metas {
  color: #c1c1c1;
}

.media-group .metas span {
  margin-right: 10px;
}

.media-group .metas i {
  margin-right: 5px;
  font-size: 14px;
}

.media-dynamic:last-child .media-body {
  border: none;
}

.media-dynamic .media-body {
  position: relative;
  padding-right: 80px;
  /*padding-bottom: 8px*/
}

@media (max-width: 767px) {
  .media-dynamic .media-body {
    padding-right: 0;
  }
}

.media-dynamic .media-body .title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  font-size: 12px;
}

.media-dynamic .media-body .content {
  height: 20px;
  overflow: hidden;
  display: block;
  color: #919191;
}

.media-dynamic .date {
  position: absolute;
  right: 0;
  top: 0;
  color: #c1c1c1;
}

@media (max-width: 767px) {
  .media-dynamic .date {
    display: none;
  }
}

.media-search .reply {
  background-color: #f5f5f5;
  color: #919191;
  width: 50px;
  height: 50px;
  text-align: center;
  padding: 5px;
  border-radius: 4px;
}

.media-search .title {
  font-size: 16px;
  margin-bottom: 10px;
}

@media (max-width: 767px) {
  .media-search .title {
    font-size: 14px;
  }
}

.breadcrumb {
  background-color: #f5f5f5;
}

/* .container{margin-top:20px;} */
.breadcrumb.breadcrumb-o {
  display: none;
  background: none;
  margin: 12px auto;
  padding: 8px 0;
}

.breadcrumb.breadcrumb-o>li,
.breadcrumb>li {
  max-width: 100%;
}

.breadcrumb li.active {
  color: #919191;
}

.breadcrumb a {
  /* color: #919191; */
  color: #0091ff;
  transition: all 0.3s ease;
}

.breadcrumb a:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.lt-ie9 .breadcrumb li {
  padding-left: 5px;
}

textarea.form-control-o {
  background-color: #f5f5f5;
  border: none;
  box-shadow: none;
  margin-bottom: 20px;
}

.es-share {
  position: relative;
  display: inline-block;
}

.es-share.top .dropdown-menu {
  top: auto;
  bottom: 100%;
  left: 0;
  margin-left: -65px;
  margin-bottom: 10px;
}

.es-share.top .dropdown-menu:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(64, 64, 64, 0);
  border-top-color: #404040;
  border-width: 8px;
  margin-left: -8px;
}

.es-share.right .dropdown-menu {
  top: -5px;
  left: 40px;
}

.es-share.right .dropdown-menu:after {
  right: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(64, 64, 64, 0);
  border-right-color: #404040;
  border-width: 8px;
  margin-top: -8px;
}

.es-share .dropdown-menu {
  min-width: 150px !important;
  padding: 3px 10px !important;
  background-color: #404040 !important;
  box-shadow: none;
  line-height: 30px !important;
}

.es-share .dropdown-menu a {
  margin: 3px 2px 2px 6px !important;
  color: #fff !important;
}

.es-share .dropdown-menu i {
  font-size: 20px !important;
}

.es-share i[class*="es-icon"] {
  transition: all 0.3s ease;
}

.es-share .es-icon-weixin:hover {
  color: #70d445;
}

.es-share .es-icon-weibo:hover {
  color: #e83d2c;
}

.es-share .es-icon-qzone:hover {
  color: #ff8a0c;
}

.es-share .es-icon-qq:hover {
  color: #2db7f5;
}

.dropdown-menu {
  border-radius: 4px;
  border: none;
}

.dropdown-menu .dropdown-header {
  padding: 5px 20px;
  margin-bottom: 10px;
  text-align: center;
  color: #616161;
  font-size: 14px;
  border-bottom: 1px solid #f5f5f5;
}

.dropdown-menu>li {
  position: relative;
}

.dropdown-menu>li>a {
  color: #616161;
  padding: 10px 20px;
  transition: all 0.3s ease;
}

.dropdown-menu>li>a:hover {
  background: #46c37b;
  color: #fff;
  transition: all 0.3s ease;
}

.btn-group.open .dropdown-toggle {
  box-shadow: none;
}

.lt-ie9 .dropdown-menu {
  border: 1px solid #f5f5f5;
}

a.btn.disabled,
fieldset[disabled] a.btn {
  pointer-events: none;
}

.btn {
  transition: all 0.3s ease;
}

.btn.active,
.btn.focus,
.btn:focus,
.btn:hover {
  transition: all 0.3s ease;
  text-decoration: none;
}

.btn.btn-lg {
  font-size: 14px;
  padding: 10px 36px;
}

.btn.btn-xlg {
  padding: 11px 35px;
}

.btn.btn-xlg,
.btn>i {
  font-size: 14px;
}

.btn-ghost-white {
  color: #fff;
  border: 1px solid #fff;
  background-color: #c1c1c1;
  background-color: hsla(0, 0%, 100%, 0.3);
}

.btn-ghost-white.focus,
.btn-ghost-white:focus,
.btn-ghost-white:hover {
  color: #fff;
  background-color: #919191;
  background-color: hsla(0, 0%, 100%, 0.5);
}

.btn-link {
  /* color: #313131 */
  color: #bababa;
}

.btn-link.focus,
.btn-link:focus,
.btn-link:hover {
  text-decoration: none;
}

.btn-gray {
  color: #919191;
}

.btn-gray.focus,
.btn-gray:focus,
.btn-gray:hover {
  color: #0091ff;
  text-decoration: none;
}

.btn-graylight {
  color: #e1e1e1;
}

.btn-graylight.focus,
.btn-graylight:focus,
.btn-graylight:hover {
  color: #0091ff;
  text-decoration: none;
}

.btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover {
  color: #616161;
  background-color: #f5f5f5;
  border-color: #dcdcdc;
  /* color: #ffffff; */
}

.btn-default.active,
.btn-default.focus,
.btn-default:focus,
.btn-default:hover {
  color: #616161;
  background-color: #e1e1e1;
}

.btn-primary,
.btn-primary.active,
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:hover {
  color: #fff;
}

.btn-success {
  border-color: #56bb2b;
  background-color: #70d445;
  color: #fff;
}

.testpaper-card-up .btn-submit:hover {
  color: #fff;
}

.btn-submit {
  border-color: #4a90e2;
  background-color: #4a90e2;
  color: #fff;
}

.btn-success.active,
.btn-success.focus,
.btn-success:focus,
.btn-success:hover {
  color: #fff;
  background-color: #34a263;
}

.btn-info {
  border-color: #0ba1e4;
  background-color: #2db7f5;
  color: #fff;
}

.btn-info.active,
.btn-info.focus,
.btn-info:focus,
.btn-info:hover {
  color: #fff;
  background-color: #0ba1e4;
}

.btn-warning {
  border-color: #d87000;
  background-color: #ff8a0c;
  color: #fff;
}

.btn-warning.active,
.btn-warning.focus,
.btn-warning:focus,
.btn-warning:hover {
  color: #fff;
  background-color: #d87000;
}

.btn-danger {
  border-color: #cb2616;
  background-color: #e83d2c;
  color: #fff;
}

.btn-danger.active,
.btn-danger.focus,
.btn-danger:focus,
.btn-danger:hover {
  color: #fff;
  background-color: #cb2616;
}

.btn-circle {
  display: inline-block;
  width: 34px;
  height: 34px;
  line-height: 32px;
  border-radius: 50%;
  background: none;
  border: 1px solid #919191;
  color: #919191;
  text-align: center;
  transition: all 0.3s ease;
}

.btn-circle:hover {
  color: #46c37b;
  border-color: #46c37b;
  transition: all 0.3s ease;
}

.btn-circle.active {
  background: #46c37b;
  border: 1px solid #46c37b;
  color: #fff;
}

.btn-circle.danger {
  color: #fff;
  border-color: #e83d2c;
  background: #e83d2c;
}

.btn-circle.primary {
  color: #fff;
  border-color: #46c37b;
  background: #46c37b;
}

.btn-circle.info {
  color: #fff;
  border-color: #2db7f5;
  background: #2db7f5;
}

.btn-circle.btn-circle-xs {
  width: 20px;
  height: 20px;
  line-height: 18px;
  font-size: 12px;
}

.btn-circle.btn-circle-xs i {
  font-size: 14px;
}

.btn-circle.btn-circle-md {
  width: 40px;
  height: 40px;
  line-height: 38px;
}

.btn-circle.btn-circle-md i {
  font-size: 24px;
}

.btn-tag {
  display: inline-block;
  padding: 6px 10px;
  margin: 5px 5px 5px 0;
  color: #46c37b;
  font-size: 12px;
  background-color: #cdefdb;
  transition: all 0.3s ease;
}

.btn-tag.active,
.btn-tag:hover {
  color: #fff;
  background-color: #46c37b;
  transition: all 0.3s ease;
}

.btn-more {
  border-radius: 50%;
  width: 58px;
  height: 58px;
  background: #fff;
  color: #a6a6a6;
  display: inline-block;
  text-align: center;
  box-shadow: 0 4px 12px -2px rgba(51, 51, 51, 0.5);
  transition: all 0.3s ease;
}

.btn-more:hover {
  color: #666;
  box-shadow: 0 10px 15px 0 rgba(51, 51, 51, 0.5);
  transition: all 0.3s ease;
}

.btn-ghost {
  border-color: #fff;
  color: #fff;
  border-radius: 20px;
  transition: all 0.3s ease;
}

.btn-ghost:hover {
  color: #46c37b;
  background-color: #fff;
  transition: all 0.3s ease;
}

.btn-transparent {
  position: relative;
  background-color: transparent;
}

.btn-transparent:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 0;
  transition: all 0.3s ease;
}

.btn-transparent.active,
.btn-transparent:hover {
  color: #fff;
}

.btn-transparent.active:after,
.btn-transparent:hover:after {
  z-index: -1;
  width: 100%;
  transition: all 0.3s ease;
}

.btn-fat {
  padding-left: 30px;
  padding-right: 30px;
}

.btn-fat-small {
  padding-left: 20px;
  padding-right: 20px;
}

.es-tabs {
  background: #fff;
  margin-bottom: 30px;
  border: 1px solid #e4ecf3;
  border-radius: 4px;
}

.es-tabs .tab-header {
  background-color: #f5f5f5;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.es-tabs .tab-header>ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.es-tabs .tab-header>ul>li {
  float: left;
}

.es-tabs .tab-header>ul>li>a {
  display: block;
  padding: 15px 30px;
  color: #616161;
  transition: all 0.3s ease;
}

@media (max-width: 767px) {
  .es-tabs .tab-header>ul>li>a {
    padding: 8px 10px;
  }
}

.es-tabs .tab-header>ul>li>a:hover {
  transition: all 0.3s ease;
}

.es-tabs .tab-header>ul>li.active>a {
  background-color: #fff;
}

.es-tabs .tab-body {
  padding: 5px 15px;
}

.es-tabs .tab-body>ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.es-tabs .tab-body>ul+ul {
  border-top: 1px dashed #e4ecf3;
}

.es-tabs .tab-body>ul>li {
  float: left;
}

.es-tabs .tab-body>ul>li>a {
  display: block;
  padding: 12px 30px;
  color: #616161;
  transition: all 0.3s ease;
}

.es-tabs .tab-body>ul>li.active>a,
.es-tabs .tab-body>ul>li>a:hover,
.image-overlay {
  transition: all 0.3s ease;
}

.image-overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  filter: alpha(opacity=30);
  background: #000;
  background-image: -moz-linear-gradient(top,
      transparent 0,
      rgba(0, 0, 0, 0.5) 100%);
  background-image: linear, top, transparent 0, rgba(0, 0, 0, 0.5) 100%;
}

.image-overlay:hover {
  opacity: 0.2;
  filter: alpha(opacity=20);
  transition: all 0.3s ease;
}

.image-overlay.image-overlay-o:hover {
  opacity: 1;
  filter: alpha(opacity=30);
}

.alert>i {
  margin-right: 10px;
}

.alert.alert-lg {
  padding: 30px 20px;
}

.alert.alert-xs {
  font-size: 12px;
  padding: 5px 10px;
  margin-bottom: 0;
}

.alert.alert-sm {
  padding: 8px 10px;
}

.alert a {
  text-decoration: none;
}

.alert-blank {
  color: #000;
  background-color: #fafafa;
}

.alert-success {
  border-color: #cddfb4;
  background-color: #f2fae3;
  color: #659f13;
}

.alert-success .alert-link,
.alert-success .close {
  color: #659f13;
}

.alert-success hr {
  border-top-color: #c1d7a2;
}

.alert-info {
  border-color: #d6ebfa;
  background-color: #edf6fd;
}

.alert-info,
.alert-info .alert-link,
.alert-info .close {
  color: #54b3e8;
}

.alert-info hr {
  border-top-color: #bfe0f7;
}

.alert-warning {
  border-color: #ffd0b7;
  background-color: #fff9cd;
  color: #ff5e06;
}

.alert-warning .alert-link,
.alert-warning .close {
  color: #ff5e06;
}

.alert-warning hr {
  border-top-color: #ffbf9e;
}

.alert-danger {
  border-color: #f0c7bd;
  background-color: #fff1f0;
  color: #e74c3c;
}

.alert-danger .alert-link,
.alert-danger .close {
  color: #e74c3c;
}

.alert-danger hr {
  border-top-color: #ebb5a8;
}

.alert-default {
  border-color: #e1e1e1;
  background-color: #f5f5f5;
}

.alert-default .alert-link,
.alert-default .close {
  color: #919191;
}

.alert-default.alert-edit:hover {
  transition: all 0.3s ease;
  border-color: #ffd0b7;
  background-color: #fff9cd;
  color: #ff5e06;
}

.alert-default.alert-edit:hover .alert-link,
.alert-default.alert-edit:hover .close {
  color: #ff5e06;
}

.alert-default.alert-edit:hover hr {
  border-top-color: #ffbf9e;
}

.alert-default.alert-edit:hover .editor>a {
  color: #cc5700;
}

.alert-default.alert-edit:hover .details {
  border-color: #ffa363;
}

.alert-default.alert-edit .alert-header {
  position: relative;
}

.alert-default.alert-edit .alert-header:hover {
  cursor: pointer;
}

.alert-default.alert-edit .icon-click {
  position: absolute;
  top: 0;
  left: 5px;
}

.alert-default.alert-edit .title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  padding: 0 150px 0 30px;
}

.alert-default.alert-edit .data,
.alert-default.alert-edit .editor {
  position: absolute;
  top: 0;
  right: 5px;
}

.alert-default.alert-edit .editor>a {
  color: #919191;
}

.alert-default.alert-edit .details {
  display: none;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #e1e1e1;
}

.alert-notice {
  border-radius: 0;
  margin-bottom: 0;
  padding: 0;
  border: none;
  color: #46c37b;
}

.alert-notice .swiper-container {
  position: relative;
  height: 38px;
  line-height: 38px;
  overflow: hidden;
}

.alert-notice .swiper-wrapper {
  padding-right: 30px;
}

.alert-notice .swiper-slide {
  float: none;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.alert-notice .close {
  float: none;
  position: absolute;
  top: 5px;
  right: 0;
  width: 30px;
}

.aside-notice {
  padding: 0;
}

.aside-notice .swiper-container {
  position: relative;
  padding: 0 15px;
  height: 38px;
  line-height: 38px;
  overflow: hidden;
}

.aside-notice .swiper-slide {
  float: none;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.set-email-alert {
  font-size: 12px;
  text-align: center;
  margin-bottom: 0;
  border-radius: 0;
  padding: 5px;
}

.set-email-alert .close {
  font-size: 16px;
}

input:-webkit-autofill,
select:-webkit-autofill,
textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 100px #fafafa inset;
}

textarea {
  resize: none;
}

.help-block {
  margin-bottom: 0;
  /*width: 978px;
    height: 112px;*/
  background-color: #fafafa;
}

.crmeb-help-block {
  color: #f00;
  font-size: 13px;
}

.order-help-block {
  padding: 17px 16px;
  margin-top: -10px;
}

.order-help-block .title {
  font-size: 16px;
  color: #333333;
  font-weight: bold;
}

.order-help-block .text {
  margin-top: 10px;
  font-size: 14px;
  line-height: 20px;
  color: #4a4a4a;
}

/* 温馨提示 */
.order-help-block .text .warm-tip {
  position: relative;
  padding-left: 20px;
  font-size: 12px;
  color: #6d7278;
}

.order-help-block .text .warm-tip::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #a0a0a0;
  top: 9px;
  left: 6px;
}

.invoice-help-block {
  background: none;
  margin-top: 30px;
  padding: 0;
  margin-bottom: 40px;
}

.invoice-help-block .text {
  margin-top: 8px;
}

.width-150 {
  width: 150px !important;
  display: inline-block;
}

.width-200 {
  width: 200px;
  display: inline-block;
}

.input-sm {
  height: 30px;
}

.width-input {
  display: inline-block !important;
  margin-right: 6px;
  width: 150px;
}

.width-input-mini {
  width: 50px;
}

.width-input-small {
  width: 100px;
}

.width-input-large {
  width: 200px;
}

.width-input-xlarge {
  width: 300px;
}

.width-full {
  width: 100%;
}

.checkboxs,
.radios {
  padding-top: 7px;
  vertical-align: middle;
}

.checkboxs label,
.radios label {
  font-weight: 400;
  padding: 0 20px 0 0;
}

.control-label span.required {
  color: #ff8a0c;
}

.form-control {
  color: #616161;
  border-color: #e1e1e1;
}

.form-control.form-control-lg {
  height: 40px;
}

.form-control::-webkit-input-placeholder {
  color: #919191;
}

.form-control:-moz-placeholder,
.form-control::-moz-placeholder {
  color: #919191;
}

.form-control:-ms-input-placeholder {
  color: #919191;
}

/* .form-horizontal .form-group {
    margin-bottom: 30px
} */

/* @media (max-width:767px) {
    .form-horizontal .form-group {
        margin-bottom: 15px
    }
} */

@media (max-width: 767px) {
  .form-horizontal .form-control {
    margin-bottom: 10px;
  }
}

.form-control-150 {
  width: 150px;
}

.has-error.form-group {
  margin-bottom: 10px;
}

@media (max-width: 767px) {
  .has-error.form-group {
    margin-bottom: -5px;
  }
}

.has-error .checkbox,
.has-error .checkbox-inline,
.has-error.checkbox-inline label,
.has-error.checkbox label,
.has-error .control-label,
.has-error .help-block,
.has-error .radio,
.has-error .radio-inline,
.has-error.radio-inline label,
.has-error.radio label {
  color: #e83d2c;
}

.has-error .form-control {
  border-color: #e83d2c;
}

.has-error .form-control:focus {
  border-color: #e1e1e1;
}

.form-control-error {
  border-color: #e83d2c !important;
}

.form-error-message {
  height: 20px;
  line-height: 20px;
  margin-bottom: 0;
  color: #e83d2c;
}

.control-label-required {
  position: relative;
}

.control-label-required:before {
  content: "*";
  color: #ff8a0c;
  position: absolute;
  top: 4px;
  left: -10px;
}

.avatar-xxs {
  border-radius: 50%;
  width: 20px !important;
  height: 20px !important;
}

.headerIndex .avatar-xs,
.defaultIndex .avatar-xs {
  border-radius: 50%;
  width: 24px !important;
  height: 24px !important;
}

.avatar-xs {
  border-radius: 50%;
  width: 30px !important;
  height: 30px !important;
}

.avatar-sm {
  border-radius: 50%;
  width: 40px !important;
  height: 40px !important;
}

.avatar-sm.avatar-sm-square {
  border-radius: 4px;
}

.avatar-md {
  border-radius: 50%;
  width: 60px !important;
  height: 60px !important;
}

.avatar-lg {
  border-radius: 50%;
  width: 100px !important;
  height: 100px !important;
}

.avatar-square-md,
.group-avatar-md {
  width: 60px;
  height: 60px;
  border-radius: 4px;
}

.group-avatar-sm {
  width: 50px;
  height: 50px;
  border-radius: 4px;
}

.progress {
  background-color: #f5f5f5;
  color: #fff;
  text-align: right;
  font-weight: 700;
  font-size: 14px;
  box-shadow: none;
  border-radius: 0;
}

.progress.progress-xs {
  height: 5px;
}

.progress.progress-sm {
  height: 10px;
}

.progress.progress-md {
  height: 30px;
  line-height: 30px;
  margin-bottom: 15px;
}

.progress.progress-md .progress-bar {
  line-height: 30px;
  font-size: 14px;
  font-weight: 700;
}

.progress.progress-radius {
  border-radius: 30px;
}

.progress-bar {
  box-shadow: none;
}

.progress-bar-left {
  text-align: left;
  padding-left: 15px;
}

.label {
  padding: 0.2em 0.6em;
  font-weight: 400;
  border-radius: 4px;
  vertical-align: middle;
}

.label.label-md {
  font-size: 100%;
}

.label.label-xs {
  font-size: 12px;
  padding: 2px;
}

.label.label-hover-primary {
  transition: all 0.3s ease;
}

.label.label-hover-primary:hover {
  transition: all 0.3s ease;
  background-color: #46c37b;
}

.task-list .task-item.task-content .title>.label-success {
  background-color: #0091ff !important;
}

.label-success {
  background-color: #70d445;
}

.score {
  margin-bottom: 10px;
}

.score i {
  font-size: 14px;
  color: #919191;
}

.sidenav .list-group:last-child {
  margin-bottom: 0;
}

.sidenav .list-group .list-group-heading {
  list-style-type: none;
  color: #919191;
  margin-bottom: 10px;
  margin-left: 20px;
}

.sidenav .list-group .list-group-item {
  border-radius: 0;
  border: none;
  padding: 0;
  border-left: 2px solid transparent;
}

.sidenav .list-group .list-group-item:first-child,
.sidenav .list-group .list-group-item:last-child {
  border-radius: 0;
}

.sidenav .list-group .list-group-item:hover {
  background-color: #f5f5f5;
}

.sidenav .list-group .list-group-item>a {
  display: block;
  color: #616161;
  padding: 10px 15px 10px 35px;
}

.sidenav .list-group .list-group-item.active {
  border-left: 2px solid #46c37b;
  background: none;
}

.sidenav .list-group .list-group-item.active>a {
  color: #46c37b;
}

.sidenav {
  padding: 20px 0 10px;
  margin-bottom: 20px;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #e4ecf3;
}

.nav-pills>li {
  margin-right: 5px;
}

.nav-pills>li+li {
  margin-left: 0;
}

.nav-pills>li>a {
  /* padding: 10px 15px; */
  padding: 4px 11px;
  color: #616161;
  transition: all 0.3s ease;
}

.nav-pills>li>a:hover {
  background-color: #f5f5f5;
  transition: all 0.3s ease;
}

.nav-pills>li.active>a {
  color: #fff;
  transition: all 0.3s ease;
}

.nav-pills.nav-pills-sm>li>a {
  font-size: 12px;
  line-height: 1.5;
  padding: 4px 13px;
}

.nav-pills.nav-pills-gray>li>a {
  background-color: #f8fbfd;
}

.nav-pills.nav-pills-transparent>li {
  margin-bottom: 10px;
}

.nav-pills.nav-pills-transparent>li .done-icon {
  position: absolute;
  right: 0;
  bottom: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  color: #fff;
  font-size: 12px;
}

.nav-pills.nav-pills-transparent>li>a {
  background: transparent;
  border: 1px solid #e1e1e1;
  color: #616161;
  border-radius: 0;
}

.nav-pills.nav-pills-transparent>li>a:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  right: 0;
  bottom: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 0 0 15px 15px;
  opacity: 0;
  filter: alpha(opacity=0);
}

.nav-pills.nav-pills-transparent>li.active .done-icon,
.nav-pills.nav-pills-transparent>li:hover .done-icon {
  opacity: 1;
  filter: alpha(opacity=100);
}

.nav-pills.nav-pills-transparent>li.active>a,
.nav-pills.nav-pills-transparent>li:hover>a {
  background-color: transparent;
}

.nav-pills.nav-pills-transparent>li.active>a:after,
.nav-pills.nav-pills-transparent>li:hover>a:after {
  opacity: 1;
  filter: alpha(opacity=100);
}

.es-tag {
  background: #fff;
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 4px;
  border: 1px solid #e4ecf3;
}

.es-piece {
  margin-bottom: 30px;
}

.es-piece.piece-lg .piece-header {
  font-size: 22px;
  font-weight: 500;
  padding: 0 30px 0 0;
}

.es-piece.piece-lg .piece-header .more {
  font-size: 14px;
}

.es-piece.piece-lg .piece-header:after {
  display: none;
}

.es-piece .piece-header {
  position: relative;
  margin: 5px auto 20px;
  padding: 0 30px 0 15px;
  color: #313131;
  font-size: 16px;
}

.es-piece .piece-header:after {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 4px;
  height: 16px;
  background-color: #46c37b;
}

.es-piece .piece-header .more {
  position: absolute;
  right: 0;
  top: 5px;
}

.es-piece .piece-body .piece-body-list {
  list-style-type: none;
  padding: 0;
  margin-bottom: 0;
}

.es-piece .piece-body .piece-body-list>li {
  padding: 15px 0;
  border-bottom: 1px solid #f5f5f5;
}

.user-avatar-list {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.user-avatar-list li {
  float: left;
  width: 20%;
  margin-bottom: 10px;
  text-align: center;
}

@media (max-width: 991px) and (min-width: 768px) {
  .user-avatar-list li {
    width: 10%;
  }
}

.user-avatar-list .name {
  margin-top: 10px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  height: 20px;
}

.popover {
  min-width: 200px;
  border-color: #e1e1e1;
}

.popover.top>.arrow {
  border-top-color: #e1e1e1;
}

.popover.right>.arrow {
  border-right-color: #e1e1e1;
}

.popover.bottom>.arrow {
  border-bottom-color: #e1e1e1;
}

.popover.left>.arrow {
  border-left-color: #e1e1e1;
}

.popover .popover-content {
  color: #616161;
}

.modal-title {
  word-break: break-all;
  color: #31363f;
  font-weight: normal;
  font-size: 18px;
}

.modal-header {
  padding: 15px 0;
  margin: 0 20px;
}

.modal-body {
  word-wrap: break-word;
  overflow: hidden;
  padding-left: 20px;
  padding-right: 20px;
}

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

.modal-backdrop.in {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

@media (min-width: 992px) {
  .modal-dialog.modal-lg {
    width: 900px;
    margin-top: 20px;
  }
}

@media (min-width: 992px) {
  .modal-md {
    width: 800px;
  }
}

@media (min-width: 992px) {
  .modal-sm {
    width: 520px;
  }
}

.modal-message .modal-header {
  border-bottom: 0;
  padding-bottom: 0;
  text-align: center;
}

.modal-message .modal-footer {
  border-top: 0;
  padding-top: 0;
}

.modal-live-remind .modal-body {
  padding: 40px;
}

.modal-live-remind .close {
  position: absolute;
  top: 10px;
  right: 10px;
}

.modal-live-remind .media-left img {
  width: 160px;
  max-width: 160px;
}

.modal-live-remind .media-body h4 {
  color: #313131;
  font-size: 16px;
}

.modal-live-remind .media-body p {
  color: #919191;
  font-size: 12px;
}

.modal-live-remind .live-countdown {
  font-size: 22px;
  color: #313131;
  margin-bottom: 20px;
  text-align: center;
}

.modal-live-remind .live-countdown span {
  color: #ff8a0c;
  font-size: 40px;
}

.modal-live-remind .btn {
  width: 300px;
}

.nav-mini>li>a {
  padding: 1px 10px;
}

.table td {
  word-wrap: break-word;
  word-break: break-all;
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
  padding: 10px 15px;
}

.table-hover>tbody>tr:hover {
  background-color: #f6f6f6;
}

.table-striped .sort-handle {
  padding: 5px;
  cursor: pointer;
  color: #ccc;
  display: inline-block;
  font-size: 18px;
}

.table-striped .sort-handle:hover {
  color: #999;
}

.table.table-middle>tbody>tr>td {
  vertical-align: middle;
}

.table.table-col-nobordered>tbody>tr>td {
  border-top: none;
}

.es-qrcode {
  position: relative;
  text-align: center;
}

@media (max-width: 767px) {
  .es-qrcode {
    display: none;
  }
}

.es-qrcode>i {
  font-size: 24px;
  color: #919191;
}

.es-qrcode .qrcode-popover {
  position: absolute;
  padding: 5px 10px;
  font-size: 12px;
  background: #fff;
  color: #313131;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  display: none\9;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transform: scale(0);
  transform: scale(0);
  transition: all 0.3s ease;
  z-index: 1;
}

.es-qrcode .qrcode-popover img,
.pintuan-es-qrcode .qrcode-popover img {
  margin-bottom: 10px;
  width: 110px;
  height: 110px;
}

.es-qrcode.toolbar-qrcode {
  color: #ccc;
}

.es-qrcode.toolbar-qrcode .qrcode-popover {
  top: 0;
  right: 100%;
  transform-origin: 100% 0;
  -webkit-transform-origin: 100% 0;
  -moz-transform-origin: 100% 0;
  -o-transform-origin: 100% 0;
}

.es-qrcode.top .qrcode-popover {
  top: 0;
  left: 0;
  transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -o-transform-origin: 0 0;
}

.es-qrcode.bottom .qrcode-popover {
  bottom: 0;
  right: 0;
  transform-origin: 100% 100%;
  -webkit-transform-origin: 100% 100%;
  -moz-transform-origin: 100% 100%;
  -o-transform-origin: 100% 100%;
}

.es-qrcode:hover {
  cursor: pointer;
}

.es-qrcode.open .qrcode-popover {
  display: block\9;
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
  filter: alpha(opacity=100);
}

.lt-ie9 .es-qrcode .mask {
  border: 1px solid #e1e1e1;
}

.qrcode-popover {
  position: relative;
}

.qrcode-popover:hover .qrcode-content {
  display: block\9;
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
  filter: alpha(opacity=100);
}

.qrcode-popover.top .qrcode-content {
  left: -65px;
  top: -205px;
  transform-origin: 50% 100%;
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
}

.qrcode-popover.top .qrcode-content:after {
  top: 100%;
  left: 50%;
  margin-left: -13px;
  border-top-color: #fff;
}

.qrcode-popover.top .qrcode-content img {
  width: 180px;
  height: 180px;
}

.qrcode-popover .qrcode-content {
  position: absolute;
  padding: 5px;
  z-index: 1;
  background: #fff;
  display: none\9;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transform: scale(0);
  transform: scale(0);
  transition: all 0.3s ease;
}

.qrcode-popover .qrcode-content:after {
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-width: 13px;
}

.student-nickname {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.well {
  background-color: #fafafa;
  border: 1px solid #f5f5f5;
  box-shadow: none;
}

.icon-user-status {
  display: block;
  width: 20px;
  height: 20px;
  line-height: 15px;
  text-align: center;
  border: 2px solid #fff;
  background: #e83d2c;
  color: #fff;
  border-radius: 50%;
}

.icon-user-status>i {
  font-size: 12px;
  vertical-align: middle;
}

.icon-user-status>img {
  border-radius: 50%;
  width: 100%;
  height: 100%;
}

.icon-user-status.icon-md {
  width: 30px;
  height: 30px;
  line-height: 25px;
}

.icon-user-status.icon-md>i {
  font-size: 18px;
}

.avatar-wrap {
  position: relative;
  display: inline-block;
  border-radius: 50%;
}

.avatar-wrap .icon-user-status {
  position: absolute;
  bottom: 0;
  right: 0;
}

.es-step {
  padding-left: 0;
  margin-top: 10px;
  margin-bottom: 35px;
}

.es-step.es-step-3 li {
  width: 33.33%;
}

.es-step.es-step-2 li {
  width: 50%;
}

.es-step li {
  float: left;
  padding: 10px;
  list-style-type: none;
  border-top: 4px solid #eeeeee;
  color: #888888;
  font-size: 12px;
  text-align: center;
  position: relative;
}

.es-step li .number {
  width: 20px;
  height: 20px;
  line-height: 18px;
  display: inline-block;
  margin-right: 5px;
  border: 1px solid #e1e1e1;
  background-color: #e1e1e1;
  color: #fff;
  border-radius: 50%;
  position: absolute;
  top: -13px;
  left: 50%;
  margin-left: -10px;
}

.es-step li.doing,
.es-step li.done {
  border-color: #0091ff;
}

.es-step li.doing .number,
.es-step li.done .number {
  color: #fff;
  background-color: #0091ff;
  border-color: #0091ff;
}

.es-step li.done {
  color: #0091ff;
}

.es-step li.doing {
  color: #0091ff;
}

.group-search {
  position: relative;
  z-index: 3;
  margin-bottom: -30px;
  float: right;
}

.search-with-btn {
  position: relative;
}

.search-with-btn.search-sm .form-control {
  height: 34px;
}

.search-with-btn.search-sm .btn {
  top: 2px;
}

.search-with-btn .form-control {
  height: 40px;
  color: #616161;
}

.search-with-btn .btn {
  background: transparent;
  border: none;
  position: absolute;
  right: 0;
  top: 5px;
  color: #c1c1c1;
}

.new-tabs-wrapper {
  border: 1px solid #e4ecf3;
  background-color: #fff;
  max-width: 1082px;
  margin: 30px auto 0px;
  padding: 14px 0;
  border: 1px solid #e9eef3;
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
}

.public-class .teacher-alink {
  /* margin-top: 22px; */
  margin-top: 8px;
}

.public-class .link-title {
  font-size: 18px !important;
}

.public-class .number {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #7191ae;
}

.public-class .course-time {
  font-size: 12px;
  color: #a7b2c3;
  line-height: 16px;
  margin-bottom: 8px;
}

.public-class .course-time.course-time-doing {
  color: #4a90e2;
}

.public-class .course-time.course-time-will {
  color: #ff6000;
}

.public-class .course-author {
  font-size: 14px;
  color: #a7b2c3;
  line-height: 36px;
}

.public-class .alink {
  display: inline-block;
  border: 1px solid #cdced9;
  border-radius: 18px;
  font-size: 14px;
  color: #a7a9b9;
  padding: 6px 21px;
}

.public-class .alink.alink-will {
  border: 1px solid #bfdffc;
  color: #fff;
  background: #4a90e2;
}

.public-class .alink.alink-border {
  border: 1px solid #bfdffc;
  color: #4a90e2;
}

.public-class .alink.alink-doing {
  background: #e8f3ff;
  border: 1px solid #bfdffc;
  color: #4a90e2;
}

.public-class .alink-doing.alink-changebg {
  background: #fff;
}

.clearfix-public {
  width: 170px;
  height: 61px;
  margin: 30px 0 0 40px;
  border-right: 0;
  border: 1px solid #bfdffc;
  border-radius: 40px;
  color: #4a90e2;
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.clearfix-public .alink {
  border-radius: 30px;
}

.tabs-wrapper .tabs-mark-group {
  border-bottom: 1px dashed #e4ecf3;
}

.tabs-wrapper .tabs-mark-group .title {
  width: 90px;
  margin-top: 3px;
  float: left;
}

.tabs-wrapper .tabs-mark-group .classify {
  margin-top: 3px;
}

.tabs-wrapper .tabs-mark-group .classify a,
.tabs-wrapper .tabs-mark-group .classify i {
  color: #919191;
}

.tabs-wrapper .tabs-mark-group .content {
  margin-left: 100px;
}

.tabs-wrapper .tabs-mark {
  margin: 0 4px;
}

.tabs-wrapper .tabs-mark a {
  border: 1px solid #e4ecf3;
  padding: 2px 5px;
  color: #919191;
}

.tabs-wrapper .tabs-mark i {
  font-size: 10px;
  margin-left: 5px;
}

.tabs-wrapper .tabs-group {
  padding: 0 60px 0 20px;
  position: relative;
  overflow-y: hidden;
  /*margin-top: -16px;*/
}

.tabs-wrapper .tabs-group a {
  color: #3f4a54 !important;
}

.tabs-wrapper .tabs-group .title {
  float: left;
  /*padding: 15px 0;*/
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.new-tabs-wrapper .tabs-group .title {
  margin-top: 16px;
}

.tabs-wrapper .tabs-group .content {
  list-style: none;
  /*padding: 0;*/
}

.tabs-wrapper .tabs-group .content>li {
  float: left;
  /*padding: 10px 12px；*/
  font-size: 14px;
  margin-right: 10px;
}

.tabs-wrapper .tabs-group .content>li>a {
  display: block;
  padding: 5px 10px;
  border: none;
  border-radius: 4px;
  color: #919191;
  transition: all 0.3s ease;
}

.tabs-wrapper .tabs-group .tabs-toggle {
  position: absolute;
  right: 20px;
  top: 18px;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
}

.tabs-wrapper .tabs-group+.tabs-group {
  /*border-top: 1px dashed #e4ecf3*/
}

.load-animation {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 60px;
  height: 60px;
  margin-left: -30px;
  margin-top: -30px;
  background-size: 100% 100%;
  background-image: url("/static-dist/app/img/loading.gif");
}

.color-lump {
  position: relative;
  display: inline-block;
  border-radius: 4px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #fff;
  background-color: #e1e1e1;
}

.color-lump.lump-sm {
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
}

.color-lump.lump-md {
  width: 24px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
}

.color-lump.lump-xs {
  width: 10px;
  height: 10px;
}

.color-lump.lump-card {
  color: #616161;
  border: 1px solid #e4ecf3;
  background-color: #fff;
}

.color-lump.lump-card.done {
  border: 1px solid #46c37b;
  background-color: #46c37b;
  color: #fff;
}

.color-lump.lump-card.doing {
  border: 1px solid #46c37b;
  background-color: transparent;
  color: #616161;
}

.sortable-list li.dragged {
  position: absolute;
  opacity: 0.5;
  z-index: 2000;
}

.sortable-list li.placeholder {
  margin-bottom: 15px;
  width: 100%;
  height: 40px;
  background: #fcffc0;
  border: 1px dashed #ccc;
  list-style: none;
}

.rc-select {
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  color: #666;
  line-height: 28px;
}

.rc-select-allow-clear .rc-select-selection--single .rc-select-selection__rendered {
  padding-right: 40px;
}

.rc-select li,
.rc-select ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.rc-select>ul>li>a {
  padding: 0;
  background-color: #fff;
}

.rc-select-arrow {
  height: 26px;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 20px;
  outline: none;
}

.rc-select-arrow b {
  border-color: #999 transparent transparent;
  border-style: solid;
  border-width: 5px 4px 0;
  height: 0;
  width: 0;
  margin-left: -4px;
  margin-top: -2px;
  position: absolute;
  top: 50%;
  left: 50%;
}

.rc-select-selection {
  outline: none;
  user-select: none;
  -webkit-user-select: none;
  box-sizing: border-box;
  display: block;
  background-color: #fff;
  border-radius: 6px;
  border: 1px solid #d9d9d9;
}

.rc-select-selection__placeholder {
  position: absolute;
  top: 0;
  color: #aaa;
}

.rc-select-enabled .rc-select-selection:hover,
.rc-select-focused .rc-select-selection {
  border-color: #23c0fa;
  box-shadow: 0 0 2px rgba(45, 183, 245, 0.8);
}

.rc-select-enabled .rc-select-selection:active {
  border-color: #2db7f5;
}

.rc-select-selection--single {
  height: 28px;
  line-height: 28px;
  cursor: pointer;
  position: relative;
}

.rc-select-selection--single .rc-select-selection-selected-value {
  position: absolute;
  left: 0;
  top: 0;
}

.rc-select-selection--single .rc-select-selection__rendered {
  height: 28px;
  position: relative;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-left: 10px;
  padding-right: 20px;
  line-height: 28px;
}

.rc-select-selection--single .rc-select-selection__clear {
  font-weight: 700;
  position: absolute;
  top: 0;
  right: 20px;
  line-height: 28px;
}

.rc-select-selection--single .rc-select-selection__clear:after {
  content: "\D7";
}

.rc-select-disabled,
.rc-select-disabled .rc-select-selection--single,
.rc-select-disabled .rc-select-selection--single:hover,
.rc-select-disabled .rc-select-selection__choice__remove,
.rc-select-disabled .rc-select-selection__choice__remove:hover {
  color: #ccc;
  cursor: not-allowed;
}

.rc-select-search__field__wrap {
  display: inline-block;
}

.rc-select-search__field__placeholder {
  position: absolute;
  top: 0;
  left: 3px;
  color: #aaa;
}

.rc-select-search--inline,
.rc-select-search--inline .rc-select-search__field__wrap {
  width: 100%;
}

.rc-select-search--inline .rc-select-search__field {
  border: none;
  font-size: 100%;
  background: transparent;
  outline: 0;
  width: 100%;
}

.rc-select-search--inline .rc-select-search__field::-ms-clear {
  display: none;
}

.rc-select-search--inline .rc-select-search__field__mirror {
  position: absolute;
  top: -999px;
  left: 0;
  white-space: pre;
}

.rc-select-search--inline>i {
  float: right;
}

.rc-select-enabled.rc-select-selection--multiple {
  cursor: text;
}

.rc-select-selection--multiple {
  min-height: 28px;
}

.rc-select-selection--multiple .rc-select-search--inline {
  float: left;
  width: auto;
}

.rc-select-selection--multiple .rc-select-search--inline .rc-select-search__field {
  width: 0.75em;
}

.rc-select-selection--multiple .rc-select-search--inline .rc-select-search__field__wrap {
  width: auto;
}

.rc-select-selection--multiple .rc-select-search__field__placeholder {
  top: 5px;
  left: 8px;
}

.rc-select-selection--multiple .rc-select-selection__rendered {
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-left: 8px;
  padding-bottom: 2px;
}

.rc-select-selection--multiple .rc-select-selection__rendered .rc-select-selection__choice {
  margin-top: 4px;
  line-height: 20px;
}

.rc-select-enabled .rc-select-selection__choice {
  cursor: default;
}

.rc-select-enabled .rc-select-selection__choice:hover .rc-select-selection__choice__remove {
  opacity: 1;
  transform: scale(1);
}

.rc-select-enabled .rc-select-selection__choice:hover .rc-select-selection__choice__content {
  margin-left: -8px;
  margin-right: 8px;
}

.rc-select-enabled .rc-select-selection__choice__disabled {
  cursor: not-allowed;
}

.rc-select-enabled .rc-select-selection__choice__disabled:hover .rc-select-selection__choice__content {
  margin-left: 0;
  margin-right: 0;
}

.rc-select .rc-select-selection__choice {
  background-color: #f3f3f3;
  border-radius: 4px;
  float: left;
  padding: 0 15px;
  margin-right: 4px;
  position: relative;
  overflow: hidden;
  transition: padding 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045),
    width 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
}

.rc-select .rc-select-selection__choice__content {
  margin-left: 0;
  margin-right: 0;
  transition: margin 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.rc-select .rc-select-selection__choice-zoom-appear,
.rc-select .rc-select-selection__choice-zoom-enter,
.rc-select .rc-select-selection__choice-zoom-leave {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  opacity: 0;
  animation-play-state: paused;
  animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.rc-select .rc-select-selection__choice-zoom-leave {
  opacity: 1;
  animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
}

.rc-select .rc-select-selection__choice-zoom-appear.rc-select-selection__choice-zoom-appear-active,
.rc-select .rc-select-selection__choice-zoom-enter.rc-select-selection__choice-zoom-enter-active {
  animation-play-state: running;
  animation-name: rcSelectChoiceZoomIn;
}

.rc-select .rc-select-selection__choice-zoom-leave.rc-select-selection__choice-zoom-leave-active {
  animation-play-state: running;
  animation-name: rcSelectChoiceZoomOut;
}

@keyframes rcSelectChoiceZoomIn {
  0% {
    transform: scale(0.6);
    opacity: 0;
  }

  to {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes rcSelectChoiceZoomOut {
  to {
    transform: scale(0);
    opacity: 0;
  }
}

.rc-select .rc-select-selection__choice__remove {
  color: #919191;
  cursor: pointer;
  font-weight: 700;
  padding: 0 0 0 8px;
  position: absolute;
  opacity: 0;
  transform: scale(0);
  top: 0;
  right: 2px;
  transition: opacity 0.3s, transform 0.3s;
}

.rc-select .rc-select-selection__choice__remove:before {
  content: "\D7";
}

.rc-select .rc-select-selection__choice__remove:hover {
  color: #333;
}

.rc-select-dropdown {
  background-color: #fff;
  border: 1px solid #d9d9d9;
  box-shadow: 0 0 4px #d9d9d9;
  border-radius: 4px;
  box-sizing: border-box;
  z-index: 100;
  left: -9999px;
  top: -9999px;
  position: absolute;
  outline: none;
}

.rc-select-dropdown-hidden,
.rc-select-dropdown:empty {
  display: none;
}

.rc-select-dropdown-menu {
  outline: none;
  margin: 0;
  padding: 0;
  list-style: none;
  z-index: 9999;
}

.rc-select-dropdown-menu-item-group-list,
.rc-select-dropdown-menu>li {
  margin: 0;
  padding: 0;
}

.rc-select-dropdown-menu-item-group-list>li.rc-select-menu-item {
  padding-left: 20px;
}

.rc-select-dropdown-menu-item-group-title {
  color: #999;
  line-height: 1.5;
  padding: 8px 10px;
  border-bottom: 1px solid #dedede;
}

li.rc-select-dropdown-menu-item {
  margin: 0;
  position: relative;
  display: block;
  padding: 7px 10px;
  font-weight: 400;
  color: #666;
  white-space: nowrap;
}

li.rc-select-dropdown-menu-item-disabled {
  color: #ccc;
  cursor: not-allowed;
}

li.rc-select-dropdown-menu-item-selected {
  color: #666;
  background-color: #ddd;
}

li.rc-select-dropdown-menu-item-active {
  background-color: #5897fb;
  color: #fff;
  cursor: pointer;
}

li.rc-select-dropdown-menu-item-divider {
  height: 1px;
  margin: 1px 0;
  overflow: hidden;
  background-color: #e5e5e5;
  line-height: 0;
}

.rc-select-dropdown-slide-up-appear,
.rc-select-dropdown-slide-up-enter {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  opacity: 0;
  animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
  animation-play-state: paused;
}

.rc-select-dropdown-slide-up-leave {
  animation-duration: 0.3s;
  animation-fill-mode: both;
  transform-origin: 0 0;
  opacity: 1;
  animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
  animation-play-state: paused;
}

.rc-select-dropdown-slide-up-appear.rc-select-dropdown-slide-up-appear-active.rc-select-dropdown-placement-bottomLeft,
.rc-select-dropdown-slide-up-enter.rc-select-dropdown-slide-up-enter-active.rc-select-dropdown-placement-bottomLeft {
  animation-name: rcSelectDropdownSlideUpIn;
  animation-play-state: running;
}

.rc-select-dropdown-slide-up-leave.rc-select-dropdown-slide-up-leave-active.rc-select-dropdown-placement-bottomLeft {
  animation-name: rcSelectDropdownSlideUpOut;
  animation-play-state: running;
}

.rc-select-dropdown-slide-up-appear.rc-select-dropdown-slide-up-appear-active.rc-select-dropdown-placement-topLeft,
.rc-select-dropdown-slide-up-enter.rc-select-dropdown-slide-up-enter-active.rc-select-dropdown-placement-topLeft {
  animation-name: rcSelectDropdownSlideDownIn;
  animation-play-state: running;
}

.rc-select-dropdown-slide-up-leave.rc-select-dropdown-slide-up-leave-active.rc-select-dropdown-placement-topLeft {
  animation-name: rcSelectDropdownSlideDownOut;
  animation-play-state: running;
}

@keyframes rcSelectDropdownSlideUpIn {
  0% {
    opacity: 0;
    transform-origin: 0 0;
    transform: scaleY(0);
  }

  to {
    opacity: 1;
    transform-origin: 0 0;
    transform: scaleY(1);
  }
}

@keyframes rcSelectDropdownSlideUpOut {
  0% {
    opacity: 1;
    transform-origin: 0 0;
    transform: scaleY(1);
  }

  to {
    opacity: 0;
    transform-origin: 0 0;
    transform: scaleY(0);
  }
}

@keyframes rcSelectDropdownSlideDownIn {
  0% {
    opacity: 0;
    transform-origin: 0 100%;
    transform: scaleY(0);
  }

  to {
    opacity: 1;
    transform-origin: 0 100%;
    transform: scaleY(1);
  }
}

@keyframes rcSelectDropdownSlideDownOut {
  0% {
    opacity: 1;
    transform-origin: 0 100%;
    transform: scaleY(1);
  }

  to {
    opacity: 0;
    transform-origin: 0 100%;
    transform: scaleY(0);
  }
}

.rc-select-open .rc-select-arrow b {
  border-color: transparent transparent #888;
  border-width: 0 4px 5px;
}

.notify-content {
  text-align: center;
}

.notify {
  background-color: #fff;
  border: 1px solid #dcdedf;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
  display: inline-block;
  padding: 10px 20px;
  border-radius: 4px;
  color: #313131;
}

.ul-list-decimal>li {
  list-style: decimal;
}

.ul-list-none>li {
  list-style: none;
}

.class-serve>ul {
  /*padding: 20px 10px*/
}

.class-serve>ul>li {
  float: left;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: 0 5px !important;
  color: #fff;
  background-color: #e1e1e1;
  text-align: center;
  border-radius: 4px;
}

@media (max-width: 1199px) {
  .class-serve>ul>li {
    margin: 0 2px;
  }
}

.class-serve>ul>li>a {
  display: block;
  color: #fff;
  font-size: 12px;
}

.class-serve>ul>li>a:focus {
  box-shadow: none;
  border: none;
}

.course-list.no-margin .course-item {
  margin-bottom: 0;
}

.course-list .course-item {
  position: relative;
  z-index: 1;
  margin-bottom: 26px;
  border-radius: 8px;
  border: 1px solid #e4ecf3;
  background-color: #fff;
}

/* .course-list-nav 是新的课程中心数据列表刷选条件 最外层div 类名 */
.courseLnav_scroll {
  position: fixed;
  top: -28px;
  z-index: -1;
}

.course-list-nav {
  display: block;
  width: 255px;
  margin-top: 30px;
  background: #ffffff;
  border: 1px solid #e9eef3;
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
  padding: 20px;
  color: #6b7584;
}

.course-list-sections {
  display: none;
}

@media (max-width: 992px) {
  .course-list-nav {
    width: auto !important;
    position: relative !important;
  }
}

.course-list-nav .field-nav,
.course-list-nav .field-nav {
  margin-bottom: 20px;
}

.course-list-nav h2 {
  font-size: 14px;
  color: #2c3240;
  border-bottom: 2px solid #4a90e2;
  padding-bottom: 4px;
  margin-bottom: 11px;
}

.course-list-nav .field-nav a {
  display: block;
  padding: 8px 10px;
  font-size: 14px;
  color: #6b7584;
}

.course-list-nav .field-nav li.active a {
  background: #f3f9ff;
  border-radius: 4px;
  color: #005bac;
}

.course-list-nav .field-nav a:hover {
  color: #005bac;
}

.course-list-nav .stage-nav ul {
  margin-left: 10px;
  padding-top: 2px;
}

/* .course-list-new 是新的课程中心数据列表显示 最外层div 类名 */
.course-list-new {
  background: #ffffff;
  border: 1px solid #e9eef3;
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
  padding: 0 20px;
  margin-top: 30px;
}

.course-list-new-open {
  background: #ffffff;
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
}

.pc-speaker-pelpeo {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 767px) {
  .course-list-new-open {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: left !important;
  }

  .open-course-item {
    width: 47% !important;
    height: 182px !important;
    margin-right: 5px !important;
    margin-left: 5px !important;
  }

  .m-speaker-pelpeo {
    display: block !important;
    padding-left: 10px;
  }

  .pc-speaker-pelpeo {
    display: none !important;
  }

  .open-course-item .class-banner {
    height: 97px !important;
  }

  .open-course-item .img-open-responsive {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    height: 97px !important;
  }

  .open-class-info .open-speaker img {
    width: 34px !important;
    height: 34px !important;
    margin-bottom: 7px;
  }

  .open-class-info .open-class-time {
    padding-top: 6px !important;
  }
}

.m-speaker-pelpeo {
  display: none;
}

.open-course-item {
  width: 255px;
  height: 241px;
  background: #ffffff;
  border: 1px solid #e5ecf7;
  box-shadow: 0px 0px 20px 0px rgba(73, 130, 186, 0.1);
  border-radius: 8px;
  margin-bottom: 20px;
  margin-right: 20px;
  position: relative;
}

.open-course-item:nth-of-type(4n + 4) {
  margin-right: 0;
}

.open-class-info .speaker-box {
  margin-left: 12px;
}

.open-class-info .open-speaker {
  width: 100%;
  height: 30px;
  display: flex;
  align-items: center;
}

.open-class-info .open-speaker img {
  width: 20px;
  height: 20px;
  border-radius: 50%;
}

.open-class-info .open-speaker span {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #636f82;
  line-height: 15px;
  font-weight: 400;
}

.open-class-info .course-duration {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #a7b2c3;
  line-height: 15px;
  font-weight: 400;
  padding-top: 9px;
}

.open-class-info .open-class-time {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #272c40;
  line-height: 15px;
  font-weight: 400;
  padding-top: 10px;
}

.open-class-info .open-speaker .speaker-pelpeo {
  padding-left: 6px;
}

.open-course-item .class-banner {
  display: block;
  width: 100%;
  height: 144px;
}

.open-course-item .class-banner .tags {
  position: absolute;
  background: #f58b23;
  border: 2px solid #f5f8fa;
  border-radius: 12px;
  padding: 4px 8px;
  line-height: 12px;
  color: #fff;
  font-size: 12px;
  top: 9px !important;
  left: -10px;
}

.open-course-item .class-banner .tags.tags-doing {
  /* background: #4A90E2 */
  background-image: linear-gradient(135deg, #45afff 0%, #2966e9 100%);
}

.open-course-item .img-open-responsive {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  width: 100%;
  height: 144px;
  object-fit: fill;
}

.opencourse-item-search {
  position: relative;
}

.opencourse-item-search .img-responsive {
  padding: 0 0 5px !important;
  border-radius: 8px 8px 0 0;
}

.open-course-item .statistics-study,
.opencourse-item-search .statistics-study {
  width: 100px;
  height: 24px;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 0px 8px 0px 8px;
  line-height: 24px;
  text-align: center;
  position: absolute;
  right: 0;
  top: 0;
  color: #fff;
  font-size: 12px;
}

.open-course-item .statistics-numberofpeople {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #ffffff;
  font-weight: 400;
}

.course-list .course-item {
  transition: all 0.3s ease;
}

.course-list-new .course-item {
  padding-bottom: 20px;
  padding-top: 25px;
  border-bottom: 1px solid #e9eef3;
  margin-left: 0px;
  margin-right: 0px;
}

.course-list-new .course-item .link-title {
  font-size: 16px;
  color: #213249;
  display: block;
  /* margin-top:10px; */
  margin-bottom: 13px;
  /* width: 100%;
    height: 30px !important; */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.course-list-new .course-item .link-title:hover {
  color: #4a90e2;
}

.course-list-new .course-item p.intro {
  font-size: 12px;
  min-height: 22px;
  height: 44px;
  color: #a7b2c3;
  margin-bottom: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  padding-right: 34px;
}

.course-list-new .course-item .spanTags {
  display: inline-block;
  height: 22px;
  width: 64%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.course-list-new .course-item .spanTags span {
  display: inline-block;
  background: #ebf4ff;
  border-radius: 4px;
  padding: 4px;
  margin-right: 6px;
  color: #6092cb;
  font-size: 12px;
  line-height: 14px;
  margin-bottom: 10px;
}

.course-list-new .course-item .metas .num {
  font-size: 12px;
  color: #a7b2c3;
  min-width: 100px;
  text-align: center;
  margin-top: -8px;
}

/* 能力测评 单独处理 */
@media (max-width: 767px) {

  .evaluation-con .course-list .course-item:hover,
  .evaluation-con .newest-courses-box li:hover {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    transform: none !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
  }
}

.ai-question main input[type="checkbox"]+label {
  display: block;
}

/* 能力测评end */
.home1 .card-list .card-item:hover,
.course-list .course-item:hover,
.newest-courses-box li:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3) !important;
  -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3) !important;
  -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3) !important;
  transition: all 0.3s ease;
}

/*}*/

@media (max-width: 767px) {
  .group-search {
    float: none;
    margin-bottom: 0px;
  }

  .course-list .course-item {
    margin-bottom: 20px;
    margin-left: -5px;
    margin-right: -5px;
  }

  .public-class .course-author .nickname span {
    display: none;
  }

  .public-class .number {
    top: 56px;
  }
}

.course-list .course-item.course-default {
  background-color: #f5f5f5;
  padding: 50px 20px 55px;
  border: 1px dashed #e1e1e1;
  color: #e1e1e1;
  text-align: center;
  font-size: 24px;
  box-shadow: none;
}

.course-list .course-item.course-default:hover {
  transform: translateY(0);
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -o-transform: translateY(0);
  box-shadow: none;
}

.course-list .course-item.course-default>i {
  font-size: 72px;
  display: inline-block;
  margin-bottom: 18px;
}

.course-list .course-item .course-img {
  position: relative;
  overflow: hidden;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.course-list-new .course-item .course-img {
  display: inline-block;
  position: relative;
  overflow: hidden;
}

/* 气泡 */
.home1 .card-list .card-item .tags,
.course-list-new .course-item .course-img .tags,
.course-item.coursetags-box .course-img .tags {
  position: absolute;
  background: #f58b23;
  border: 2px solid #f5f8fa;
  border-radius: 12px;
  padding: 4px 8px;
  line-height: 12px;
  color: #fff;
  font-size: 12px;
  top: 9px !important;
  left: -8px;
  z-index: 1;
}

.home1 .card-list .card-item .tags.tags-doing,
.course-list-new .course-item .course-img .tags.tags-doing,
.course-item.coursetags-box .course-img .tags.tags-doing {
  /* background: #4A90E2 */
  background-image: linear-gradient(135deg, #45afff 0%, #2966e9 100%);
}

.home1 .card-list .card-item .tags.tags-free,
.course-list-new .course-item .course-img .tags.tags-free,
.course-item.coursetags-box .course-img .tags.tags-free {
  background-image: linear-gradient(45deg, #2ecc8e 0%, #05945b 100%);
}

.home1 .card-list .card-item .tags.tags-hot,
.course-list-new .course-item .course-img .tags.tags-hot,
.course-item.coursetags-box .course-img .tags.tags-hot {
  background: url("/static-dist/app/img/shenlan2020/HOT_icon@2x.png") no-repeat;
  width: 24px;
  height: 27px;
  background-size: 100%;
  border: 0;
}

.course-list .course-item .course-img .tag-discount {
  position: absolute;
  right: 0;
  top: 0;
  width: 68px;
  height: 68px;
  background: url("/static-dist/app/img/tag_discount.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_discount.png") 1x,
      url("/static-dist/app/img/tag_discount@2x.png") 2x);
}

.course-list .course-item .course-img .tag-discount.free {
  background: url("/static-dist/app/img/tag_limitfree.png");
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_limitfree.png") 1x,
      url("/static-dist/app/img/tag_limitfree@2x.png") 2x);
}

.course-list .course-item .course-img .img-responsive {
  width: 100%;
  padding: 10px;
}

.course-list-new .course-item .course-img .img-responsive {
  /* width: 230px; */
  width: 100%;
  border-radius: 8px;
}

@media (max-width: 767px) {
  .course-list .course-item .course-img .img-responsive {
    padding: 5px;
  }

  /* 搜索气泡 */
  .course-list-new .course-item .course-img .tags,
  .course-item.coursetags-box .course-img .tags {
    left: -5px;
  }
}

.course-list .course-item .tags {
  position: absolute;
  top: 0;
  left: 10px;
}

.home1 .card-list .card-item .tags-increase,
.course-list-new .course-item .course-img .tags-increase,
.course-item.coursetags-box .course-img .tags-increase {
  background: #f15f49;
}

.course-list .course-item .tags .tag-finished,
.course-list .course-item .tags .tag-live,
.course-list .course-item .tags .tag-serialing {
  display: inline-block;
  width: 40px;
  height: 50px;
}

.course-list .course-item .tags .tag-live {
  background: url("/static-dist/app/img/tag_live.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_live.png") 1x,
      url("/static-dist/app/img/tag_live@2x.png") 2x);
}

.course-list .course-item .tags .tag-serialing {
  background: url("/static-dist/app/img/tag_serialing.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_serialing.png") 1x,
      url("/static-dist/app/img/tag_serialing@2x.png") 2x);
}

.course-list .course-item .tags .tag-finished {
  background: url("/static-dist/app/img/tag_finished.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_finished.png") 1x,
      url("/static-dist/app/img/tag_finished@2x.png") 2x);
}

.course-list .course-item .title {
  margin-top: 10px;
  padding: 0 10px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

@media (max-width: 767px) {
  .course-list .course-item .title {
    margin-top: 5px;
    padding: 0 5px;
  }
}

.course-list .course-item .metas {
  position: relative;
  padding: 10px;
  color: #979797;
  font-size: 12px;
  line-height: 17px;
}

@media (max-width: 767px) {
  .course-list .course-item .metas {
    padding: 5px;
  }
}

.course-list .course-item .metas i {
  margin-right: 5px;
}

.course-list .course-item .metas .comment {
  margin-left: 10px;
}

@media (max-width: 767px) {
  .course-list .course-item .metas .comment {
    display: none;
  }
}

.course-list .course-date {
  position: relative;
  padding: 20px 0;
  text-align: center;
  z-index: 1;
}

.course-list .course-date .date {
  margin-top: 20px;
  color: #919191;
}

.course-list .course-date:before {
  position: absolute;
  content: "";
  left: -10px;
  right: -10px;
  top: 40px;
  height: 1px;
  background-color: #e1e1e1;
  z-index: -1;
}

.course-list .course-date .btn-circle {
  z-index: 1;
  background: #e1e1e1;
  border: none;
  color: #fff;
  text-shadow: 0 1px 1px rgba(73, 73, 73, 0.21);
  box-shadow: inset 0 0 4px hsla(0, 0%, 44%, 0.3);
}

.course-list .course-date .btn-circle>i {
  line-height: 40px;
}

/* 这块为啥要写float先去掉，影响Ta的显示了 */
/* .course-list .course-price-widget {
    float: right
} */

.course-price-widget .price {
  color: #e83d2c;
  font-size: 14px;
  margin-right: 0;
  line-height: 20px;
}

.course-price-widget .free {
  /*color: #70d445*/
  font-size: 14px;
  color: #22bfa7;
  line-height: 20px;
}

.course-price-widget .discount {
  color: #ff8a0c;
}

.es-banner {
  position: relative;
  height: 80px;
  padding: 20px 0;
  background-color: #f5f5f5;
  letter-spacing: 1px;
}

@media (max-width: 767px) {
  .es-banner {
    height: 60px;
    padding: 15px 0;
  }

  /* 普通课程，在移动端按钮和文案位置变动 */
  .course-list-new .course-item .metas .num {
    position: relative;
    top: -48px;
  }

  .public-class.course-list-item .alink {
    position: relative;
    top: 52px;
  }
}

.es-banner .container {
  position: relative;
}

.es-banner .title {
  text-transform: uppercase;
  padding: 6px 0;
  font-size: 20px;
}

@media (max-width: 767px) {
  .es-banner .title {
    font-size: 16px;
  }
}

.es-banner .title>i {
  display: none;
  float: left;
  margin-right: 10px;
  margin-top: 3px;
  font-size: 20px;
}

@media (max-width: 767px) {
  .es-banner .title>i {
    font-size: 16px;
    margin-right: 5px;
  }
}

.es-banner .more {
  position: absolute;
  top: 0;
  right: 10px;
}

@media (max-width: 767px) {
  .es-banner .more .btn {
    padding: 8px 20px;
  }
}

.nav-filter {
  padding: 10px 0;
  border-bottom: 1px solid #f5f5f5;
}

.nav-filter .btn-group {
  float: right;
  margin-top: -5px;
}

.nav-filter .nav-pills {
  float: left;
}

.nav-filter .nav-pills>li {
  margin-right: 15px;
}

@media (max-width: 767px) {
  .nav-filter .nav-pills>li {
    margin-right: 10px;
  }
}

.nav-filter .nav-pills>li.dropdown>a {
  color: #616161;
  border: none;
  background: none;
  padding: 4px 0;
}

.topic-list .topic-item {
  position: relative;
  margin-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f5f5f5;
}

.topic-list .topic-item .title {
  margin-bottom: 10px;
}

.topic-list .topic-item .title a {
  color: #616161;
  transition: all 0.3s ease;
}

.topic-list .topic-item .title a:hover {
  transition: all 0.3s ease;
}

.topic-list .topic-item .metas {
  color: #919191;
}

.topic-list .topic-item .metas>.name {
  color: #616161;
  transition: all 0.3s ease;
}

.topic-list .topic-item .metas>.name:hover {
  transition: all 0.3s ease;
}

@media (min-width: 768px) {

  .topic-list .topic-item .metas>.period,
  .topic-list .topic-item .metas>span {
    margin: 0 5px;
  }
}

@media (min-width: 768px) {
  .topic-list .media-body {
    padding-right: 100px;
  }
}

.topic-list .media-data {
  position: absolute;
  top: 5px;
  right: 0;
  text-align: center;
  color: #919191;
}

.topic-list .media-data span {
  padding: 0 10px;
  display: inline-block;
}

.topic-list .media-data span+span {
  border-left: 1px solid #e1e1e1;
}

.note-filter .btn-group .dropdown-menu {
  max-height: 300px;
  overflow-y: auto;
}

.note-list .note-item {
  position: relative;
  margin-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f5f5f5;
}

.note-list .note-item .content {
  margin-bottom: 20px;
  max-height: 90px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.note-list .note-item .content.active {
  max-height: 3000px;
  transition: all 0.3s ease;
}

.note-list .note-item .content p {
  line-height: 30px;
  margin-bottom: 0;
}

.note-list .note-item .more {
  display: none;
  margin-bottom: 20px;
}

.note-list .note-item .metas {
  color: #919191;
}

.note-list .note-item .metas>.name {
  color: #616161;
  transition: all 0.3s ease;
}

.note-list .note-item .metas>.name:hover {
  transition: all 0.3s ease;
}

@media (min-width: 768px) {

  .note-list .note-item .metas>.period,
  .note-list .note-item .metas>span {
    margin: 0 5px;
  }
}

.note-list .note-item .metas .metas-sns {
  float: right;
}

.note-list .note-item .metas .metas-sns>span {
  margin-left: 10px;
}

.note-list .note-item .metas .metas-sns>span i {
  margin-right: 3px;
}

.note-list .note-item .metas .metas-sns>span>a {
  color: #919191;
  transition: all 0.3s ease;
}

.note-list .note-item .metas .metas-sns>span>a:hover {
  transition: all 0.3s ease;
}

.note-list .note-item .metas .icon-favour.active>a>i {
  animation: rotate 2s;
  -moz-animation: rotate 2s;
  -webkit-animation: rotate 2s;
  -o-animation: rotate 2s;
}

.es-bar {
  position: fixed;
  top: 0;
  bottom: 0;
  right: -230px;
  width: 265px;
  z-index: 888;
  background-color: #fff;
}

.es-bar .go-top {
  visibility: hidden;
  opacity: 0;
  filter: alpha(opacity=0);
  transition: all 0.3s ease;
}

.es-bar .go-top.show {
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=100);
  transition: all 0.3s ease;
}

.es-bar-menu {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 35px;
  background-color: #fff;
  box-shadow: -1px 0 2px 0 rgba(0, 0, 0, 0.1);
}

.es-bar-menu>ul {
  position: absolute;
  left: 0;
  right: 0;
  padding: 0;
  text-align: center;
  list-style-type: none;
  margin-bottom: 0;
}

.es-bar-menu>ul>li {
  position: relative;
  margin: 10px auto;
  padding: 8px 0;
  display: block;
  transition: all 0.3s ease;
}

.es-bar-menu>ul>li .popover {
  min-width: 250px;
  margin-right: 50px;
}

.es-bar-menu>ul>li.bar-weixin-btn .popover {
  min-width: 120px;
  text-align: center;
}

.es-bar-menu>ul>li.bar-weixin-btn .popover-content {
  padding: 5px;
}

.es-bar-menu>ul>li.active,
.es-bar-menu>ul>li:hover {
  transition: all 0.3s ease;
}

.es-bar-menu>ul>li.active>a,
.es-bar-menu>ul>li:hover>a {
  color: #fff;
  transition: all 0.3s ease;
}

.es-bar-menu>ul>li>a {
  display: block;
  color: #616161;
  transition: all 0.3s ease;
}

.es-bar-menu>ul>li>a>i {
  display: block;
  font-size: 18px;
}

.es-bar-menu .q-a {
  display: block !important;
  padding: 8px 0 !important;
  color: #616161;
}

.es-bar-menu .q-a:hover {
  background-color: #005bac !important;
  color: #fff;
}

.bar-menu-top {
  top: 100px;
  background-color: #fff;
  z-index: 2;
}

.bar-menu-top .bar-user {
  padding: 10px 0;
  border-top: 1px solid #f5f5f5;
  border-bottom: 1px solid #f5f5f5;
}

.bar-menu-top .bar-user.active .badge,
.bar-menu-top .bar-user:hover .badge {
  background-color: #fff;
  transition: all 0.3s ease;
}

.bar-menu-top>li {
  position: relative;
}

.bar-menu-top>li .dot {
  position: absolute;
  top: 8px;
  right: 6px;
}

.bar-menu-sns {
  bottom: 0;
  z-index: 1;
}

.bar-menu-sns .popover-content {
  max-height: 300px;
  overflow-x: hidden;
  overflow-y: auto;
}

.es-bar-main {
  position: absolute;
  top: 0;
  left: 35px;
  bottom: 0;
  width: 230px;
  z-index: 888;
  opacity: 0;
  filter: alpha(opacity=0);
  visibility: hidden;
  background-color: #fafafa;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  transition: all 0.3s ease;
}

.es-bar-main.active {
  top: 0;
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 999;
  visibility: visible;
  -webkit-transform: scale(1);
  transform: scale(1);
  transition: all 0.3s ease;
}

.es-bar-main .bar-main-header {
  position: relative;
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  font-size: 16px;
  text-align: center;
}

.es-bar-main .bar-main-header>a {
  position: absolute;
  left: 10px;
}

.es-bar-main .bar-main-body {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  overflow-x: hidden;
  font-size: 12px;
  margin-top: 60px;
  padding: 0 15px;
}

.es-bar-main .bar-main-body .ps-scrollbar-x-rail {
  display: none !important;
}

.es-bar-main .btn-action {
  margin-bottom: 20px;
  padding: 0 10px;
  text-align: center;
}

.es-bar-main .btn-action span {
  position: relative;
}

.es-bar-main .btn-action .dot-md {
  position: absolute;
  top: -4px;
  right: -4px;
}

.es-bar-main .course-item {
  margin-bottom: 20px !important;
}

.es-bar-main .course-item .title {
  margin: 0;
  padding: 5px 10px;
}

.es-bar-main .progress {
  margin-bottom: 0;
}

.bar-message {
  list-style-type: none;
  padding-left: 0;
}

.bar-message>li {
  position: relative;
  margin-top: 0;
  padding: 15px 0;
  border-bottom: 1px dashed #e1e1e1;
}

.bar-message>li:last-child {
  border: none;
}

.bar-message>li .notification-footer {
  margin-top: 5px;
  color: #919191;
}

.bar-message>li>i {
  position: absolute;
  top: 6px;
  left: -15px;
}

.bar-homework li {
  padding: 10px 0;
}

.bar-user-center {
  text-align: center;
}

.bar-user-center p {
  font-size: 14px;
  margin-top: 20px;
}

.bar-preview {
  padding-left: 0;
  list-style-type: none;
}

.bar-preview>li {
  margin-bottom: 20px;
}

.bar-preview>li i {
  margin-right: 5px;
}

.bar-preview .date {
  color: #919191;
}

.bar-task {
  padding: 10px 0;
  margin-bottom: 10px;
  border-bottom: 1px dashed #e1e1e1;
}

.bar-task:last-child {
  border: none;
}

.bar-task .bar-task-header {
  color: #fff;
  padding: 4px 10px;
  line-height: 16px;
  border-radius: 20px;
}

.bar-task .bar-task-header .title {
  position: relative;
  padding-right: 45px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.bar-task .bar-task-header .title span {
  position: absolute;
  top: 0;
  right: 5px;
}

.bar-task .bar-time-line {
  position: relative;
  padding-left: 0;
  list-style-type: none;
}

.bar-task .bar-time-line>li {
  position: relative;
  padding: 20px 0 0 30px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.bar-task .bar-time-line>li:before {
  position: absolute;
  content: "";
  top: 0;
  left: 10px;
  width: 2px;
  height: 100%;
}

.bar-task .bar-time-line>li .es-icon {
  position: absolute;
  top: 20px;
  left: 4px;
  display: inline-block;
  font-size: 14px;
  line-height: 17px;
  text-align: center;
  z-index: 1;
  background-color: #fafafa;
}

.bar-history {
  position: relative;
  padding: 15px 0;
  z-index: 1;
}

.bar-history:before {
  position: absolute;
  content: "";
  top: 0;
  left: 26px;
  width: 2px;
  height: 100%;
  background-color: #e1e1e1;
  z-index: -1;
}

.bar-history .date {
  display: inline-block;
  height: 24px;
  width: 54px;
  line-height: 24px;
  background-color: #e1e1e1;
  text-align: center;
  color: #fff;
}

.bar-history ul {
  margin-bottom: 0;
}

.bar-history ul>li {
  position: relative;
  padding: 30px 0 0 45px;
}

.bar-history ul>li .icon {
  position: absolute;
  top: 28px;
  left: 17px;
  display: inline-block;
  width: 20px;
  height: 20px;
  color: #fff;
  border-radius: 50%;
}

.js-user-card {
  display: inline-block;
}

.es-card {
  width: 330px;
  max-width: 330px;
  z-index: 999;
}

.es-card .popover-content {
  padding: 0;
}

.es-card .card-header {
  position: relative;
  padding: 15px;
  min-height: 95px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  background-color: #f5f5f5;
}

.es-card .media {
  padding-right: 70px;
}

.es-card .media-left {
  position: relative;
}

.es-card .avatar-md {
  border: 2px solid #fff;
}

.es-card .user-avatar {
  position: relative;
}

.es-card .icon-user-status {
  position: absolute;
  bottom: 0;
  right: 0;
}

.es-card .content {
  font-size: 12px;
  margin-top: 6px;
  color: #919191;
}

.es-card .metas {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 70px;
  text-align: right;
}

.es-card .metas .btn {
  margin-bottom: 12px;
}

.es-card .metas .btn:last-child {
  margin-bottom: 0;
}

.es-card .card-body {
  line-height: 24px;
  padding: 20px;
  color: #919191;
}

.es-card .card-footer {
  border-top: 1px solid #f5f5f5;
}

.es-card .card-footer span {
  float: left;
  width: 33.33%;
  margin: 5px auto;
  text-align: center;
  line-height: 24px;
  border-right: 1px solid #f5f5f5;
}

.es-card .card-footer span:last-child {
  border: none;
}

.sign_wapper {
  display: block;
  height: 50px;
  width: 180px;
  background-color: #fff;
}

.sign_wapper .btn {
  margin: 5px;
}

.sign_main {
  position: absolute;
  right: 0;
  width: 280px;
  background: #fbfefe;
  display: none;
  margin-top: 10px;
  z-index: 9999;
  border: 1px solid #ccc;
}

.sign_main .disabled-next {
  cursor: not-allowed;
  color: #999;
}

.sign_main table {
  width: 278px;
  border: 1px solid #e3e3e3;
  border-width: 1px 0;
  background: #fff;
  color: #666;
}

.sign_main thead {
  color: #999;
}

.sign_main table tr td {
  border-bottom: 1px solid #e3e3e3;
}

.sign_main table tbody td {
  border-right: 1px solid #e3e3e3;
  border-left: 1px solid #e3e3e3;
}

.sign_main .calendar_title_month {
  height: 40px;
}

.sign_main .keep-days,
.sign_main .signed-number,
.sign_main .today-rank {
  color: #ff7f3e;
}

.sign_main .calendar_title_month span:hover {
  cursor: pointer;
}

.sign_main .title-month {
  font-size: 14px;
  color: #656565;
}

.sign_main .title-margin {
  margin: 10px;
}

.sign_main .signed_anime_day,
.sign_main .signed_day {
  background: url("/static-dist/app/img/sign_have_anime.gif") 50% no-repeat;
}

.order-nav {
  margin: 0 0 30px;
  font-size: 16px;
  color: #fff;
  background: #919191;
}

.order-nav>div {
  position: relative;
  float: left;
  width: 33.3%;
  text-align: center;
  line-height: 46px;
  color: #fff;
  font-size: 16px;
}

.order-nav>div b {
  border: 23px solid #fafafa;
  border-left-color: #919191;
  font-size: 0;
  right: -23px;
}

.order-nav>div b,
.order-nav span {
  width: 0;
  height: 0;
  line-height: 0;
  position: absolute;
  top: 0;
}

.order-nav span {
  left: 0;
  border: 23px solid #919191;
  border-left-color: #fafafa;
}

.order-nav .on span {
  border-left-color: #fafafa;
}

.order-nav .on.error {
  background: #e83d2c;
}

.order-nav .on.error span {
  border: 23px solid #e83d2c;
  border-left-color: #fafafa;
}

.order-nav .on.error b {
  border-left-color: #e83d2c;
}

.es-filter {
  position: relative;
  /*background-color: #fafafa;*/
  border-radius: 4px;
  font-size: 16px;
  margin-bottom: 30px;
}

.es-filter .nav-sort>li {
  float: left;
}

.es-filter .nav-sort>li>a {
  height: 40px;
  padding: 10px 15px;
  color: #616161;
  transition: all 0.3s ease;
}

.es-filter .nav-sort>li>a:hover {
  transition: all 0.3s ease;
}

.es-filter .nav-sort>li>a.active,
.es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-filter .btn-group.open .dropdown-toggle {
  box-shadow: none;
}

.es-filter .filter {
  position: absolute;
  text-align: right;
  top: 0;
  right: 15px;
  width: 300px;
}

.es-filter .filter .btn {
  background: none;
  padding: 10px 0;
  transition: all 0.3s ease;
}

.es-filter .filter .btn:hover {
  transition: all 0.3s ease;
}

.es-filter .filter .btn>i {
  font-size: 18px;
}

.es-filter .filter label {
  margin-left: 15px;
  margin-top: 11px;
  vertical-align: top;
  transition: all 0.3s ease;
}

.es-filter .filter label:hover {
  transition: all 0.3s ease;
}

.card-pack-list .card-pack-item {
  margin: 0 auto 30px;
}

.card-pack-item {
  position: relative;
  width: 254px;
  height: 172px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 12px;
}

.card-pack-item h4 {
  position: absolute;
  font-size: 18px;
  left: 18px;
}

.card-pack-item p {
  margin-bottom: 0;
}

.card-pack-item .title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.card-pack-item .price {
  margin-bottom: 18px;
  margin-top: 10px;
}

.card-pack-item .price strong {
  font-size: 30px;
  font-weight: 400;
}

.card-pack-item .price a {
  color: #fff;
  padding-left: 8px;
}

.card-pack-item .stamp {
  position: absolute;
  display: inline-block;
  width: 132px;
  height: 132px;
  bottom: 8px;
  left: 15px;
}

.card-pack-item .stamp.stamp-outdate {
  background: url("/static-dist/app/img/card.png") no-repeat 0 -349px;
}

.card-pack-item .stamp.stamp-cancel {
  background: url("/static-dist/app/img/card.png") no-repeat -410px -351px;
}

.card-pack-item.coupon-item {
  background: url("/static-dist/app/img/card.png") no-repeat;
}

.card-pack-item.coupon-item.useless {
  background: url("/static-dist/app/img/card.png") no-repeat 0 -174px;
}

.card-pack-item.coupon-item .title {
  padding-top: 38px;
}

.card-pack-item.coupon-item .stamp-used {
  background: url("/static-dist/app/img/card.png") no-repeat -140px -349px;
}

.card-pack-item.card-item {
  background: url("/static-dist/app/img/card.png") no-repeat -260px 0;
}

.card-pack-item.card-item.useless {
  background: url("/static-dist/app/img/card.png") no-repeat -260px -174px;
}

.card-pack-item.card-item .title {
  padding-top: 58px;
}

.card-pack-item.card-item .stamp-used {
  background: url("/static-dist/app/img/card.png") no-repeat -275px -351px;
}

.modal-card-pack.modal-logined .modal-content:after {
  position: absolute;
  width: 96px;
  height: 97px;
  top: 105px;
  right: 90px;
  content: "";
  background: url("/static-dist/app/img/card_user.png") 50% no-repeat;
}

@media (max-width: 767px) {
  .modal-card-pack.modal-logined .modal-content:after {
    display: none;
  }
}

.modal-card-pack .modal-content {
  position: relative;
  background: url("/static-dist/app/img/card_bg.png") #feba37 50% no-repeat;
  border-radius: 20px;
}

.modal-card-pack .modal-body {
  padding: 30px;
}

@media (max-width: 767px) {
  .modal-card-pack .modal-body {
    padding: 15px;
  }
}

.modal-card-pack .modal-body .modal-info {
  text-align: center;
  color: #fff;
  font-size: 22px;
  margin-bottom: 30px;
}

@media (max-width: 767px) {
  .modal-card-pack .modal-body .modal-info {
    margin-bottom: 20px;
    font-size: 18px;
  }
}

.modal-card-pack .modal-body .modal-action {
  margin-top: 30px;
  text-align: center;
}

@media (max-width: 767px) {
  .modal-card-pack .modal-body .modal-action {
    margin-top: 20px;
  }
}

.task-list {
  list-style: none;
  padding: 0;
  margin: 10px 20px 0 20px;
}

.sidebar-task-list {
  margin: 0;
  position: relative;
}

.sidebar-task-list.active .color-gray .title,
.sidebar-task-list.preface-item a:hover .title {
  color: #32a7ff !important;
}

.task-list .task-item {
  position: relative;
  background-color: transparent;
  /* margin-bottom: 10px */
  /* background:#fff; */
}

.task-list .task-item .task-member-expired {
  display: block;
  /* background: rgba(0,0,0,0.5); */
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 2;
}

/* 节任务的任务条 */
.sidebar-task-list:before {
  content: "";
  display: block;
  width: 0;
  height: 100%;
  border-left: 1px solid #323a53;
  position: absolute;
  top: 0;
  left: 11px;
}

/* .sidebar-task-list .task-item.color-gray:before{
    content: "";
    display: block;
    width: 0;
    height: 100%;
    border-left: 1px solid #323A53;
    position: absolute;
    top: 0;
    left: 11px;
} */

.sidebar-task-list .task-item {
  margin-bottom: 1px;
}

.sidebar-task-list .task-item:last-child {
  padding-bottom: 20px;
}

.task-list .task-item .new-icon {
  position: absolute;
  right: 19px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  color: #bababa;
}

.task-list .task-item.task-content.active,
.task-list .task-item.task-content:hover {
  /* background-color: #F5FBFF */
  color: #32a7ff;
}

.task-list .task-item.task-content.active a.title,
.task-list .task-item.task-content a:hover .title,
.task-list .task-item.task-content.active .left-menu,
.task-list .task-item.task-content a:hover .left-menu {
  color: #32a7ff !important;
}

.task-list .task-item.task-content .title {
  color: #878ec3;
}

.task-list .task-item .title {
  display: block;
  word-wrap: break-word;
  word-break: break-all;
  padding: 12px 90px 12px 50px;
}

.sidebar-task-list .js-task-chapter .title {
  padding: 10px 65px 10px 30px;
  font-size: 14px;
  color: #fff;
  font-weight: 500;
  line-height: 20px;
}

.sidebar-task-list .color-gray .title {
  padding: 12px 67px 12px 30px;
  font-size: 14px;
  color: #ecefff !important;
  line-height: 20px;
}

.sidebar-task-list .task-content .title {
  padding: 7px 58px 7px 52px;
  font-size: 12px !important;
  color: #3f4a54;
  line-height: 20px;
  /* text-align: justify; */
}

.sidebar-task-list .js-task-chapter .title,
.sidebar-task-list .color-gray .title {
  position: relative;
}

.sidebar-task-list .js-task-chapter .title:before,
.sidebar-task-list .color-gray .title:before {
  position: absolute;
  background: #fff;
  left: 10px;
  content: "";
  border-radius: 50%;
}

.sidebar-task-list .js-task-chapter .title:before {
  width: 5px;
  height: 5px;
  top: 16px;
}

.sidebar-task-list .color-gray .title:before {
  width: 4px;
  height: 4px;
  top: 20px;
  background: #adbdf2;
}

/* .sidebar-task-list .task-item.task-content.active {
    background: #005BAC;
} */

.sidebar-task-list .es-icon:before {
  position: absolute;
  left: -2px;
  top: -1px;
  font-size: 14px;
}

/* .sidebar-task-list .task-item.task-content.active .left-menu, */
.sidebar-task-list .task-item.task-content.active .title,
.sidebar-task-list .task-item.task-content.active .right-menu {
  color: #32a7ff !important;
}

.sidebar-task-list .task-item.task-content.active .es-icon-videoclass,
.sidebar-task-list .task-item.task-content.active .es-icon-videocam {
  background: url("/static-dist/app/img/2018/1.0/public_class/shipinbofang_icon_active.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/shipinbofang_icon_active.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/shipinbofang_icon_active@2x.png") 2x);
}

.task-list .task-item .left-menu {
  position: absolute;
  left: 30px;
  top: 17px;
}

.task-list-pane .task-list .task-item .left-menu {
  left: 10px;
  top: 17px;
}

.sidebar-task-list .task-item .left-menu {
  left: 32px;
  top: 12px;
  width: 12px;
  height: 12px;
  color: #9298bf;
}

/* .new-dashboard-sidebar .dashboard-toolbar li .mbs {
    margin-bottom: 0 !important;
    float: left;
    margin-top: 3px;
    margin-right: 4px;
} */

.new-dashboard-sidebar .dashboard-toolbar li .mbs:before {
  content: "";
  /* display: block;
    width: 14px;
    height: 14px; */
}

/* .new-dashboard-sidebar .dashboard-toolbar li:nth-child(1) .mbs:before {
    background: url('/static-dist/app/img/2018/1.0/video/mulu_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/video/mulu_icon.png') 1x, url('/static-dist/app/img/2018/1.0/video/mulu_icon@2x.png') 2x);
}

.new-dashboard-sidebar .dashboard-toolbar li:nth-child(2) .mbs:before {
    background: url('/static-dist/app/img/2018/1.0/video/biji_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/video/biji_icon.png') 1x, url('/static-dist/app/img/2018/1.0/video/biji_icon@2x.png') 2x);
}

.new-dashboard-sidebar .dashboard-toolbar li:nth-child(3) .mbs:before {
    background: url('/static-dist/app/img/2018/1.0/video/wenda_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/video/wenda_icon.png') 1x, url('/static-dist/app/img/2018/1.0/video/wenda_icon@2x.png') 2x);
}

.new-dashboard-sidebar .task-list-pane .es-icon-remove:before,
.new-dashboard-sidebar .task-list-pane .es-icon-anonymous-iconfont:before {
    content: '';
    display: block;
    width: 17px;
    height: 10px;
    background: url('/static-dist/app/img/2018/1.0/video/jiantou01_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/video/jiantou01_icon.png') 1x, url('/static-dist/app/img/2018/1.0/video/jiantou01_icon@2x.png') 2x);
}
 */
.new-dashboard-sidebar .task-list-pane .es-icon-remove,
.new-dashboard-sidebar .task-list-pane .es-icon-anonymous-iconfont {
  width: 17px;
  height: 10px;
  top: 15px !important;
}

.new-dashboard-sidebar .task-list-pane .es-icon-remove:before {
  transform: rotate(180deg);
}

/* .new-dashboard-sidebar .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a {
    background-color: #f0f0f0 !important;
    color: #202E3A !important;
} */
.dashboard-sidebar-leftlist .tooltip-inner {
  width: 70px;
  text-align: center;
  padding: 2px;
}

.dashboard-sidebar-leftlist .arrow.toHide {
  width: 24px;
  height: 52px;
  background: url("/static-dist/app/img/shenlan2020/tohide@2x.png") no-repeat center;
  background-size: 100%;
  cursor: pointer;
  position: absolute;
  top: 120px;
  right: -24px;
}

.dashboard-sidebar-leftlist .arrow.toShow {
  width: 62px;
  height: 54px;
  background: url("/static-dist/app/img/shenlan2020/toshow@2x.png") no-repeat center;
  background-size: 100%;
  cursor: pointer;
  position: absolute;
  top: 120px;
  right: -62px;
}

.dashboard-sidebar-leftlist .arrow.toShow:hover {
  background: url("/static-dist/app/img/shenlan2020/toshowhover@2x.png") no-repeat center;
  background-size: 100%;
}

/* .new-dashboard-sidebar .arrow {
    width: 30px;
    height: 30px;
    box-shadow: -2px 0 2px 0 rgba(0, 0, 0, 0.10);
    border-radius: 4px 0 0 4px;
    position: absolute;
    top: 20px;
    left: -30px;
    background-color: #fff;
    cursor: pointer;
}

.new-dashboard-sidebar .arrow span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 12px;
    height: 12px;
    transform: translate(-50%, -50%);
} */

.new-dashboard-sidebar .arrow.toHide span {
  width: 25px;
  height: 54px;
  background: url("/static-dist/app/img/shenlan2020/shouqi_right@2x.png") no-repeat center;
  background-size: 100%;
  cursor: pointer;
  position: absolute;
  top: 120px;
  left: -25px;
}

.new-dashboard-sidebar .arrow.toShow span {
  width: 25px;
  height: 54px;
  background: url("/static-dist/app/img/shenlan2020/zhankai02_icon@2x.png") no-repeat center;
  background-size: 100%;
  cursor: pointer;
  position: absolute;
  top: 120px;
  left: -25px;
}

.new-dashboard-sidebar .js-sidebar-pane-body .task-item.active .es-icon-iccheckcircleblack24px:before {
  content: "\E6C7";
}

.new-dashboard-sidebar .js-sidebar-pane-body .task-item.active .es-icon-undone-check {
  border-color: #fff;
}

.new-dashboard-sidebar .js-sidebar-pane-body .task-item .right-menu {
  font-size: 12px;
}

.task-list .task-item .right-menu {
  position: absolute;
  /* top: 50%;
  transform: translateY(-50%); */
  top: 12px;
  /* right: 15px; */
  right: 25px;
  line-height: normal;
}

.task-list .task-item .right-menu>a {
  position: absolute;
  top: -4px;
  right: 0;
}

.task-list .task-item .btn-learn {
  margin-top: -6px;
}

.task-list.task-list-gray .task-item {
  background-color: #f8f8f8;
}

.task-list.task-list-md .task-item {
  /* margin-bottom: 2px */
  /* height: 46px; */
}

.task-list.task-list-md .title {
  color: #31363f;
  padding: 12px 30px 12px 59px;
  font-size: 15px;
}

.task-list.one-outline .title {
  padding: 0 30px 0 0;
  font-size: 16px;
  color: #333333;
}

.task-list.one-outline .unit-detail {
  font-size: 13px;
  color: #999999;
  letter-spacing: 0;
  font-weight: 400;
  padding-top: 8px;
}

.task-list.one-outline .outline-icon-member {
  position: absolute;
  right: 0;
  font-size: 12px;
  color: #9297a5;
  display: flex;
  justify-content: center;
  top: 50%;
  transform: translateY(-50%);
  align-items: center;
}

.task-list.one-outline .outline-icon-member .es-outline {
  font-size: 13px;
  /* padding-right: 3px; */
  padding-left: 3px;
  line-height: unset;
}

.task-list.one-outline .outline-icon {
  position: absolute;
  right: 0;
  font-size: 12px;
  color: #9297a5;
  top: 10px;
}

.task-list.one-outline .outline-icon::before {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  background: url("/static-dist/app/img/cs-one/time02_icon@2x.png") center;
  background-size: 100% 100%;
  left: -13px;
  top: 6px;
}

.task-list.one-outline .title.bbb {
  color: #135e98;
  padding: 10px 90px 10px 20px;
  font-size: 16px;
}

.task-list.one-outline .title.bbb .tast-detail {
  font-size: 13px;
  color: #999999;
  margin-top: 10px;
}

.task-list.task-list-md .title.big-title {
  font-size: 18px;
  color: #31363f !important;
  font-weight: 600;
  padding-left: 15px;
  /* padding-top:32px; */
  padding-right: 60px;
  /* padding-right:1px; */
  vertical-align: middle;
  display: table-cell;
  width: 100%;
}

.task-list-md.one-outline .title.big-title {
  padding: 0 10px 8px 0;
  position: relative;

  display: flex;
  justify-content: space-between;
}

.task-list-md.one-outline .title.big-title .chapter-r-info {
  font-size: 12px;
  color: #999999;
  text-align: right;
  font-weight: 400;
}

.task-list-md.one-outline .chapter-detail {
  font-size: 14px;
  color: #484e59;
  margin-bottom: 20px;
}

.task-list-md.one-outline .title.big-title::before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  background: #333333;
  border-radius: 50%;
  left: -13px;
  /* top: 50%; */
  margin-top: 6px;
}

/* 最新new 图标 */
.chapter_new {
  width: 39px;
  height: 16px;
}

.task-list .light-gray {
  background-color: #f5f7fb !important;
  font-size: 16px;
  color: #4a545b;
}

.task-list .light-gray.one-outline {
  margin-top: 10px;
  background-color: #fff !important;
}

@media (max-width: 767px) {
  .task-list .light-gray.one-outline {
    margin-top: 6px;
  }

  .task-dashboard-page .new-dashboard-sidebar {
    width: 100% !important;
  }

  .task-dashboard-page .new-dashboard-content,
  .task-dashboard-page .new-dashboard-sidebar,
  .task-dashboard-page .task-list-pane,
  .task-dashboard-page {
    position: static !important;
  }

  .task-dashboard-page .task-list-pane {
    margin-top: 10px;
  }
}

/* @media (min-width:768px) {
    .task-list .light-gray span {
        padding-left: 57px !important;
    }
} */
.new-dashboard-content .prereading {
  padding: 20px;
  background: #ffffff;
  border: 1px solid #ebedf2;
  border-radius: 4px;
  font-size: 14px;
  color: #787e99;
  margin-bottom: 20px;
}

.new-dashboard-content .prereading.belowModule,
.new-dashboard-content .prereading.evaluate {
  margin-top: 20px;
  margin-bottom: 0px;
}

.new-dashboard-content .prereading .reading-title {
  font-size: 16px;
  color: #313131;
  font-weight: 500;
  padding-bottom: 20px;
}

/* 课程评分 */
/* 已评分 */
.evaluate-success {
  background: #f9f9f9;
  font-size: 14px;
  color: #6d7278;
  text-align: center;
  padding: 56px 0;
}

.evaluate-success .evaluate-success-icon {
  font-size: 30px;
  color: #22bfa7;
  top: 1px;
  position: relative;
  padding-right: 4px;
}

/* 未评分 */
.new-dashboard-content .prereading.evaluate .submitevaluate {
  font-size: 12px;
  color: #0091ff;
  padding: 8px 26px;
  border: 1px solid #0091ff;
  border-radius: 20px;
  margin-top: 34px;
}

.evaluate-box {
  display: -webkit-flex;
  /* Safari */
  display: flex;
}

.rating-stars-box .rating-star-text {
  font-size: 12px;
  color: #313131;
}

.rating-stars-box .rating-stars-container {
  display: inline-block;
}

.rating-stars-box .rating-star {
  display: inline-block;
  color: #e7e9f4;
  padding-left: 6px;
  vertical-align: middle;
  cursor: pointer;
}

.rating-stars-container .rating-star.is--active,
.rating-stars-container .rating-star.is--hover {
  color: #ffb858;
}

.rating-stars-container .rating-star.is--no-hover {
  color: #e7e9f4;
}

.evaluate-box .evaluate-left {
  width: 234px;
}

.evaluate-box .evaluate-right {
  flex-grow: 1;
}

.evaluate-box .evaluate-right textarea {
  width: 100%;
  height: 100%;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
  padding: 12px;
  font-size: 12px;
}

.new-dashboard-content .js-btn-learn.active {
  background-color: #005bac;
}

.task-list .light-gray .list-style {
  width: 4px !important;
  height: 4px !important;
  background-color: #3f4a54 !important;
  /* margin: 23px 0 0 43px !important; */
  margin-top: 21px !important;
}

@media (max-width: 768px) {
  .task-list .light-gray .list-style {
    width: 4px !important;
    height: 4px !important;
    background-color: #3f4a54 !important;
    /* margin: 23px 0 0 0 !important; */
  }

  /* 首页气泡 */
  .course-item.coursetags-box-left .course-img .tags {
    left: 0;
  }
}

/*.task-list.task-list-md .left-menu {
left: 20px;
top: 17px
}*/

.task-list.task-list-md .list-style {
  /* background-color: #3F4A54; */
  background-color: #2c3240;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  float: left;
  margin: 27px 0 0 37px;
}

/*a.title.gray-dark {

}
a.title.gray-dark:before {

}*/

/* .task-list.task-list-md .right-menu {
    right: 23px;
    top: 15px;
} */
.course-detail-content .js-task-chapter .right-menu {
  /* top: 18px !important; */
  color: #31363f !important;
}

.task-list.task-list-hover .task-item.task-content:hover {
  background-color: #f5fbff;
}

.task-list.task-chart {
  margin-right: -18px;
}

.task-list.task-chart .task-item {
  float: left;
  width: 33.2%;
  margin-bottom: 20px;
  background-color: #f8f8f8;
  border-right: 20px solid #fff;
}

.task-list.task-chart .task-item.half {
  width: 50%;
}

.task-list.task-chart .task-item .title {
  color: #616161;
  padding: 18px 80px 28px 45px;
}

.task-list.task-chart .task-item .title .task-overflow {
  display: block;
  overflow: hidden;
  line-height: 20px;
  height: 40px;
}

.task-list.task-chart .task-item .left-menu {
  top: 20px;
}

.task-list.task-chart .task-item .right-menu {
  top: 18px;
}

.task-list.task-chart .task-item .task-type-icon {
  font-size: 48px;
  margin-right: -5px;
  margin-top: -6px;
  color: #e9eaea;
}

.task-manage-list {
  margin: 0 10px 0 40px;
  padding: 0;
  list-style: none;
  border-left: 1px solid #c1c1c1;
}

.task-manage-list .task-manage-item {
  border: 1px solid #c1c1c1;
  background: #fff;
  line-height: 42px;
  margin-bottom: 15px;
  margin-left: 20px;
  cursor: move;
  word-wrap: break-word;
  word-break: break-all;
}

.task-manage-list .task-manage-item.active,
.task-manage-list .task-manage-item:hover {
  background: #f3f3f3;
}

.task-manage-list .task-manage-item.active .item-actions,
.task-manage-list .task-manage-item:hover .item-actions {
  visibility: visible;
}

.task-manage-list .task-manage-item.active .item-default-header {
  border-color: #c1c1c1;
}

.task-manage-list .task-manage-chapter {
  position: relative;
  margin-left: -40px;
}

.task-manage-list .task-manage-unit {
  margin-left: -20px;
}

.task-manage-list .item-line {
  border-bottom: 1px solid #c1c1c1;
  vertical-align: top;
  display: inline-block;
  height: 21px;
  width: 21px;
  margin-left: -21px;
  float: left;
}

.task-manage-list .item-content {
  padding-left: 10px;
  overflow: hidden;
  height: 42px;
  line-height: 42px;
  float: left;
  width: 100%;
}

.task-manage-list .item-actions {
  position: absolute;
  right: 11px;
  padding-right: 0;
  visibility: hidden;
  background: #f3f3f3;
  border-left: 1px solid #ddd;
}

.task-manage-list .item-actions .btn,
.task-manage-list .item-actions .dropdown-menu>li>a {
  transition: none;
}

.task-manage-list .item-actions .btn-link:hover,
.task-manage-list .item-actions a.dropdown-toggle:focus,
.task-manage-list .item-actions a.dropdown-toggle:hover {
  text-decoration: none;
}

.task-manage-list .item-default-header {
  border-bottom: 1px solid transparent;
}

.task-manage-list .settings-list {
  padding: 0;
  display: none;
  list-style: none;
  background-color: #f3f3f3;
}

.task-manage-list .settings-list .settings-item {
  float: left;
  width: 20%;
  text-align: center;
}

.task-manage-list .settings-list .settings-item>a {
  color: #919191;
  line-height: 58px;
}

.task-manage-list .settings-list .settings-item.active>a,
.task-manage-list .settings-list .settings-item>a:hover {
  color: #70d445;
}

.task-manage-list .settings-list .settings-item .after {
  line-height: 55px;
  color: #c1c1c1;
  float: right;
}

.mouse-control>.mouse-leave {
  display: inline-block;
}

.mouse-control:hover>.mouse-leave,
.mouse-control>.mouse-enter {
  display: none;
}

.mouse-control:hover>.mouse-enter {
  display: inline-block;
}

/* @media (min-width:768px) {
    .es-poster {
        position: relative;
        background: #fff;
        margin: 0 auto;
        max-height: 600px
    }

    .es-poster.swiper-container {
        width: 1080px;
        height: 350px;
        border-radius: 8px;
        margin-top: 10px;
    }

} */

/*.es-poster.swiper-container:before,
.es-poster.swiper-container:after {
width: 40px;
height: 80px;
content: '';
position: absolute;
top: 50%;
z-index: 2;
transform: translateY(-50%);
}
.es-poster.swiper-container:before {
left: 0;
background: url('/static-dist/app/img/2018/1.0/homepage/zuoqiehuan_pic.png') no-repeat center;
background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/homepage/zuoqiehuan_pic.png') 1x, url('/static-dist/app/img/2018/1.0/homepage/zuoqiehuan_pic@2x.png') 2x);
}

.es-poster.swiper-container:after {
right: 0;
background: url('/static-dist/app/img/2018/1.0/homepage/youqiehuan_pic.png') no-repeat center;
background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/homepage/youqiehuan_pic.png') 1x, url('/static-dist/app/img/2018/1.0/homepage/youqiehuan_pic@2x.png') 2x);
}*/

.es-poster .swiper-slide {
  margin: 0 auto;
  width: 100%;
  height: 100%;
  visibility: visible;
  /* border-radius: 8px; */
}

.es-poster .swiper-wrapper {
  height: 100%;
}

.es-poster .swiper-slide .container {
  position: relative;
}

.es-poster .swiper-slide .img-responsive {
  margin: 0 auto;
}

.es-poster .swiper-slide .mask {
  position: absolute;
  top: 0;
  left: 10px;
  right: 10px;
  height: 100%;
}

.es-poster .swiper-slide .mask .container {
  position: relative;
  height: 100%;
}

.es-poster .swiper-slide .title {
  position: absolute;
  top: 130px;
  left: 50px;
  line-height: 80px;
  margin-bottom: 20px;
  font-size: 70px;
  color: #fff;
  opacity: 0;
}

.es-poster .swiper-slide .title span {
  display: block;
}

@media (max-width: 1199px) {
  .es-poster .swiper-slide .title {
    font-size: 60px;
  }
}

@media (max-width: 991px) {
  .es-poster .swiper-slide .title {
    font-size: 40px;
    line-height: 50px;
    top: 100px;
  }
}

@media (max-width: 767px) {
  .es-poster .swiper-slide .title {
    top: 20px;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 26px;
  }

  .es-poster .swiper-slide .title span {
    display: inline-block;
  }

  .course-detail-content .js-task-chapter .title.big-title {
    left: -14px;
  }

  .task-list.task-list-md .title.big-title,
  .task-list.task-list-md .title {
    text-align: justify;
    padding-left: 20px;
  }

  .task-list-md.one-outline .title.big-title,
  .task-list-md.one-outline .title {
    padding-left: 0;
  }

  .task-list.task-list-md .title.big-title {
    font-size: 15px;
  }

  .task-list.task-list-md .title {
    font-size: 13px;
  }

  .task-list .task-item .right-menu {
    right: 6px;
  }

  .task-list .task-item .list-style.jie_point {
    display: none;
  }

  .task-list.task-list-md .list-style {
    margin: 27px 0 0 10px;
  }

  .task-list.task-list-md .mouse-control .title {
    font-size: 12px;
    padding-right: 120px;
  }

  .one-outline.task-list-md .mouse-control .title {
    /* padding: 6px 0 12px 0; */
    padding: 6px 89px 6px 20px;
  }

  .task-list.task-list-md .mouse-control .chapter_circle {
    display: none;
  }

  .task-list.task-list-md .mouse-control .left-menu.js_chapter_btn {
    width: 10px;
    left: 5px;
  }

  .task-list.task-list-md .mouse-control .right-menu {
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
  }
}

.es-poster .swiper-slide .subtitle {
  position: absolute;
  top: 320px;
  left: 50px;
  color: #46c37b;
  font-size: 22px;
  opacity: 0;
}

.es-poster .swiper-slide .subtitle span {
  margin-right: 20px;
}

@media (max-width: 991px) {
  .es-poster .swiper-slide .subtitle {
    top: 220px;
    font-size: 18px;
  }
}

@media (max-width: 767px) {
  .es-poster .swiper-slide .subtitle {
    left: 0;
    right: 0;
    text-align: center;
    top: 80px;
  }

  .es-poster .swiper-slide .subtitle span {
    margin: 0 10px;
  }
}

.es-poster .swiper-slide .item-mac {
  position: absolute;
  bottom: 50px;
  right: 0;
  max-width: 70%;
  opacity: 0;
}

@media (min-width: 992px) and (max-width: 1199px) {
  .es-poster .swiper-slide .item-mac {
    width: 550px;
  }
}

@media (max-width: 991px) {
  .es-poster .swiper-slide .item-mac {
    width: 400px;
  }
}

@media (max-width: 767px) {
  .es-poster .swiper-slide .item-mac {
    display: none;
  }
}

.es-poster .swiper-slide.swiper-slide-active .title {
  -webkit-animation: fadeInUp 1s 0.2s ease both;
  animation: fadeInUp 1s 0.2s ease both;
}

.es-poster .swiper-slide.swiper-slide-active .subtitle {
  -webkit-animation: fadeInLeft 1s 0.8s ease both;
  animation: fadeInLeft 1s 0.8s ease both;
}

.es-poster .swiper-slide.swiper-slide-active .item-mac {
  -webkit-animation: fadeInRight 1s 0.2s ease both;
  animation: fadeInRight 1s 0.2s ease both;
}

.swiper-pager {
  position: absolute;
  bottom: 30px;
  bottom: 17%;
  z-index: 100;
  width: 100%;
  text-align: center;
}

.swiper-pager span {
  font-size: 0;
  margin: 0 4px;
  width: 9px;
  height: 9px;
  display: inline-block;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  border: 0px solid #fff;
}

/* @media (max-width:767px) {
    .swiper-pager span {
        width: 10px;
        height: 10px;
        margin: 0 5px
    }

} */

.swiper-pager span:hover {
  cursor: pointer;
}

.swiper-pager span.swiper-active-switch,
.swiper-pager span:hover {
  background: rgba(255, 255, 255, 0.8);
  border-radius: 5px;
  width: 18px;
}

.section-more-btn {
  text-align: center;
  margin: 20px auto;
}

@media (max-width: 767px) {
  .section-more-btn {
    margin: 10px auto;
  }

  .section-more-btn .btn {
    padding: 6px 12px;
  }
}

.section-more-btn a {
  padding: 0 !important;
  width: 146px;
  height: 44px;
  line-height: 44px;
  background-color: transparent !important;
  color: #666;
}

.course-filter {
  position: relative;
  min-height: 48px;
  margin: 0 0 20px;
  padding-right: 150px;
}

@media (max-width: 767px) {
  .course-filter {
    min-height: 30px;
  }

  .course-filter .btn {
    padding: 3px 6px;
  }
}

.course-filter .nav-pills>li {
  margin: 0 30px 10px 0;
}

.course-filter .course-sort {
  position: absolute;
  right: 0;
  top: 0;
}

.course-filter .course-sort .btn-circle {
  margin-left: 10px;
}

.course-list-section {
  position: relative;
  /* padding-bottom: 14px;
    max-width: 1080px;
    margin: 0 auto; */
}

.open-course-list-section::before {
  content: "";
  position: absolute;
  width: 393px;
  height: 680px;
  top: -340px;
  left: 0;
  background: url("/static-dist/app/img/shenlan2020/zhuangshi01_icon@2x.png") no-repeat;
  background-size: 100% 100%;
  z-index: -1;
  /* 新年皮肤 */
  /* width: 316px;
  height: 589px;
  top: -170px;
  left: 0;
  background: url("/static-dist/app/img/2021/2023_left@2x.png") no-repeat;
  background-size: 100% 100%; */
}

.open-course-list-section::after {
  content: "";
  position: absolute;
  width: 393px;
  height: 680px;
  top: 0px;
  right: 0;
  background: url("/static-dist/app/img/shenlan2020/zhuangshi01_icon@2x.png") no-repeat;
  background-size: 100% 100%;
  transform: rotate(180deg);
  z-index: -1;
  /* 新年皮肤 */
  /* width: 338px;
  height: 589px;
  top: 100px;
  right: 0;
  background: url("/static-dist/app/img/2021/2023_right.png") no-repeat;
  background-size: 100% 100%; */
}

.course-list-section .openitem-box {
  /* display: grid;
    grid-template-columns: repeat(4, 1fr);
            grid-column-gap: 20px; */
  display: flex;
  justify-content: space-between;
}

.open-course-list-section .course-item {
  background: #ffffff;
  border: 1px solid #e5ecf7;
  box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  border-radius: 8px;
  /* transition: all .3s ease; */
  flex: 1;
  margin-right: 20px;
}

.open-course-list-section .course-item:nth-last-of-type(1) {
  margin-right: 0;
}

.open-course-list-section .img-responsive {
  width: 100%;
  border-radius: 8px 8px 0 0;
}

.open-course-list-section .course-item:hover .open-apply-box {
  display: block;
}

.open-course-list-section .course-teacherinfo {
  position: relative;
  padding: 0 20px 20px;
  margin-top: -13px;
}

.open-course-list-section .open-courselink {
  display: block;
  position: relative;
}

.open-course-list-section .course-teacherinfo .img-circle {
  width: 60px;
  border: 3px solid #fff;
}

.open-course-list-section .nickname {
  font-size: 16px;
  color: #31363f;
  display: block;
  width: 100%;
  padding-left: 91px;
  position: absolute;
  top: 16px;
  left: 0;
  overflow: hidden;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.open-course-list-section .position-title {
  font-size: 13px;
  color: #909eab;
  position: absolute;
  display: block;
  top: 40px;
  width: 100%;
  left: 0;
  padding-left: 91px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.open-course-list-section .open-course-detail {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: 12px;
  color: #bababa;
  /* text-align: justify; */
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 18px;
  margin-top: 10px;
}

.open-course-list-section .open-apply-box {
  display: none;
  background: #fff;
  height: 60px;
  position: absolute;
  width: calc(100% + 2px);
  left: -1px;
  /* z-index: 3; */
  bottom: -50px;
  border: 1px solid #e5ecf7;
  border-radius: 0 0 8px 8px;
  border-top: 0;
  padding-top: 7px;
}

.open-course-list-section .open-apply {
  display: block;
  text-align: center;
  background: #f8fcff;
  border: 1px solid #abc3e1;
  border-radius: 19px;
  font-size: 10px;
  color: #4a90e2;
  max-width: 100px;
  line-height: 28px;
  margin: 0 auto 20px;
}

@media (max-width: 767px) {
  .course-list-section {
    padding-bottom: 0;
  }
}

.live-course-section {
  padding-bottom: 20px;
  background: #fafafa;
}

.introduction-section {
  position: relative;
  background-color: #46c37b;
}

.introduction-section h3 {
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  .introduction-section h3 {
    font-size: 14px;
  }

  /* 公开课程 */
  .open-course-list-section .course-teacherinfo .img-circle {
    width: 47px;
  }

  .open-course-list-section .nickname {
    padding-left: 60px;
    top: 7px;
  }

  .course-list-section .openitem-box {
    display: grid;
    grid-template: 1fr / repeat(2, 47vw);
    /* gap: 2vw; */
    padding: 2vw;
    margin-bottom: 20px;
    margin: 0 2vw;
    grid-column-gap: 0;
  }

  .open-course-list-section .course-item {
    margin-bottom: 2vw;
    margin-right: 2vw !important;
  }

  /* .open-course-list-section .course-item:nth-of-type(2n+1){
        margin-right: 2vw;
    } */
  .open-course-list-section .course-teacherinfo {
    padding: 0 10px 10px;
    margin-top: -5px;
  }

  /* .open-course-list-section .course-item:hover{
        transform: scale(1);
    } */
  .open-course-list-section .course-item:hover .open-apply-box {
    display: none;
  }

  .open-course-list-section .position-title {
    font-size: 12px;
    top: 24px;
    padding-left: 60px;
  }
}

.introduction-section img {
  margin: 0 auto 30px;
}

.introduction-section .introduction-item {
  margin: 90px 0;
  text-align: center;
  vertical-align: top;
  display: block;
  color: #fff;
}

@media (max-width: 991px) {
  .introduction-section .introduction-item {
    margin: 40px 0;
  }
}

.class-section {
  padding-bottom: 20px;
  background-color: #fff;
}

.recommend-class-list .class-item {
  position: relative;
  margin: 0 auto 30px;
  z-index: 1;
  border: 1px solid #e4ecf3;
  border-radius: 4px;
}

@media (max-width: 767px) {
  .recommend-class-list .class-item {
    margin: 0 -5px 20px;
  }
}

.recommend-class-list .class-item .class-img-wrap {
  position: relative;
  overflow: hidden;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.recommend-class-list .class-item .class-img-wrap .mask {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.8);
  opacity: 0;
  transition: all 0.3s ease;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.recommend-class-list .class-item .class-img-wrap .mask .btn {
  margin-top: 80%;
  transition: all 0.3s ease;
}

.recommend-class-list .class-item .class-img {
  display: block;
}

.recommend-class-list .class-item .img-responsive {
  width: 100%;
}

.recommend-class-list .class-item h3 {
  margin: 15px 5px;
  font-size: 16px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  text-align: center;
}

@media (max-width: 767px) {
  .recommend-class-list .class-item h3 {
    margin: 10px 5px;
    font-size: 14px;
  }
}

.recommend-class-list .class-item .metas {
  margin: 15px 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  text-align: center;
}

@media (max-width: 767px) {
  .recommend-class-list .class-item .metas {
    margin: 10px 0;
    font-size: 12px;
  }
}

.recommend-class-list .class-item .metas span {
  margin: 0 3px;
}

.recommend-class-list .class-item:hover .mask {
  opacity: 1;
  transition: all 0.3s ease;
}

.recommend-class-list .class-item:hover .mask .btn {
  margin-top: 30%;
  transition: all 0.3s ease;
}

.open-course-list-section .course-item .course-img .img-responsive {
  padding: 0;
}

.dynamic-section-main .panel {
  /*height: 287px*/
}

.dynamic-section-main .panel-body {
  padding: 30px 0 29px;
}

@media (max-width: 767px) {
  .dynamic-section-main .panel {
    height: auto;
  }
}

.dynamic-section {
  padding-bottom: 40px;
  background: #f7f7f7;
}

.index-group {
  padding-bottom: 3px;
}

.index-article .index-recommend-aricle {
  float: left;
  width: 35%;
  padding-left: 0;
  margin-bottom: 0;
}

@media (max-width: 1199px) {
  .index-article .index-recommend-aricle {
    width: 43%;
  }
}

@media (max-width: 991px) {
  .index-article .index-recommend-aricle {
    width: 28%;
  }
}

@media (max-width: 767px) {
  .index-article .index-recommend-aricle {
    width: 100%;
  }
}

.index-article .index-recommend-aricle li {
  position: relative;
  list-style-type: none;
  margin-bottom: 10px;
  overflow: hidden;
}

@media (max-width: 767px) {
  .index-article .index-recommend-aricle li {
    float: left;
    width: 50%;
  }
}

.index-article .index-recommend-aricle li.last {
  margin-bottom: 0;
}

.index-article .index-recommend-aricle li img {
  width: 100%;
  height: 106px;
}

@media (max-width: 991px) {
  .index-article .index-recommend-aricle li img {
    height: auto;
  }
}

.index-article .index-recommend-aricle .title {
  position: absolute;
  bottom: 5px;
  left: 10px;
  right: 10px;
  color: #fff;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.index-article .index-new-article {
  float: left;
  width: 100%;
  padding-left: 0;
  margin-bottom: 0;
}

.index-article .index-new-article.full {
  width: 100% !important;
  padding-left: 0;
}

@media (max-width: 1199px) {
  .index-article .index-new-article {
    /*width: 57%*/
  }
}

@media (max-width: 991px) {
  .index-article .index-new-article {
    /*width: 72%*/
  }
}

@media (max-width: 767px) {
  .index-article .index-new-article {
    width: 100%;
    padding-left: 0;
  }
}

.index-article .index-new-article .date {
  position: absolute;
  top: 0;
  right: 0;
  color: #c1c1c1;
}

.index-article .index-new-article li {
  position: relative;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  margin-bottom: 15px;
  padding-right: 80px;
}

@media (max-width: 767px) {
  .index-article .index-new-article li {
    margin-bottom: 20px;
  }
}

.index-article .index-new-article li.last {
  margin-bottom: 0;
}

/* 课程讲师 */
.recommend-teacher-new {
  position: relative;
}

/* 新年皮肤 */
.recommend-teacher-new::before {
  content: "";
  position: absolute;
  width: 410px;
  height: 349px;
  top: -265px;
  left: 0;
  background: url(/static-dist/app/img/shenlan2020/zhuangshi02_pic@2x.png) no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}

.recommend-teacher-new::after {
  content: "";
  position: absolute;
  width: 410px;
  height: 349px;
  bottom: 0px;
  right: 0;
  background: url(/static-dist/app/img/shenlan2020/zhuangshi03_pic@2x.png) no-repeat;
  background-size: 100% 100%;
  z-index: -1;
}

.recommend-teacher-new .title-bg {
  display: inline-block;
  height: 46px;
  width: 142px;
  background: url(/static-dist/app/img/shenlan2020/041jiaoyantuandui_pic@2x.png);
  background-size: 142px 46px;
}

.recommend-teacher-new h2 {
  text-align: center;
  max-width: 1080px;
  margin: 0 auto;
  position: relative;
}

.recommend-teacher-new h2 a {
  float: right;
  font-size: 14px;
  color: #6d6d6d;
  padding-top: 20px;
  position: absolute;
  right: 0;
}

.recommend-teacher-new .teacher-box {
  max-width: 1080px;
  margin: 30px auto 60px;
  /* display: grid;
    grid-template-columns: repeat(5,1fr);
    grid-gap: 20px; */
  display: flex;
  justify-content: space-between;
}

.recommend-teacher-new .techer-fivecolumn-item {
  background: rgb(173 250 255 / 20%);
  /* box-shadow: 2px 2px 20px 0 rgba(70,92,163,0.20); */
  border-radius: 6px;
  flex: 1;
  margin-right: 20px;
}

.recommend-teacher-new .techer-fivecolumn-item:nth-last-of-type(1) {
  margin-right: 0;
}

.techer-fivecolumn-item .teacher-itemlink {
  display: block;
  height: 338px;
  border-radius: 6px;
  position: relative;
  background: linear-gradient(#e8f9ff 0%, #f5fcff 100%);
}

.techer-fivecolumn-item .avatarimg {
  width: 100%;
  height: 100%;
  border-radius: 6px;
}

.techer-fivecolumn-item .teacher-info-box {
  background: url("/static-dist/app/img/shenlan2020/xingzhuang_pic@2x.png");
  background-size: 100% 100%;
  color: #fff;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 160px;
  padding: 36px 16px 29px;
}

.techer-fivecolumn-item .teacher-info-box .title {
  display: inline-block;
  position: relative;
  font-weight: bold;
  font-size: 20px;
  text-shadow: 0 2px 4px #3385ff;
  z-index: 2;
}

.techer-fivecolumn-item .teacher-info-box .title::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 10px;
  background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgb(24, 97, 206) 100%);
  border-radius: 6px;
  left: 0;
  bottom: -1px;
  z-index: -1;
}

.techer-fivecolumn-item .teacher-info-box .subtitle {
  font-size: 13px;
  padding: 5px 0 14px;
}

.techer-fivecolumn-item .teacher-info-box .description {
  font-size: 12px;
  color: #d5e5ff;
  text-align: justify;
  line-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* 师资团队 end */

.dynamic-section .container,
.recommend-teacher .container {
  padding: 0 20px;
  margin-top: 0px;
}

.recommend-teacher .text-line {
  padding: 36px 0 59px 0;
}

.recommend-teacher .text-line h5 {
  margin-top: 4px;
}

.es-friend-link {
  border-top: 1px solid #e1e8ed;
  background-color: #f5f8fa;
  padding: 20px 0;
}

@media (max-width: 767px) {
  .es-friend-link {
    padding: 10px 0;
  }
}

.es-friend-link .container {
  position: relative;
}

.es-friend-link .container .title {
  position: absolute;
  top: 2px;
  left: 0;
  color: #919191;
  font-size: 18px;
}

@media (max-width: 767px) {
  .es-friend-link .container .title {
    display: none;
  }
}

.es-friend-link .container ul {
  padding-left: 80px;
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .es-friend-link .container ul {
    padding-left: 0;
  }
}

.es-friend-link .container ul li {
  margin: 5px 30px;
  display: inline-block;
}

@media (max-width: 1199px) {
  .es-friend-link .container ul li {
    margin: 5px 15px;
  }
}

@media (max-width: 767px) {
  .es-friend-link .container ul li {
    margin: 5px;
  }
}

.feature-banner img {
  margin: 0 auto;
}

.aricle-carousel {
  overflow: hidden;
}

.aricle-carousel .swiper-container {
  border-radius: 4px;
}

.aricle-carousel .swiper-container,
.aricle-carousel .swiper-slide {
  position: relative;
  width: 100%;
  height: 100%;
}

.aricle-carousel .swiper-slide img {
  width: 100%;
  border-radius: 4px;
}

.aricle-carousel .swiper-slide .image-overlay {
  border-radius: 4px;
}

.aricle-carousel .swiper-cat {
  position: absolute;
  bottom: 80px;
  left: 20px;
  right: 20px;
  opacity: 0.7;
  filter: alpha(opacity=70);
  color: #fff;
  z-index: 1;
}

.aricle-carousel .swiper-caption {
  position: absolute;
  font-size: 24px;
  left: 20px;
  right: 20px;
  bottom: 40px;
  color: #fff;
  z-index: 1;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

@media (max-width: 1199px) {
  .aricle-carousel .swiper-caption {
    font-size: 20px;
  }
}

@media (max-width: 991px) {
  .aricle-carousel .swiper-caption {
    font-size: 18px;
  }
}

@media (max-width: 767px) {
  .aricle-carousel .swiper-caption {
    font-size: 16px;
    bottom: 10px;
  }
}

.aricle-carousel .swiper-pager {
  position: absolute;
  bottom: 10px;
  z-index: 100;
  width: 100%;
  text-align: center;
}

@media (max-width: 767px) {
  .aricle-carousel .swiper-pager {
    display: none;
  }
}

.aricle-carousel .swiper-pager span {
  font-size: 0;
  margin: 0 5px;
  width: 10px;
  height: 10px;
  display: inline-block;
  background: none;
  border: 1px solid #fff;
  border-radius: 50%;
}

.aricle-carousel .swiper-pager span.swiper-active-switch,
.aricle-carousel .swiper-pager span:hover {
  background: #fff;
  color: #46c37b;
  opacity: 1;
  filter: alpha(opacity=100);
}

.aricle-carousel .swiper-pager span:hover {
  cursor: pointer;
}

.topic-post-small {
  position: relative;
  border-collapse: collapse;
  display: block;
  color: #fff;
}

.topic-post-small+.topic-post-small {
  margin-top: 12px;
}

.topic-post-small:hover {
  color: #fff;
  transition: all 0.3s ease;
}

.topic-post-small:hover .image-overlay {
  transition: all 0.3s ease;
  opacity: 0.2;
  filter: alpha(opacity=20);
}

.topic-post-small img {
  border-radius: 4px;
}

.topic-post-small .content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 20px;
  z-index: 1;
}

.topic-post-small .content .title {
  margin: 0;
  line-height: 25px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.topic-post-small .content p {
  margin-bottom: 5px;
  font-size: 12px;
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.article-list .article-item {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f5f5f5;
}

@media (max-width: 767px) {
  .article-list .article-item .media-left {
    width: 100%;
    display: block;
    padding-right: 0;
    margin-bottom: 10px;
  }

  .article-list .article-item .media .thumb-img {
    width: 100%;
  }
}

.article-list .article-item .content {
  margin-top: 15px;
  color: #919191;
}

.article-list .media {
  color: #919191;
}

.article-list .media .media-body {
  padding-left: 10px;
  line-height: 25px;
}

.article-list .media .thumb-img {
  width: 260px;
  border-radius: 4px;
}

.article-list .pager {
  margin: 40px 0 20px;
}

.article-metas {
  overflow: hidden;
}

.article-metas .date {
  height: 45px;
  width: 45px;
  text-align: center;
  color: #919191;
  background-color: #f5f5f5;
  border-radius: 50%;
}

.article-metas .date .day {
  padding-top: 5px;
  font-size: 16px;
  line-height: 1.2;
}

.article-metas .date .month {
  font-size: 12px;
}

.article-metas .metas-body {
  padding-left: 60px;
}

.article-metas .metas-body p {
  margin-bottom: 0;
  font-size: 12px;
}

.article-metas .metas-body .title {
  margin: 0;
  line-height: 32px;
}

@media (max-width: 1199px) {
  .article-metas .metas-body .title {
    font-size: 20px;
    line-height: 30px;
  }
}

@media (max-width: 767px) {
  .article-metas .metas-body .title {
    font-size: 16px;
    line-height: 20px;
  }
}

.article-metas .metas-body .title a {
  color: #616161;
  transition: all 0.3s ease;
}

.article-metas .metas-body .title a:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.article-metas .metas-body .sns {
  color: #919191;
  margin: 10px auto;
}

.article-metas .metas-body .sns span {
  margin-right: 10px;
}

.article-metas .metas-body .sns span i {
  margin-right: 5px;
}

.article-text p {
  line-height: 30px;
  margin: 20px auto 30px;
}

@media (max-width: 767px) {
  .article-text p {
    margin: 10px auto 20px;
  }
}

.article-text img {
  margin: 10px auto;
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 4px;
}

.article-sns {
  margin: 30px auto 10px;
  font-size: 16px;
}

.article-sns .es-share>a,
.article-sns a.love {
  margin-right: 20px;
  color: #919191;
}

.article-sns .es-share>a:hover,
.article-sns a.love:hover {
  color: #46c37b;
}

.article-sns .es-share>a i,
.article-sns a.love i {
  margin-right: 5px;
  font-size: 22px;
}

.related-article {
  margin-top: 30px;
  padding: 15px 0;
  border-top: 1px solid #e1e1e1;
  border-bottom: 1px solid #e1e1e1;
}

.related-article .row {
  margin: 0 -5px;
}

.related-article .col-sm-4 {
  position: relative;
  display: block;
  padding: 0 5px;
  margin: 5px auto;
}

.related-article .related-item {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}

.related-article .related-item img {
  width: 100%;
}

.related-article .title {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px 20px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  color: #fff;
  z-index: 999;
}

.es-commet {
  margin: 30px auto;
}

.es-commet .badge {
  margin-left: 5px;
}

.es-commet textarea {
  margin: 20px auto;
}

.es-commet>.form-group {
  line-height: 38px;
}

.artcile-comments {
  padding-left: 0;
  border-top: 1px solid #f5f5f5;
}

.class-manage-page .container {
  width: 1170px !important;
}

/*系列课程*/

.class-list .class-item,
.recommend-class-list .class-item {
  background-color: #fff;
  margin: 46px auto 0;
  border-radius: 4px;
  box-shadow: 0 10px 20px 0 rgba(0, 24, 94, 0.1);
  position: relative;
  transition: 0.3s transform linear;
  margin-bottom: 46px !important;
  margin-top: 0;
}

.class-list .class-item .class-img,
.new-recommend-class-list .class-item .class-img-wrap {
  position: relative;
  transition: 0.3s transform linear;
}

.class-list .class-item .class-img:nth-of-type(1),
.new-recommend-class-list .class-item .class-img-wrap:nth-of-type(1) {
  position: absolute !important;
  top: -4px;
  opacity: 0.4;
  width: 97%;
  left: 50%;
  transform: translateX(-50%);
}

.class-list .class-item .class-img:nth-of-type(2),
.new-recommend-class-list .class-item .class-img-wrap:nth-of-type(2) {
  position: absolute !important;
  top: -8px;
  opacity: 0.2;
  width: 94%;
  left: 50%;
  transform: translateX(-50%);
}

.class-list .class-item:hover,
.new-recommend-class-list .class-item:hover {
  transform: translateY(12px);
}

.class-list .class-item:hover .class-img:nth-of-type(1),
.new-recommend-class-list .class-item:hover .class-img-wrap:nth-of-type(1) {
  transform: translate(-50%, -6px);
}

.class-list .class-item:hover .class-img:nth-of-type(2),
.new-recommend-class-list .class-item:hover .class-img-wrap:nth-of-type(2) {
  transform: translate(-50%, -12px);
}

.class-list .class-item h3,
.new-recommend-class-list .class-item h3 {
  font-size: 14px;
  color: #4a4a4a;
  line-height: 20px;
  display: block;
  word-wrap: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0 !important;
  text-align: left !important;
}

.class-list .class-item .class-info,
.new-recommend-class-list .class-item .class-info {
  padding: 14px 12px;
  transition: 0.3s transform linear;
}

.class-list .class-item .class-info .icon,
.new-recommend-class-list .class-item .class-info .icon {
  margin-top: 24px;
  font-size: 12px;
  color: #979797;
  line-height: 17px;
}

.class-list .class-item .class-info .icon .video-icon,
.class-list .class-item .class-info .icon .video,
.class-list .class-item .class-info .icon .number-icon,
.class-list .class-item .class-info .icon .number {
  float: left;
}

.class-list .class-item .class-info .icon .video-icon,
.new-recommend-class-list .class-item .class-info .icon .video-icon {
  width: 14px;
  height: 12px;
  margin-top: 3px;
  background: url("/static-dist/app/img/2018/1.0/series_courses/video_icon.png") no-repeat center center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/video_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/video_icon@2x.png") 2x);
  margin-right: 3px;
  float: left;
  z-index: 2;
}

.class-list .class-item .class-info .icon .number-icon,
.new-recommend-class-list .class-item .class-info .icon .number-icon {
  width: 9px;
  height: 10px;
  margin: 3px 3px 0 20px;
  background: url("/static-dist/app/img/2018/1.0/series_courses/number_icon.png") no-repeat center center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/number_icon@2x.png") 2x);
}

.class-list .class-item .class-info .icon .price,
.new-recommend-class-list .class-item .class-info .icon .price {
  font-size: 14px;
  color: #e83d2c;
  margin-top: -4px;
  float: right;
}

.class-list .class-item .class-info .icon .price {
  margin-top: 0;
}

.new-recommend-class-list .class-item .class-info .icon .video,
.new-recommend-class-list .class-item .class-info .icon .number-icon,
.new-recommend-class-list .class-item .class-info .icon .number {
  float: left;
}

.class-list .class-item .img-responsive {
  width: 100%;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.class-list .class-item .class-data {
  list-style-type: none;
  padding: 15px 0;
  margin-bottom: 0;
  background-color: #f5f5f5;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.class-list .class-item .class-data>li {
  float: left;
  width: 33.33%;
  text-align: center;
  color: #919191;
  line-height: 40px;
  border-right: 1px solid #e1e1e1;
}

.class-list .class-item .class-data>li:last-child {
  border: none;
}

.class-list .class-item .class-data>li>i {
  margin-right: 5px;
}

.class-list .class-item .class-serve {
  margin-bottom: 0;
  height: 70px;
}

.lt-ie9 .class-list .class-item {
  border: 1px solid #e1e1e1;
}

.class-bg-layer {
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  height: 100%;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  z-index: -1;
}

@media (max-width: 767px) {
  .class-bg-layer {
    top: 2px;
    left: 2px;
  }
}

.class-header .class-bg-layer {
  top: 8px;
}

.class-header {
  /*background-color: #F5F8FA;*/
}

.class-header .class-header-mian {
  position: relative;
  /*height: 265px;*/
  border: 1px solid #eeeeee;
  border-radius: 4px;
}

.class-header .class-header-bg {
  background-color: #fff;
  border-radius: 4px;
  /*box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1);*/
}

.class-header .class-header-bg .es-share {
  position: absolute !important;
  top: 30px;
  right: 20px;
}

.course-detail-section .content .es-share {
  position: absolute !important;
  top: 10px;
  right: 20px;
}

.new-classroom-course-detail .content .es-share {
  position: absolute !important;
  top: 10px;
  right: 30px;
}

.class-header .class-header-bg .es-icon-share,
.new-classroom-course-detail .content .es-icon-share,
.course-detail-section .content .es-icon-share {
  display: block;
  border: 1px solid #eeeeee;
  border-radius: 3px;
  background-color: #f5f8fa;
  font-size: 12px;
  width: 26px;
  height: 25px;
  line-height: 22px;
  text-align: center;
  color: #999 !important;
}

.new-course-detail .course-detail-section-responsive .js-unfavorite-btn,
.new-course-detail .course-detail-section-responsive .js-favorite-btn,
.new-course-detail .course-detail-section-responsive .es-share {
  display: block;
  border: 1px solid #eeeeee;
  border-radius: 3px;
  background-color: #f5f8fa;
  font-size: 12px;
  width: 26px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  color: #999 !important;
}

.new-course-detail .course-detail-section-responsive {
  /*margin: 0;*/
}

.new-course-detail .course-detail-section-responsive .es-share {
  margin-left: 10px;
}

.class-header .class-header-mian .graph,
.course-detail-bottom .graph {
  position: relative;
  height: 225px;
  width: 400px;
  margin: 20px;
  float: left;
  margin-right: 0;
  z-index: 2;
}

@media (min-width: 768px) {
  .course-detail-section .course-detail-bottom {
    width: 100%;
    height: 100%;
  }

  .class-header .class-img,
  .course-detail-bottom .graph .course-detail-img {
    float: left;
    height: 225px;
    width: 400px !important;
  }

  .open-course-list-section .course-item:hover {
    transition: all 0.3s ease;
    transform: scale(1.1);
    margin-top: -10px;
    z-index: 2;
  }
}

@media (max-width: 768px) {

  /*.class-header .class-header-mian .graph,
    .course-detail-bottom .graph {
        width: 100%;
        height: auto;
    }*/
  .class-header .class-img,
  .course-detail-bottom .graph .course-detail-img {
    width: 100% !important;
  }
}

.class-header .class-img:nth-of-type(1),
.new-classroom-course-detail .class-img:nth-of-type(1) {
  z-index: 1;
  position: absolute;
}

.class-header .class-img:nth-of-type(2),
.new-classroom-course-detail .class-img:nth-of-type(2) {
  position: absolute !important;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  height: 95%;
  opacity: 0.4;
  float: none;
}

.new-classroom-course-detail {
  border: 1px solid #eeeeee;
  border-radius: 4px;
}

@media (min-width: 768px) {

  .class-header .class-img img,
  .course-detail-bottom .graph .course-detail-img img {
    height: 100% !important;
    border-radius: 5px;
    width: 400px !important;
  }
}

@media (max-width: 768px) {

  .class-header .class-img img,
  .course-detail-bottom .graph .course-detail-img img {
    /*height: 100% !important;*/
    border-radius: 5px;
    /*width: 100% !important;*/
  }
}

.class-header .class-img:nth-of-type(3) {
  position: absolute !important;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  height: 91%;
  opacity: 0.2;
  float: none;
}

.class-header .class-img img {
  display: block;
  max-width: 100%;
  height: auto;
  width: 100%;
  border-top-left-radius: 4px;
}

.class-header .class-header-mian {
  height: auto !important;
}

/*@media (max-width: 992px) {
    .class-header .class-header-mian {
height: auto!important;
    }
}*/

@media (min-width: 767px) {
  .class-header .container {
    /*width: 740px!important;*/
    width: auto !important;
  }
}

/*@media (max-width:1199px) {
    .class-header.after .class-info {
width: 340px
    }

}*/

@media (min-width: 992px) {
  .class-header .container {
    width: 1100px !important;
  }

  .class-header.after .class-info {
    /*width: 100%!important;*/
  }
}

@media (min-width: 768px) {
  .class-header .class-img img {
    border-bottom-left-radius: 4px;
  }
}

@media (max-width: 767px) {
  .class-header .class-img img {
    border-top-right-radius: 4px;
  }
}

.class-header-bg .text,
.course-detail-bottom .text {
  font-size: 0;
  margin-top: 20px;
  padding-bottom: 14px;
  /*background-color: #fafafa;*/
  background-color: red;
  width: 659px;
  line-height: 14px;
}

.class-header-bg .text {
  /*margin-left: -8px;
    padding-left: 8px;
    width: 646px;*/
}

.course-detail-bottom .text {
  height: 98px;
  width: 659px;
  margin-left: -30px;
  padding-left: 35px;
}

@media (min-width: 768px) {
  .course-detail-section {
    width: 1080px !important;
  }
}

.class-header-bg .text li,
.course-detail-bottom .text li {
  margin-top: 14px;
  padding-left: 14px;
}

.class-header-bg .text .service .serve-frame,
.course-detail-bottom .text .service .serve-frame,
.course-detail-bottom .text .satisfaction .score-frame {
  font-size: 12px;
  padding-left: 14px;
  color: #999999;
  float: left;
  margin-left: 69px;
  margin-top: 15px;
  background: url("/static-dist/app/img/2018/1.0/series_courses/service_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/service_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/service_icon@2x.png") 2x);
}

.course-detail-bottom .text .satisfaction .score-frame {
  background: url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon@2x.png") 2x);
}

.course-detail-bottom .text .satisfaction .serve-frame {
  margin-right: 20px;
}

.course-detail-bottom .text .satisfaction .score-frame {
  margin-right: 20px;
  margin-top: 10px;
}

.course-detail-bottom .text .service li {
  padding-left: 0;
}

.class-header-bg .text .service ul,
.course-detail-bottom .text .service ul {
  float: left;
  margin-left: 15px;
}

.new-classroom-course-detail .service ul {
  float: left;
}

.course-detail-bottom .text .service span {
  display: inline-block;
  margin-top: 13px;
}

.class-header-bg .text .join-service ul {
  float: left;
  margin-left: -6px !important;
}

.class-header-bg .text .service li {
  padding-left: 0;
  margin-top: 12px !important;
}

.class-header-bg .text .join-service li {
  margin-top: -3px !important;
}

.class-header-bg .text .service>ul {
  /*padding: 25px 10px 25px 40px*/
}

.class-header-bg .key,
.course-detail-bottom .key {
  font-size: 12px;
  width: 112px;
  color: #999999;
  float: left;
  padding-left: 33px;
}

.class-header-bg .key {
  width: 126px;
}

.course-detail-bottom .key {
  width: 93px;
}

.course-detail-bottom .key {
  padding-left: 0;
}

.class-header-bg .key li:nth-child(1),
.course-detail-bottom .key li:nth-child(1) {
  background: url("/static-dist/app/img/2018/1.0/public_class/validity_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/validity_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/validity_icon@2x.png") 2x);
}

.class-header-bg .key li:nth-child(2),
.course-detail-bottom .key li:nth-child(2) {
  background: url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/number_icon@2x.png") 2x);
}

.class-header-bg .key li:nth-child(3),
.course-detail-bottom .key li:nth-child(3) {
  background: url("/static-dist/app/img/2018/1.0/series_courses/courses_number_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/courses_number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/courses_number_icon@2x.png") 2x);
}

.class-header-bg .joined-text li:nth-child(1) {
  background: url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/number_icon@2x.png") 2x);
}

.class-header-bg .joined-text li:nth-child(2) {
  background: url("/static-dist/app/img/2018/1.0/public_class/kechengmanyidu_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/kechengmanyidu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/kechengmanyidu_icon@2x.png") 2x);
}

.class-header-bg .joined-text li:nth-child(3) {
  background: url("/static-dist/app/img/2018/1.0/public_class/service_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/service_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/service_icon@2x.png") 2x);
}

.class-header-bg .value,
.course-detail-bottom .value {
  font-size: 12px;
  float: left;
  color: #3f4a54;
}

.course-detail-bottom .value .mhs {
  margin-left: 0 !important;
}

.class-header-bg .price-key,
.course-detail-bottom .price-key {
  width: 92px;
  float: left;
  font-size: 12px;
  color: #999999;
  margin-top: 46px;
  line-height: 14px;
  margin-left: 32px;
}

.course-detail-bottom .price-key {
  margin-left: 0;
}

.class-header-bg .price-value,
.course-detail-bottom .price-value {
  float: left;
  font-size: 24px;
  color: #ff6000;
  margin-top: 36px;
  line-height: 28px;
}

.class-header-bg .price-value span,
.course-detail-bottom .price-value span {
  font-size: 14px !important;
  color: #ff6000 !important;
}

.class-header-bg .price button,
.course-detail-bottom .price button {
  font-size: 14px;
  color: #ffffff;
  background-color: #005bac;
  border-radius: 4px;
  float: right;
  width: 128px;
  height: 40px;
  margin-top: 30px;
  margin-right: 20px;
}

.class-header .class-info,
.course-detail-bottom .class-info {
  float: left;
  position: relative;
}

.class-header .class-info>.title {
  margin-top: 15px;
  font-size: 24px;
  color: #424242;
}

.course-detail-bottom .course-detail-gray .title {
  padding-top: 10px;
}

.class-header .class-info .title .title-text,
.course-detail-gray .title-text {
  max-width: 455px;
  float: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.course-detail-gray h2 .title-text {
  color: #424242 !important;
}

.course-detail-info a {
  color: #005bac;
}

.course-detail-info .buy-btn-group a {
  color: #fff;
}

.course-detail-bottom .satisfaction {
  float: left;
  width: 70%;
}

.course-detail-bottom .satisfaction .score {
  float: none !important;
}

.course-detail-bottom .satisfaction .score i {
  display: inline-block;
  margin-top: 10px;
}

.course-detail-bottom .satisfaction .class-serve {
  float: none;
  width: 100%;
}

@media (max-width: 1199px) {
  .class-header .class-info>.title {
    font-size: 20px;
  }
}

.class-header .class-info>.metas {
  min-height: 40px;
  margin-bottom: 20px;
  color: #919191;
}

@media (max-width: 1199px) {
  .class-header .class-info>.metas {
    min-height: 30px;
    margin-bottom: 8px;
  }
}

@media (max-width: 991px) {
  .class-header .class-info>.metas {
    margin-bottom: 10px;
  }
}

.class-header .class-info .price span {
  font-size: 24px;
  color: #313131;
}

@media (max-width: 1199px) {
  .class-header .class-info .price span {
    font-size: 20px;
  }
}

.class-header .class-serve {
  position: relative;
  height: 70px;
  border: 1px dashed #f5f5f5;
}

/*.class-header .class-serve .serve-frame {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 30px;
padding: 5px;
font-size: 12px;
line-height: 15px;
text-align: center;
background-color: #f5f5f5
}

.class-header .class-serve>ul {
padding: 25px 10px 25px 40px
}*/

.class-header .class-data {
  list-style-type: none;
  padding: 11px 0;
  margin-bottom: 0;
  /*background-color: #fafafa*/
}

.class-header .class-data>li {
  float: left;
  margin: 10px 0;
  color: #919191;
  text-align: center;
  line-height: 30px;
  border-left: 1px solid #f5f5f5;
}

@media (max-width: 1199px) {
  .class-header .class-data>li {
    padding: 8px 0;
    line-height: 25px;
    padding: 5px 0;
    line-height: 20px;
  }
}

.class-header .class-data>li:first-child {
  border: none;
}

.class-header .class-data>li p {
  margin-bottom: 0;
}

.class-header .class-data>li i {
  font-size: 26px;
}

.class-header .class-data>li .dropdown-toggle {
  color: #919191;
}

.class-header .setting {
  position: absolute;
  top: 30px;
  right: 50px;
  padding: 0 3px;
  border: 1px solid #eeeeee;
  border-radius: 3px;
  background-color: #f5f8fa;
  font-size: 12px;
  width: 26px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  color: #999 !important;
}

.class-header .setting+.setting {
  right: 35px;
}

.class-header.before .class-img {
  position: relative;
  width: 50%;
}

@media (max-width: 991px) {
  .class-header.before .class-img {
    width: 40%;
  }
}

@media (max-width: 767px) {
  .class-header.before .class-img {
    width: 100%;
  }
}

.class-header.before .class-img .label {
  position: absolute;
  top: 5px;
  left: 5px;
}

.class-header.before .class-info {
  width: 658px;
  /*margin-left: 32px;*/
}

@media (max-width: 991px) {
  .class-header.before .class-info {
    width: 60%;
  }
}

@media (max-width: 767px) {
  .class-header.before .class-info {
    width: 100%;
  }
}

.class-header.before .class-info>.title {
  margin: 30px 0 0 32px;
}

@media (max-width: 1199px) {
  .class-header.before .class-info>.title {
    margin: 20px 20px 15px;
  }
}

.class-header.before .class-info>.metas {
  min-height: 60px;
  padding-left: 20px;
}

@media (max-width: 1199px) {
  .class-header.before .class-info>.metas {
    min-height: 50px;
    padding-left: 20px;
  }
}

.class-header.before .bottom-metas {
  padding: 20px;
}

@media (max-width: 1199px) {
  .class-header.before .bottom-metas {
    padding: 10px;
  }
}

@media (max-width: 991px) {
  .class-header.before .bottom-metas {
    padding: 0 10px;
  }
}

.class-header.before .bottom-metas .btn-buy {
  float: right;
  width: 50%;
  line-height: 70px;
  text-align: right;
}

@media (max-width: 991px) {
  .class-header.before .bottom-metas .btn-buy {
    width: 100%;
    height: 60px;
    line-height: 60px;
  }
}

.class-header.before .bottom-metas .btn-buy .btn-link {
  color: #919191;
}

.class-header.before .bottom-metas .btn-buy .btn-link:hover {
  text-decoration: none;
}

.class-header.before .bottom-metas .btn-buy .btn-lg {
  padding: 13px 40px;
  font-size: 14px;
}

@media (max-width: 1199px) {
  .class-header.before .bottom-metas .btn-buy .btn-lg {
    padding: 10px 25px;
  }
}

.class-header.before .class-serve,
.course-detail-bottom .class-serve {
  float: left;
  /*width: 50%*/
}

@media (max-width: 767px) {
  .class-header.before .class-serve {
    width: 100%;
  }
}

.class-header.before .class-data>li {
  width: 33.33%;
}

.class-header.before .class-data.active>li {
  width: 25%;
}

.class-header.after .class-img {
  width: 300px;
}

@media (max-width: 991px) {
  .class-header.after .class-img {
    width: 240px;
  }

  .class-header .class-info {
    margin: 5px 0 0 8px;
  }
}

.new-classroom-course-detail.new-course-detail .buy-btn-group {
  width: 70%;
  position: absolute;
  right: 10px;
  bottom: 0;
}

@media (max-width: 767px) {
  .class-header.after .class-img {
    width: 100%;
  }

  .class-header.after .class-img:nth-of-type(1),
  .new-classroom-course-detail.new-course-detail .class-img:nth-of-type(1) {
    height: 100%;
  }

  .class-header.after .class-info {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .class-header.after .class-info {
    width: 55%;
    padding: 0 20px;
    position: relative;
  }
}

@media (max-width: 470px) {

  .class-header .class-info>.title,
  .class-header.after .class-info {
    margin-top: 0 !important;
  }

  .class-header .graph {
    margin-bottom: 0 !important;
  }

  .class-header .class-img:nth-of-type(1) img {
    /*width: 70%!important;*/
  }

  .class-header .class-img:nth-of-type(2) img {
    /*width: 70%!important;*/
  }

  .class-header .class-img:nth-of-type(3) img {
    /*width: 70%!important;*/
  }
}

@media (max-width: 320px) {
  .class-header .graph {
    margin-left: 5px !important;
  }

  .class-header .class-img:nth-of-type(1) img {
    /*width: 70%!important;*/
  }

  .class-header .class-img:nth-of-type(2) img {
    /*width: 70%!important;*/
  }

  .class-header .class-img:nth-of-type(3) img {
    /*width: 70%!important;*/
  }
}

/*@media (max-width:767px) {
    .class-header.after .class-info {
width: 100%
    }

}*/

.class-header.after .class-info .price span {
  font-size: 16px;
}

.class-header.after .class-operation {
  float: left;
  width: 430px;
  background-color: #f5f5f5;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

@media (max-width: 1199px) {
  .class-header.after .class-operation {
    width: 300px;
  }
}

@media (max-width: 991px) {
  .class-header.after .class-operation {
    width: 140px;
  }
}

@media (max-width: 767px) {
  .class-header.after .class-operation {
    width: 100%;
  }
}

.class-header.after .class-serve {
  display: inline-block;
}

.class-header.after .class-data {
  border-top-right-radius: 4px;
  margin-bottom: 0;
}

@media (max-width: 1199px) {
  .class-header.after .class-data {
    padding: 19px 0;
  }
}

@media (max-width: 991px) {
  .class-header.after .class-data {
    padding: 0;
  }
}

@media (max-width: 767px) {
  .class-header.after .class-data {
    border-bootom-left-radius: 4px;
    border-bootom-right-radius: 4px;
  }
}

.class-header.after .class-data>li {
  width: 33.33%;
  /*padding: 48px 0*/
}

@media (max-width: 991px) and (min-width: 768px) {
  .class-header.after .class-data>li {
    width: 100%;
    border: none;
    padding: 0;
    margin: 4px 0;
  }
}

@media (max-width: 767px) {
  .class-header.after .class-data>li {
    padding: 10px 0;
  }
}

.class-header.after .class-data>li>a {
  display: block;
  color: #919191;
  transition: all 0.3s ease;
}

.class-header.after .class-data>li>a:hover {
  transition: all 0.3s ease;
}

.class-header.after .class-data.two-col>li {
  width: 50%;
}

@media (max-width: 991px) and (min-width: 768px) {
  .class-header.after .class-data.two-col>li {
    width: 100%;
    margin: 17px 0;
  }
}

.class-header.after.auditor .class-data {
  padding: 0;
  border-bottom: 1px solid #f5f5f5;
}

@media (max-width: 1199px) {
  .class-header.after.auditor .class-data {
    padding: 10px 0;
  }
}

@media (max-width: 991px) {
  .class-header.after.auditor .class-data {
    padding: 0;
  }
}

.class-header.after.auditor .class-data>li {
  padding: 10px 0;
}

@media (max-width: 991px) {
  .class-header.after.auditor .class-data>li {
    padding: 0;
  }
}

@media (max-width: 767px) {
  .class-header.after.auditor .class-data>li {
    padding: 20px 0;
  }
}

.class-header.after.auditor .class-auditor {
  padding: 18px 40px;
  line-height: 30px;
  color: #919191;
  background-color: #fafafa;
}

@media (max-width: 1199px) {
  .class-header.after.auditor .class-auditor {
    padding: 18px 20px;
  }
}

@media (max-width: 991px) {
  .class-header.after.auditor .class-auditor {
    padding: 10px 0 0;
  }
}

@media (max-width: 767px) {
  .class-header.after.auditor .class-auditor {
    padding: 10px 20px;
  }
}

.class-course-list .course-item {
  margin-top: 30px;
  background-color: #fff;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
}

.class-course-list .course-item .media {
  position: relative;
  background-color: #f5f5f5;
  padding: 20px;
}

.class-course-list .course-item .media .media-left {
  padding-right: 35px;
}

.class-course-list .course-item .media .media-left img {
  width: 160px;
  height: auto;
  border-radius: 4px;
}

.class-course-list .course-item .media .duration {
  font-size: 12px;
  color: #999999;
}

@media (max-width: 767px) {
  .class-course-list .course-item .media .media-left {
    display: block;
    padding-right: 0;
  }

  .class-course-list .course-item .media .media-left img {
    width: 100%;
  }
}

.class-course-list .course-item .media .title {
  margin-bottom: 13px;
  line-height: 14px;
}

@media (min-width: 767px) {
  .class-course-list .course-item .media .title {
    margin-right: 210px;
  }
}

.class-course-list .course-item .media .title>a {
  color: #313131;
  font-size: 14px;
}

.class-course-list .course-item .media .price {
  position: absolute;
  top: 52px !important;
  right: 90px;
}

.class-course-list .course-item .media .price span {
  font-size: 24px;
  color: #313131;
}

@media (max-width: 1199px) {
  .class-course-list .course-item .media .price {
    right: 60px;
  }

  .class-course-list .course-item .media .price span {
    font-size: 20px;
  }
}

.class-course-list .course-item .media .course-show {
  position: absolute;
  top: 50px;
  right: 40px;
  transition: all 0.3s ease;
}

@media (max-width: 1199px) {
  .class-course-list .course-item .media .course-show {
    right: 20px;
  }
}

@media (max-width: 767px) {
  .class-course-list .course-item .media .course-show {
    top: auto;
    bottom: 30px;
  }
}

.class-course-list .course-item .media .course-show i {
  font-size: 24px;
  color: #bababa;
}

.class-course-list .course-item .media .course-show:hover {
  cursor: pointer;
  transition: all 0.3s ease;
}

.period-list {
  margin-top: 20px;
  margin-bottom: 0;
  padding-left: 0;
  list-style-type: none;
}

.period-list>li {
  margin-bottom: 10px;
  padding: 10px 15px;
}

.period-list .chapter,
.period-list .section {
  background-color: #f5f5f5;
  color: #919191;
}

.period-list .chapter {
  position: relative;
}

.period-list .chapter:hover {
  cursor: pointer;
}

.period-list .chapter .es-icon-toc {
  position: absolute;
  top: 11px;
  left: 15px;
}

.period-list .chapter .period-show {
  position: absolute;
  top: 8px;
  right: 15px;
}

.period-list .chapter .title {
  padding: 0 30px;
}

.period-list .chapter .title,
.period-list .section {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.period-list .section {
  padding-left: 45px;
}

.period-list .period {
  position: relative;
  padding: 10px 100px 10px 45px;
}

.period-list .period.item-active,
.period-list .period:hover {
  background-color: #f2fae3;
}

.period-list .period.disable {
  background: none;
}

.period-list .period>a {
  color: #919191;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.period-list .period .es-icon-doing,
.period-list .period .es-icon-done1,
.period-list .period .es-icon-undone {
  position: absolute;
  top: 11px;
  left: 15px;
}

.period-list .period .title {
  color: #616161;
}

.period-list .period .date {
  position: absolute;
  top: 11px;
  right: 50px;
}

.period-list .period .course-type {
  position: absolute;
  top: 11px;
  right: 15px;
  line-height: 20px;
}

.period-list .period .course-type i {
  font-size: 20px;
}

.period-list .period .course-type small {
  margin-top: -3px;
}

.period-list .period .period-state {
  position: absolute;
  top: 10px;
  right: 15px;
  color: #919191;
}

.class-detail-content {
  min-height: 300px;
}

.class-detail-content .class-about p {
  line-height: 30px;
  margin-bottom: 30px;
}

.class-detail-content .class-about img {
  max-width: 100%;
  height: auto;
}

.topic-detail .topic-header {
  position: relative;
  margin-bottom: 30px;
}

.topic-detail .topic-header .media-body {
  padding-right: 100px;
}

.topic-detail .topic-header .title {
  font-size: 16px;
  margin-bottom: 10px;
}

.topic-detail .topic-header .title>a {
  color: #616161;
  transition: all 0.3s ease;
}

.topic-detail .topic-header .title>a:hover {
  transition: all 0.3s ease;
}

.topic-detail .topic-header .metas {
  color: #919191;
}

.topic-detail .topic-header .metas>a {
  color: #616161;
  margin-right: 5px;
  transition: all 0.3s ease;
}

.topic-detail .topic-header .metas>a:hover {
  transition: all 0.3s ease;
}

.topic-detail .topic-header .metas span {
  margin-left: 5px;
}

.topic-detail .topic-header .media-data {
  position: absolute;
  top: 10px;
  right: 0;
  text-align: center;
  color: #919191;
}

.topic-detail .topic-header .media-data span {
  padding: 0 10px;
  display: inline-block;
}

.topic-detail .topic-header .media-data span+span {
  border-left: 1px solid #e1e1e1;
}

.topic-detail .topic-body {
  position: relative;
  background-color: #f5f5f5;
  padding: 15px;
  margin-bottom: 30px;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
}

.topic-detail .topic-body .media-left {
  padding-right: 30px;
}

@media (max-width: 1199px) {
  .topic-detail .topic-body .media-left {
    padding-right: 20px;
  }
}

@media (max-width: 767px) {
  .topic-detail .topic-body .media-left {
    display: block;
    padding-right: 0;
    margin-bottom: 20px;
  }
}

.topic-detail .topic-body .media-left img {
  width: 200px;
  height: auto;
}

@media (max-width: 767px) {
  .topic-detail .topic-body .media-left img {
    width: 100%;
  }
}

.topic-detail .topic-body .media-body {
  padding-right: 180px;
}

@media (max-width: 767px) {
  .topic-detail .topic-body .media-body {
    padding-right: 0;
  }
}

.topic-detail .topic-body .media-body p {
  color: #919191;
  margin-bottom: 18px;
  text-indent: 0;
}

@media (max-width: 1199px) {
  .topic-detail .topic-body .media-body p {
    margin-bottom: 10px;
  }
}

.topic-detail .topic-body .metas {
  position: absolute;
  top: 50%;
  margin-top: -20px;
  right: 20px;
}

@media (max-width: 1199px) {
  .topic-detail .topic-body .metas {
    right: 10px;
  }
}

@media (max-width: 767px) {
  .topic-detail .topic-body .metas {
    position: relative;
    margin-top: 10px;
  }
}

.topic-detail .topic-body .metas .btn {
  margin-left: 10px;
}

.topic-detail .topic-num .num-list {
  height: 50px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.topic-detail .topic-num .num-list a {
  display: inline-block;
  margin: 5px 3px;
}

.topic-detail .topic-num .num-list.active {
  height: 100%;
  transition: all 0.3s ease;
}

.topic-detail .topic-num .num-more {
  padding-top: 20px;
  text-align: center;
}

.topic-detail .topic-num .num-more i {
  font-size: 24px;
  color: #616161;
  transition: all 0.3s ease;
}

.topic-detail .topic-num .num-more i:hover {
  cursor: pointer;
  transition: all 0.3s ease;
}

.topic-detail .topic-action {
  padding-bottom: 20px;
  border-bottom: 1px solid #f5f5f5;
  text-align: right;
}

.topic-detail .topic-action a {
  margin: 0 10px;
}

@media (max-width: 767px) {
  .topic-detail .topic-action a {
    margin: 0;
  }
}

.topic-detail .topic-action i {
  margin-right: 5px;
}

.comment-list {
  list-style-type: none;
  padding-left: 0;
}

.class-signin {
  position: relative;
  padding: 0;
  color: #919191;
}

.class-signin .panel-body {
  padding: 23px 15px 23px 11px;
}

.class-signin i {
  font-size: 24px;
  margin: 0 2px 0 0;
}

.class-signin .date {
  font-size: 22px;
}

.class-signin .btn-signin {
  position: absolute;
  padding: 20px 10px;
  min-width: 110px;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  top: 0;
  bottom: 0;
  right: 0;
  color: #fff;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.class-signin .btn-signin.after {
  line-height: 20px;
}

.lesson-question-plugin-pane-header {
  background: #f5f5f5;
  border-bottom: 1px solid #e9e9e9;
  padding: 10px;
  position: relative;
}

.lesson-question-plugin-pane-header .back-to-list {
  float: left;
}

.lesson-question-plugin-pane-header h4 {
  margin: 0;
  padding: 0 70px;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  line-height: 34px;
}

.lesson-question-plugin-pane-header h4 i {
  font-weight: 400;
  color: #777;
  font-size: 14px;
}

.lesson-question-plugin-pane-thread {
  padding: 10px;
  margin-bottom: 20px;
}

.lesson-question-plugin-pane-thread h5 {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 700;
}

.lesson-question-plugin-pane-posts .posts-header {
  margin: 10px;
  border-top: 1px solid #ddd;
  position: relative;
  height: 20px;
}

.lesson-question-plugin-pane-posts .posts-header h5 {
  position: absolute;
  top: -18px;
  left: 10px;
  background: #fff;
  padding: 0 5px;
  font-size: 14px;
  font-weight: 700;
}

.lesson-question-plugin-pane .posts {
  list-style: none;
  margin: 10px;
  padding: 0;
}

.lesson-question-plugin-pane .post-item {
  margin-bottom: 20px;
}

.lesson-question-plugin-pane .post-item-heading {
  border-bottom: 1px solid #e3e3e3;
  padding-bottom: 5px;
  margin-bottom: 5px;
}

.lesson-question-plugin-pane .post-item-heading .avatar {
  float: left;
  width: 32px;
  height: 32px;
}

.lesson-question-plugin-pane .post-item-heading .infos {
  margin-left: 42px;
}

.lesson-question-plugin-pane .post-item-heading .infos .time {
  font-size: 12px;
  color: #999;
}

.lesson-question-plugin-pane .post-item-heading .infos .teacher-flag {
  background: #5cb85c;
  font-size: 12px;
  color: #fff;
  float: right;
  padding: 1px 5px;
  border-radius: 2px;
}

.lesson-question-plugin-pane .post-item-body {
  color: #444;
}

.lesson-question-plugin-pane .post-form {
  margin: 10px;
}

.toolbar-pane-list {
  font-size: 13px;
}

.toolbar-pane-list .list-item-body {
  padding-left: 10px;
  padding-right: 10px;
}

.toolbar-pane-list .meta,
.toolbar-pane-list .summary {
  color: #999;
  font-size: 12px;
}

.homework-pane,
.material-pane {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  overflow: hidden;
}

.homework-pane h5,
.material-pane h5 {
  font-weight: 700;
  font-size: 13px;
  color: #999;
  margin: 10px;
}

.homework-pane .lesson-about,
.material-pane .lesson-about {
  color: #999;
  font-size: 12px;
  margin: 10px;
  margin-bottom: 30px;
}

.course-item-list-in-toolbar-pane {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  overflow-y: hidden;
  overflow-x: hidden;
}

.ppt-dashboard {
  width: 100%;
  position: fixed;
  top: 56px;
  bottom: 0;
  left: 0;
  right: 0;
  background: #e5e5e5;
}

.slide-player {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.slide-player-full-window {
  padding: 0;
  margin: 0;
  height: 100%;
}

.slide-player-fullscreen {
  position: fixed;
  overflow: hidden;
  z-index: 1000;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.modal-body .lesson-preview-ppt {
  position: relative;
  min-height: 500px;
}

.loading-background {
  background: #fff url("/static-dist/app/img/old/loader.gif") no-repeat 50%;
}

.slide-player-watermark {
  bottom: 50px;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

.slide-player-control,
.slide-player-watermark {
  position: absolute;
  width: 100%;
  text-align: center;
  padding: 10px;
}

.slide-player-control {
  bottom: 0;
  font-size: 20px;
  background: #fff;
  border-top: 1px solid #e2e2e2;
}

.slide-player-control a {
  color: #666;
}

.slide-player-control a:hover {
  color: #333;
}

.slide-player-control .fullscreen {
  float: right;
  margin-left: 15px;
}

.slide-player-control .goto-first {
  margin-left: 100px;
}

@media (max-width: 480px) {
  .slide-player-control .goto-first {
    margin-left: 0;
  }
}

.slide-player-control .goto-page {
  width: 50px;
  display: inline-block;
}

@media (max-width: 480px) {
  .slide-player-control .goto-page {
    width: 35px;
    padding: 0 5px;
  }
}

.slide-player-control .goto-page-input {
  float: right;
  font-size: 16px;
}

.slide-player-control .glyphicon {
  padding-left: 10px;
  padding-right: 10px;
}

@media (max-width: 480px) {
  .slide-player-control .glyphicon {
    padding-left: 0;
    padding-right: 5px;
  }
}

.slide-player-body {
  position: absolute;
  text-align: center;
  width: 100%;
  top: 0;
  bottom: 50px;
}

.slide-player-body .slide {
  display: none;
  position: relative;
  max-height: 100%;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
}

.slide-player-body .slide.active {
  display: inline-block;
}

.slide-notice {
  display: none;
  border-bottom: 1px solid #e5e5e5;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  outline: 0;
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
  z-index: 1000;
  text-align: center;
  margin: 100px auto;
  position: relative;
  width: 300px;
}

.slide-notice .header {
  padding: 15px;
  min-height: 16px;
}

.course-filter.search-filter {
  padding-right: 0;
}

.course-filter.search-filter .nav-pills {
  float: right;
}

.course-filter.search-filter .nav-pills>li {
  margin: 0 0 10px 20px;
}

.course-filter.search-filter .result-declare {
  position: absolute;
  top: 0;
  left: 0;
  line-height: 48px;
}

.course-filter.search-filter .result-declare span {
  color: red;
  padding: 0 10px;
}

.course-filter.search-filter .btn-group>.btn-primary {
  float: right;
}

.course-filter.search-filter .btn-group>.dropdown-menu {
  left: inherit;
  right: 0;
}

.course-filter.search-filter .btn-group>.dropdown-menu>li>a {
  text-align: center;
}

.cloud-search-box {
  position: absolute;
  padding-left: 90px;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}

.search-banner {
  background: url("/static-dist/app/img/banner_search.jpg") top no-repeat;
  height: 200px;
}

.search-banner .search-input-group {
  margin: 75px 20%;
  height: 50px;
}

@media (max-width: 991px) {
  .search-banner .search-input-group {
    margin-left: 0;
    margin-right: 0;
  }
}

.search-banner .search-input-group .form-control {
  height: 50px;
  border: none;
  padding-right: 50px;
  font-size: 16px;
  color: #000;
  border-top-left-radius: 4px !important;
  border-bottom-left-radius: 4px !important;
}

.search-banner .search-input-group .input-wrap {
  position: relative;
}

.search-banner .search-input-group .es-icon {
  display: none;
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 20px;
  z-index: 3;
  color: #e1e1e1;
  transition: all 0.3s ease;
}

.search-banner .search-input-group .es-icon:hover {
  cursor: pointer;
  color: #c1c1c1;
  transition: all 0.3s ease;
}

.search-banner .search-input-group .btn {
  height: 50px;
  width: 120px;
  border: none;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

@media (max-width: 991px) {
  .search-banner .search-input-group .btn {
    width: 80px;
  }
}

.search-banner .search-input-group .btn:hover {
  z-index: 1;
}

.search-course-list {
  margin-top: -25px;
}

.search-course-list .course-item {
  padding: 25px 0;
  border-bottom: 1px solid #f5f5f5;
}

.search-course-list .course-item .course-img {
  position: relative;
  float: left;
  width: 35%;
}

@media (max-width: 767px) {
  .search-course-list .course-item .course-img {
    width: 100%;
    float: none;
  }
}

.search-course-list .course-item .course-img .tags-left {
  position: absolute;
  left: 0;
  top: 0;
}

.search-course-list .course-item .course-img .tags-left .tag-live {
  display: inline-block;
  width: 40px;
  height: 50px;
  background: url("/static-dist/app/img/tag_live.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_live.png") 1x,
      url("/static-dist/app/img/tag_live@2x.png") 2x);
}

.search-course-list .course-item .course-img .tags-right {
  position: absolute;
  right: 0;
  top: 0;
}

.search-course-list .course-item .course-img .tags-right .tag-public {
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("/static-dist/app/img/tag_public.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_public.png") 1x,
      url("/static-dist/app/img/tag_public@2x.png") 2x);
}

.search-course-list .course-item .course-info {
  float: left;
  width: 65%;
  padding-left: 15px;
}

@media (max-width: 767px) {
  .search-course-list .course-item .course-info {
    width: 100%;
    float: none;
    padding-left: 0;
    margin-top: 10px;
  }
}

.search-course-list .course-item .content {
  color: #313131;
}

.search-course-list .course-item .title {
  margin-top: 0;
}

.search-course-list .course-item .title>a {
  color: #313131;
  transition: all 0.3s ease;
}

.search-course-list .course-item .title>a:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.search-course-list .course-item .ul-lesson {
  margin-top: 10px;
  padding: 0;
}

.search-course-list .course-item .ul-lesson li {
  font-size: 12px;
  list-style-type: none;
  margin-bottom: 10px;
}

.search-course-list .course-item .ul-lesson li i {
  font-size: 12px;
}

.search-result em {
  color: #e83d2c;
  font-style: inherit;
}

.search-result .loading {
  padding: 50px;
  margin: 0 auto;
  text-align: center;
}

.search-result .loading>i {
  font-size: 40px;
}

.teacher-item {
  position: relative;
  margin-bottom: 50px;
  text-align: center;
  z-index: 1;
  border-radius: 4px;
  /* border: 1px solid #e4ecf3; */
  margin-top: 43px;
  box-shadow: 0 5px 10px 0 rgba(73, 130, 186, 0.05);
  -webkit-box-shadow: 0 5px 10px 0 rgba(73, 130, 186, 0.05);
  -moz-box-shadow: 0 5px 10px 0 rgba(73, 130, 186, 0.05);
}

/* .recommend-teacher .row {
    margin-top: -64px;
} */

@media (max-width: 767px) {
  .teacher-item {
    margin-left: -5px;
    margin-right: -5px;
  }
}

/*@media (min-width:992px) {*/

.teacher-item,
.teacher-item:hover {
  transition: all 0.3s ease;
}

.teacher-item:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
}

/*}*/

.teacher-item .metas {
  width: 90%;
  margin-left: -5px;
}

.teacher-item:hover .metas {
  opacity: 1;
  filter: alpha(opacity=100);
  transition: all 0.3s ease;
}

.teacher-item:hover .about {
  opacity: 0;
  filter: alpha(opacity=0);
  transition: all 0.3s ease;
}

.teacher-item .teacher-top {
  position: relative;
  z-index: 1;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  background-color: #f5f8fa;
  padding: 20px 10px;
}

@media (max-width: 767px) {
  .teacher-item .teacher-top {
    padding: 10px;
  }
}

.teacher-item .avatar-lg {
  border: 4px solid #fff;
}

@media (max-width: 767px) {
  .teacher-item .avatar-lg {
    width: 80px !important;
    height: 80px !important;
  }
}

.teacher-item .title {
  height: 22px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

@media (max-width: 767px) {
  .teacher-item .title {
    margin-top: 10px;
  }
}

.teacher-item .position {
  color: #c1c1c1;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

@media (max-width: 767px) {
  .teacher-item .position {
    font-size: 12px;
  }
}

.teacher-item .teacher-bottom {
  position: relative;
  height: 90px;
}

@media (max-width: 767px) {
  .teacher-item .teacher-bottom {
    height: 60px;
  }
}

.teacher-item .about,
.teacher-item .metas {
  position: absolute;
  right: 20px;
  bottom: 20px;
  left: 20px;
  z-index: 1;
  transition: all 0.3s ease;
}

@media (max-width: 767px) {

  .teacher-item .about,
  .teacher-item .metas {
    left: 10px;
    bottom: 10px;
    right: 10px;
  }
}

.teacher-item .about {
  top: 20px;
  line-height: 25px;
  overflow: hidden;
  color: #919191;
  opacity: 1;
  filter: alpha(opacity=100);
}

@media (max-width: 767px) {
  .teacher-item .about {
    top: 10px;
    line-height: 20px;
    font-size: 12px;
  }
}

.teacher-item .metas {
  /*top: 30px;*/
  bottom: 30px;
  opacity: 0;
  filter: alpha(opacity=0);
}

/*@media (max-width:767px) {
.teacher-item .metas {
top: 20px;
bottom: 10px
}

}*/

.teacher-item .metas .btn {
  /*margin: 0 15px*/
}

@media (min-width: 992px) and (max-width: 1199px) {
  .teacher-item .metas .btn {
    /*margin: 0 10px*/
  }
}

/* @media (max-width:767px) {
    .teacher-item .metas .btn {
        margin: 0 5px
    }
} */

.custompage .es-section img {
  max-width: 100%;
  height: auto;
}

.error-panel {
  margin-top: 10%;
}

.error-panel .panel-heading {
  text-align: center;
  font-size: 22px;
}

@media (max-width: 767px) {
  .error-panel .panel-heading {
    font-size: 16px;
  }
}

.error-panel .panel-body {
  padding: 60px 0;
}

@media (max-width: 767px) {
  .error-panel .panel-body {
    padding: 30px 0;
  }
}

.error-panel .well {
  position: relative;
  width: 60%;
  margin-left: 20%;
}

@media (max-width: 1199px) {
  .error-panel .well {
    width: 80%;
    margin-left: 10%;
  }
}

@media (max-width: 991px) {
  .error-panel .well {
    width: 90%;
    margin-left: 5%;
    width: 100%;
    margin-left: 0;
  }
}

.error-panel .well p {
  margin: 30px 20px;
}

@media (max-width: 767px) {
  .error-panel .well p {
    margin: 10px 0;
  }
}

.error-panel .well .error-404-icon {
  position: absolute;
  top: 20px;
  right: 30px;
  width: 191px;
  height: 241px;
  background: url("/static-dist/app/img/icon_search.png") no-repeat;
}

.error-panel .well .error-403-icon {
  position: absolute;
  right: -44px;
  bottom: -28px;
  width: 245px;
  height: 248px;
  background: url("/static-dist/app/img/icon_lock.png") no-repeat;
}

@media (max-width: 1199px) {
  .error-panel .well .error-403-icon {
    right: -30px;
  }
}

.error-panel .well .error-500-icon {
  position: absolute;
  top: 20px;
  right: -140px;
  width: 297px;
  height: 219px;
  background: url("/static-dist/app/img/icon_server.png") no-repeat;
}

@media (max-width: 1199px) {
  .error-panel .well .error-500-icon {
    right: -80px;
  }
}

@media (max-width: 991px) {
  .error-panel .well .error-500-icon {
    right: -20px;
  }
}

.error-title {
  font-family: Phosphate;
  font-size: 200px;
  text-transform: uppercase;
  color: #9a9a9a;
  margin-right: 30px;
}

@media (max-width: 1199px) {
  .error-title {
    font-size: 180px;
  }
}

@media (max-width: 991px) {
  .error-title {
    height: 120px;
  }
}

@media (max-width: 767px) {
  .error-title {
    font-size: 40px;
  }
}

.order-detail-bg {
  margin-bottom: 20px;
  border: 1px solid #f5f5f5;
}

.order-detail-bg.checkout .order-info {
  padding-top: 30px;
  /* width: 70% */
}

@media (max-width: 767px) {
  .order-detail-bg.checkout .order-info {
    width: 100%;
    padding: 15px;
  }
}

.order-detail-bg.checkout .order-info>p {
  margin-bottom: 15px;
  font-size: 14px;
}

.order-detail-bg.checkout .order-info .pay-rmb {
  font-size: 14px;
}

.order-detail-bg .order-detail {
  position: relative;
  height: 150px;
  width: auto;
  background-color: #f3f5f7;
  padding: 20px;
  display: flex;
  align-items: center;
}

@media (max-width: 767px) {
  .order-detail-bg .order-detail {
    padding: 15px;
    height: auto;
  }
}

/* .order-detail-bg .order-img {
    float: left;
    width: 30%
} */
.order-detail-bg .order-img {
  flex-shrink: 0;
}

.order-detail-bg .order-img img {
  /* height: 150px */
  height: 110px;
  /* margin: 20px; */
}

.order-detail-bg .order-info {
  /* float: left;
    width: 50%;
    padding: 60px 0 0 50px;
    font-size: 18px;
    color: #616161 */
  /* padding: 60px 0 0 10px; */
  margin-left: 20px;
  flex: 2;
  font-size: 14px;
  color: #5f5f5f;
}

.order-detail-bg .order-info .order-course-name {
  font-size: 18px;
  color: #3d464d;
  margin-bottom: 20px;
}

.order-detail-bg .order-info .order-validity-date {
  font-family: MicrosoftYaHeiUI;
  font-size: 13px;
  color: #666666;
  font-weight: 400;
  line-height: 18px;
}

.order-detail-bg .order-info .order-validity-date span {
  color: #fe5400;
}

.m-order-price {
  display: none;
}

.reconfirm-course-price {
  margin-top: 5px;
}

@media (max-width: 650px) {
  .order-detail-bg .order-img img {
    width: 96px;
    height: 54px;
  }

  .order-detail-bg .order-info {
    padding: 0;
    margin-left: 10px;
  }

  .order-detail-bg .order-info .order-course-name {
    font-size: 14px;
    font-weight: 700;
    line-height: 14px;
    margin-bottom: 4px;
    margin-right: 15px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
  }

  .order-detail-bg .order-info .order-validity-date {
    line-height: 15px;
    margin-bottom: 7px;
  }

  .order-detail-bg .order-price {
    display: none;
  }

  .m-order-price {
    display: block;
    line-height: 14px;
  }

  .reconfirm-course-price {
    margin-top: 0;
  }

  .reconfirm-course-price .pay-rmb,
  .m-order-price .pay-rmb {
    font-family: PingFangSCSemibold-;
    font-size: 14px;
    color: #333333;
    letter-spacing: 0;
    line-height: 14px;
    font-weight: 600;
  }
}

.layui-layer-page.cart-reconfirm .layui-layer-title {
  font-family: PingFangSC-Bold;
  font-size: 16px;
  color: #32383f;
  letter-spacing: 0;
  font-weight: 700;
}

.layui-layer-page.cart-reconfirm .layui-layer-setwin {
  top: 21px;
}

.layui-layer-page.cart-reconfirm .layui-layer-btn a {
  width: 120px;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  border: 1px solid #0091ff;
}

.cart-reconfirm.layui-layer-page .layui-layer-btn .layui-layer-btn0 {
  background: #ffffff;
  color: #0091ff;
}

.cart-reconfirm.layui-layer-page .layui-layer-btn .layui-layer-btn1 {
  color: #ffffff;
  background: #0091ff;
}

.layui-layer-page.cart-reconfirm .layui-layer-btn1 {
  color: #0091ff;
  margin-left: 20px;
}

#reconfirm-course {
  display: none;
  padding: 20px;
  max-height: 390px;
  overflow: auto;
}

.reconfirm-course-item {
  display: flex;
  align-items: center;
  margin-bottom: 42px;
}

.reconfirm-course-item:last-child {
  margin-bottom: 0;
}

.reconfirm-course-cover {
  width: 196px;
  height: 110px;
  flex-shrink: 0;
}

.reconfirm-course-cover img {
  width: 100%;
  height: 100%;
  border-radius: 8px;
}

.reconfirm-course-info {
  padding-left: 20px;
}

.reconfirm-course-name {
  font-family: PingFangSC-Regular;
  font-size: 16px;
  color: #3d464d;
  font-weight: 400;
  line-height: 22px;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  -webkit-line-clamp: 2;
}

.reconfirm-course-date {
  margin-top: 10px;
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  line-height: 14px;
  color: #666666;
  font-weight: 400;
}

.reconfirm-course-date span {
  color: #fe5400;
}

.reconfirm-course-pirce {
  display: none;
  font-family: PingFangSCSemibold-;
  font-size: 14px;
  color: #333333;
  letter-spacing: 0;
  line-height: 14px;
  font-weight: 600;
}

.orgin-course {
  font-size: 14px;
  color: #333333;
  letter-spacing: 0;
  font-weight: 600;
  display: flex;
  align-items: center;
  line-height: 14px;
  font-family: "PingFang SC", Arial, "Microsoft YaHei", "Lantinghei SC",
    "HanHei SC", "Helvetica Neue", "Open Sans", "Hiragino Sans GB", 微软雅黑,
    STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif;
  margin-top: 7px;
}

.orgin-course .price-through {
  font-size: 12px;
  color: #b0b0b0;
  letter-spacing: 0;
  font-weight: 400;
  margin-left: 8px;
  text-decoration: line-through;
}

@media (max-width: 650px) {
  #reconfirm-course {
    max-height: 280px;
  }

  .reconfirm-course-item {
    margin-bottom: 30px;
  }

  .reconfirm-course-cover {
    width: 96px;
    height: 54px;
  }

  .reconfirm-course-info {
    padding-left: 10px;
    width: calc(100% - 96px);
    line-height: 1;
  }

  .orgin-course {
    margin-top: 3px;
  }

  .order-course-name-wrapper {
    width: 100%;
    overflow: hidden;
  }

  .order-course-name-wrapper .order-course-name-inner {
    width: 1000px;
    display: flex;
  }

  .reconfirm-course-name {
    font-size: 14px;
    line-height: 14px;
    margin-right: 15px;
    white-space: nowrap;
    /* text-overflow: ellipsis; */
    overflow: hidden;
    /* width: 100%; */
    display: inline-block;
  }

  .reconfirm-course-name:last-child {
    margin-right: 0;
  }

  .reconfirm-course-date {
    margin-top: 4px;
    font-size: 12px;
  }

  .reconfirm-course-pirce {
    display: block;
  }
}

@media (max-width: 767px) {
  .order-detail-bg .order-info {
    float: none;
    width: calc(100% - 96px - 10px);
    /* padding: 15px 15px 0 */
  }
}

.order-detail-bg .order-price {
  /* float: right; */
  /* font-size: 20px;
    width: 20%; */
  /* text-align: right; */
  flex: 1;
  /* padding: 60px 30px 0 0 */
}

@media (max-width: 767px) {
  .order-detail-bg .order-price {
    float: none;
    width: 100%;
    padding: 0 0 10px 15px;
    text-align: left;
  }
}

.order-detail-item {
  line-height: 30px;
  padding: 15px 20px;
}

.paid-courses .course-item {
  padding: 5px;
}

.paid-courses .course-item:nth-child(odd) {
  background-color: #fafafa;
}

.paid-courses .course-item .course-img {
  float: left;
}

.paid-courses .course-item .course-img img {
  width: 112px;
  height: auto;
}

.paid-courses .course-item .course-title {
  float: left;
  padding: 10px 20px;
  margin: 0;
}

.paid-courses .course-item .course-info {
  padding: 16px 20px;
  float: right;
}

.paid-courses .course-item .more {
  position: relative;
}

.paid-courses .course-item .more:hover {
  cursor: pointer;
}

.paid-courses .course-item .more:hover .more-info {
  display: block;
}

.paid-courses .course-item .more .more-info {
  position: absolute;
  display: none;
  z-index: 1;
  top: 100%;
  right: 0;
  background-color: #fef7ed;
  border: 1px solid #ffd183;
  padding: 5px 10px;
  white-space: nowrap;
  border-radius: 4px;
}

.order-item {
  border-bottom: 0;
  padding: 50px 30px 50px 40px;
  line-height: 33px;
}

@media (max-width: 991px) {
  .order-item {
    padding: 15px;
  }
}

.order-item .order-item-title {
  float: left;
  width: 36%;
  color: #919191;
}

@media (max-width: 767px) {
  .order-item .order-item-title {
    width: 100% !important;
  }
}

.order-item .order-item-title .title {
  font-size: 18px;
  color: #313131;
  margin: 0 15px;
}

@media (max-width: 1199px) {
  .order-item .order-item-title .title {
    margin: 0;
  }
}

.order-item .order-item-title .es-icon {
  font-size: 22px;
  color: #313131;
}

.order-item .order-item-detail {
  float: left;
  width: 45%;
}

@media (max-width: 767px) {
  .order-item .order-item-detail {
    width: 100%;
  }
}

.order-item .order-item-detail .help-block {
  display: none;
}

.order-item .order-item-detail .help-block .text-danger {
  display: inline-block;
  color: #d85030;
  width: 130px;
  margin-top: 10px;
  padding: 0 15px;
  line-height: 20px;
  font-size: 12px;
  background-color: #fff1f0;
  border: 1px solid #f0c7bd;
}

.order-item .order-item-price {
  float: right;
  width: 19%;
  font-size: 14px;
  text-align: right;
  color: #616161;
}

@media (max-width: 767px) {
  .order-item .order-item-price {
    width: 100% !important;
    text-align: left;
  }
}

.order-item .form-control {
  background-color: #fafafa;
  border: 1px solid #f5f5f5;
}

.order-pay .total-price {
  text-align: right;
  margin-bottom: 20px;
  font-size: 14px;
  color: #3f4a54;
  height: 73px;
  /* background-color: #FAFAFA; */
  border-radius: 4px 4px 0 0;
  margin: 20px 10px 0 10px;
  line-height: 73px;
}

@media (max-width: 767px) {
  .order-pay .total-price {
    margin-bottom: 15px;
  }
}

/* 订单确认页面样式添加 */
/* .pay-title-bg {max-width:1920px;margin:0 auto; background:url('/static-dist/app/img/shenlan19/dingdanzhifu_bg_pic.png') center top;} */
.pay-title-bg {
  background: url("/static-dist/app/img/transfer/dingbubj_pic.png") center top;
}

.pay-title-bg h2 {
  font-size: 28px;
  color: #31363f;
  margin: 0px auto;
  padding-top: 40px;
  padding-bottom: 122px;
}

.order-pay .hidden-xs-title {
  font-size: 18px;
  color: #424242;
}

.order-pay .pay-rmb {
  color: #333;
  font-size: 14px;
  font-weight: 600;
}

.teacher-say-text {
  margin-bottom: 5px;
}

.question-eassy-form-control {
  margin-bottom: 18px;
}

.question-eassy-form-control img {
  max-width: 100%;
}

.question-set-item {
  margin-bottom: 50px;
  padding-top: 20px;
  border-top: 1px solid #ccc;
}

.question-set-item-side {
  float: left;
  width: 40px;
}

.question-set-item-main {
  margin-left: 50px;
}

.question-heading {
  padding-bottom: 10px;
  border-bottom: 1px dashed #ddd;
  margin-bottom: 10px;
  overflow: hidden;
  zoom: 1;
}

.question-choices {
  list-style: none;
  padding-left: 0;
}

.question-choices>li {
  padding: 6px;
}

.question-choices>li:hover {
  background: #eee;
  cursor: pointer;
}

.question-choices .choice-index {
  color: #999;
  margin-right: 20px;
  float: left;
}

.form-paytype .order-detail-bg {
  padding: 50px;
}

@media (max-width: 767px) {
  .form-paytype .order-detail-bg {
    padding: 15px;
  }

  .hidden-xs-title {
    display: none;
  }
}

.form-paytype .pay-type-label {
  display: inline-block;
  margin-right: 10%;
  font-size: 18px;
}

@media (max-width: 1199px) {
  .form-paytype .pay-type-label {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .form-paytype .pay-type-label {
    display: block;
    margin-bottom: 10px;
  }
}

.form-paytype .check,
.form-chapter .check {
  cursor: pointer;
  width: 200px;
  height: 90px;
  border: 2px solid #f5f5f5;
  position: relative;
  text-align: center;
  font-size: 16px;
  display: inline-block;
  margin-right: 15px;
  transition: all 0.3s ease;
}

.form-paytype .check img,
.form-chapter .check img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.form-paytype .check img,
.form-chapter .check img {
  width: 83%;
  height: auto;
}

@media (max-width: 1199px) {

  .form-paytype .check,
  .form-chapter .check {
    margin-right: 5px;
    width: 150px;
    height: 60px;
    line-height: 32px;
    margin-bottom: 10px;
  }

  .form-paytype .check img,
  .form-chapter .check img {
    width: 80%;
    height: auto;
  }
}

@media (max-width: 768px) {

  .form-paytype .check,
  .form-chapter .check {
    height: 40px;
  }

  .form-horizontal .form-group {
    padding: 0px 0 0 0px !important;
  }
}

.form-paytype .check:hover,
.form-chapter .check:hover {
  border-color: #c1c1c1;
  transition: all 0.3s ease;
}

.form-paytype .check.active,
.form-chapter .check.active {
  border: 2px solid #0091ff;
}

.form-paytype .check.active .icon,
.form-chapter .check.active .icon {
  display: block;
}

.form-paytype .check.disabled,
.form-chapter .check.disabled {
  opacity: 0.2;
  filter: alpha(opacity=20);
  cursor: default;
}

.form-paytype .check.disabled:hover,
.form-chapter .check.disabled:hover {
  border-color: #f5f5f5;
}

.form-paytype .check .icon,
.form-chapter .check .icon {
  display: none;
  /* background: url("/static-dist/app/img/old/pay_check_status.png") no-repeat; */
  background: url("/static-dist/app/img/shenlan19/zhifuxuanzhong_icon@2x.png") no-repeat;
  background-size: 23px 23px;
  top: -1px;
  right: -1px;
  width: 23px;
  height: 23px;
  background-position: 0 0;
  position: absolute;
  overflow: hidden;
}

.pay-agreement-list {
  margin-top: 30px;
  padding-left: 0;
}

.pay-agreement-list li {
  list-style-type: none;
}

.pay-agreement-list li.checked .pay-bank {
  border-color: #70d445;
}

.pay-agreement-list li.checked .pay-bank:after {
  position: absolute;
  content: "";
  background: url("/static-dist/app/img/old/pay_check_status.png") no-repeat;
  top: -2px;
  right: -2px;
  width: 23px;
  height: 23px;
  background-position: 0 0;
  z-index: -1;
}

.pay-agreement-list .pay-bank {
  position: relative;
  margin-bottom: 10px;
  padding: 18px;
  border: 2px solid #fafafa;
  z-index: 1;
  background-color: #fafafa;
  transition: all 0.3s ease;
  color: #313131;
}

@media (max-width: 1199px) {
  .pay-agreement-list .pay-bank {
    padding: 10px;
  }
}

.pay-agreement-list .pay-bank:hover {
  border-color: #c1c1c1;
  cursor: pointer;
  transition: all 0.3s ease;
}

.pay-agreement-list .pay-bank:hover .closed {
  opacity: 1;
  filter: alpha(opacity=100);
}

.pay-agreement-list .pay-bank input {
  margin-top: 0;
}

.pay-agreement-list .pay-bank .closed {
  float: right;
  display: block;
  color: #c1c1c1;
  z-index: 1;
  opacity: 0;
  filter: alpha(opacity=0);
  transition: all 0.3s ease;
}

.pay-agreement-list .pay-bank .closed:hover {
  color: #e83d2c;
  transition: all 0.3s ease;
}

.pay-agreement-list .pay-bank .name {
  display: inline-block;
  width: 200px;
}

@media (max-width: 767px) {
  .pay-agreement-list .pay-bank .name {
    width: 150px;
  }
}

.pay-agreement-list .pay-bank .number {
  margin-right: 50px;
}

@media (max-width: 767px) {
  .pay-agreement-list .pay-bank .number {
    margin-right: 20px;
  }
}

/* 支付页面之订单完成 */
.order-pay-state {
  padding: 40px 0;
  margin-bottom: 15px;
  color: #659f13;
  border: 1px solid #cddfb4;
  background-color: #f2fae3;
  font-size: 22px;
  text-align: center;
}

/* .order-pay-stateCourse {
    text-align: center;
    border: 1px solid #EEEEEE;
    border-radius: 4px;
    font-size: 14px;
    color: #485159;
    padding-top: 60px;
    padding-bottom: 50px;  8.30修改
} */
/* 20号注释，因为助教批阅受这个影响 */
/* .es-section {
    margin-bottom: 118px;
} */

.order-pay-stateCourse {
  position: relative;
  text-align: center;
  /* border: 1px solid #EEEEEE;  8.30
    border-radius: 4px; */
  font-size: 14px;
  color: #485159;
  /* padding-top: 40px;
    padding-bottom: 50px; */
}

/* .order-pay-stateCourse i.state-course {
    background: url('/static-dist/app/img/shenlan19/success_pic@2x.png') no-repeat center;
    background-size: 112px;
    width: 112px;
    height: 112px;
    display: block;
    margin: 0 auto 16px;
} */
/* 9.1 支付页面二维码突出性优化样式 */
.order-pay-stateCourse .order-pay-stateCourse-pay {
  font-size: 16px;
  line-height: 17px;
}

/* .order-pay-stateCourse i.state-course-better {
    background: url('/static-dist/app/img/shenlan19/zhifuchenggong_pic@2x.png') no-repeat center;
    background-size: 17px;
    width: 17px;
    height: 17px;
    display:inline-block;
    margin-right: 6px;
} */
.order-pay-stateCourse .order-pay-stateCourse-teacher {
  font-weight: 700;
  font-size: 24px;
}

.order-pay-stateCourse .order-pay-stateCourse-img {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -74px;
  margin-left: -72px;
  z-index: 1;
}

.order-pay-stateCourse .order-pay-stateCourse-border {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -99px;
  margin-left: -97px;
}

/* 9.1 支付页面二维码突出性优化样式 end*/
.order-pay-stateCourse .state-course.state-course-fail {
  background: url("/static-dist/app/img/shenlan19/warning_pic@2x.png") no-repeat center;
  background-size: 100%;
}

.order-pay-stateCourse .js-course-return {
  display: inline-block;
  padding: 9px 36px 10px;
  border: 1px solid #0091ff;
  border-radius: 47px;
  font-size: 14px;
  color: #0091ff;
  line-height: 19px;
  transition: all 0.3s ease;
}

.order-pay-stateCourse .return-course-link {
  display: block;
  font-size: 12px;
  color: #909eab;
  text-decoration: underline !important;
  margin-top: 14px;
}

.order-pay-stateCourse .js-course-return:hover {
  background-color: #0091ff;
  color: #ffffff;
  transition: all 0.3s ease;
}

.order-pay-state .es-icon {
  font-size: 70px;
}

.order-pay-state p {
  margin: 40px 0 60px;
}

.order-pay-state.error {
  color: #e83d2c;
  border: 1px solid #f0c7bd;
  background-color: #fff1f0;
}

.social-login {
  position: relative;
  text-align: center;
  margin-top: 30px;
  z-index: 1;
}

.social-login>span {
  padding: 0 10px;
  z-index: 1;
  background-color: #fff;
}

.social-login .line {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #f1f1f1;
  margin-top: -1px;
  z-index: -1;
}

.social-login .social-icon {
  display: inline-block;
  margin: 0 8px;
  border: 2px solid #919191;
  color: #919191;
  border-radius: 50%;
  width: 35px;
  height: 35px;
  line-height: 33px;
  transition: all 0.3s ease;
}

.social-login .social-icon>i {
  font-size: 20px;
}

.social-login .social-icon:hover {
  color: #fff;
  transition: all 0.3s ease;
}

.social-login .social-icon.social-weibo:hover {
  background: #e6162d;
  border-color: #e6162d;
}

.social-login .social-icon.social-qq:hover {
  background: #78c257;
  border-color: #78c257;
}

.social-login .social-icon.social-renren:hover {
  background: #3793f1;
  border-color: #3793f1;
}

.social-login .social-icon.social-weixin:hover {
  background: #1ec354;
  border-color: #1ec354;
}

.social-login .social-icon.social-yun:hover {
  background: #ff842e;
  border-color: #ff842e;
}

.social-login .social-icon.social-more:hover {
  background: #46c37b;
  border-color: #46c37b;
}

/* 9.2 修改样式 */
.login-section {
  position: relative;
  margin: 50px auto;
  width: 458px;
  height: 419px;
  border-radius: 0;
  font-weight: 700;
}

.login-section .alert-danger {
  position: absolute;
  top: 39px;
  background: none;
  border: 0;
  width: 100%;
  left: 0;
  right: 0;
  text-align: center;
  line-height: 15px;
}

.login-section .eye,
.ordinary_mask .eye {
  position: absolute;
  top: 9px;
  right: 0;
  width: 40px;
  height: 25px;
  text-align: center;
  color: #8590a6;
}

.login-section .eye>i,
.ordinary_mask .eye>i {
  font-size: 22px;
}

.login-section .losewechat {
  opacity: 0.95;
  background: #ffffff;
  position: absolute;
  width: 180px;
  height: 180px;
  border: 1px solid #eeeeee;
}

.login-section .losewechat p:nth-of-type(1) {
  font-size: 12px;
  color: #31363f;
  padding-top: 50px;
}

.login-section .losewechat p:nth-of-type(2) {
  display: inline-block;
  background: url("/static-dist/app/img/shenlan21/shuaxin_icon@2x.png") no-repeat 0 center;
  background-size: 10px 10px;
  padding-left: 14px;
  font-size: 12px;
  color: #0091ff;
  margin-top: 20px;
}

.login-section .resetpwd-title {
  font-size: 20px;
  color: #31363f;
  padding: 30px 0 40px;
  text-align: center;
}

.login-section .sent-text {
  font-size: 14px;
  color: #909eab;
  line-height: 24px;
  padding-bottom: 60px;
}

.login-section .reset-nav {
  border-bottom: 1px solid #f7f7f7;
  text-align: center;
}

.login-section .reset-nav>li {
  display: inline-block;
}

.login-section .reset-nav>li>a {
  cursor: pointer;
  font-size: 16px;
  color: #909eab;
}

.login-section .reset-nav>li:nth-of-type(2)>a {
  margin-left: 80px;
}

.login-section .reset-nav>li.active>a {
  color: #3385ff;
  border-bottom: 2px solid #3385ff;
}

@media (max-width: 767px) {
  .login-section {
    width: 100%;
    margin: 0 auto;
    height: auto;
  }

  .login-section.wechat {
    height: 419px;
  }

  /* .login-section .login-main{
        padding:40px 0 0!important;
    } */
  .login-section .login-main {
    padding: 0 0 !important;
  }
}

.login-section.login-section-weixin {
  min-height: 315px;
}

.login-section .logon-tab {
  /* margin: -15px -15px 0 */
  margin: -20px -20px 0;
}

/* 9.2 登录样式修改 */
.login-section .logon-tab>a {
  display: block;
  padding: 30px;
  float: left;
  width: 50%;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  color: #616161;
  background-color: #f5f5f5;
  transition: all 0.3s ease;
}

/* @media screen and (max-width: 375px) {
    .login-section .logon-tab>a {
        margin-left: 90px!important;
    }
} */
.login-section .logon-tab>a:hover {
  background-color: #fafafa;
  transition: all 0.3s ease;
}

.login-section .logon-tab>a.active {
  background-color: #fff;
  transition: all 0.3s ease;
}

.login-section .login-main {
  padding: 52px 45px 0;
}

/* 登录更新 */
.select-tip-bg {
  border: 0;
  background: none;
  padding: 0 !important;
  white-space: nowrap;
  -webkit-appearance: none;
}

.state-code .select-down {
  width: 10px;
  height: 30px;
  display: block;
  z-index: 3;
  background-image: url("/static-dist/app/img/mobile/select_tip_bg@2x.png");
  background-color: #fff;
  background-repeat: no-repeat;
  background-size: 8px auto;
  position: absolute;
  background-position: 1px 9px;
  top: 2px;
  left: 92px;
}

/* 预约提醒手机号区号 */
.course-tel-ext {
  position: absolute;
  top: 0;
  left: 18px;
  z-index: 2;
  width: 82px;
  padding: 0;
  border: 0;
  white-space: nowrap;
}

.state-code .form-control[readonly]+.select-down {
  background-color: #f5f5f5;
}

.course-tel-ext+.form-control {
  padding-left: 100px;
}

.state-code .sl-icon-shoujihao1_icon {
  color: #909eab;
  position: absolute;
  top: 8px;
  left: 15px;
  font-size: 17px;
  z-index: 2;
}

.weixin-title {
  display: inline-block;
  font-size: 14px;
  color: #516577;
  background: url(/static-dist/app/img/mobile/wechat@2x.png) no-repeat 0 2px;
  background-size: 16px 16px;
  padding-left: 20px;
}

.weixin-box .weixin-img-box {
  width: 180px;
  height: 180px;
  border: 1px solid #eeeeee;
  margin-bottom: 19px;
}

/* 9.2样式修改 */
.form-group-tab {
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  border-top: 1px solid #f7f7f7;
  text-align: center;
  padding-top: 10px;
  height: 66px;
}

.form-group-tab.no-border {
  border: 0px;
  height: auto;
}

.form-group-tab.inlineblock {
  display: inline-block;
}

/* 9.2 修改底部样式*/
.form-group-tab .btn-links,
.form-group-tab .btn-links1,
.form-group-tab .btn-links2 {
  font-size: 12px;
  color: #909eab;
}

.form-group-tab.iconlock .btn-links1 {
  background: url("/static-dist/app/img/shenlan21/shouji_icon@2x.png") 0 center no-repeat;
  background-size: 10px auto;
  padding-left: 13px;
}

.form-group-tab.iconlock .btn-links2 {
  background: url("/static-dist/app/img/shenlan21/mima_icon@2x.png") 0 center no-repeat;
  background-size: 10px auto;
  padding-left: 13px;
}

/* 9.2样式修改 end*/

@media (min-width: 768px) {
  .login-modal {
    width: 350px;
  }

  .login-modal .modal-body {
    padding: 30px 30px 15px;
  }

  .login-modal .modal-footer {
    padding: 30px;
  }
}

.es-mobile .mobile-first {
  background: url("/static-dist/app/img/mobile/mobile_bg.jpg") top no-repeat;
}

.es-mobile .mobile-first .container {
  position: relative;
  height: 570px;
}

@media (max-width: 1199px) {
  .es-mobile .mobile-first .container {
    height: 500px;
  }
}

@media (max-width: 767px) {
  .es-mobile .mobile-first .container {
    height: 300px;
  }
}

.es-mobile .mobile-first .img-one {
  position: absolute;
  bottom: -70px;
  left: 5%;
  opacity: 0;
  z-index: 1;
}

@media (max-width: 991px) {
  .es-mobile .mobile-first .img-one {
    bottom: -60px;
    left: 1%;
  }
}

.es-mobile .mobile-first .img-two {
  position: absolute;
  bottom: -100px;
  left: 13%;
  z-index: 2;
  opacity: 0;
}

@media (max-width: 991px) {
  .es-mobile .mobile-first .img-two {
    bottom: -80px;
    left: 6%;
  }
}

.es-mobile .mobile-first .img-two-content {
  position: absolute;
  left: 50px;
  top: 55px;
  width: 233px;
  height: 400px;
}

.es-mobile .mobile-first .mobile-content {
  position: absolute;
  top: 30%;
  left: 52%;
  color: #fff;
}

@media (max-width: 991px) {
  .es-mobile .mobile-first .mobile-content {
    left: 50%;
  }
}

@media (max-width: 767px) {
  .es-mobile .mobile-first .mobile-content {
    top: 15%;
    left: 10%;
    right: 10%;
    text-align: center;
  }
}

.es-mobile .mobile-first .title {
  font-size: 80px;
  opacity: 0;
  font-weight: 700;
}

.es-mobile .mobile-first .title img {
  display: inline-block;
  margin-top: -15px;
  width: 80px;
}

@media (max-width: 1199px) {
  .es-mobile .mobile-first .title img {
    width: 60px;
  }
}

@media (max-width: 767px) {
  .es-mobile .mobile-first .title img {
    width: 40px;
    margin-top: -5px;
  }
}

@media (max-width: 1199px) {
  .es-mobile .mobile-first .title {
    font-size: 48px;
    margin-bottom: 10px;
  }
}

@media (max-width: 767px) {
  .es-mobile .mobile-first .title {
    font-size: 28px;
  }
}

.es-mobile .mobile-first .subtitle {
  font-size: 24px;
  margin-bottom: 40px;
  opacity: 0;
  letter-spacing: 3px;
}

@media (max-width: 1199px) {
  .es-mobile .mobile-first .subtitle {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .es-mobile .mobile-first .subtitle {
    margin-bottom: 20px;
  }
}

.es-mobile .mobile-first .btn-mobile {
  display: inline-block;
  border: 2px solid #fff;
  font-size: 16px;
  padding: 18px 28px;
  color: #fff;
  opacity: 0;
  transition: all 0.3s ease;
  border-radius: 4px;
}

@media (max-width: 1199px) {
  .es-mobile .mobile-first .btn-mobile {
    font-size: 14px;
    padding: 10px 15px;
  }
}

.es-mobile .mobile-first .btn-mobile>i {
  font-size: 20px;
  margin-left: 10px;
  -webkit-animation: nextshake 1s infinite linear;
  animation: nextshake 1s infinite linear;
}

.es-mobile .mobile-first .btn-mobile:hover {
  background: hsla(0, 0%, 100%, 0.2);
  transition: all 0.3s ease;
}

.es-mobile .mobile-first .btn-mobile+.btn-mobile {
  margin-left: 35px;
}

@media (max-width: 767px) {
  .es-mobile .mobile-first .btn-mobile+.btn-mobile {
    margin-left: 10px;
  }
}

.es-mobile .mobile-first.active .img-one {
  -webkit-animation: fadeInLeft 0.5s 0.2s ease both;
  animation: fadeInLeft 0.5s 0.2s ease both;
}

.es-mobile .mobile-first.active .img-two {
  -webkit-animation: fadeInRight 0.5s 0.2s ease both;
  animation: fadeInRight 0.5s 0.2s ease both;
}

.es-mobile .mobile-first.active .title {
  -webkit-animation: fadeInDown 0.5s 0.7s ease both;
  animation: fadeInDown 0.5s 0.7s ease both;
}

.es-mobile .mobile-first.active .btn-mobile,
.es-mobile .mobile-first.active .label-mobile,
.es-mobile .mobile-first.active .subtitle {
  -webkit-animation: fadeInUp 0.5s 0.7s ease both;
  animation: fadeInUp 0.5s 0.7s ease both;
}

.es-mobile .mobile-second {
  min-height: 200px;
  background: #fff;
}

@media (max-width: 767px) {
  .es-mobile .mobile-second {
    text-align: center;
  }
}

.es-mobile .mobile-second .container {
  padding: 80px 40px;
}

@media (max-width: 767px) {
  .es-mobile .mobile-second .container {
    padding: 50px 10px;
  }
}

.es-mobile .mobile-second .step {
  margin-bottom: 85px;
}

@media (max-width: 767px) {
  .es-mobile .mobile-second .step {
    margin-bottom: 30px;
  }
}

.es-mobile .mobile-second .qrcode {
  display: inline-block;
  width: 220px;
  height: auto;
  max-width: 100%;
}

@media (max-width: 991px) {
  .es-mobile .mobile-second .qrcode {
    width: 200px;
  }
}

.es-mobile .mobile-second .btn-android,
.es-mobile .mobile-second .btn-apple {
  display: inline-block;
  color: #fff;
  margin-top: 70px;
  text-align: center;
  font-size: 20px;
  padding: 24px 30px;
  border-radius: 4px;
  transition: all 0.3s ease;
}

@media (max-width: 1199px) {

  .es-mobile .mobile-second .btn-android,
  .es-mobile .mobile-second .btn-apple {
    font-size: 18px;
    padding: 15px 10px;
    margin-top: 74px;
  }
}

@media (max-width: 991px) {

  .es-mobile .mobile-second .btn-android,
  .es-mobile .mobile-second .btn-apple {
    padding: 15px;
    margin-top: 28px;
  }
}

.es-mobile .mobile-second .btn-android:hover,
.es-mobile .mobile-second .btn-apple:hover {
  background-image: none;
  transition: all 0.3s ease;
}

.es-mobile .mobile-second .btn-android>i,
.es-mobile .mobile-second .btn-apple>i {
  font-size: 30px;
  margin-right: 15px;
}

@media (max-width: 991px) {

  .es-mobile .mobile-second .btn-android>i,
  .es-mobile .mobile-second .btn-apple>i {
    font-size: 24px;
    margin-right: 10px;
  }
}

.es-mobile .mobile-second .btn-android {
  background: #35d572;
  box-shadow: 0 16px 40px rgba(54, 214, 115, 0.4);
  background-image: -ms-linear-gradient(90deg, #35d572 0, #3fde7b 100%);
}

.es-mobile .mobile-second .btn-apple {
  background: #1f5dea;
  margin-left: 35px;
  box-shadow: 0 16px 40px rgba(31, 93, 234, 0.4);
  background-image: -ms-linear-gradient(90deg, #1f5dea 0, #2b67f1 100%);
}

@media (max-width: 1199px) {
  .es-mobile .mobile-second .btn-apple {
    margin-left: 20px;
  }
}

@media (max-width: 991px) {
  .es-mobile .mobile-second .btn-apple {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .es-mobile .mobile-second .btn-apple {
    margin-top: 20px;
  }
}

.es-mobile .mobile-third {
  position: relative;
  min-height: 200px;
  overflow: hidden;
  background: #f5f8fa url("/static-dist/app/img/mobile/mobile_texture.jpg") top;
}

@media (max-width: 767px) {
  .es-mobile .mobile-third {
    background: #f5f8fa;
    text-align: center;
  }
}

.es-mobile .mobile-third>.container {
  position: relative;
  padding: 80px 40px 0;
}

@media (max-width: 767px) {
  .es-mobile .mobile-third>.container {
    padding: 50px 10px;
  }
}

.es-mobile .mobile-third .step {
  margin-bottom: 45px;
}

@media (max-width: 767px) {
  .es-mobile .mobile-third .step {
    margin-bottom: 30px;
  }
}

.es-mobile .mobile-third .qrcode {
  margin: 30px auto 0;
  width: 220px;
  font-size: 18px;
  color: #313131;
}

@media (max-width: 991px) {
  .es-mobile .mobile-third .qrcode {
    width: 200px;
  }
}

.es-mobile .mobile-third .qrcode img {
  width: 100%;
  margin-bottom: 20px;
}

.es-mobile .mobile-third .thumb {
  max-width: 100%;
  opacity: 0;
}

.es-mobile .mobile-third.active .thumb {
  -webkit-animation: fadeInUp 1s ease both;
  animation: fadeInUp 1s ease both;
}

.es-mobile .step {
  font-size: 24px;
  color: #313131;
}

@media (max-width: 767px) {
  .es-mobile .step {
    font-size: 16px;
  }
}

.es-mobile .step .member {
  display: inline-block;
  width: 48px;
  height: 48px;
  line-height: 48px;
  margin-right: 20px;
  text-align: center;
  border-radius: 50%;
  background: #46c37b;
  box-shadow: 0 6px 20px rgba(70, 195, 123, 0.4);
  color: #fff;
}

@media (max-width: 767px) {
  .es-mobile .step .member {
    width: 30px;
    height: 30px;
    line-height: 30px;
    margin-right: 5px;
  }
}

.section-wxpay .pay-qrcode-body {
  border: 1px solid #f5f5f5;
  margin-bottom: 50px;
  padding: 20px;
  text-align: center;
}

.section-wxpay .qrcode-img {
  float: left;
  width: 19%;
  margin-left: 24%;
}

@media (max-width: 1199px) {
  .section-wxpay .qrcode-img {
    width: 23%;
    margin-left: 21%;
  }
}

@media (max-width: 991px) {
  .section-wxpay .qrcode-img {
    width: 30%;
    margin-left: 15%;
  }
}

@media (max-width: 767px) {
  .section-wxpay .qrcode-img {
    width: 100%;
    float: none;
    margin-left: 0;
  }
}

.section-wxpay .qrcode-img img {
  width: 100%;
  margin: 20px auto;
}

.section-wxpay .qrcode-img-two {
  float: left;
  width: 40%;
}

@media (max-width: 1199px) {
  .section-wxpay .qrcode-img-two {
    width: 35%;
  }
}

@media (max-width: 991px) {
  .section-wxpay .qrcode-img-two {
    width: 40%;
  }
}

.section-wxpay .qrcode-img-two img {
  margin: 0 auto;
}

.section-wxpay .text-qrcode {
  color: #fff;
  padding: 5px 10px;
  background: #46c37b;
}

.section-wxpay .pay-qrcode-footer {
  padding-right: 30px;
  font-size: 16px;
  text-align: right;
}

.section-wxpay .pay-qrcode-footer a {
  font-size: 14px;
}

.section-wxpay .pay-qrcode-footer .pay-rmb {
  font-size: 24px;
  color: #e83d2c;
}

.coin-block {
  padding: 40px 0 25px;
}

.coin-block .coin-text {
  float: left;
}

.coin-block .coin-text img {
  margin: 0 10px 14px 0;
}

.coin-block .coin-text strong {
  font-size: 30px;
  color: #ff5d42;
}

.coin-block .coin-btn {
  float: left;
  margin: 4px 0 0 55px;
}

.table.order-table>tbody>tr>td,
.table.order-table>tbody>tr>th {
  padding: 10px;
  line-height: 22px;
}

.es-share.top .ml30-o {
  margin-left: -30px;
}

@-webkit-keyframes boxshow {
  0% {
    box-shadow: 0 0 15px #2db7f5;
    width: 8px;
    margin-left: -4px;
    left: 4px;
  }

  25% {
    box-shadow: 0 0 10px #2db7f5;
    width: 7px;
    margin-left: -3.5px;
    left: 3.5px;
  }

  50% {
    box-shadow: 0 0 5px #2db7f5;
    width: 6px;
    margin-left: -3px;
    left: 3px;
  }

  75% {
    box-shadow: 0 0 10px #2db7f5;
    width: 7px;
    margin-left: -3.5px;
    left: 3.5px;
  }

  to {
    box-shadow: 0 0 15px #2db7f5;
    width: 8px;
    margin-left: -4px;
    left: 4px;
  }
}

@keyframes boxshow {
  0% {
    box-shadow: 0 0 15px #2db7f5;
    width: 8px;
    margin-left: -4px;
    left: 4px;
  }

  25% {
    box-shadow: 0 0 10px #2db7f5;
    width: 7px;
    margin-left: -3.5px;
    left: 3.5px;
  }

  50% {
    box-shadow: 0 0 5px #2db7f5;
    width: 6px;
    margin-left: -3px;
    left: 3px;
  }

  75% {
    box-shadow: 0 0 10px #2db7f5;
    width: 7px;
    margin-left: -3.5px;
    left: 3.5px;
  }

  to {
    box-shadow: 0 0 15px #2db7f5;
    width: 8px;
    margin-left: -4px;
    left: 4px;
  }
}

.marker-manage {
  position: relative;
  min-width: 1200px;
  height: 100%;
  background-color: #313131;
  overflow: hidden;
}

.marker-manage.slideing {
  -moz-user-select: none;
  user-select: none;
  cursor: move !important;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit {
  margin-bottom: 0;
  border-bottom: none;
  background-color: #313131;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit>li a {
  color: #919191;
  font-size: 14px;
  padding: 20px 15px;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit>li a i:hover {
  color: #ff8a0c;
  cursor: pointer;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit>li.active>a,
.marker-manage .nav.nav-tabs.nav-tabs-edit>li:hover>a {
  background-color: #414141;
  color: #f5f5f5;
  border-color: transparent;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit>li.static .border {
  border-left: 1px solid #919191;
  padding-left: 15px;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit>li.static:hover {
  background-color: transparent;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit>li.static:hover>a {
  background-color: transparent;
  color: #919191;
}

.marker-manage .nav.nav-tabs.nav-tabs-edit .highlight {
  border-bottom: none;
}

.marker-manage .nav.nav-pills.nav-pills-difficulty {
  display: inline-block;
  vertical-align: middle;
}

.marker-manage .nav.nav-pills.nav-pills-difficulty>li {
  margin-right: 10px;
}

.marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #46c37b;
  color: #fff;
}

.marker-manage .nav.nav-pills.nav-pills-difficulty>li>a {
  background-color: #262626;
  color: #ccc;
  font-size: 12px;
  padding: 0 15px;
}

.marker-manage .breadcrumb li.active {
  color: #fff;
}

.marker-manage .lesson-list {
  border: 0;
  margin: 0;
  overflow: auto;
  padding-right: 15px;
  padding: 0;
  list-style: none;
}

.marker-manage .lesson-list .item-lesson {
  position: relative;
  background-color: transparent;
  border: none;
  line-height: 40px;
  margin-bottom: 0;
  margin-left: 0;
  cursor: move;
}

.marker-manage .lesson-list .item-lesson .btn-preview {
  top: 0;
  right: 0;
  color: #919191;
}

.marker-manage .lesson-list .item-lesson .btn-preview:hover {
  color: #46c37b;
}

.marker-manage .lesson-list .item-lesson .sqe-number {
  display: none;
}

.marker-manage .lesson-list .item-lesson .icon-drag {
  vertical-align: middle;
  margin-right: 10px;
  font-size: 16px;
}

.marker-manage .lesson-list .item-lesson .question-remove {
  position: absolute;
  top: 12px;
  right: 5px;
}

.marker-manage .lesson-list .item-lesson .info {
  display: inline-block;
  max-width: 60%;
  vertical-align: middle;
}

.marker-manage .lesson-list .item-lesson.dragged {
  border: 1px dashed #919191;
  position: absolute;
  width: 220px !important;
  padding-left: 15px;
}

.marker-manage .lesson-list .item-lesson.dragged .btn-preview {
  display: none;
}

.marker-manage .lesson-list .item-lesson.disdragg {
  opacity: 0.3;
  filter: alpha(opacity=30);
  cursor: default;
}

.marker-manage .lesson-list .placeholder {
  position: relative;
}

.marker-manage .lesson-list .more-questions {
  position: absolute;
  right: 15px;
  bottom: -15px;
  left: 0;
  text-align: right;
  color: #919191;
  font-size: 12px;
}

.marker-manage .lesson-list .more-questions .loading {
  display: none;
}

.marker-manage .lesson-list .more-questions .loading img {
  height: 30px;
  margin-right: 10px;
}

.marker-manage .lesson-list .more-questions.loading .loading {
  display: inline;
}

.marker-manage .lesson-list .more-questions a {
  color: #919191;
}

.marker-manage .lesson-list .more-questions a:hover {
  color: #46c37b;
}

.marker-manage-content {
  height: 100%;
  padding-bottom: 160px;
}

.marker-manage-content .manage-player-body {
  position: relative;
  padding-top: 60px;
  float: left;
  height: 100%;
  width: 70%;
}

.marker-manage-content .manage-player-body .manage-player-header {
  position: absolute;
  left: 0;
  top: 0;
  width: 70%;
  height: 60px;
}

.marker-manage-content .manage-player-body .manage-player-header .title-link {
  float: left;
  font-size: 16px;
  color: #fff;
  line-height: 60px;
  margin-right: 20px;
}

.marker-manage-content .manage-player-body .manage-player-header .title-link i {
  font-size: 16px;
}

.marker-manage-content .manage-player-body .manage-player-header .title-link:hover {
  color: #46c37b;
}

.marker-manage-content .manage-player-body .manage-player-content {
  height: 100%;
}

.marker-manage-content .manage-player-body .mask {
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0;
  background-color: transparent;
}

.marker-manage-content .manage-edit-body {
  position: relative;
  float: left;
  width: 30%;
  height: 100%;
  background-color: #414141;
  color: #f5f5f5;
}

.marker-manage-content .manage-edit-body .btn-preview {
  position: absolute;
  right: 15px;
  top: 12px;
}

.marker-manage-content .manage-edit-body .tab-pane {
  padding: 30px 0 30px 20px;
  position: relative;
}

.marker-manage-content .manage-edit-body .btn-search {
  position: absolute;
  right: 10px;
  bottom: 0;
  padding: 9px;
  background-color: transparent;
  border: none;
  font-size: 16px;
  color: #616161;
}

.marker-manage-content .manage-edit-body .btn-search:focus {
  outline: none;
}

.marker-manage-content .manage-edit-body .question-difficulty {
  padding-bottom: 30px;
}

.marker-manage-content .manage-edit-body .question-remask {
  padding-top: 24px;
  border-top: 1px solid #616161;
  color: #919191;
  margin-bottom: 12px;
}

.marker-manage-content .manage-edit-body .question-remask .remask-icon {
  color: #ff8a0c;
  font-size: 16px;
  margin-right: 10px;
}

.marker-manage-content .editbox {
  position: absolute;
  left: 0;
  right: 0;
  height: 160px;
  bottom: 0;
  background-color: #313131;
}

.marker-manage-content .editbox .lesson-list {
  height: 100%;
  background-color: #414141;
  padding: 0 160px 0 20px;
}

.marker-manage-content .editbox .lesson-list.highlight {
  border: 1px dashed #2db7f5;
  background-color: transparent;
  background-color: rgba(45, 183, 245, 0.3);
}

.marker-manage-content .editbox .lesson-list .btn-preview {
  display: none;
}

.marker-manage-content .editbox .lesson-list .placeholder {
  border-color: transparent;
}

.marker-manage-content .editbox .scale-content {
  height: 111px;
  padding-top: 10px;
  border-top: 1px solid #292929;
}

.marker-manage-content .editbox .scalebox {
  position: relative;
  height: 21px;
  border-bottom: 1px solid #404040;
}

.marker-manage-content .editbox .scalebox .lesson-list {
  height: auto;
  padding: 0;
  background-color: transparent;
  overflow: visible;
}

.marker-manage-content .editbox .scalebox .lesson-list .item-lesson {
  padding: 0 10px;
  margin-bottom: 0;
  text-align: left;
  cursor: pointer;
}

.marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #46c37b;
}

.marker-manage-content .editbox .scalebox .lesson-list .item-lesson .title {
  display: none;
}

.marker-manage-content .editbox .scalebox .lesson-list .item-lesson .info {
  max-width: 150px;
}

.marker-manage-content .editbox .scalebox .lesson-list .item-lesson .sqe-number {
  display: inline;
}

.marker-manage-content .editbox .scalebox .lesson-list .placeholder {
  height: 10px;
}

.marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  content: "";
  border: 5px solid;
  border-color: transparent transparent transparent #46c37b;
  position: absolute;
  top: 0;
  left: 0;
}

.marker-manage-content .editbox .scalebox .scale {
  position: absolute;
  top: 0;
  display: block;
  z-index: 1;
  padding-left: 5px;
  color: #fff;
  height: 20px;
  line-height: 20px;
}

.marker-manage-content .editbox .scalebox .scale.scale-red .line {
  top: 0;
  height: 160px;
  border-color: #e83d2c;
}

.marker-manage-content .editbox .scalebox .scale.scale-red .scale-details {
  visibility: visible;
  font-size: 12px;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue {
  cursor: pointer;
  height: 100px;
  top: 32px;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue .line {
  height: 100px;
  border-color: #2db7f5;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue.highlight,
.marker-manage-content .editbox .scalebox .scale.scale-blue:hover {
  width: 8px;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue.highlight .line,
.marker-manage-content .editbox .scalebox .scale.scale-blue:hover .line {
  border-color: transparent;
  background-color: rgba(45, 183, 245, 0.5);
  -webkit-animation: boxshow 1s ease infinite;
  animation: boxshow 1s ease infinite;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue.highlight .scale-details,
.marker-manage-content .editbox .scalebox .scale.scale-blue:hover .scale-details {
  width: 220px;
  margin-left: -110px;
  visibility: visible;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue.moveing .line {
  -webkit-animation: boxshow 0 ease infinite;
  animation: boxshow 0 ease infinite;
}

.marker-manage-content .editbox .scalebox .scale.scale-blue.moveing .scale-details {
  width: 220px;
  margin-left: -110px;
  visibility: visible;
}

.marker-manage-content .editbox .scalebox .scale.scale-white .line {
  height: 106px;
  top: 26px;
  border-color: #fff;
}

.marker-manage-content .editbox .scalebox .scale.scale-white .line i {
  position: absolute;
  left: -8.5px;
  top: -13.5px;
}

.marker-manage-content .editbox .scalebox .scale .scale-details {
  position: absolute;
  left: 0;
  bottom: 100%;
  visibility: hidden;
  min-width: 50px;
  margin-left: -25px;
  background-color: rgba(0, 0, 0, 0.8);
  text-align: center;
  color: #fff;
}

.marker-manage-content .editbox .scalebox .scale .line {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  border-left: 1px solid #616161;
}

.marker-manage-content .editbox .scalebox .scale .line.line-dashed {
  top: 32px;
  height: 100px;
  border-left: 1px dashed #a3a3a3;
}

.marker-manage-content .editbox .scalebox .scale .scale-time {
  display: inline-block;
  font-size: 12px;
  -webkit-transform: scale(0.83);
}

.marker-manage .introjs-button.introjs-skipbutton,
.marker-manage .introjs-nextbutton.introjs-fullbutton {
  background: transparent;
  border-color: transparent;
  color: #919191;
  margin: 0;
  padding-right: 0;
  cursor: pointer;
}

.marker-manage .introjs-button.introjs-skipbutton:focus,
.marker-manage .introjs-button.introjs-skipbutton:hover,
.marker-manage .introjs-nextbutton.introjs-fullbutton:focus,
.marker-manage .introjs-nextbutton.introjs-fullbutton:hover {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  outline: none;
}

.marker-manage .introjs-overlay {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.marker-manage .introjs-fixedTooltip {
  background-color: transparent;
  border: none;
  box-shadow: none;
}

.marker-manage .introjs-helperNumberLayer,
.marker-manage .introjs-skipbutton {
  display: none;
}

.marker-manage .introjs-helperLayer {
  background-color: transparent;
  box-shadow: none;
  border-color: transparent;
}

.marker-manage .introjs-arrow.top-middle {
  margin-left: 0;
}

.marker-manage .introjs-tooltip {
  text-align: justify;
  font-size: 12px;
  color: #313131;
  padding: 15px;
}

.marker-manage .introjs-tooltip .title {
  color: #919191;
  padding-bottom: 5px;
  margin-bottom: 10px;
  border-bottom: 1px solid #e6e6e6;
}

.marker-manage .introjs-tooltip .remask {
  font-size: 14px;
  margin-bottom: 6px;
}

.marker-manage .intro-img {
  position: absolute;
  left: 0;
  top: 100%;
  color: #fff;
  font-size: 20px;
}

.marker-manage .intro-img img {
  display: block;
  margin-left: 70px;
}

.show-introhelp {
  position: relative;
}

.show-introhelp .introhelp-icon-help {
  position: relative;
  color: #ff8a0c;
  z-index: 9999999 !important;
}

.show-introhelp .introhelp-icon-drag {
  position: relative;
  color: #fff;
  z-index: 9999999 !important;
}

.show-introhelp .popover {
  display: none;
  font-size: 12px;
  color: #313131;
}

.show-introhelp .popover .title {
  color: #919191;
  padding-bottom: 5px;
  border-bottom: 1px solid #e6e6e6;
  margin-bottom: 10px;
}

.show-introhelp .popover.bottom {
  top: 18px;
  left: -92px;
}

.show-introhelp .popover.left {
  left: -230px;
  top: 90px;
}

.show-introhelp .introhelp-img {
  position: absolute;
  top: 100%;
  left: 0;
  color: #fff;
  font-size: 14px;
}

.show-introhelp .introhelp-img img {
  display: block;
  margin-left: 50px;
}

.show-introhelp .close-introhelp {
  float: right;
  color: #919191;
  cursor: pointer;
}

.show-introhelp.show .popover {
  display: block;
}

.introhelp-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0.5;
  filter: alpha(opacity=50);
  background-color: #000;
}

.marker-preview {
  height: 100%;
  background-color: #f1f4f6;
}

.marker-preview .marker-preview-content {
  position: relative;
  height: 100%;
  padding-top: 20px;
  color: #313131;
  text-align: center;
}

@media (max-width: 1199px) {
  .marker-preview .marker-preview-content {
    padding-top: 10px;
  }
}

.marker-preview .marker-preview-content .title {
  font-size: 20px;
  line-height: 1;
}

.marker-preview .marker-preview-content .marker-preview-player {
  position: absolute;
  left: 120px;
  right: 120px;
  top: 60px;
  bottom: 20px;
}

@media (max-width: 1199px) {
  .marker-preview .marker-preview-content .marker-preview-player {
    bottom: 10px;
    top: 40px;
  }
}

.mark-questions-modal {
  width: 756px;
}

.mark-questions-modal .modal-header {
  position: relative;
  padding: 20px 30px;
  color: #fff;
  border-color: #fff;
  border-bottom: 1px solid #f5f8fa;
}

.mark-questions-modal .modal-header .close {
  margin-top: -25px;
  opacity: 1;
  filter: alpha(opacity=100);
  font-size: 26px;
  color: #616161;
}

.mark-questions-modal .modal-title {
  font-size: 18px;
  line-height: 18px;
  text-align: left;
  color: #313131;
}

.mark-questions-modal .modal-content {
  border-radius: 10px;
}

.mark-questions-modal .modal-body {
  padding: 15px 30px;
}

.mark-questions-modal .topic-bottom {
  padding-bottom: 20px;
  font-size: 14px;
  color: #fff;
  color: #616161;
  line-height: 40px;
  text-align: left;
  background-color: #f5f8fa;
  border-radius: 10px;
}

.mark-questions-modal .topic-bottom .topic-bottom-info {
  line-height: 34px;
  padding: 20px 30px 0;
  color: #919191;
}

.mark-questions-modal .topic-bottom .topic-bottom-info .btn {
  float: right;
  margin-left: 20px;
}

.mark-questions-modal .popup-topic {
  padding: 0;
  margin: 0;
  height: 300px;
  overflow: auto;
  list-style-type: none;
}

.mark-questions-modal .popup-topic img {
  max-width: 100%;
  vertical-align: top;
}

.mark-questions-modal .popup-topic p {
  margin-bottom: 0;
}

.mark-questions-modal .popup-topic .title {
  margin-bottom: 14px;
  line-height: 30px;
  font-size: 18px;
  color: #313131;
}

.mark-questions-modal .popup-topic .list {
  padding: 10px 0 10px 40px;
  line-height: 30px;
  cursor: pointer;
  cursor: default;
  position: relative;
}

.mark-questions-modal .popup-topic .list .num {
  position: absolute;
  left: 0;
  top: 12px;
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 15px;
  border: 1px solid #c1c1c1;
  color: #c1c1c1;
  font-size: 14px;
  text-align: center;
  line-height: 22px;
}

.mark-questions-modal .popup-topic.topic-resolve .list {
  min-height: 200px;
  padding: 20px;
  margin-bottom: 15px;
  border-radius: 4px;
  cursor: default;
  background-color: #f5f8fa;
}

.mark-questions-modal .question-stem-fill-blank {
  color: #313131;
}

.caption-uploader {
  height: 34px;
  background: transparent;
  display: inline-block;
}

.caption-notify {
  line-height: 28px;
}

.text-track-overview {
  overflow-y: scroll;
  padding-top: 10px;
  padding-bottom: 10px;
}

.text-track-overview p {
  font-size: 14px;
  line-height: 30px;
  color: #919191;
}

.text-track-overview p.active {
  color: #f5f5f5;
}

.text-track-select-form-group {
  margin-bottom: 0 !important;
}

.track-select-parent {
  position: relative;
}

.track-select-parent .track-select-show {
  width: 100%;
  background: #fff;
  border: 1px solid #ccc;
  color: #919191;
  font-size: 14px;
  line-height: 32px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 2px;
  overflow: hidden;
}

.track-select-parent .track-select-show.active {
  border-color: #46c37b;
}

.track-select-parent .track-select-show .data-show {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  min-height: 32px;
  padding-right: 20px;
}

.track-select-parent .track-select-show .track-selcet-close-arrow,
.track-select-parent .track-select-show .track-selcet-open-arrow {
  position: absolute;
  top: 0;
  right: 10px;
}

.track-select-parent .track-selcet-list {
  padding-left: 0;
  position: absolute;
  top: 34px;
  width: 100%;
  background: #fff;
  border-radius: 2px;
  border: 1px solid #ccc;
}

.track-select-parent .track-selcet-list li {
  position: relative;
  list-style: none;
  padding-left: 10px;
  padding-right: 10px;
  color: #919191;
  line-height: 34px;
}

.track-select-parent .track-selcet-list li .value {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-right: 110px;
}

.track-select-parent .track-selcet-list li .convertStatus {
  position: absolute;
  line-height: 1.2;
  padding: 2px 10px;
  border-radius: 5px;
  right: 40px;
  top: 8px;
  color: #fff;
}

.track-select-parent .track-selcet-list li .convertStatus.convert-success {
  background: #46c37b;
}

.track-select-parent .track-selcet-list li .convertStatus.convert-error {
  background: red;
}

.track-select-parent .track-selcet-list li .convertStatus.convert-doing {
  background: blue;
}

.track-select-parent .track-selcet-list li .convertStatus.convert-none,
.track-select-parent .track-selcet-list li .convertStatus.convert-waiting {
  background: #aaa;
}

.track-select-parent .track-selcet-list li:hover {
  background: #f5f5f5;
}

.track-select-parent .track-selcet-list li:hover .delete {
  display: inline;
}

.track-select-parent .track-selcet-list li .delete {
  display: none;
  position: absolute;
  top: 8px;
  right: 10px;
}

.track-select-parent .track-selcet-list li.active {
  color: #46c37b;
}

.subtitle-transcode-status {
  color: #fff;
  display: inline-block;
  padding: 3px 10px;
  border-radius: 3px;
  line-height: 1;
  text-align: center;
  min-width: 72px;
}

.subtitle-transcode-status.none,
.subtitle-transcode-status.waiting {
  background: #919191;
}

.subtitle-transcode-status.doing {
  background: #2db7f5;
}

.subtitle-transcode-status.success {
  background: #46c37b;
}

.subtitle-transcode-status.error {
  background: #e83d2c;
}

.subtitle-name {
  width: 300px;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.user-center-header {
  position: relative;
  z-index: 1;
  width: 1080px;
  height: 160px !important;
  margin: 40px auto;
  padding: 30px;
  border: 1px solid #eeeeee;
  border-radius: 8px;
  background-color: #fff !important;
}

.user-center-container {
  padding-left: 0;
  width: 1020px;
  padding-right: 0;
}

.user-center-header .mask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0 !important;
}

.user-center-header .blurr-bg {
  z-index: -1;
}

/*@media (max-width:767px) {
    .user-center-header {
padding: 15px 0
    }

}*/

.user-center-header .container {
  /*position: relative;*/
  z-index: 1;
  background-color: #fff;
}

/*@media (max-width:1199px) {
.user-center-header .container {
padding: 0 30px
}

}

@media (max-width:767px) {
.user-center-header .container {
padding: 0 10px
}

}*/

.user-center-header .user-avatar {
  position: relative;
  float: left;
  width: 66.67%;
  padding-left: 126px;
  top: -10px;
}

/*@media (max-width:991px) {
.user-center-header .user-avatar {
width: 100%;
float: none
}

}*/

@media (max-width: 1200px) {
  .user-center-header {
    width: 90%;
  }
}

@media (max-width: 768px) {
  .user-center-header {
    padding: 0 !important;
    height: auto !important;
  }

  .user-center-header .avatar-wrap {
    /*position: relative;!important;*/
    /*margin: 0 auto!important;*/
    /*width: 100px;*/
  }

  .user-center-header .user-avatar {
    padding: 0 !important;
    top: 0px;
  }

  .user-center-header .container {
    padding: 20px;
  }

  .user-center-header .description {
    display: none;
  }

  .user-center-header .title {
    margin-top: 100px !important;
  }

  .user-center-header .fans {
    margin-top: 20px;
  }
}

/*@media (max-width:767px) {
    .user-center-header .user-avatar {
text-align: center;
padding-left: 0
    }

    .user-center-header .user-avatar .avatar-wrap {
position: relative;
margin-bottom: 10px;
border: 3px solid hsla(0, 0%, 100%, .5)
    }

    .user-center-header .user-avatar .avatar-wrap .avatar-lg {
width: 60px !important;
height: 60px !important
    }

    .user-center-header .user-avatar .avatar-wrap .icon-md {
width: 20px;
height: 20px;
line-height: 15px
    }

    .user-center-header .user-avatar .avatar-wrap .icon-md>i {
font-size: 12px
    }

}*/

.user-center-header .avatar-wrap {
  position: absolute;
  top: 0;
  left: 0;
}

.user-center-header .name {
  color: #fff;
  font-size: 18px;
  font-size: 20px;
  color: #333333;
  margin-bottom: 10px;
}

.user-center-header .title {
  margin-top: 16px;
}

.user-center-header .description {
  font-size: 14px;
  color: #888888;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-center-header .fans {
  /*float: right;*/
  position: absolute;
  right: 30px;
}

.user-center-header .fans li {
  float: left;
  text-align: center;
}

.user-center-header .fans li:nth-of-type(2) {
  margin-left: 42px;
  margin-right: 15px;
}

.user-center-header .fans .number {
  font-size: 18px;
  color: #3f4a54;
  line-height: 25px;
}

.user-center-header .fans .fans-title {
  font-size: 12px;
  color: #3f4a54;
  margin-top: 0;
  line-height: 17px;
}

.user-center-header .actions {
  position: absolute;
  right: 30px;
  /* bottom: 33px; */
  top: 93px;
  z-index: 3;
  font-size: 0;
}

.user-center-header .actions a,
.user-center-header .actions button {
  width: 48px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  padding: 0;
  font-size: 12px;
  /*color: #fff;*/
}

.user-center-header .actions .btn-primary {
  background-color: #005bac;
  border-radius: 4px;
  color: #fff;
}

.user-center-header .actions .btn-ghost-white {
  background-color: #ffffff;
  border: 1px solid #005bac;
  border-radius: 4px;
  color: #005bac;
}

/*@media (max-width:767px) {
.user-center-header .name {
font-size: 16px
}

}*/

.user-center-header .position {
  margin-bottom: 10px;
  color: #919191;
  color: hsla(0, 0%, 100%, 0.5);
}

.user-center-header .position>a {
  color: #919191;
  color: hsla(0, 0%, 100%, 0.5);
  transition: all 0.3s ease;
}

.user-center-header .position>a:hover {
  color: #fff;
  transition: all 0.3s ease;
}

.user-center-header .mates {
  font-size: 18px;
  margin-bottom: 15px;
  color: #fff;
}

/*@media (max-width:767px) {
.user-center-header .mates {
font-size: 16px
}

}*/

.user-center-header .user-about {
  float: left;
  width: 33.33%;
  padding: 15px 10px;
  background-color: #919191;
  background-color: hsla(0, 0%, 100%, 0.3);
  color: #fff;
  border-radius: 4px;
}

.user-center-header .user-about-content {
  height: 100px;
  overflow: hidden;
  line-height: 25px;
}

.group-header {
  margin-bottom: 20px;
  border-radius: 4px;
  height: 150px;
  position: relative;
}

.group-header .media {
  position: absolute;
  bottom: 20px;
  left: 20px;
  border-radius: 3px;
  min-width: 20%;
  z-index: 1;
}

.group-header .media-left {
  padding-right: 20px;
}

.group-header .media-body {
  padding-top: 5px;
  width: auto;
}

.group-header .media-heading {
  font-size: 18px;
  color: #fff;
  margin-bottom: 12px;
}

.group-header .media-heading .btn {
  padding: 3px 15px 2px;
  vertical-align: text-top;
  margin-left: 12px;
  border: none;
}

.group-header .media-metas {
  font-size: 12px;
  color: #fff;
}

.group-user-info hr {
  margin: 15px 0;
  background: #e1e1e1;
}

.group-user-info .group-message {
  margin: 0;
}

.group-user-info .group-message span {
  float: left;
  width: 50%;
  text-align: center;
  font-size: 12px;
  color: #919191;
}

.group-user-info .group-message strong {
  display: block;
  color: #313131;
  font-size: 18px;
  font-weight: 400;
}

.thread-list .media-left {
  padding-right: 18px;
}

.thread-list .media-heading {
  margin-bottom: 10px;
}

.thread-list .reply-num {
  display: inline-block;
  width: 60px;
  height: 60px;
  border-radius: 4px;
  background: #f1f1f1;
  color: #919191;
  text-align: center;
  font-size: 12px;
}

.thread-list .reply-num strong {
  display: block;
  font-size: 20px;
  font-weight: 400;
  padding: 7px 0 0;
}

.group-page .grouplist {
  height: 120px;
  width: 81px;
  float: left;
  text-align: center;
}

.group-page .post-delete-btn {
  visibility: hidden;
}

.group-page .media:hover .post-delete-btn {
  visibility: visible;
}

.es-live-poster {
  position: relative;
  background: #fff;
  margin: 0 auto;
  max-height: 300px;
}

.es-live-poster a.img-responsive {
  max-width: none;
  width: 100%;
}

.es-live-poster .swiper-slide {
  margin: 0 auto;
  width: 100%;
}

.es-live-poster .swiper-pager {
  position: absolute;
  bottom: 20px;
  z-index: 100;
  width: 100%;
  text-align: center;
}

.es-live-poster .swiper-pager span {
  cursor: pointer;
  font-size: 0;
  margin: 0 7px;
  width: 14px;
  height: 14px;
  display: inline-block;
  border-radius: 50%;
  background: #fff;
  background: hsla(0, 0%, 100%, 0.5);
}

.es-live-poster .swiper-pager span.swiper-active-switch {
  background: #f5f5f5;
  background: #fff;
}

.es-live-poster .swiper-pager img.img-responsive {
  margin: 0 auto;
}

.live-course-body .label {
  padding: 0.4em 0.8em !important;
}

.live-course-body .es-live-list,
.live-course-body .es-live-list .panel-body {
  padding: 0;
}

.live-course-body .es-live-list .panel-body>ul {
  margin: 0;
  padding: 0;
  background: #f5f5f5;
}

.live-course-body .es-live-list .panel-body>ul li {
  float: left;
  margin-bottom: -1px;
  list-style-type: none;
  padding: 12px 0;
  width: 25%;
  text-align: center;
  color: #313131;
  background-color: #f5f5f5;
  border-bottom: 1px solid #f5f5f5;
  border-right: 1px solid #e9e9e9;
}

.live-course-body .es-live-list .panel-body>ul li:last-child {
  border-right: none;
}

.live-course-body .es-live-list .panel-body>ul li a {
  color: #313131;
  padding: 14px 17px;
}

@media (max-width: 1199px) {
  .live-course-body .es-live-list .panel-body>ul li a {
    padding: 14px 0;
  }
}

@media (max-width: 991px) {
  .live-course-body .es-live-list .panel-body>ul li a {
    padding: 14px 60px;
  }
}

@media (max-width: 767px) {
  .live-course-body .es-live-list .panel-body>ul li a {
    padding: 14px 9px;
  }
}

.live-course-body .es-live-list .panel-body>ul li.active {
  background-color: #fff;
  border-bottom: none;
}

.live-course-body .es-live-list .es-live-item {
  position: relative;
  margin: 20px 15px;
}

.live-course-body .es-live-list .es-live-item:before {
  content: "";
  position: absolute;
  top: 0;
  left: 5px;
  height: 100%;
  width: 2px;
  background: #e1e1e1;
}

.live-course-body .es-live-list .es-live-item .live-content.live .time-icon,
.live-course-body .es-live-list .es-live-item .live-content.living .time-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  background: #a8eb8b;
  border-radius: 50%;
  position: absolute;
  left: -1px;
}

.live-course-body .es-live-list .es-live-item .live-content.live .time-icon em,
.live-course-body .es-live-list .es-live-item .live-content.living .time-icon em {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #70d445;
  border-radius: 50%;
  position: absolute;
  top: 3px;
  left: 3px;
}

.live-course-body .es-live-list .es-live-item .live-content.live .label,
.live-course-body .es-live-list .es-live-item .live-content.living .label {
  margin-left: 24px;
}

.live-course-body .es-live-list .es-live-item .live-content.live .time-icon {
  background: #6dcbf5;
}

.live-course-body .es-live-list .es-live-item .live-content.live .time-icon em {
  background: #2db7f5;
}

.live-course-body .es-live-list .es-live-item li,
.live-course-body .es-live-list .es-live-item ul {
  list-style-type: none;
  padding: 0;
}

.live-course-body .es-live-list .es-live-item li {
  margin-top: 15px;
  padding-left: 24px;
}

.live-course-body .es-live-list .es-live-item li a {
  color: #313131;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  font-size: 12px;
}

.live-course-body .es-live-list .es-live-item li a span {
  color: #919191;
  padding-right: 15px;
}

.live-course-body .es-live-recommend img {
  width: 110px;
  max-width: 110px;
  border-radius: 4px;
}

.live-course-body .es-live-recommend .title {
  margin-bottom: 10px;
  height: 20px;
  overflow: hidden;
}

.live-course-body .es-live-recommend .price {
  color: #e83d2c;
  font-size: 12px;
}

.live-course-body .es-live-back ul {
  padding: 0;
  margin: 0;
}

.live-course-body .es-live-back ul li {
  list-style-type: none;
  margin-top: 15px;
}

.live-course-body .es-live-back ul li:first-child {
  margin-top: 0;
}

.live-course-body .es-live-back ul li:last-child {
  margin-bottom: 5px;
}

.live-course-body .es-live-back ul li .dat {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
}

.live-course-body .es-live-back ul li a {
  color: #313131;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.live-course-body .es-live-back ul li a span {
  padding: 0 14px 0 8px;
}

.live-course-body .es-live-all .media {
  padding-bottom: 15px;
  border-bottom: 1px solid #f5f5f5 !important;
}

.live-course-body .es-live-all .media-left {
  position: relative;
}

.live-course-body .es-live-all .media-left .re-live {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
  width: 68px;
  height: 68px;
  background: url("/static-dist/app/img/tag_recommend.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_recommend.png") 1x,
      url("/static-dist/app/img/tag_recommend@2x.png") 2x);
}

.live-course-body .es-live-all .media-left .re-report {
  position: absolute;
  bottom: 0;
  background-color: #000;
  background: rgba(0, 0, 0, 0.5);
  width: 302px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  height: 25px;
  font-size: 12px;
  text-align: center;
  line-height: 25px;
  color: #fff;
  font-weight: 700;
}

@media (max-width: 1200px) {
  .live-course-body .es-live-all .media-left .re-report {
    width: 288px;
  }
}

@media (max-width: 767px) {
  .live-course-body .es-live-all .media-left {
    display: block;
    padding: 0;
  }
}

.live-course-body .es-live-all .media-left img {
  max-width: 302px;
  border-radius: 4px;
}

@media (max-width: 1199px) {
  .live-course-body .es-live-all .media-left img {
    max-width: 767px;
    width: 100%;
  }
}

@media (max-width: 1200px) {
  .live-course-body .es-live-all .media-left img {
    width: 288px;
  }
}

.live-course-body .es-live-all .media-body {
  position: relative;
}

.live-course-body .es-live-all .media-body .title {
  height: 20px;
  overflow: hidden;
  margin-top: 10px;
}

.live-course-body .es-live-all .media-body .title a {
  font-size: 16px;
}

.live-course-body .es-live-all .media-body .metas {
  margin: 15px 0 20px;
  color: #c1c1c1;
}

.live-course-body .es-live-all .media-body .user {
  min-height: 30px;
}

.live-course-body .es-live-all .media-body .user a {
  color: #c1c1c1 !important;
}

.live-course-body .es-live-all .media-body .other {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -34px;
  text-align: center;
}

@media (max-width: 767px) {
  .live-course-body .es-live-all .media-body .other {
    margin-top: -14px;
  }

  .public-top-warp .open-course-msg .course-operation {
    display: none;
  }
}

.live-course-body .es-live-all .media-body .other span {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
}

.live-course-body .es-live-all .media-body .other a {
  position: absolute;
  right: 0;
}

.embed-responsive-16by9.masks {
  z-index: 99;
}

.breadcrumb.open-course-breadcrumb {
  margin: -30px 0 0;
  background: transparent;
  padding: 25px 0 20px;
}

/* 公开课详情页 */
.video-info-wrap {
  max-width: 1080px;
  background: url("/static-dist/app/img/shenlan19/gongkaikebj01_pic.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 400px;
  border-radius: 8px;
  padding: 70px 0;
  margin: 50px auto;
}

.video-info-wrap .video-info {
  text-align: center;
  padding: 50px 0;
  border-right: 1px solid rgba(216, 216, 216, 0.4);
}

.video-info-wrap .video-info p {
  font-size: 18px;
  color: #ffffff;
}

.video-info-wrap .video-info p.small {
  font-size: 12px;
}

.video-info-wrap .video-info i.es-icon-playcircleoutline {
  font-size: 95px;
  color: #fff;
}

.video-info-wrap .video-info-text {
  color: #ffffff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  /* border-left:1px solid rgba(216,216,216,0.4); */
  padding: 8px 80px 0;
}

.video-info-wrap .video-info-text .title {
  font-size: 24px;
  padding-bottom: 17px;
}

.video-info-wrap .video-info-text .text {
  font-size: 14px;
  color: #ffffff;
  text-align: justify;
  /* line-height: 28px; */
  max-height: 234px;
  overflow: auto;
}

.video-info-wrap .video-info-text .text p {
  line-height: 26px;
  margin-bottom: 10px;
}

/* 公开课按钮入口样式 */
.video-info-wrap .video-info .courseStatus-willdo {
  display: inline-block;
  margin: 10px 0 10px;
  opacity: 0.2;
  cursor: default;
}

.video-info-wrap .video-info .courseStatus-doing,
.video-info-wrap .video-info .courseStatus-done {
  display: inline-block;
  margin: 25px 0 10px;
  border: 2px solid #ffffff;
  border-radius: 30px;
  width: 144px;
  line-height: 48px;
  color: #fff;
  background: #FE9402;
  border-color: #FE9402;
}

.video-info-wrap .video-info .opacity2 {
  opacity: 0.2;
}

.video-info-wrap .video-info .playcircleoutline {
  display: inline-block;
  margin: 10px 0 10px;
}

/* .video-info-wrap .video-info .courseStatus-done{
    display: inline-block;margin: 25px 0 10px;border: 2px solid rgba(255,255,255,0.4);border-radius: 30px;width: 144px;line-height: 48px;color:rgba(255,255,255,0.4); cursor:default;
} */
/* 滚动条样式 */
.task-scrollbarsl {
  padding-right: 10px;
  overflow-y: scroll;
}

.task-scrollbarsl::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 6px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 1px;
}

.task-scrollbarsl::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 10px;
  box-shadow: inset 0 0 5px rgba(20, 72, 8, 0.3);
  background: #3cb2ff;
}

.task-scrollbarsl::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow: inset 0 0 5px rgba(255, 0, 0, 0.2);
  border-radius: 10px;
  background: #85bcff;
}

/* 滚动条美化end */

.public-top-warp {
  color: #fff;
}

.public-top-warp h2 {
  font-size: 32px;
  color: #ffffff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  padding-top: 30px;
  padding-bottom: 16px;
  /* overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; */
  width: 78%;
}

.public-top-warp .course-author {
  font-size: 12px;
}
/* 公开课 - 开课时间+立即学习 父级 */
.open-course-study-time {
  margin-top: -52px;
}

.open-course-study-time .study-time-row {
  display: flex;
  height: 110px;
}
/* 公开课 - 联系客服 提示信息 */
.open-course-study-time .contact-tip {
  text-align: right;
  padding-right: 20px;
}

.open-course-study-time .contact-tip .hover-text {
  display: inline-block;
  text-align: right;
  font-size: 12px;
  color: #666;
}
.open-course-study-time .contact-tip .hover-text .es-icon-qrcode:before {
  color: #4695e0;
}

/* 公开课 - 提示信息 tooltip样式重置 start */
.open-course-study-time .contact-tip .tooltip.in,
.open-course-videoinfo-wrap .contact-tip .tooltip.in  {
  opacity: 1;
  filter: alpha(opacity=100)
}

.open-course-study-time .contact-tip .tooltip-inner,
.open-course-videoinfo-wrap .contact-tip .tooltip-inner {
  background: #ffffff !important;
  width: 110px;
  height: 110px;
  padding: 0 !important;
  /* display: flex;
  flex-direction: column; */
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
  filter: alpha(opacity=100) !important;
  box-shadow: 0px 1px 13px 0px rgba(29,103,188,0.36);
  border-radius: 4px;
}

.open-course-study-time .contact-tip .tooltip-arrow,
.open-course-videoinfo-wrap .contact-tip .tooltip-arrow {
  /* border-bottom-color: #ffffff !important;
  box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1) */
  display: none;
}

.open-course-study-time .contact-tip .tooltip-inner img,
.open-course-videoinfo-wrap .contact-tip .tooltip-inner img {
  width: 100px;
  height: 100px;
  margin: 5px;
}
/* 公开课 - 提示信息 tooltip样式重置 end */

.open-course-header {
  margin-bottom: 15px;
  position: relative;
}

.open-course-header .black-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #000;
}

.open-course-header>.row {
  margin: 0;
}

.open-course-detail-main {
  width: 45%;
  float: left;
}

.open-course-detail-main img {
  width: 120px;
  max-width: 120px;
  height: 68px;
  border-radius: 2px;
}

.open-course-detail-main .title {
  font-size: 20px;
  color: #313131;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.open-course-detail-main .metas span {
  font-size: 15px;
  color: #919191;
}

.open-course-detail-main .metas span:first-child {
  margin-right: 30px;
}

.open-course-detail-main .media-body {
  padding: 8px 0;
}

.open-course-detail-operation {
  float: left;
  width: 55%;
  padding: 20px 0;
}

@media (max-width: 991px) {
  .open-course-detail-operation {
    width: 100%;
  }
}

.open-course-detail-operation .operation-list {
  display: inline-block;
  width: 24%;
  text-align: center;
  border-right: 1px solid #f1f1f1;
}

.open-course-detail-operation .operation-list:last-child {
  border-right: none;
}

@media (max-width: 991px) {
  .open-course-detail-operation .operation-list {
    width: 32%;
  }
}

@media (max-width: 991px) {
  .open-course-detail-operation .operation-list.no-border {
    border-right: 1px solid transparent;
  }
}

.open-course-detail-operation .operation-img.operation-share a {
  display: inline-block;
}

.open-course-detail-operation .operation-img {
  display: inline-block;
  width: 36px;
  height: 36px;
  color: #fff;
  border-radius: 50%;
  text-align: center;
  margin-right: 8px;
  background: #919191;
  transition: all 0.3s ease;
}

.open-course-detail-operation .operation-img a {
  color: #fff;
  display: block;
}

.open-course-detail-operation .operation-img i {
  font-size: 18px;
  line-height: 36px;
}

.open-course-detail-operation .operation-img .qrcode-popover.top .qrcode-content {
  left: -77px;
  top: -247px;
}

.open-course-detail-operation .operation-zan.active,
.open-course-detail-operation .operation-zan:hover {
  background: #e85749;
  transition: all 0.3s ease;
}

.open-course-detail-operation .operation-share:hover {
  background: #83d460;
  transition: all 0.3s ease;
}

.open-course-detail-operation .operation-collection.active,
.open-course-detail-operation .operation-collection:hover {
  background: #53c3f5;
  transition: all 0.3s ease;
}

.open-course-detail-operation .operation-code:hover {
  background: #ff8a0c;
  transition: all 0.3s ease;
}

.open-course-detail {
  position: relative;
}

.open-course-detail .btn-setting {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 0 3px;
}

.open-course-container {
  padding: 0;
}

.open-course-wechat-preview .open-course-container {
  max-width: 740px;
}

.open-course-wechat-preview .open-course-container .open-course-wechat-qrcode {
  position: fixed;
  right: 50%;
  top: 100px;
  background: #fff;
  margin-right: -585px;
}

.open-course-wechat-preview .open-course-container .open-course-wechat-qrcode img {
  width: 200px;
  height: 200px;
}

.open-course-panel {
  margin: 15px 0;
  border-color: transparent;
  border-radius: 0;
}

.open-course-panel .panel-heading {
  border: none;
}

.open-course-panel .panel-heading:before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  vertical-align: sub;
  margin-right: 6px;
}

.open-course-intro img {
  max-width: 100%;
}

.open-course-recommend {
  margin-bottom: 15px;
}

.open-course-recommend:last-child {
  margin-bottom: 0;
}

.open-course-recommend .open-course-img {
  float: left;
  width: 30%;
  margin-right: 20px;
}

.open-course-recommend .open-course-content {
  float: left;
  width: 63%;
}

.open-course-recommend .title {
  margin: 8px 0 5px;
}

.open-course-recommend .title a {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  color: #313131;
}

.open-course-recommend .metas {
  font-size: 12px;
  color: #919191;
}

.open-course-img {
  float: left;
  width: 15%;
}

.open-course-comment {
  float: left;
  width: 84%;
  margin: 0 auto;
}

.open-course-comment textarea {
  margin: 0 auto;
}

.open-course-comment textarea.form-control-o {
  background-color: transparent;
  border: 1px solid #f5f5f5;
}

.es-open-course-list .course-item .title {
  max-width: 58%;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  font-size: 16px;
  margin-top: 20px;
  padding: 0 15px;
}

@media (max-width: 767px) {
  .es-open-course-list .course-item .title a {
    font-size: 12px;
  }

  /* 公开课详情页 */
  .public-top-warp h2 {
    font-size: 19px;
    white-space: normal;
    line-height: 24px;
    width: 90%;
    padding-bottom: 20px;
  }

  .open-course-study-time li {
    border: 0px !important;
    margin-bottom: 0px;
  }

  .open-course-study-time li:nth-of-type(3) {
    margin-top: 0px;
  }

  .open-course-study-time .public-class {
    display: none;
  }

  .video-info-wrap {
    height: auto;
    padding: 0;
    background: none;
    margin: 20px auto;
  }

  .video-info-wrap .video-info i.es-icon-playcircleoutline {
    font-size: 65px;
  }

  .video-info-wrap .video-info {
    height: 220px;
    /* background: url(/static-dist/app/img/shenlan19/gongkaikebj01_pic.png); */
    background-repeat: no-repeat;
    border-radius: 8px;
    margin: 0 10px;
    border: 0;
    background-image: linear-gradient(48deg, #4351C9 0%, #2966E9 100%);
  }

  .video-info-wrap .video-info-text .title {
    font-size: 19px;
  }

  .video-info-wrap .video-info-text {
    padding: 20px;
    border: 0;
    /* background: url(/static-dist/app/img/shenlan19/gongkaikebj01_pic.png) no-repeat; */
    background-size: cover;
    margin-top: 20px;
  }

  .video-info-wrap .video-info-text .text {
    font-size: 12px;
    /* line-height:24px; */
    max-height: 100%;
  }

  .video-info-wrap .video-info-text .text p {
    line-height: 24px;
  }
}

@media (max-width: 767px) {
  .es-open-course-list .course-item .title {
    margin-top: 5px;
    display: block;
    max-width: 100%;
  }
}

.es-open-course-list .course-item .course-img .img-responsive {
  padding: 0;
}

.es-open-course-list .course-item .course-img .mask {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: #000;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  padding: 10px;
}

@media (max-width: 767px) {
  .es-open-course-list .course-item .course-img .mask {
    font-size: 12px;
    padding: 6px;
  }
}

.es-open-course-list .course-item .metas {
  padding: 22px 15px;
}

@media (max-width: 767px) {
  .es-open-course-list .course-item .metas {
    padding: 10px 15px;
    font-size: 12px;
    width: 100%;
  }
}

.open-course-title {
  font-size: 18px;
  margin-bottom: 10px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.open-course-mobile-title {
  font-size: 20px;
  margin-bottom: 0;
  padding: 10px 10px 0;
  background: #fff;
  margin-top: 15px;
}

.open-course-mobile-title p {
  font-size: 16px;
}

.open-course-mask {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: #000;
  background-color: rgba(0, 0, 0, 0.9);
}

.open-course-mask .mask-content {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 330px;
  height: 160px;
  margin-top: -80px;
  margin-left: -165px;
  text-align: center;
}

.open-course-mask .mask-content h2 {
  color: #fff;
  font-size: 20px;
  margin-bottom: 20px;
}

.open-course-mask .mask-content .mask-btn {
  font-size: 20px;
  border-radius: 4px;
}

.open-course-mask .mask-content .mask-btn .es-icon {
  font-size: 23px;
  padding-left: 10px;
}

.open-course-mask .open-course-content {
  background: transparent;
  text-align: center;
}

.open-course-mask .open-course-content img {
  position: absolute;
  right: 0;
  top: 0;
}

.open-course-mask .open-course-content .metas {
  position: absolute;
  left: 50%;
  margin-left: -142px;
  top: 156px;
}

.open-course-mask .open-course-content p {
  font-size: 22px;
  color: #fff;
}

.open-course-mask .open-course-content .open-course-btn {
  border: 1px solid #fff;
  color: #fff;
  border-radius: 0;
  margin-top: 10px;
}

.open-course-views.open-course-wechat-views {
  padding-top: 40px;
}

.open-course-views {
  position: relative;
  padding: 0;
  background-color: #000;
  height: 500px;
}

@media (max-width: 767px) {
  .open-course-views {
    height: 300px;
  }
}

.open-course-views .mask-img {
  width: 100%;
  padding-top: 10px;
}

@media (max-width: 1199px) {
  .open-course-views .mask-img {
    padding-top: 50px;
  }
}

@media (max-width: 991px) {
  .open-course-views .mask-img {
    padding: 0;
  }
}

.open-course-views .lesson-content {
  height: 100%;
}

.open-course-views .mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #000;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 3;
}

.open-course-views .mask .mask-content {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 330px;
  height: 160px;
  margin-top: -80px;
  margin-left: -165px;
  text-align: center;
}

@media (max-width: 991px) {
  .open-course-views .mask .mask-content {
    margin-top: -60px;
  }
}

.open-course-views .mask .mask-content h2 {
  color: #fff;
  font-size: 20px;
  margin-bottom: 20px;
}

.open-course-views .mask .mask-content .mask-btn {
  font-size: 20px;
  border-radius: 4px;
}

.open-course-views .mask .mask-content .mask-btn .es-icon {
  font-size: 23px;
  padding-left: 10px;
}

.open-course-views .mask .open-course-content {
  background: transparent;
  text-align: center;
}

.open-course-views .mask .open-course-content img {
  position: absolute;
  right: 0;
  top: 0;
}

.open-course-views .mask .open-course-content .metas {
  position: absolute;
  left: 50%;
  margin-left: -142px;
  top: 156px;
}

.open-course-views .mask .open-course-content p {
  font-size: 22px;
  color: #fff;
}

.open-course-views .mask .open-course-content .open-course-btn {
  border: 1px solid #fff;
  color: #fff;
  border-radius: 0;
  margin-top: 10px;
}

.open-course-views .modal-dialog .modal-img {
  float: left;
  width: 33.3%;
  padding: 0 8px;
}

.open-course-views .modal-dialog .modal-img img {
  margin-bottom: 12px;
  border-radius: 4px;
}

.open-course-views .modal-dialog .modal-img .title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  color: #313131;
}

.open-course-views .modal-dialog .modal-footer .es-share .dropdown-menu {
  left: 96px;
}

.open-course-views .modal-dialog .modal-footer .es-share a {
  color: #fff;
  font-size: 14px;
}

.open-course-views .modal-dialog .modal-footer .es-share .share-btn {
  background-color: #70d445;
  border-color: #70d445;
}

.open-course-views .modal-dialog .modal-footer .es-share .share-btn:hover {
  background-color: #56bb2b;
}

.open-course-views .modal-dialog .modal-footer .es-share .next-btn {
  background-color: #ff8a0c;
  border-color: #ff8a0c;
}

.open-course-views .modal-dialog .modal-footer .es-share .next-btn:hover {
  background-color: #d87000;
}

.open-course-mobile-views {
  background: #fff;
  padding: 0 10px 10px;
}

.open-course-tab {
  height: 500px;
  background-color: #212121;
  color: #fff;
  padding: 0;
}

@media (max-width: 991px) {
  .open-course-tab {
    height: auto;
  }
}

.open-course-tab ul {
  padding: 0;
  margin-bottom: 0;
  list-style-type: none;
}

.open-course-tab ul .tab-header {
  float: left;
  width: 50%;
  padding: 20px 0;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
  background-color: #313131;
}

.open-course-tab ul .tab-header.active,
.open-course-tab ul .tab-header:hover {
  background-color: #212121;
  transition: all 0.3s ease;
}

@media (max-width: 991px) {
  .open-course-tab ul .tab-header {
    padding: 15px 0;
    font-size: 14px;
  }
}

.open-course-tab .tab-recommand {
  padding: 10px 20px 10px 15px;
}

.open-course-tab .tab-recommand:first-child {
  padding: 15px 20px 10px 15px;
}

.open-course-tab .tab-recommand img {
  float: left;
  width: 118px;
  border-radius: 4px;
}

@media (max-width: 1199px) {
  .open-course-tab .tab-recommand img {
    width: 100px;
  }
}

.open-course-tab .tab-recommand .open-course-info {
  margin-left: 138px;
}

@media (max-width: 1199px) {
  .open-course-tab .tab-recommand .open-course-info {
    margin-left: 108px;
  }
}

.open-course-tab .tab-recommand .open-course-info .title {
  display: inline-block;
  padding-bottom: 8px;
  max-height: 42px;
  line-height: 21px;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: hsla(0, 0%, 100%, 0.8);
}

.open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.open-course-tab .tab-recommand .open-course-info .num {
  color: hsla(0, 0%, 100%, 0.5);
  overflow: hidden;
  height: 21px;
}

.open-course-tab .tab-live a {
  display: block;
  padding: 14px 50px 14px 20px;
  color: hsla(0, 0%, 100%, 0.7);
  cursor: pointer;
  overflow: hidden;
  word-wrap: normal;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.open-course-tab .tab-live a.active,
.open-course-tab .tab-live a:active,
.open-course-tab .tab-live a:hover {
  color: #fff;
  background-color: #46c37b;
}

.open-course-mobile-tab {
  background: #fff;
  margin-bottom: 20px;
}

.open-course-mobile-tab ul .tab-header {
  background-color: #fff;
  border-bottom: 2px solid #616161;
  color: #616161;
  font-size: 13px;
}

.open-course-mobile-tab ul .tab-header.active {
  background-color: #fff;
  border-bottom: 2px solid #46c37b;
  color: #46c37b;
}

.open-course-detail .intro-img {
  width: 186px;
  display: block;
  margin-top: 10px;
}

.open-course-teacher img {
  margin: 0 auto;
}

.open-course-teacher .intro {
  line-height: 20px;
  text-align: left;
  font-size: 12px;
  color: #313131;
}

.course-comment {
  padding: 15px 20px;
}

.course-comment .media {
  margin-bottom: 40px;
  margin-top: 20px;
}

.course-comment .media:first-child {
  margin-bottom: 20px;
  border-bottom: 1px solid #f5f5f5;
}

.open-starttime {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  color: #fff;
  height: 30px;
  line-height: 30px;
  padding-left: 10px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.5);
}

@media (max-width: 1199px) {
  .open-starttime {
    font-size: 12px;
  }
}

.open-course-list .course-block {
  padding: 20px;
  border: 1px solid #e4ecf3;
  background-color: #fff;
  margin-bottom: 20px;
}

@media (max-width: 991px) {
  .open-course-list .course-block {
    width: 48%;
    float: left;
    margin: 0 1% 20px;
    padding: 0;
  }
}

.open-course-list .course-block .course-img {
  position: relative;
  float: left;
  width: 35%;
}

.open-course-list .course-block .course-img img {
  width: 100%;
}

@media (max-width: 991px) {
  .open-course-list .course-block .course-img {
    float: none;
    width: 100%;
  }
}

.open-course-list .course-block .open-course-content {
  float: left;
  width: 65%;
  padding-left: 20px;
}

@media (max-width: 991px) {
  .open-course-list .course-block .open-course-content {
    float: none;
    width: 100%;
    padding: 0 10px 10px;
  }

  .open-course-list .course-block .open-course-content .title {
    padding-top: 10px;
  }
}

@media (max-width: 767px) {
  .open-course-list .course-block .open-course-content {
    padding: 0 5px 5px;
  }
}

.open-course-list .course-block .open-course-content .title {
  margin-bottom: 10px;
}

.open-course-list .course-block .open-course-content .title a {
  font-size: 22px;
  vertical-align: middle;
}

@media (max-width: 991px) {
  .open-course-list .course-block .open-course-content .title a {
    font-size: 14px;
  }
}

.open-course-list .course-block .open-course-intro {
  margin-bottom: 20px;
  height: 80px;
  overflow: hidden;
  color: #919191;
}

@media (max-width: 1199px) {
  .open-course-list .course-block .open-course-intro {
    height: 60px;
    margin-bottom: 10px;
  }
}

.open-course-list .course-block .metas {
  line-height: 34px;
}

@media (max-width: 767px) {
  .open-course-list .course-block .metas {
    line-height: 20px;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .open-course-list .course-block .metas .btn {
    font-size: 12px;
  }
}

@media (min-width: 768px) and (max-width: 1400px) {

  /* 右下角位置 */
  .service-module {
    position: fixed;
    margin-left: 0;
    right: 70px;
    bottom: 228px;
    z-index: 20;
  }
}

.open-course-list .course-block .metas span {
  margin-right: 15px;
  color: #c1c1c1;
  font-size: 12px;
}

@media (max-width: 991px) {
  .open-course-list .course-block .metas span {
    margin-right: 5px;
  }
}

.open-course-list .course-block .metas span .es-icon {
  margin-right: 5px;
  font-size: 20px;
}

@media (max-width: 767px) {
  .open-course-list .course-block .metas span .es-icon {
    font-size: 16px;
  }
}

.open-course-list .section-more-btn {
  margin: 40px 0 70px;
}

.open-course-list .tags {
  position: absolute;
  top: 0;
  left: 10px;
}

.open-course-list .tags .tag-open-live {
  display: inline-block;
  width: 40px;
  height: 50px;
}

/* .open-course-sms-form .help-block {
    margin-top: 47px;
    margin-left: 200px
} */

@media (max-width: 991px) {
  .open-course-sms-form .help-block {
    margin: 0;
  }
}

@media (max-width: 991px) {
  .open-course-form-control {
    width: 67%;
    display: inline-block;
  }
}

@media (max-width: 991px) {
  .open-course-form-btn {
    width: 30%;
    display: inline-block;
  }
}

.materiallib-stats .stats-summary {
  padding: 15px;
}

.stats-summary .piece {
  cursor: pointer;
  padding: 0;
  height: 100px;
  border: 2px solid #eee;
}

.stats-summary .piece.border-sm-left {
  border-left-width: 1px;
}

.stats-summary .piece.border-sm-top {
  border-top-width: 1px;
}

.stats-summary .piece.border-sm-right {
  border-right-width: 1px;
}

.stats-summary .piece.border-sm-bottom {
  border-bottom-width: 1px;
}

.stats-summary .piece.active,
.stats-summary .piece:hover {
  border: 2px solid #499ae6;
}

.stats-summary .piece .quantum {
  padding: 20px;
}

.stats-summary .piece .quantum .p-text {
  font-size: 16px;
}

.stats-summary .piece .quantum .number {
  color: #499ae6;
  font-weight: 500;
}

.materiallib-stats .pie-container {
  padding: 15px;
}

.pie-container .left {
  padding-left: 0;
  padding-right: 5px;
}

.pie-container .right {
  padding-left: 5px;
  padding-right: 0;
}

.pie-container .pie {
  padding: 0;
  height: 460px;
  border: 4px solid #eee;
}

.materiallib-stats .line-container {
  padding: 15px;
}

.line-container .container {
  padding: 0;
}

.line-container .line {
  border: 4px solid #eee;
  height: 300px;
}

.materiallib-stats .chart {
  display: none;
}

.materiallib-stats .chart.active {
  display: block;
}

.material-body .page-header {
  display: none;
}

.material-detail-widget .header {
  padding-bottom: 12px;
  margin: 0 0 20px;
  padding: 0;
  border-bottom-width: 2px;
  border-bottom: 1px solid #eee;
}

.material-detail-widget .header h1 {
  display: inline;
  font-size: 18px;
  line-height: 32px;
  margin: 0;
}

.material-detail-widget .content .tab-panne {
  display: none;
}

.material-detail-widget .content .tab-panne.active {
  display: block;
}

.material-detail-widget .content .nav {
  margin-bottom: 20px;
}

.my-materials-list .materials-ul {
  height: 200px;
}

.materials-ul {
  border: 1px solid #eee;
  padding-left: 0;
  height: 218px;
  background: #fafafa;
}

.materials-ul.batch-hidden i {
  display: none !important;
}

.materials-ul li {
  list-style-type: none;
}

.materials-ul li img {
  width: 100%;
}

.materials-ul li .op-btn {
  text-align: center;
  height: 40px;
  line-height: 40px;
  padding: 0;
  cursor: pointer;
  border-top: 1px solid #eee;
}

.materials-ul li .op-btn:hover {
  background: #eee;
}

.materials-ul li.op-li {
  margin: 0;
}

.materials-ul li .border-left {
  border-left: 1px solid #eee;
}

.materials-ul li.img-li .reconvert-btn {
  position: absolute;
  left: 35%;
  top: 40%;
}

.materials-ul li.caption {
  padding: 8px 10px;
}

.materials-ul li.caption p.date,
.materials-ul li.caption p.tags {
  font-size: 10px;
  margin-bottom: 0;
}

.materials-ul li.caption p.use-time {
  font-size: 10px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.material-list-container {
  margin-top: 20px;
}

#material-search-form .source-btn {
  margin-bottom: 10px;
}

.material-collection {
  color: #ff8a0c;
}

.batch-item {
  position: absolute;
  left: 8px;
  top: 4px;
  z-index: 101;
}

.materials-type {
  margin-bottom: 25px !important;
}

.materials-type ul {
  padding: 0;
}

.materials-type li {
  list-style-type: none;
}

.materials-type li.dropdown {
  padding: 5px 11px;
  border: 1px solid #ccc;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  border-color: #e1e1e1;
}

.materials-type li.dropdown a {
  color: #616161;
}

.materials-type .form-control {
  height: 32px;
  border-color: #e1e1e1;
  box-shadow: none;
  position: relative;
  left: -4px;
  width: 240px;
}

.es-materials-manage .nav-tabs>li span {
  display: block;
  padding: 14px 15px 15px;
  color: #919191;
}

.es-materials-manage .nav-tabs>li>a {
  padding: 14px 15px 15px;
  color: #313131;
}

.es-materials-manage .nav-tabs>li>a,
.es-materials-manage .nav-tabs>li>a:hover {
  border-top: 1px solid transparent;
  border-left: 1px solid transparent;
  border-right: 1px solid transparent;
}

.es-materials-manage .nav-tabs>li>a:hover {
  background: transparent;
}

.es-materials-manage .nav-tabs>li.active>a {
  border-bottom-color: #ddd;
}

.es-materials-manage .nav-tabs>li.active>a:hover {
  border-top: 1px solid transparent;
  border-left: 1px solid transparent;
  border-right: 1px solid transparent;
}

.es-materials-manage .es-materials-filter {
  padding-top: 8px;
}

.es-materials-manage .es-materials-filter .form-control {
  width: 180px;
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
}

.es-materials-manage .form-csearch-type {
  width: auto;
}

.es-materillib-table a {
  color: #616161;
}

.es-materillib-table a:hover {
  text-decoration: none;
}

.es-materials-manage .table>tbody>tr>td {
  vertical-align: middle;
  color: #313131;
}

.material-search-list {
  position: relative;
  padding-bottom: 15px;
  border-bottom: 1px solid #f5f5f5;
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .material-search-list .btn-group {
    margin-top: 10px;
  }

  .btn-ctiy-chaptersm {
    margin-top: 9px !important;
  }
}

.material-search-list .all {
  position: absolute;
  top: 13px;
  left: 15px;
  color: #919191;
}

.material-search-list .right-content {
  padding-left: 70px;
}

.material-search-list.material-tabs {
  padding-top: 10px;
  padding-bottom: 10px;
}

.material-search-list.material-tabs .all {
  top: 15px;
}

.material-search-list.material-tabs .right-content {
  margin-bottom: 0;
}

.material-search-list.material-tabs .right-content li {
  float: left;
  list-style-type: none;
}

.material-search-list.material-tabs .right-content li a {
  display: inline-block;
  padding: 5px 10px;
  color: #616161;
}

.material-search-list.material-tag {
  padding-top: 10px;
  padding-bottom: 10px;
}

.material-search-list.material-tag .right-content .label {
  margin: 5px;
  display: inline-block;
  cursor: pointer;
}

.material-search-list.bottom {
  padding-top: 15px;
  margin-bottom: 20px;
}

.material-search-list.bottom .all {
  top: 22px;
}

@media (max-width: 767px) {
  .material-search-list.bottom {
    padding-bottom: 5px;
  }

  .material-search-list.bottom .form-control {
    margin-bottom: 10px;
  }
}

.material-search-list.bottom .input-time {
  display: inline-block;
  width: 48%;
}

.material-search-list.bottom .input-space {
  display: inline-block;
  width: 4%;
  text-align: center;
}

.materials-modal-body .nav.nav-tabs>li>a {
  border-bottom: 1px solid transparent;
}

.materials-modal-body .nav.nav-tabs>li.active>a,
.materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #46c37b;
}

.materials-ul .img-li {
  position: relative;
  height: 103px;
}

.materials-ul .img-li img {
  height: 100%;
}

.materials-ul .img-li .mask {
  position: absolute;
  opacity: 0;
  filter: alpha(opacity=0);
  transition: all 0.3s ease;
  visibility: hidden;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  text-align: right;
}

.materials-ul .img-li .mask .icon-operation {
  position: relative;
  padding: 10px 0;
  height: 40px;
}

.materials-ul .img-li .mask .icon-operation .dropdown-menu {
  left: auto;
  right: 0;
}

.materials-ul .img-li .mask .icon-operation i {
  cursor: pointer;
  font-size: 16px;
  margin-right: 10px;
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.materials-ul .img-li .mask .icon-operation i:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

.materials-ul .img-li .mask .btn-operation {
  text-align: center;
  margin-top: 5px;
  height: 35px;
}

.materials-ul .img-li .mask .time {
  height: 22px;
  padding: 5px 2px;
  font-size: 12px;
}

.materials-ul .img-li:hover {
  transition: all 0.3s ease;
}

.materials-ul .img-li:hover .mask {
  opacity: 1;
  filter: alpha(opacity=100);
  visibility: visible;
}

.materials-ul .capon .state {
  height: 20px;
}

.materials-ul .status-parent {
  height: 19px;
  overflow: hidden;
}

.tab-content-img .tab-pane-img {
  display: none;
}

.tab-content-img .tab-pane-img.active {
  display: block;
}

.material-detail-img {
  height: 150px;
}

.material-detail-img .detail-img {
  height: 100%;
  width: 267px;
  margin-right: 20px;
  overflow: hidden;
  text-align: center;
  background-color: #000;
  float: left;
}

.material-detail-img .detail-img img {
  height: 100%;
  width: auto;
}

.material-detail-img .btn {
  margin-top: 58px;
}

@media (max-width: 1199px) {
  .material-detail-img {
    height: auto;
  }
}

@media (max-width: 480px) {
  .material-detail-img {
    height: auto;
  }

  .material-detail-img .detail-img {
    float: none;
  }

  .material-detail-img .btn {
    margin-top: 10px;
  }
}

.material-detail-save {
  text-align: center;
  padding-top: 30px;
  margin-bottom: 20px;
  border-top: 1px solid #ddd;
}

.media-preview .media-preview-content .title {
  padding-top: 35px;
  text-align: center;
  font-size: 30px;
}

.media-preview .media-preview-content .media-preview-player {
  position: absolute;
  top: 120px;
  bottom: 60px;
  left: 120px;
  right: 120px;
}

.course-manage-header {
  position: relative;
}

.course-manage-header .picture {
  float: left;
  height: 60px;
  margin-right: 10px;
}

.course-manage-header .title {
  margin: 5px 170px 10px 0;
  line-height: 1.2;
  font-size: 18px;
  font-weight: 700;
  word-break: break-all;
}

@media (max-width: 767px) {
  .course-manage-header .title {
    margin-right: 10px;
  }
}

.course-manage-header .teachers {
  color: #919191;
  font-size: 13px;
}

.course-manage-header .teachers a {
  margin-right: 10px;
  color: #616161;
}

.course-manage-header .toolbar {
  position: absolute;
  right: 15px;
  top: 50%;
  margin-top: -15px;
}

.task-price-setting-group {
  position: relative;
  max-height: 211px;
  overflow: hidden;
  padding-bottom: 5px;
}

.task-price-setting-group .price {
  visibility: hidden;
}

.task-price-setting-group .title {
  max-width: 80%;
}

.task-price-setting-group li.open .price {
  visibility: visible;
}

.study-process-item {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.study-process-item i {
  position: absolute;
  bottom: -30px;
  right: 0;
  font-size: 100px;
  z-index: -1;
  color: #f1f1f1;
}

@media (max-width: 1199px) {
  .study-process-item i {
    display: none;
  }
}

.study-process-item.bg-danger .content,
.study-process-item.bg-danger .title,
.study-process-item.bg-success .content,
.study-process-item.bg-success .title,
.study-process-item.warning .content,
.study-process-item.warning .title {
  color: #fff;
}

.study-process-item.bg-danger i,
.study-process-item.bg-success i,
.study-process-item.warning i {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.study-process-item .title {
  color: #919191;
  margin-bottom: 20px;
}

.study-process-item .content {
  color: #313131;
}

.study-process-item .current {
  font-size: 40px;
  margin-right: 10px;
}

.study-process-item .total {
  font-size: 16px;
  margin-left: 10px;
}

.process-table {
  padding: 15px;
}

.process-table .reference {
  font-size: 12px;
  margin-bottom: 20px;
}

.process-table .reference-item {
  display: inline-block;
  margin-right: 20px;
}

.process-table .reference-item i {
  margin-right: 10px;
}

.process-table .lump-list {
  margin: 0 -3px;
}

.process-table .lump-list .color-lump {
  margin: 3px;
}

.study-data .well {
  position: relative;
  text-align: center;
  z-index: 1;
  color: #919191;
  font-size: 16px;
  padding-top: 30px;
  margin-bottom: 20px;
  overflow: hidden;
}

.study-data .well i {
  position: absolute;
  bottom: -20px;
  left: 0;
  font-size: 100px;
  z-index: -1;
  color: #f1f1f1;
}

@media (max-width: 1199px) {
  .study-data .well i {
    display: none;
  }
}

.study-data .well .number {
  font-size: 32px;
  color: #313131;
}

.process-popover {
  width: 300px;
  text-align: center;
}

.process-popover .popover-content {
  padding: 10px;
}

.process-popover .process-popover-title {
  background-color: #e1e1e1;
  color: #fff;
  margin-bottom: 30px;
  padding: 8px 10px;
  border-radius: 4px;
}

.process-popover .process-popover-score {
  font-size: 34px;
  color: #313131;
  margin-bottom: 25px;
}

.process-popover .process-popover-date {
  margin-bottom: 10px;
  color: #919191;
  font-size: 12px;
}

.report-card {
  padding-bottom: 30px;
}

.report-card+.report-card {
  padding-top: 40px;
  border-top: 1px solid #f5f5f5;
}

.report-card .report-card-header {
  position: relative;
  padding-right: 150px;
  margin-bottom: 20px;
  color: #919191;
}

@media (max-width: 767px) {
  .report-card .report-card-header {
    padding-right: 0;
  }
}

.report-card .report-card-header .include {
  position: absolute;
  top: 0;
  right: 0;
}

@media (max-width: 767px) {
  .report-card .report-card-header .include {
    display: none;
  }
}

.report-card .card-main-title {
  position: relative;
  height: 40px;
  margin-bottom: 20px;
  line-height: 40px;
  padding: 0 200px 0 10px;
  background-color: #fafafa;
  color: #313131;
  transition: all 0.3s ease;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

@media (max-width: 767px) {
  .report-card .card-main-title {
    padding: 0 10px;
  }
}

.report-card .card-main-title .score {
  position: absolute;
  top: 0;
  right: 60px;
  margin-bottom: 0;
  color: #e83d2c;
}

.report-card .card-main-title .score span {
  font-size: 22px;
}

.report-card .card-main-title .reviews {
  position: absolute;
  top: 0;
  right: 10px;
}

.report-card .card-main-title .reviews:hover {
  cursor: pointer;
}

.report-card .score-list {
  padding-left: 10px;
  margin-bottom: 20px;
}

.report-card .score-list li {
  position: relative;
  line-height: 30px;
  height: 30px;
  color: #919191;
  list-style-type: none;
}

.report-card .score-list li:after {
  position: absolute;
  content: "";
  top: 50%;
  left: 180px;
  right: 110px;
  border-bottom: 1px dashed #919191;
}

@media (max-width: 767px) {
  .report-card .score-list li:after {
    right: 50px;
  }
}

.report-card .score-list .name {
  color: #313131;
  margin-right: 20px;
}

.report-card .score-list .score {
  position: absolute;
  top: 0;
  right: 60px;
}

@media (max-width: 767px) {
  .report-card .score-list .score {
    right: 10px;
  }
}

.task-create-editor {
  padding: 0 20px;
}

.task-create-editor .task-create-type-list {
  padding: 0 55px;
  margin-bottom: 0;
  list-style: none;
}

.task-create-editor .task-create-type-list .task-create-type-item {
  margin-bottom: 20px;
}

.task-create-editor .task-create-type-list .task-create-type-item>a {
  height: 110px;
  background-color: #f4f6f8;
  display: block;
  text-align: center;
  color: #919191;
  transition: all 0.3s ease;
  border-radius: 4px;
  border: 3px solid #f4f6f8;
}

.task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  background: #f4f6f8;
  transition: all 0.3s ease;
}

.task-create-editor .task-create-type-list .task-create-type-item.active>a {
  color: #fff;
  transition: all 0.3s ease;
}

.task-create-editor .task-create-type-list .task-create-type-item i {
  display: block;
  font-size: 35px;
  line-height: 1;
  padding-top: 18px;
  margin-bottom: 10px;
}

.task-create-editor .task-create-content {
  min-height: 200px;
  position: relative;
}

.task-create-editor .task-create-content .task-create-content-iframe {
  width: 100%;
  min-height: 200px;
  border: none;
}

/* 计划任务 复制任务相关 开始 */
.course-copy-editor .form-horizontal .control-label {
  text-align: left;
}

.course-copy-editor .form-group .task-item {
  display: block;
  margin-bottom: 10px;
  padding-left: 25px;
  box-sizing: border-box;
}

.course-copy-editor .form-group .task-item input[type="checkbox"] {
  margin-right: 15px;
}

/* 计划任务 复制任务相关 结束 */

.task-iframe-body {
  background-color: #fff;
  padding: 0 20px;
}

.file-chooser-main {
  border: 1px solid #e1e1e1;
  border-radius: 4px;
}

.file-chooser-main .file-chooser-nav {
  padding: 15px;
}

.file-chooser-main .file-chooser-tab {
  padding: 15px;
  border-top: 1px solid #e1e1e1;
}

.download-list {
  list-style: none;
  padding-left: 0;
  border-radius: 4px;
  background-color: #f8fbfd;
}

.download-list li {
  padding: 10px 15px 0;
}

.download-list li:last-child {
  padding-bottom: 10px;
}

.download-list li>a {
  color: #313131;
  font-weight: 700;
}

.download-list li .btn-delete {
  visibility: hidden;
  font-size: 16px;
  color: #919191;
}

.download-list li:hover>.btn-delete {
  visibility: visible;
}

.chooser-content {
  margin: 0 15px 15px;
  padding: 15px;
}

.chooser-content,
.import-content {
  border-radius: 4px;
  background-color: #f8fbfd;
}

.import-content {
  padding: 30px;
}

.chooser-list-parent {
  border-top: 1px solid #e1e1e1;
}

.chooser-list {
  position: relative;
  height: 163px;
  overflow: auto;
  background-color: #fff;
}

.chooser-list.border-top {
  border-top: 1px solid #e1e1e1;
}

.chooser-list .table-striped {
  margin-bottom: 0;
}

.chooser-list .table-striped>tbody>tr:nth-of-type(odd) {
  background-color: #fafafa;
}

.chooser-list .table-striped>tbody>tr>td {
  border-top: 0;
  padding: 10px;
}

.uploader-content {
  background-color: #f8fbfd;
  border-radius: 4px;
  padding: 30px 30px 15px;
}

.uploader-content .uploader-container {
  border: 1px dashed #e4ecf3;
  padding: 5px 10px;
}

.uploader-content .uploader-bottom {
  padding-top: 15px;
  line-height: 30px;
  border-top: 1px solid #eaf2f7;
  margin-top: 25px;
}

.uploader-content .uploader-bottom .form-control {
  margin-bottom: 0;
  width: auto;
  display: inline-block;
  min-width: 85px;
  margin-left: 10px;
}

.task-list-header {
  padding-top: 7px;
  padding-bottom: 10px;
  font-size: 16px;
  line-height: 30px;
  background-color: #fff;
  margin-bottom: 18px;
}

.task-list-header .space {
  margin-right: 50px;
}

/* .task-list-header.fixed {
  position: fixed;
  top: 0;
  width: 850px;
  margin-left: -16px;
  padding: 10px 20px;
  bottom: auto;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.08);
  z-index: 1000;
  border-radius: 4px;
} */
/* 
  23.05.06 gyr 改写 .task-list-header.fixed 样式，应用于课程后台-计划任务-吸顶框。
  如果有其他地方样式受到影响，之后再进行更改。
*/
.task-list-header.fixed {
  position: fixed;
  top: 60px;
  width: 743px;
  bottom: auto;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.08);
  z-index: 1000;
  border-radius: 4px;
}

.task-empty {
  margin-bottom: 96px;
}

.task-empty .task-empty-icon {
  font-size: 50px;
  display: block;
  margin: 60px 0 20px;
}

.upload-height {
  line-height: 25px;
}

.lesson-list-wrapper.pbs {
  padding-bottom: 100px !important;
}

.lesson-list-wrapper.pbm {
  padding-bottom: 150px !important;
}

.lesson-list-wrapper.pbl {
  padding-bottom: 200px !important;
}

.lesson-list {
  margin: 0 10px 0 40px;
  padding: 0;
  list-style: none;
  border-left: 2px solid #ccc;
}

.lesson-list .item-chapter,
.lesson-list .item-lesson {
  border: 1px solid #ccc;
  background: #fff;
  line-height: 40px;
  margin-bottom: 15px;
}

.lesson-list .item-chapter {
  position: relative;
  margin-left: -30px;
}

.lesson-list .item-chapter-unit {
  margin-left: -15px;
}

.lesson-list .item-lesson {
  margin-left: 20px;
  cursor: move;
}

.lesson-list .item-line {
  border-bottom: 2px solid #ccc;
  vertical-align: top;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin-left: -21px;
  float: left;
}

.lesson-list .item-content {
  margin-left: 10px;
  overflow: hidden;
  height: 40px;
  line-height: 40px;
  float: left;
  width: 99%;
}

.lesson-list .item-actions {
  visibility: hidden;
  background: #f3f3f3;
  border-left: 1px solid #ddd;
  position: absolute;
  right: 15px;
  padding-right: 35px;
}

.lesson-list .item-actions .btn,
.lesson-list .item-actions .dropdown-menu>li>a {
  transition: none;
}

.lesson-list .item-actions .btn-link:hover,
.lesson-list .item-actions a.dropdown-toggle:focus,
.lesson-list .item-actions a.dropdown-toggle:hover {
  text-decoration: none;
}

.lesson-list .item-chapter:hover .item-actions,
.lesson-list .item-lesson:hover .item-actions {
  visibility: visible;
}

.lesson-list .item-chapter:hover,
.lesson-list .item-lesson:hover {
  background: #f3f3f3;
}

.lesson-form .for-audio-type,
.lesson-form .for-document-type,
.lesson-form .for-flash-type,
.lesson-form .for-none-type,
.lesson-form .for-ppt-type,
.lesson-form .for-text-type,
.lesson-form .for-video-type {
  display: none;
}

.lesson-form-audio .for-audio-type,
.lesson-form-document .for-document-type,
.lesson-form-flash .for-flash-type,
.lesson-form-ppt .for-ppt-type,
.lesson-form-text .for-text-type,
.lesson-form-video .for-video-type {
  display: block;
}

.file-chooser-uploader {
  padding: 20px;
  background: #f9f9f9;
  border: 1px solid #e6e6e6;
}

.file-chooser-uploader-label {
  margin-bottom: 10px;
  font-weight: 700;
}

.file-chooser-uploader-control {
  margin-bottom: 10px;
}

.file-chooser-uploader .alert-info {
  margin-bottom: 0;
}

.file-browser {
  padding: 10px;
  background: #f9f9f9;
  border: 1px solid #e6e6e6;
  height: 210px;
  overflow-y: auto;
  overflow-x: hidden;
}

.file-browser-list-container {
  height: 110px;
  overflow-y: auto;
  overflow-x: auto;
}

.file-browser-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.file-browser-list li {
  padding: 5px 10px;
}

.file-browser-list li:hover {
  background: #eee;
}

.file-browser-list .filename {
  float: left;
  width: 50%;
  cursor: default;
}

.file-browser-list .filesize {
  float: left;
  width: 20%;
  color: #777;
  cursor: default;
}

.file-browser-list .filetime {
  float: left;
  width: 30%;
  color: #777;
  cursor: default;
}

.teacher-list-group .nickname {
  display: inline-block;
  width: 160px;
  margin-left: 6px;
}

.teacher-list-group .visible-checkbox {
  font-weight: 400;
}

.teacher-list-group .delete-btn {
  margin-top: 12px;
}

.teacher-list-group li .sort-handle {
  font-size: 18px;
  padding: 15px 10px 5px 5px;
  cursor: pointer;
}

.dashboard-panel .course-dashboard-ul {
  height: 80px;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.dashboard-panel .course-dashboard-ul li {
  width: 33%;
  float: left;
  padding: 0 5px;
  text-align: center;
}

.dashboard-panel .course-dashboard-ul li .title {
  font-size: 14px;
  color: #333;
  margin-top: 0;
}

.dashboard-panel .course-dashboard-ul li .number {
  font-weight: 500;
  font-size: 24px;
}

.panel-create-course .panel-heading h2 {
  padding-bottom: 20px;
  border-bottom: 1px solid #e1e1e1;
  font-size: 16px;
}

.panel-create-course .course-piece {
  position: relative;
  text-align: left;
  padding-left: 15px;
  font-size: 16px;
}

.panel-create-course .course-piece:after {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 4px;
  height: 16px;
  background-color: #46c37b;
}

.panel-create-course .course-piece.title:after {
  top: 8px;
}

.panel-create-course .course-select {
  margin: 20px 5px 30px;
  height: 250px;
  padding: 35px 15px;
  border: 2px solid transparent;
  text-align: center;
  border-radius: 10px;
  cursor: pointer;
  background-color: #f4f6f8;
}

.panel-create-course .course-select:hover {
  border: 2px solid #46c37b;
}

.panel-create-course .course-select.disabled {
  border: 0;
  color: #d9d7d7;
  cursor: help;
}

.panel-create-course .course-select.active {
  background-color: #46c37b;
  color: #fff;
}

.panel-create-course .course-select.active .course-type {
  border-bottom: 1px solid #fff;
}

.panel-create-course .course-select .es-icon {
  font-size: 47px;
}

.panel-create-course .course-select .course-type {
  padding: 20px 0;
  font-size: 16px;
  border-bottom: 1px solid #e1e1e1;
}

.panel-create-course .course-select .course-intro {
  padding-top: 20px;
  font-size: 12px;
}

.panel-create-course .course-title {
  margin-bottom: 50px;
}

.intro-fixed-group {
  position: fixed;
  right: 50px;
  bottom: 30px;
  z-index: 99;
  opacity: 1;
  filter: alpha(opacity=100);
}

.intro-fixed-group.transparent {
  opacity: 0;
  filter: alpha(opacity=0);
}

.intro-fixed-group .intro-btn {
  display: block;
  cursor: pointer;
  width: 50px;
  height: 50px;
  padding: 8px;
  line-height: 1.5;
  font-size: 12px;
  border-radius: 50%;
  background-color: #fff;
  text-align: center;
  border: none;
  color: #70d445;
  box-shadow: 0 1px 7px 2px rgba(202, 241, 219, 0.35);
}

.intro-fixed-group .popover {
  min-width: 150px;
}

.task-dashboard-page {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  background-color: #f5f8fa;
  height: 100%;
}

.task-dashboard-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: #1f2331;
  height: 60px;
  color: #fff;
  font-size: 14px;
  z-index: 1;
}

.task-dashboard-header .back-link {
  color: #a2a8d3;
  line-height: 60px;
  padding: 0 200px 0 15px;
}

.task-dashboard-header .task-title {
  font-size: 16px;
}

.task-dashboard-page .dashboard-content {
  position: absolute;
  /* 7.15 */
  left: 350px;
  right: 70px;
  top: 60px;
  max-width: 900px;
  margin: 20px auto 0;
  bottom: 70px;
  /* overflow-y:auto; */
}

.task-dashboard-page .dashboard-content.videofull {
  left: 280px;
  right: 0;
  top: 33px;
  max-width: 100%;
}

.task-dashboard-page .dashboard-content.page-full {
  left: 0 !important;
  right: 0 !important;
  max-width: 100%;
  margin: 0px auto;
  top: 0 !important;
  bottom: -7px;
  z-index: 90;
}

@media (max-width: 767px) {
  .task-dashboard-page .dashboard-content {
    right: 15px !important;
    left: 15px;
  }

  .task-dashboard-page {
    background-color: #f6f8fa;
  }

  .iframe-parent-content .warn {
    padding-top: 130px;
  }
}

.task-dashboard-page .dashboard-content .dashboard-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 54px;
  line-height: 54px;
  color: #919191;
  font-size: 16px;
  z-index: 1;
  overflow: hidden;
}

.task-dashboard-page .dashboard-content .dashboard-header .back-link {
  color: #616161;
  padding-right: 20px;
  border-right: 1px solid #c1c1c1;
  margin-right: 20px;
}

.task-dashboard-page .dashboard-content .dashboard-header .back-link i {
  font-size: 22px;
  line-height: 1;
}

.task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #46c37b;
}

@media (max-width: 767px) {
  .task-dashboard-page .dashboard-content .dashboard-header {
    z-index: 0;
  }

  .task-dashboard-page .dashboard-content .dashboard-footer {
    position: static !important;
    height: auto !important;
    padding: 15px 10px !important;
  }
}

.task-dashboard-page .dashboard-content .dashboard-footer {
  position: absolute;
  bottom: -70px;
  left: 0;
  right: 0;
  height: 70px;
  /* padding: 10px 0; */
  padding: 10px;
  color: #919191;
  z-index: 1;
  text-align: right;
  background: #f5f8fa;
}

.dashboard-footer .unitbox {
  display: block !important;
}

.dashboard-footer .unitdefault {
  font-size: 14px;
  color: #0091ff;
  padding: 8px 42px;
  border: 1px solid #0091ff;
  border-radius: 20px;
}

.dashboard-footer .unitdefault:hover,
.new-dashboard-content .prereading.evaluate .submitevaluate:hover {
  color: #fff;
  background: #0091ff;
}

.dashboard-footer .unitdefault.disabled {
  opacity: 0.5;
}

/* .dashboard-footer .nextunit{
    color:#fff;
    background:#0091FF;
} */
.task-dashboard-page .dashboard-content .dashboard-body {
  position: relative;
  padding: 7px 0;
  /* background-color: #fff; */
  height: 100%;
  /* overflow: hidden */
  overflow-y: auto;
}

/* 23.2.9 任务直播间新增锁定模式*/
.task-dashboard-page .dashboard-content .lockMode-state-opration {
  position: absolute;
  top: 13px;
  right: 159px;
}

.task-dashboard-page .dashboard-content .lockMode-state-opration .state-opration>.btn {
  position: static;
  display: none;
}

.task-dashboard-page .dashboard-content .lockMode-state-opration .btn-transparent {
  border: 0;
  color: #fff !important;
  font-size: 12px;
  background: #0091ff !important;
  font-weight: 400 !important;
  border-radius: 30px;
}

.task-dashboard-page .dashboard-content .lockMode-state-opration .btn-transparent:after {
  background: none;
}

.task-dashboard-page .dashboard-content .lockMode-state-opration .btn-transparent .es-icon {
  font-size: 13px;
  margin-right: 2px;
  position: relative;
  top: 1px;
}

.task-dashboard-page .dashboard-content .lockMode-state-opration .state-opration>.btn.open {
  display: inline-block;
}

@media (max-width: 767px) {
  .task-dashboard-page .dashboard-content .lockMode-state-opration {
    position: static;
    margin-top: 10px;
  }

  /* .modal-body {
    width: 100%;
  }

  .task-state-modal .content {
    padding: 30px 10px;
  } */
}

.task-dashboard-page .dashboard-content .state-opration {
  position: relative;
  display: inline-block;
  height: 31px;
  text-align: right;
  vertical-align: middle;
  min-width: 300px;
}

/* 滚动条样式 */
.task-scrollbar::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 3px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 300px;
}

.task-scrollbar::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 10px;
  box-shadow: inset 0 0 5px rgba(20, 72, 8);
  background: #0097fb;
}

.task-scrollbar::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow: inset 0 0 5px rgba(255, 0, 0, 0.2);
  border-radius: 10px;
  background: #f5f8fa;
}

@media (max-width: 767px) {
  .task-dashboard-page .dashboard-content .state-opration {
    min-width: 20px;
  }
}

.task-dashboard-page .dashboard-content .state-opration>.btn {
  position: absolute;
  top: 60px;
  right: 0;
}

.task-dashboard-page .dashboard-content .state-opration>.btn.open {
  top: 0;
}

.task-dashboard-page .dashboard-content .state-opration>.btn.moveup {
  -webkit-animation: moveUp 1s;
  animation: moveUp 1s;
  top: 0;
}

.task-dashboard-page .dashboard-content .btn-learn .doing {
  display: inline;
}

.task-dashboard-page .dashboard-content .btn-learn.active .doing,
.task-dashboard-page .dashboard-content .btn-learn .done {
  display: none;
}

.task-dashboard-page .dashboard-content .btn-learn.active .done {
  display: inline;
}

.dashboard-sidebar-leftlist {
  position: absolute;
  /* left: -280px; */
  left: 0px;
  top: 60px;
  bottom: 0;
  width: 280px;
  background-color: #272b39;
}

.dashboard-sidebar-leftlist .es-icon-keyboardarrowup:before,
.dashboard-sidebar-leftlist .es-icon-keyboardarrowdown:before {
  font-size: 17px;
  color: #a2a8d3;
  left: -2px;
}

.dashboard-sidebar-leftlist .new-tasklist-box {
  height: 100%;
  overflow-y: auto;
}

.task-dashboard-page .dashboard-sidebar {
  position: absolute;
  right: 0;
  top: 60px;
  bottom: 0;
  width: 360px;
  right: -360px;
  /* right: 0; */
  background-color: #fff;
  box-shadow: -2px 0 2px 0 rgba(0, 0, 0, 0.1);
}

@media (max-width: 767px) {
  .task-dashboard-header {
    height: 30px;
  }

  .task-dashboard-page .dashboard-sidebar {
    z-index: 4;
    padding-bottom: 16px;
    margin-bottom: 13px;
  }

  .task-dashboard-page .dashboard-toolbar {
    position: static !important;
    padding: 10px;
  }

  .task-dashboard-header .back-link {
    padding: 0 20px 0 15px;
    line-height: 30px;
  }

  .task-dashboard-header .task-title {
    font-size: 12px;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: 140px;
    margin-top: -26px;
  }
}

@media (max-width: 767px) and (min-width: 400px) {
  .task-dashboard-page .dashboard-sidebar {
    width: 300px;
    right: -300px;
  }
}

@media (max-width: 400px) {
  .task-dashboard-page .dashboard-sidebar {
    width: 260px;
    right: -260px;
  }
}

.task-dashboard-page .dashboard-toolbar {
  /* position: relative; */
  z-index: 1;
  position: fixed;
  top: 10px;
  right: 46px;
}

/* .task-dashboard-header .dashboard-toolbar{
    position: absolute;
    top:0;
    right:46px;
} */

.task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav {
  margin-bottom: 0;
  vertical-align: middle;
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  background-color: #4b517c;
  padding: 4px;
  border-radius: 20px;
}

.task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li {
  /*margin-bottom: 10px;*/
  flex: 1;
}

.task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li>a {
  padding: 5px 26px;
  width: 100%;
  display: inline-block;
  /* background-color: #fff; */
  color: #a2a8d3;
  text-align: center;
}

.task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li a {
  /* background-color: #f0f0f0; */
  outline: none;
}

.task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a {
  background: #0091ff !important;
  color: #fff;
  box-shadow: 0 0 4px 0 rgba(37, 40, 63, 0.5);
  border-radius: 20px;
}

/* .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a {
    background-color: #46c37b;
    color: #fff
} */

.task-dashboard-page .dashboard-pane {
  overflow: hidden;
  height: 100%;
}

.task-dashboard-page .task-list-pane {
  position: absolute;
  top: 60px;
  bottom: 0;
  width: 100%;
  overflow-y: hidden;
  overflow-x: hidden;
}

.task-dashboard-page .task-list-pane .task-list-pane-body {
  padding: 0;
}

.task-dashboard-page .note-pane {
  height: 100%;
  overflow: hidden;
}

.task-dashboard-page .note-pane .note-pane-body {
  padding: 15px;
}

.task-dashboard-page .question-pane {
  height: 100%;
  overflow: hidden;
}

/* 添加答案 */
.task-dashboard-page .question-pane .task-question-plugin-pane {
  padding: 15px;
}

.task-dashboard-page .question-pane .media-list {
  margin-top: 0;
}

.task-dashboard-page .question-pane .media-list .media {
  border-bottom: 1px solid #e4ecf3;
}

.task-dashboard-page .task-question-plugin-pane-header {
  margin-bottom: 24px;
  padding-left: 14px;
}

.task-dashboard-page .task-question-plugin-pane-header__btn {
  padding: 6px 9px;
  background: #f1f1f1;
  border: 1px solid #e1e1e1;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  color: #b1b1b1;
  font-size: 12px;
  line-height: 1;
}

.task-dashboard-page .task-question-plugin-pane-thread {
  padding: 0 14px;
}

.task-dashboard-page .task-question-plugin-pane-thread__title {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  color: #313131;
}

.task-dashboard-page .task-question-plugin-pane-thread__title .post-tag-success {
  color: #fff;
  background-color: #43bc60;
}

.task-dashboard-page .task-question-plugin-pane-thread__info {
  font-size: 12px;
  line-height: 1;
  color: #919191;
}

.task-dashboard-page .task-question-plugin-pane-thread__info .nickname {
  font-weight: 600;
}

.task-dashboard-page .task-question-plugin-pane-thread__content {
  font-size: 14px;
  line-height: 24px;
  /* max-height: 76px; */
  max-height: 400px;
  letter-spacing: 1px;
  overflow-y: auto;
}

.task-dashboard-page .task-question-plugin-pane-thread__content.active {
  max-height: none;
}

.task-dashboard-page .task-question-plugin-pane-thread__content p {
  margin: 0;
}

.task-dashboard-page .task-question-plugin-pane-thread__item {
  padding-bottom: 12px;
  border-bottom: 1px solid #f1f1f1;
}

.task-dashboard-page .task-question-plugin-pane-thread__item:last-child {
  border: none;
}

.task-dashboard-page .task-question-plugin-pane-thread__item .more {
  display: none;
}

.task-dashboard-page .task-question-plugin-pane-post-form {
  margin-top: 16px;
  padding: 8px 14px;
}

/* end */

.task-dashboard-page .question-pane .task-question-plugin-form {
  margin-bottom: 0;
  padding: 15px;
}

.task-dashboard-page .question-pane .media-list {
  margin-top: 0;
}

.task-dashboard-page .question-pane .media-list .media {
  border-bottom: 1px solid #e4ecf3;
}

.screen-full {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999;
}

.iframe-modal.modal {
  overflow-y: auto;
}

.all-wrapper {
  height: 100%;
}

/* 讨论直播转点播discuss */
.discuss-wrap .iScrollVerticalScrollbar,
.discuss-wrap .iScrollLoneScrollbar {
  z-index: -1 !important;
}

.discuss-wrap {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0px;
  width: 100%;
  overflow-y: auto;
  background-color: #272b39;
}

.discuss-wrap .discuss-content .chat-msg-line:nth-last-child(1) {
  padding-bottom: 20px;
}

.discuss-content {
  /* width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    top: 0;
    bottom: 2px; */
  font-size: 12px;
  /* padding-bottom:20px; */
}

.discuss-content .chat-msg-line {
  padding: 0 12px;
}

.discuss-content .chat-msg-wrap {
  overflow: hidden;
  color: #fff;
  text-align: left;
  padding: 15px 0 08px 0;
}

.discuss-content .chat-user-name {
  color: #aeb6d6;
  max-width: 45%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.discuss-content .chat-send-time {
  font-size: 12px;
  color: #4b517c;
}

.discuss-content .chat-content-p3 {
  max-width: 100%;
  color: #aeb6d6;
  margin-left: 7px;
  padding: 10px;
  position: relative;
  background-color: #323a53;
  border-radius: 4px;
  line-height: 17px;
  display: inline-block;
}

.discuss-content .chat-msg-line.self .chat-content-p3 {
  float: right;
  background: #0091ff;
  color: #fff;
  border: 0;
}

.discuss-content .chat-content-p3 img {
  vertical-align: middle !important;
  width: auto;
  height: auto;
  max-width: 160px;
}

/* end */
@media (max-width: 767px) {
  .all-wrapper.mobile-scroll-wrapper {
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
  }

  .discuss-wrap {
    position: static;
    height: 300px;
    overflow-y: scroll;
  }
}

@-webkit-keyframes moveUp {
  0% {
    top: 100%;
    opacity: 0;
  }

  to {
    opacity: 1;
    top: 0;
  }
}

@keyframes moveUp {
  0% {
    top: 100%;
    opacity: 0;
  }

  to {
    opacity: 1;
    top: 0;
  }
}

.iframe-parent-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  overflow: auto;
  background: #fff;
}

.iframe-parent-content img {
  max-width: 100%;
}

.iframe-parent-content.iframe-parent-full {
  overflow: hidden;
}

@media (max-width: 767px) {
  .iframe-parent-content.iframe-parent-full {
    -webkit-overflow-scrolling: touch;
    /* overflow-y: auto; */
  }

  .download-activity-list {
    margin: 0 50px 10px !important;
    width: auto !important;
    padding: 0 10px !important;
  }

  .download-activity-list .down-text {
    max-width: 60% !important;
  }
}

.task-preview-modal-content {
  position: relative;
  height: 400px;
}

.download-activity-list {
  padding-left: 0;
  list-style: none;
  line-height: 40px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 20px;
  color: #333;
  width: 60%;
  margin: 0px auto 10px;
  border: 1px solid #f1f1f1;
}

.download-activity-list .down-text {
  float: left;
  max-width: 70%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.download-activity-list .down-link {
  float: right;
  display: inline-block;
}

.download-activity-list .download-link {
  background: #4a90e2;
  padding: 3px 10px;
  color: #fff;
  cursor: pointer;
  text-align: center;
  border-radius: 3px;
}

.download-activity-list>li:nth-of-type(odd) {
  background-color: #fafafa;
}

.download-activity-list>li>a {
  display: block;
  padding: 20px;
}

.download-activity-list>li>a .download-icon {
  float: right;
  /* color: #c1c1c1 */
}

.download-activity-list>li>a:hover,
.download-activity-list>li>a:hover .download-icon {
  color: #46c37b;
}

.task-testpaper-body-iframe {
  position: relative;
  /* height: 100%; */
  height: auto;
  overflow: auto;
}

.task-testpaper-body-iframe .iframe-replay {
  width: 100% !important;
  max-width: 1000px;
  padding: 0px !important;
  overflow: hidden !important;
}

.testpaper-card .panel-card {
  position: relative;
  max-height: 290px;
  overflow: hidden;
}

.testpaper-card .marking-card {
  position: absolute;
  right: 0;
  top: 0;
}

.testpaper-timer {
  position: relative;
  background-color: #fff;
  padding: 15px 44px 15px 20px;
  margin-bottom: 20px;
  line-height: 1;
}

.testpaper-timer .btn-pause {
  position: absolute;
  right: 0;
  top: 0;
  height: 44px;
  width: 44px;
  text-align: center;
  background-color: #46c37b;
  color: #fff;
}

.testpaper-timer .btn-pause i {
  line-height: 44px;
}

.testpaper-timer .btn-pause .pause {
  display: block;
}

.testpaper-timer .btn-pause.open .pause,
.testpaper-timer .btn-pause .play {
  display: none;
}

.testpaper-timer .btn-pause.open .play {
  display: block;
}

.task-state-modal .title {
  text-align: center;
  font-size: 22px;
  color: #313131;
  margin-bottom: 20px;
  line-height: 1;
}

.task-state-modal .title i {
  font-size: 22px;
  margin-right: 10px;
}

.task-state-modal .content {
  font-size: 12px;
  background-color: #fafafa;
  /* padding: 30px 70px; */
  padding: 30px 10px;
  text-align: center;
}

.task-state-modal .content .content-title {
  line-height: 1;
  font-size: 16px;
  color: #313131;
  margin-bottom: 40px;
}

.task-state-modal .content .content-progress {
  margin-bottom: 15px;
}

.task-state-modal.task-state-modal-xs {
  padding: 6px 0;
}

.task-state-modal.task-state-modal-xs .title {
  font-size: 12px;
  text-align: left;
}

.task-state-modal.task-state-modal-xs .title i {
  font-size: 14px;
}

.task-state-modal.task-state-modal-xs .content {
  padding: 0;
  background-color: transparent;
  text-align: left;
  margin-bottom: 13px;
  color: #919191;
}

.task-state-modal.task-state-modal-xs .content .content-title {
  font-size: 12px;
  line-height: 14px;
  color: #616161;
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-weight: 400;
  border-bottom: 1px solid #e4ecf3;
}

.task-state-modal.task-state-modal-xs .content .content-progress {
  padding-bottom: 14px;
  border-bottom: 1px solid #e4ecf3;
  margin-bottom: 0;
}

.lesson-content-text-body {
  width: 80%;
  margin: 0 auto;
  padding-top: 50px;
}

.lesson-content-text-body .live-show-item {
  text-align: center;
  padding-bottom: 45px;
}

.lesson-content-text-body .live-show-item .title {
  margin-bottom: 12px;
  font-weight: 700;
  color: #313131;
}

.lesson-content-text-body .live-show-item .icon-live-end {
  font-size: 50px;
  display: block;
  margin-bottom: 30px;
}

.course-detail-section {
  position: relative;
  padding: 0;
}

.course-detail-section .course-detail-top {
  padding-right: 130px;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-top {
    padding-right: 0;
  }

  /* .course-detail-top .courseSet-setting {
        display: none;
    } */
}

.course-detail-section .course-detail-top .course-detail-heading {
  vertical-align: top;
  display: inline-block;
  color: #313131;
  font-size: 24px;
  word-wrap: break-word;
  word-break: break-all;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-top .course-detail-heading {
    max-width: 100%;
  }
}

.course-detail-section .course-detail-top .subtitle {
  padding-top: 5px;
  max-width: 50%;
  margin: 0;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-top .subtitle {
    max-width: 100%;
  }
}

.course-detail-section .course-detail-top .tags {
  float: left;
}

.course-detail-section .course-detail-top .tags .tag-finished,
.course-detail-section .course-detail-top .tags .tag-serialing {
  display: inline-block;
  width: 40px;
  height: 50px;
}

.course-detail-section .course-detail-top .tags .tag-live {
  background: url("/static-dist/app/img/tag_live.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_live.png") 1x,
      url("/static-dist/app/img/tag_live@2x.png") 2x);
}

.course-detail-section .course-detail-top .tags .tag-serialing {
  background: url("/static-dist/app/img/tag_serialing.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_serialing.png") 1x,
      url("/static-dist/app/img/tag_serialing@2x.png") 2x);
}

.course-detail-section .course-detail-top .tags .tag-finished {
  background: url("/static-dist/app/img/tag_finished.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_finished.png") 1x,
      url("/static-dist/app/img/tag_finished@2x.png") 2x);
}

.course-detail-section .course-operation {
  position: absolute;
  list-style-type: none;
  right: 10px;
  top: 30px;
}

.course-detail-section .course-operation li {
  float: left;
  margin-right: 10px;
}

.course-detail-section .course-operation li>.btn {
  font-size: 14px;
  color: #919191;
}

.course-detail-section .course-detail-bottom .course-detail-img {
  position: relative;
  float: left;
  width: 480px;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-bottom .course-detail-img {
    width: 100%;
    float: none;
    margin-bottom: 20px;
  }

  .course-detail-section .course-detail-bottom .course-detail-img img {
    width: 100%;
  }
}

.course-detail-section .course-detail-bottom .course-detail-img .course-img-cover,
.course-img-cover {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: #000;
  opacity: 0.4;
  filter: alpha(opacity=40);
  transition: all 0.3s ease;
}

.course-detail-section .course-detail-bottom .course-detail-img .course-img-cover:hover,
.course-img-cover:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  transition: all 0.3s ease;
}

.course-detail-section .course-detail-bottom .course-detail-img .course-img-cover .es-icon,
.course-img-cover .es-icon {
  color: #fff;
  font-size: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -50px;
  margin-top: -50px;
}

.course-detail-section .course-detail-bottom .course-detail-img .course-detail-remask {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  color: #fff;
  padding: 10px;
}

.course-detail-section .course-detail-bottom .course-detail-img .course-detail-remask .score i {
  color: #fff;
}

.course-detail-section .course-detail-bottom .course-detail-info {
  /*padding-left: 60px;
    margin-left: 480px;*/
  font-size: 12px;
  color: #919191;
}

.course-detail-section .course-detail-bottom .course-detail-info .buy-btn-group {
  position: absolute;
  right: 20px;
  bottom: 20px;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-bottom .course-detail-info {
    margin: 0;
    padding: 0;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-price-money {
  font-size: 24px;
  line-height: 1;
  color: #ff6000;
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-title {
  width: 80px;
  display: inline-block;
}

@media (max-width: 767px) {
  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-title {
    display: none;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray {
  padding-left: 60px;
  margin: 0 -15px 15px -151px;
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #fff;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray {
    padding-left: 15px;
    min-height: auto;
    margin: 0 -15px 10px;
    padding-top: 0;
    background-color: transparent;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray.not-activity {
  min-height: 158px;
}

@media (max-width: 991px) {
  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray.not-activity {
    min-height: auto;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content {
  position: relative;
  padding-left: 80px;
}

@media (max-width: 767px) {
  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content {
    padding-left: 0;
    padding-right: 15px;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content .course-detail-nav {
  display: inline-block;
}

@media (max-width: 767px) {
  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content .course-detail-nav {
    display: block;
  }

  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content .course-detail-nav>li {
    width: 100%;
  }

  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content .course-detail-nav>li>a {
    text-align: center;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .course-detail-gray .course-detail-content .course-detail-title {
  position: absolute;
  left: 0;
  top: 6px;
}

.course-detail-section .course-detail-bottom .course-detail-info .pirce-num {
  font-size: 24px;
}

@media (max-width: 767px) {
  .course-detail-section .course-detail-bottom .course-detail-info .pirce-num {
    font-size: 14px;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .original-price {
  position: relative;
  margin-left: 4px;
}

.course-detail-section .course-detail-bottom .course-detail-info .original-price:after {
  content: "";
  position: absolute;
  left: -2px;
  top: 50%;
  right: -2px;
  height: 1px;
  background-color: #919191;
}

.course-detail-section .course-detail-bottom .course-detail-info .tag-discount {
  position: relative;
  top: -3px;
  background: url("/static-dist/app/img/course2_tag_discount.png") no-repeat;
  display: inline-block;
  width: 62px;
  margin-left: 11px;
  height: 24px;
  color: #fff;
  line-height: 24px;
}

@media (max-width: 768px) {
  .course-detail-section .course-detail-bottom .course-detail-info .tag-discount {
    display: none;
  }
}

.course-detail-section .course-detail-bottom .course-detail-info .tag-discount .discount-font {
  margin-left: 25px;
}

.vertical-sub {
  vertical-align: sub;
}

.cd-text-lg {
  font-size: 16px !important;
}

.course-detail__label {
  margin-right: 12px;
  width: 48px;
  color: #919191;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}

.course-freelearn-section {
  background-color: #fafafa;
  margin: 97px 0 48px;
  padding: 33px 15px;
}

@media (max-width: 991px) {
  .course-freelearn-section {
    margin: 60px 0 20px;
    padding: 0;
    background-color: #fff;
  }
}

.course-freelearn-section .course-learn-list {
  list-style: none;
}

@media (min-width: 768px) and (max-width: 991px) {
  .course-freelearn-section .course-learn-list {
    padding-left: 20px;
  }
}

.course-freelearn-section .course-learn-list>li {
  float: left;
  /*width: 33.33%*/
}

.course-freelearn-section .course-learn-list>li:first-child {
  /*width: 33.33%*/
  width: 21.7%;
}

.course-freelearn-section .course-learn-list>li:nth-of-type(2) {
  /*width: 33.33%*/
  width: 19.5%;
}

.course-freelearn-section .course-learn-list>li:nth-of-type(3) {
  /*width: 33.33%*/
  width: 58.8%;
}

.course-freelearn-section .course-progress {
  top: -50px;
  left: 75px;
}

@media (max-width: 991px) {
  .course-freelearn-section .course-progress {
    left: 0;
    top: 0;
  }
}

.course-orderlearn-section {
  min-height: 230px;
  padding-top: 40px;
}

@media (max-width: 991px) {
  .course-orderlearn-section {
    min-height: auto;
    padding-top: 0;
  }
}

.course-orderlearn-section .progress-info {
  list-style: none;
  margin-left: 190px;
  margin-top: 25px;
  font-size: 12px;
  padding-left: 0;
}

.course-orderlearn-section .progress-info .progress-learn-time {
  margin-left: 20px;
}

.course-orderlearn-section .task-list-detail {
  margin-left: -48px;
}

.course-progress {
  position: absolute;
  top: 0;
  left: 15px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 18px 2px rgba(41, 94, 64, 0.1);
}

@media (max-width: 991px) {
  .course-progress {
    position: relative;
    margin: 20px auto 40px;
    left: 0;
  }
}

.course-progress .cricle-progress {
  position: absolute;
  left: 7.5px;
  top: 7.5px;
  width: 145px;
  height: 145px;
}

.course-progress .cricle-progress .percent {
  position: absolute;
  top: 40px;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #919191;
}

.course-progress .cricle-progress .percent .num {
  display: inline-block;
  margin-top: 10px;
  font-size: 30px;
  line-height: 1;
  font-weight: 700;
  color: #46c37b;
}

.orderlearn-poster {
  height: 80px;
  position: relative;
}

.orderlearn-poster .swiper-pager {
  bottom: -30px;
}

.orderlearn-poster .arrow-left {
  left: 0;
}

.orderlearn-poster .arrow-left,
.orderlearn-poster .arrow-right {
  position: absolute;
  top: 50%;
  z-index: 1;
  margin-top: -10px;
  font-size: 18px;
}

.orderlearn-poster .arrow-right {
  right: 0;
}

.orderlearn-poster .swiper-container {
  height: 80px;
  margin: 25px 30px;
}

.orderlearn-poster .swiper-pagination-switch {
  background-color: #f0f0f0;
  margin: 0 5px;
}

.orderlearn-poster span.swiper-active-switch {
  background-color: #46c37b;
}

.course-detail-section-responsive {
  /* background-color: #ffffff; */
  padding: 18px 10px 18px 0;
  margin: -15px;
}

.course-freelearn-section .course-detail-section-responsive {
  margin: 0;
}

.course-detail-section-responsive ul {
  margin: 0;
  padding: 0;
}

.course-detail-section-responsive ul>li {
  float: left;
  width: 26px;
  height: 25px;
  list-style-type: none;
  text-align: center;
  color: #919191;
  font-size: 12px;
}

@media (max-width: 399px) and (min-width: 330px) {
  .course-detail-section-responsive ul>li {
    width: 50px;
  }
}

@media (max-width: 329px) {
  .course-detail-section-responsive ul>li {
    width: 45px;
  }
}

.course-detail-section-responsive ul>li:last-child {
  border-left: 1px solid #e1e1e1;
}

.course-detail-section-responsive ul>li:first-child {
  border-left: 1px solid transparent;
}

.course-detail-section-responsive ul>li:hover,
.course-detail-section-responsive ul>li:hover a {
  color: #46c37b;
}

.course-detail-section-responsive ul>li a {
  color: #919191;
}

.course-detail-section-responsive .es-share.top .dropdown-menu {
  left: 50%;
  margin-left: -70px;
}

@media (max-width: 991px) {
  .buy-btn-group {
    line-height: 33px;
    position: absolute;
    right: 10px;
    bottom: 15px;
  }
}

@media (max-width: 991px) and (min-width: 769px) {
  .course-freelearn-section .buy-btn-group {
    width: 50%;
    line-height: 33px;
    position: absolute;
    left: 0;
    /*bottom: 0*/
  }

  .course-freelearn-section {
    width: 718px;
  }
}

.buy-btn-group .btn-lg {
  padding: 10px 35px;
}

@media (max-width: 500px) and (min-width: 400px) {
  .buy-btn-group .btn-lg {
    padding: 10px 20px;
  }
}

@media (max-width: 399px) and (min-width: 330px) {
  .buy-btn-group .btn-lg {
    padding: 10px 13px;
  }
}

@media (max-width: 329px) {
  .buy-btn-group .btn-lg {
    padding: 10px;
  }
}

.course-dashboard-page .breadcrumb.breadcrumb-o>li {
  max-width: 95.5%;
  vertical-align: top;
}

@media (max-width: 991px) {
  .course-dashboard-page .breadcrumb.breadcrumb-o>li {
    max-width: 90%;
  }
}

.course-features .course-features-item {
  border-bottom: 1px dashed #e4ecf3;
  margin-top: 15px;
  padding-bottom: 15px;
}

.course-features .course-features-item:last-child {
  border-color: transparent;
  padding-bottom: 0;
}

.course-features .media {
  float: left;
  width: 50%;
  margin: 0;
}

.belongs-class .media-left img {
  width: 100px;
  height: auto;
  border: 3px solid #e4ecf3;
  border-radius: 4px;
}

.belongs-class .media-body {
  vertical-align: middle;
}

.belongs-class .media-body>a {
  color: #616161;
  transition: all 0.3s ease;
}

.belongs-class .media-body>a:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.panel-class .arrow-next,
.panel-class .arrow-prev {
  position: absolute;
  top: 35%;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 50%;
  background-color: #7f7f7f;
  background-color: hsla(0, 0%, 50%, 0.5);
  color: #fff;
  text-align: center;
  transition: all 0.3s ease;
  visibility: hidden;
}

.panel-class .arrow-next:hover,
.panel-class .arrow-prev:hover {
  background-color: hsla(0, 0%, 50%, 0.8);
  transition: all 0.3s ease;
}

.panel-class .arrow-prev {
  left: 5px;
}

.panel-class .arrow-next {
  right: 5px;
}

.panel-class:hover .arrow-next,
.panel-class:hover .arrow-prev {
  visibility: visible;
}

.course-detail {
  margin-top: -10px;
}

.course-detail-content .es-piece {
  margin-bottom: 50px;
}

.course-detail-content .es-piece img {
  max-width: 100%;
  height: auto;
}

.course-detail-content .es-piece .piece-body p {
  line-height: 30px;
  margin-bottom: 0;
  margin-left: 15px;
}

.es-mobile body {
  background-color: #fff;
}

.es-mobile .course-dashboard-page .breadcrumb-o,
.es-mobile .course-dashboard-page .es-footer,
.es-mobile .course-dashboard-page .es-footer-link,
.es-mobile .course-dashboard-page .progress-sm {
  display: none;
}

.es-mobile .course-dashboard-page .course-detail-header .es-section {
  margin: 10px 0;
}

.es-mobile .course-dashboard-page #content-container {
  margin: 10px auto;
  min-height: auto;
}

.es-mobile .course-dashboard-page .course-sidebar {
  display: none;
}

.es-mobile .course-dashboard-page .course-operation {
  width: auto;
  float: none;
}

.es-mobile .course-dashboard-page .course-detail-section {
  margin: 10px 0;
}

.es-mobile .course-dashboard-page .course-detail-section-responsive {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 998;
  right: 0;
  margin: 0;
  padding: 8px 0;
}

.es-mobile .course-dashboard-page .course-detail-section-responsive .es-share.top.learn-es-share .dropdown-menu {
  left: 0;
  margin-left: 0;
}

.es-mobile .course-dashboard-page .course-detail-section-responsive .es-share.top.learn-es-share .dropdown-menu:after {
  left: 25px;
}

.es-mobile .course-dashboard-page .buy-btn-group {
  position: fixed;
  left: 80px;
  right: 15px;
  bottom: 7px;
  z-index: 998;
}

.es-mobile .course-dashboard-page .buy-btn-group .btn-lg {
  padding: 8px 10px;
}

.es-mobile .course-dashboard-page .course-progress {
  margin-bottom: 10px;
}

.es-mobile .es-piece .piece-header,
.es-mobile .next-class {
  display: none;
}

.es-mobile .es-mobile-nav li {
  width: 33.33%;
  text-align: center;
}

.es-mobile .es-mobile-nav li a {
  font-weight: 400;
}

.es-mobile .es-mobile-nav li.active {
  border-bottom: 1px solid #46c37b;
}

.es-mobile .es-mobile-nav li.active a {
  color: #46c37b;
}

.es-mobile .es-mobile-nav li.active.navs {
  width: auto;
  border: none;
}

.es-mobile .es-mobile-nav li.active.navs a {
  color: #313131;
}

.es-mobile .modal {
  z-index: 9999;
}

.es-mobile body.course-dashboard-page.has-app .es-wrap,
.es-mobile body.course-list-page.has-app .es-wrap,
.es-mobile body.homepage.has-app .es-wrap,
.es-mobile body.login.has-app .es-wrap,
.es-mobile body.my-course.has-app .es-wrap,
.es-mobile body.open-course-list.has-app .es-wrap,
.es-mobile body.register.has-app .es-wrap {
  padding-top: 110px;
}

.es-mobile body.course-dashboard-page .es-wrap,
.es-mobile body.course-list-page .es-wrap,
.es-mobile body.homepage .es-wrap,
.es-mobile body.login .es-wrap,
.es-mobile body.my-course .es-wrap,
.es-mobile body.open-course-list .es-wrap,
.es-mobile body.register .es-wrap {
  padding-top: 60px;
  padding-bottom: 50px;
}

.es-mobile body.course-dashboard-page .es-header,
.es-mobile body.course-list-page .es-header,
.es-mobile body.homepage .es-header,
.es-mobile body.login .es-header,
.es-mobile body.my-course .es-header,
.es-mobile body.open-course-list .es-header,
.es-mobile body.register .es-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.es-mobile body.course-dashboard-page .es-header .navbar-mobile,
.es-mobile body.course-list-page .es-header .navbar-mobile,
.es-mobile body.homepage .es-header .navbar-mobile,
.es-mobile body.login .es-header .navbar-mobile,
.es-mobile body.my-course .es-header .navbar-mobile,
.es-mobile body.open-course-list .es-header .navbar-mobile,
.es-mobile body.register .es-header .navbar-mobile {
  display: none !important;
}

.es-mobile body.course-dashboard-page .es-header .M_header-back,
.es-mobile body.course-dashboard-page .footer-tool-bar,
.es-mobile body.course-list-page .es-header .M_header-back,
.es-mobile body.course-list-page .footer-tool-bar,
.es-mobile body.homepage .es-header .M_header-back,
.es-mobile body.homepage .footer-tool-bar,
.es-mobile body.login .es-header .M_header-back,
.es-mobile body.login .footer-tool-bar,
.es-mobile body.my-course .es-header .M_header-back,
.es-mobile body.my-course .footer-tool-bar,
.es-mobile body.open-course-list .es-header .M_header-back,
.es-mobile body.open-course-list .footer-tool-bar,
.es-mobile body.register .es-header .M_header-back,
.es-mobile body.register .footer-tool-bar {
  display: block;
}

.es-mobile body.course-dashboard-page .course-list-section .course-filter,
.es-mobile body.course-dashboard-page .dynamic-section,
.es-mobile body.course-dashboard-page .es-footer,
.es-mobile body.course-dashboard-page .es-footer-link,
.es-mobile body.course-dashboard-page .es-friend-link,
.es-mobile body.course-list-page .course-list-section .course-filter,
.es-mobile body.course-list-page .dynamic-section,
.es-mobile body.course-list-page .es-footer,
.es-mobile body.course-list-page .es-footer-link,
.es-mobile body.course-list-page .es-friend-link,
.es-mobile body.homepage .course-list-section .course-filter,
.es-mobile body.homepage .dynamic-section,
.es-mobile body.homepage .es-footer,
.es-mobile body.homepage .es-footer-link,
.es-mobile body.homepage .es-friend-link,
.es-mobile body.login .course-list-section .course-filter,
.es-mobile body.login .dynamic-section,
.es-mobile body.login .es-footer,
.es-mobile body.login .es-footer-link,
.es-mobile body.login .es-friend-link,
.es-mobile body.my-course .course-list-section .course-filter,
.es-mobile body.my-course .dynamic-section,
.es-mobile body.my-course .es-footer,
.es-mobile body.my-course .es-footer-link,
.es-mobile body.my-course .es-friend-link,
.es-mobile body.open-course-list .course-list-section .course-filter,
.es-mobile body.open-course-list .dynamic-section,
.es-mobile body.open-course-list .es-footer,
.es-mobile body.open-course-list .es-footer-link,
.es-mobile body.open-course-list .es-friend-link,
.es-mobile body.register .course-list-section .course-filter,
.es-mobile body.register .dynamic-section,
.es-mobile body.register .es-footer,
.es-mobile body.register .es-footer-link,
.es-mobile body.register .es-friend-link {
  display: none;
}

.es-mobile body.course-list-page {
  background-color: #fff;
}

.es-mobile body.course-list-page .es-banner {
  display: none;
}

.es-mobile body.course-list-page #content-container {
  margin-top: 0;
  margin-bottom: 0;
}

.es-mobile body.course-list-page #content-container .es-filter,
.es-mobile body.course-list-page #content-container .tabs-wrapper {
  display: none;
}

.es-mobile body.course-list-page #content-container .panel.panel-default {
  border: none;
  margin-top: -15px;
  margin-bottom: -15px;
}

.es-mobile body.my-course {
  background-color: #fff;
}

.es-mobile body.my-course #content-container {
  margin-top: 0;
  margin-bottom: 0;
}

.es-mobile body.my-course #content-container .my-layout,
.es-mobile body.open-course-list .es-banner {
  display: none;
}

.es-mobile body.open-course-list #content-container {
  margin-top: 0;
  margin-bottom: 0;
}

.es-mobile body.homepage .M_header-back {
  display: none !important;
}

.es-mobile body.homepage .app-download {
  display: block;
}

.es-mobile .navbar-user .user-avatar-li ul li,
.es-mobile body.course-dashboard-page .es-footer-mobile,
.es-mobile body.homepage .class-section,
.es-mobile body.homepage .feature-banner,
.es-mobile body.homepage .recommend-teacher {
  display: none;
}

.es-mobile .navbar-user .user-avatar-li ul li.mobile-switch,
.es-mobile .navbar-user .user-avatar-li ul li.user-nav-li-login,
.es-mobile .navbar-user .user-avatar-li ul li.user-nav-li-logout,
.es-mobile .navbar-user .user-avatar-li ul li.user-nav-li-my,
.es-mobile .navbar-user .user-avatar-li ul li.user-nav-li-register {
  display: block;
}

.M_header-back {
  display: none;
  position: absolute;
  height: 100%;
  width: 40px;
  text-align: center;
  left: 0;
  top: 0;
}

.M_header-back a {
  color: #fff;
}

.M_header-back a i {
  font-size: 30px;
  line-height: 60px;
}

.footer-tool-bar {
  display: none;
  position: fixed;
  border-top: 1px solid #ececec;
  height: 50px;
  padding-top: 8px;
  width: 100%;
  bottom: 0;
  background-color: #f5f5f5;
  overflow: hidden;
  z-index: 10;
}

.footer-tool-bar>div {
  display: inline-block;
  width: 33.33333333%;
  float: left;
  text-align: center;
  font-size: 10px;
  line-height: 1;
}

.footer-tool-bar>div a {
  color: #919191;
}

.footer-tool-bar>div i {
  font-size: 24px;
}

.footer-tool-bar>div.active a {
  color: #46c37b;
}

.footer-tool-bar>div.active a .es-icon-home1:before {
  content: "\E6D1";
}

.footer-tool-bar>div.active a .es-icon-newshot:before {
  content: "\E7C4";
}

.footer-tool-bar>div.active a .es-icon-write:before {
  content: "\E760";
}

.app-download {
  display: none;
  position: fixed;
  top: 60px;
  width: 100%;
  height: 50px;
  background: #fafafa;
  z-index: 10;
}

.app-download i {
  position: absolute;
  top: 0;
  line-height: 50px;
  left: 7px;
  font-size: 26px;
  color: #d9d9d9;
  z-index: 2;
}

.app-download .slogan {
  position: absolute;
  top: 0;
  background-size: 36px 36px;
  background-position: 38px 7px;
  padding-left: 83px;
  padding-top: 8px;
  height: 50px;
}

.app-download .slogan .main-slogan {
  line-height: 1;
  margin-bottom: 6px;
  color: #313131;
}

.app-download .slogan .sub-slogan {
  font-size: 10px;
  color: #919191;
}

.app-download .app-download-button {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  line-height: 50px;
  width: 116px;
  background-color: #46c37b;
  color: #fff;
  text-align: center;
}

.mobile-search {
  padding: 15px 10px;
  position: relative;
}

.mobile-search .form-group {
  margin-bottom: 0;
}

.mobile-search .search-input {
  height: 40px;
  background-color: #f5f5f5;
  font-size: 12px;
  color: #c1c1c1;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
}

.mobile-search button {
  position: absolute;
  display: inline-block;
  top: 14px;
  right: 10px;
  line-height: 1;
  padding: 0 10px;
  border-radius: 0;
  border-left: 1px solid #c1c1c1;
  font-size: 18px;
  margin-top: 10px;
  color: #919191;
  background-color: transparent;
}

.nav-color-white .es-header {
  background-color: #fff;
}

.nav-color-white .es-header .navbar-header .navbar-brand,
.nav-color-white .es-header .navbar-mobile .navbar-more {
  color: #313131;
}

.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li>a {
  color: #c1c1c1;
}

.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li.active>a,
.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li.open.active>a,
.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li.open>a,
.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li.open>a:focus,
.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li.open>a:hover,
.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li>a:focus,
.nav-color-white .es-header .nav-mobile .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.nav-color-white .es-header .nav.navbar-nav>li>a {
  color: #616161;
}

.nav-color-white .es-header .nav.navbar-nav>li.active>a,
.nav-color-white .es-header .nav.navbar-nav>li.open.active>a,
.nav-color-white .es-header .nav.navbar-nav>li.open>a,
.nav-color-white .es-header .nav.navbar-nav>li.open>a:focus,
.nav-color-white .es-header .nav.navbar-nav>li.open>a:hover,
.nav-color-white .es-header .nav.navbar-nav>li>a:focus,
.nav-color-white .es-header .nav.navbar-nav>li>a:hover {
  color: #313131;
}

.nav-color-white .es-header .nav.user-nav>li>a {
  color: #616161;
}

.nav-color-white .es-header .nav.user-nav>li>a:focus,
.nav-color-white .es-header .nav.user-nav>li>a:hover {
  color: #313131;
}

.nav-color-white .navbar-form .form-control {
  border-color: #e1e1e1;
}

.es-nav-default .es-header {
  background-color: #212121;
}

.es-nav-default .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-default .es-header .nav.navbar-nav>li.active>a,
.es-nav-default .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-default .es-header .nav.navbar-nav>li.open>a,
.es-nav-default .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-default .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-default .es-header .nav.navbar-nav>li>a:focus,
.es-nav-default .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-default .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-default .es-header .nav.user-nav>li>a:focus,
.es-nav-default .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-nav-white .es-header {
  background-color: #fff;
  /* 新年皮肤 */
  /* background: url(/static-dist/app/img/2021/PCdaohang_bg@2x.png) no-repeat top center; */
  /* max-width: 1920px; */
  height: 60px;
  min-height: 60px;
  background-size: 1920px 60px;
  margin: 0 auto;
}

.es-nav-white .es-header .navbar-header .navbar-brand,
.es-nav-white .es-header .navbar-mobile .navbar-more {
  color: #313131;
}

.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li>a {
  color: #c1c1c1;
}

.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li.active>a,
.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li.open.active>a,
.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li.open>a,
.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li.open>a:focus,
.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li.open>a:hover,
.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li>a:focus,
.es-nav-white .es-header .nav-mobile .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-white .es-header .nav.navbar-nav>li>a {
  color: #616161;
  /* 新年皮肤 */
  /* color: #ad5d33; */
}

.es-nav-white .es-header .nav.navbar-nav>li.active>a,
.es-nav-white .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-white .es-header .nav.navbar-nav>li.open>a,
.es-nav-white .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-white .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-white .es-header .nav.navbar-nav>li>a:focus,
.es-nav-white .es-header .nav.navbar-nav>li>a:hover {
  color: #313131;
}

.es-nav-white .es-header .nav.user-nav>li>a {
  color: #616161;
}

.es-nav-white .es-header .nav.user-nav>li>a:focus,
.es-nav-white .es-header .nav.user-nav>li>a:hover {
  color: #313131;
}

.es-nav-white .navbar-form .form-control {
  border-color: #e1e1e1;
}

.es-main-blue .badge-primary {
  background-color: #005bac;
}

.es-main-blue .breadcrumb a:hover {
  color: #005bac;
}

.es-main-blue .btn-primary {
  /* border-color: #0064b3;
    background-color: #005bac; */
  border-color: #0091ff;
  background-color: #0091ff;
  border-radius: 100px;
}

.es-main-blue .btn-primary.login21,
.es-main-blue .btn-primary.login21:hover {
  background-color: #005bac;
  border: none;
  border-radius: 4px;
  width: 100%;
  height: 44px;
}

.es-main-blue .btn-primary.active,
.es-main-blue .btn-primary.focus,
.es-main-blue .btn-primary:focus,
.es-main-blue .btn-primary:hover {
  border-color: #0091ff;
  background-color: #0091ff;
  outline: none;
}

.es-main-blue .btn-transparent {
  border-color: #005bac;
  color: #005bac;
}

.es-main-blue .btn-transparent:after {
  background-color: #005bac;
}

.es-main-blue .btn-transparent.active,
.es-main-blue .btn-transparent:hover {
  color: #fff;
}

.es-main-blue .btn-link.focus,
.es-main-blue .btn-link:focus,
.es-main-blue .btn-link:hover {
  color: #005bac;
}

.es-main-blue.lump-card.done {
  border: 1px solid #005bac;
  color: #005bac;
}

.es-main-blue.lump-card.doing {
  background-color: #005bac;
  border: 1px solid #0064b3;
}

.es-main-blue .dropdown-menu>.active>a,
.es-main-blue .dropdown-menu>.active>a:focus,
.es-main-blue .dropdown-menu>.active>a:hover,
.es-main-blue .dropdown-menu>li>a:hover {
  background: #005bac;
}

.es-main-blue .es-tabs .tab-body>ul>li.active>a,
.es-main-blue .es-tabs .tab-body>ul>li>a:hover,
.es-main-blue .es-tabs .tab-header>ul>li>a:hover {
  color: #005bac;
}

.es-main-blue .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-blue .label-primary,
.es-main-blue .label.label-hover-primary:hover {
  background-color: #005bac;
}

.es-main-blue .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #005bac;
}

.es-main-blue .comment-sns:hover,
.es-main-blue .media-comment .reply-link:hover,
.es-main-blue .media-subcomment .reply-link:hover,
.es-main-blue .sidenav .list-group .list-group-item.active>a {
  color: #005bac;
}

.es-main-blue .nav-pills.nav-pills-gray>li.active>a,
.es-main-blue .nav-pills>li.active>a {
  background: #005bac;
}

.es-main-blue .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #005bac;
}

.es-main-blue .nav-pills.nav-pills-transparent>li.active>a,
.es-main-blue .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #005bac;
  color: #005bac;
}

.es-main-blue .nav.nav-tabs .highlight {
  border-bottom: 2px solid #005bac;
}

.es-main-blue .nav.nav-tabs>li.active>a,
.es-main-blue .nav.nav-tabs>li.active>a small,
.es-main-blue .nav.nav-tabs>li:hover>a,
.es-main-blue .nav.nav-tabs>li:hover>a small {
  color: #005bac;
}

.es-main-blue .nav.nav-tabs>li.active>a .badge,
.es-main-blue .nav.nav-tabs>li:hover>a .badge,
.es-main-blue .panel-primary>.panel-heading {
  background-color: #005bac;
}

.es-main-blue .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-blue .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #005bac;
}

.es-main-blue .tabs-wrapper .tabs-mark.active a,
.es-main-blue .tabs-wrapper .tabs-mark:focus a,
.es-main-blue .tabs-wrapper .tabs-mark:hover a {
  color: #005bac;
  border: 1px solid #005bac;
}

.es-main-blue .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-blue .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-blue .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #005bac;
}

.es-main-blue .progress-bar {
  background-color: #005bac;
}

.es-main-blue .pagination>.active>a,
.es-main-blue .pagination>.active>a:focus,
.es-main-blue .pagination>.active>a:hover,
.es-main-blue .pagination>.active>span,
.es-main-blue .pagination>.active>span:focus,
.es-main-blue .pagination>.active>span:hover {
  /* background-color: #005bac;
    border-color: #0064b3; */

  background-color: #4a90e2;
  border-color: #4a90e2;
}

.es-main-blue .form-control:focus {
  border-color: #005bac;
}

.es-main-blue .es-piece .piece-header:after {
  background-color: #0091ff;
  border-radius: 2px;
}

.es-main-blue .bg-primary {
  background-color: #005bac !important;
}

/* .es-main-blue .color-primary,
.es-main-blue .link-dark:hover,
.es-main-blue .link-darker:hover,
.es-main-blue .link-gray:hover,
.es-main-blue .link-light:hover,
.es-main-blue .link-lighter:hover,
.es-main-blue .link-medium:hover,
.es-main-blue .link-primary,
.es-main-blue .link-white:hover {
    color: #005bac !important
} */

.es-main-blue .link-primary:hover {
  color: #0064b3 !important;
}

.es-main-blue .course-list .course-date .btn-circle.btn-live {
  background: #005bac;
}

.es-main-blue .class-serve>ul>li.active,
.es-main-blue .es-bar-menu>ul>li.active,
.es-main-blue .es-bar-menu>ul>li:hover {
  background-color: #005bac;
}

.es-main-blue .bar-menu-top .bar-user.active .badge,
.es-main-blue .bar-menu-top .bar-user:hover .badge {
  color: #005bac;
}

.es-main-blue .bar-task .bar-task-header,
.es-main-blue .bar-task .bar-time-line>li:before {
  background-color: #005bac;
}

.es-main-blue .bar-task .bar-time-line>li .es-icon {
  color: #005bac;
}

.es-main-blue .bar-history ul>li .icon {
  background-color: #005bac;
}

.es-main-blue .es-filter .nav-sort>li>a:hover {
  color: #005bac;
}

.es-main-blue .es-filter .nav-sort>li>a.active {
  background-color: #005bac;
}

.es-main-blue .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-blue .es-filter .btn-group.open .dropdown-toggle {
  color: #005bac;
}

.es-main-blue .es-filter .filter .btn:hover {
  color: #005bac;
  transition: all 0.3s ease;
}

.es-main-blue .es-filter .filter label:hover,
.es-main-blue .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #005bac;
}

.es-main-blue .order-nav .on {
  background: #005bac;
}

.es-main-blue .order-nav .on span {
  border: 23px solid #005bac;
}

.es-main-blue .order-nav .on b {
  border-left-color: #005bac;
}

.es-main-blue .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-blue .note-list .note-item .metas>.name:hover,
.es-main-blue .note-list .note-item .metas>.period,
.es-main-blue .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-blue .task-list.task-show .task-item.active.task-content .title,
.es-main-blue .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-blue .task-list.task-show .task-item:hover.task-content .title,
.es-main-blue .topic-list .topic-item .metas>.name:hover,
.es-main-blue .topic-list .topic-item .metas>.period,
.es-main-blue .topic-list .topic-item .title a:hover {
  color: #005bac;
}

.es-main-blue .select2-container-active .select2-choice,
.es-main-blue .select2-container-active .select2-choices,
.es-main-blue .select2-drop-active {
  border-color: #005bac !important;
}

.es-main-blue .select2-results .select2-highlighted {
  background: #005bac !important;
}

.es-main-blue .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #005bac !important;
}

.es-main-blue .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-blue .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #005bac !important;
}

.es-main-blue .noUi-horizontal .noUi-handle {
  border: 2px solid #005bac;
}

.es-main-blue .noUi-horizontal .noUi-tooltip {
  color: #005bac;
}

.es-main-blue .noUi-connect {
  background-color: #005bac;
}

.es-main-blue .vip-new-member .member-list img:hover {
  border-color: #005bac;
}

.es-main-blue .belongs-class .media-body>a:hover,
.es-main-blue .course-progress .cricle-progress .percent .num {
  color: #005bac;
}

.es-main-blue .orderlearn-poster span.swiper-active-switch {
  background-color: #005bac;
}

.es-main-blue .course-detail-section-responsive ul>li:hover,
.es-main-blue .course-detail-section-responsive ul>li:hover a {
  color: #005bac;
}

.es-main-blue .panel-create-course .course-piece:after {
  background-color: #005bac;
}

.es-main-blue .panel-create-course .course-select:hover {
  border: 2px solid #005bac;
}

.es-main-blue .panel-create-course .course-select.active {
  background-color: #005bac;
}

.es-main-blue .download-activity-list>li>a:hover,
.es-main-blue .download-activity-list>li>a:hover .download-icon,
.es-main-blue .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #005bac;
}

/* .es-main-blue .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-blue .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a, */
.es-main-blue .testpaper-timer .btn-pause {
  background-color: #005bac;
}

.es-main-blue .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #005bac;
}

.es-main-blue .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #005bac;
  border: 3px solid #005bac;
}

.es-main-blue .article-sns .es-share>a:hover,
.es-main-blue .article-sns a.love:hover,
.es-main-blue .chooser-list .table-striped>tbody>tr.active>td,
.es-main-blue .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-blue .class-course-list .course-item .media .course-show:hover,
.es-main-blue .class-header.after .class-data>li>a:hover,
.es-main-blue .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-blue .class-header .class-data>li .dropdown-toggle:hover,
.es-main-blue .download-list li:hover>.btn-delete:hover,
.es-main-blue .topic-detail .topic-header .metas>a:hover,
.es-main-blue .topic-detail .topic-header .title>a:hover,
.es-main-blue .topic-detail .topic-num .num-more i:hover {
  color: #005bac;
}

.es-main-blue .class-signin .btn-signin {
  background-color: #005bac;
}

.es-main-blue .es-poster .swiper-slide .subtitle {
  color: #005bac;
}

.es-main-blue .introduction-section {
  background-color: #005bac;
}

.es-main-blue .live-course-body .es-live-back ul li .dat {
  background: #005bac;
}

.es-main-blue .live-course-body .es-live-all .media-body .user a:hover,
.es-main-blue .live-course-body .es-live-back ul li a:hover {
  color: #005bac;
}

.es-main-blue .social-login .social-icon.social-more:hover {
  background: #005bac;
  border-color: #005bac;
}

.es-main-blue .es-materials-manage .nav-tabs>li.active>a,
.es-main-blue .es-materials-manage .nav-tabs>li>a:hover,
.es-main-blue .es-materillib-table a:hover,
.es-main-blue .material-search-list.material-tabs .right-content li.active a,
.es-main-blue .material-search-list.material-tabs .right-content li:hover a {
  color: #005bac;
}

.es-main-blue .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-blue .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #005bac;
}

.es-main-blue .es-mobile .step .member {
  background: #005bac;
  box-shadow: 0 6px 20px rgba(0, 129, 230, 0.4);
}

.es-main-blue .open-course-panel .panel-heading:before {
  background: #005bac;
}

.es-main-blue .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #005bac;
}

.es-main-blue .open-course-tab .tab-live a.active,
.es-main-blue .open-course-tab .tab-live a:active,
.es-main-blue .open-course-tab .tab-live a:hover {
  background-color: #005bac;
}

.es-main-blue .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #005bac;
  color: #005bac;
}

.es-main-blue .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #005bac;
}

.es-main-blue .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-blue .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-blue .marker-manage .lesson-list .more-questions a:hover {
  color: #005bac;
}

.es-main-blue .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #005bac;
}

.es-main-blue .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #005bac;
}

.es-main-blue .section-wxpay .text-qrcode,
.es-main-blue .subtitle-transcode-status.success {
  background: #005bac;
}

.es-main-blue .btn-consult-default {
  background: #005bac;
  border-color: #0070d5;
}

.es-main-blue .btn-consult-default:hover {
  background: #0070d5;
  border-color: #005fc4;
}

.es-main-blue .list-group-panel .list-group-item.active,
.es-main-blue .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #005bac;
  font-weight: 700;
  border-left: 3px solid #005bac;
}

.es-main-blue .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #005bac;
}

.es-nav-blue .es-header {
  background-color: #005bac;
}

.es-nav-blue .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-blue .es-header .nav.navbar-nav>li.active>a,
.es-nav-blue .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-blue .es-header .nav.navbar-nav>li.open>a,
.es-nav-blue .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-blue .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-blue .es-header .nav.navbar-nav>li>a:focus,
.es-nav-blue .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-blue .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-blue .es-header .nav.user-nav>li>a:focus,
.es-nav-blue .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-blue-light .badge-primary {
  background-color: #4bbbfa;
}

.es-main-blue-light .breadcrumb a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .btn-primary {
  border-color: #19a8f9;
  background-color: #4bbbfa;
}

.es-main-blue-light .btn-primary.active,
.es-main-blue-light .btn-primary.focus,
.es-main-blue-light .btn-primary:focus,
.es-main-blue-light .btn-primary:hover {
  background: #23acf9;
  border-color: #19a8f9;
}

.es-main-blue-light .btn-transparent {
  border-color: #4bbbfa;
  color: #4bbbfa;
}

.es-main-blue-light .btn-transparent:after {
  background-color: #4bbbfa;
}

.es-main-blue-light .btn-transparent.active,
.es-main-blue-light .btn-transparent:hover {
  color: #fff;
}

.es-main-blue-light .btn-link.focus,
.es-main-blue-light .btn-link:focus,
.es-main-blue-light .btn-link:hover {
  color: #4bbbfa;
}

.es-main-blue-light.lump-card.done {
  border: 1px solid #4bbbfa;
  color: #4bbbfa;
}

.es-main-blue-light.lump-card.doing {
  background-color: #4bbbfa;
  border: 1px solid #19a8f9;
}

.es-main-blue-light .dropdown-menu>.active>a,
.es-main-blue-light .dropdown-menu>.active>a:focus,
.es-main-blue-light .dropdown-menu>.active>a:hover,
.es-main-blue-light .dropdown-menu>li>a:hover {
  background: #4bbbfa;
}

.es-main-blue-light .es-tabs .tab-body>ul>li.active>a,
.es-main-blue-light .es-tabs .tab-body>ul>li>a:hover,
.es-main-blue-light .es-tabs .tab-header>ul>li>a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-blue-light .label-primary,
.es-main-blue-light .label.label-hover-primary:hover {
  background-color: #4bbbfa;
}

.es-main-blue-light .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #4bbbfa;
}

.es-main-blue-light .comment-sns:hover,
.es-main-blue-light .media-comment .reply-link:hover,
.es-main-blue-light .media-subcomment .reply-link:hover,
.es-main-blue-light .sidenav .list-group .list-group-item.active>a {
  color: #4bbbfa;
}

.es-main-blue-light .nav-pills.nav-pills-gray>li.active>a,
.es-main-blue-light .nav-pills>li.active>a {
  background: #4bbbfa;
}

.es-main-blue-light .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #4bbbfa;
}

.es-main-blue-light .nav-pills.nav-pills-transparent>li.active>a,
.es-main-blue-light .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #4bbbfa;
  color: #4bbbfa;
}

.es-main-blue-light .nav.nav-tabs .highlight {
  border-bottom: 2px solid #4bbbfa;
}

.es-main-blue-light .nav.nav-tabs>li.active>a,
.es-main-blue-light .nav.nav-tabs>li.active>a small,
.es-main-blue-light .nav.nav-tabs>li:hover>a,
.es-main-blue-light .nav.nav-tabs>li:hover>a small {
  color: #4bbbfa;
}

.es-main-blue-light .nav.nav-tabs>li.active>a .badge,
.es-main-blue-light .nav.nav-tabs>li:hover>a .badge,
.es-main-blue-light .panel-primary>.panel-heading {
  background-color: #4bbbfa;
}

.es-main-blue-light .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-blue-light .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .tabs-wrapper .tabs-mark.active a,
.es-main-blue-light .tabs-wrapper .tabs-mark:focus a,
.es-main-blue-light .tabs-wrapper .tabs-mark:hover a {
  color: #4bbbfa;
  border: 1px solid #4bbbfa;
}

.es-main-blue-light .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-blue-light .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-blue-light .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #4bbbfa;
}

.es-main-blue-light .progress-bar {
  background-color: #4bbbfa;
}

.es-main-blue-light .pagination>.active>a,
.es-main-blue-light .pagination>.active>a:focus,
.es-main-blue-light .pagination>.active>a:hover,
.es-main-blue-light .pagination>.active>span,
.es-main-blue-light .pagination>.active>span:focus,
.es-main-blue-light .pagination>.active>span:hover {
  background-color: #4bbbfa;
  border-color: #19a8f9;
}

.es-main-blue-light .form-control:focus {
  border-color: #4bbbfa;
}

.es-main-blue-light .es-piece .piece-header:after {
  background-color: #4bbbfa;
}

.es-main-blue-light .bg-primary {
  background-color: #4bbbfa !important;
}

.es-main-blue-light .color-primary,
.es-main-blue-light .link-dark:hover,
.es-main-blue-light .link-darker:hover,
.es-main-blue-light .link-gray:hover,
.es-main-blue-light .link-light:hover,
.es-main-blue-light .link-lighter:hover,
.es-main-blue-light .link-medium:hover,
.es-main-blue-light .link-primary,
.es-main-blue-light .link-white:hover {
  color: #4bbbfa !important;
}

.es-main-blue-light .link-primary:hover {
  color: #19a8f9 !important;
}

.es-main-blue-light .course-list .course-date .btn-circle.btn-live {
  background: #4bbbfa;
}

.es-main-blue-light .class-serve>ul>li.active,
.es-main-blue-light .es-bar-menu>ul>li.active,
.es-main-blue-light .es-bar-menu>ul>li:hover {
  background-color: #4bbbfa;
}

.es-main-blue-light .bar-menu-top .bar-user.active .badge,
.es-main-blue-light .bar-menu-top .bar-user:hover .badge {
  color: #4bbbfa;
}

.es-main-blue-light .bar-task .bar-task-header,
.es-main-blue-light .bar-task .bar-time-line>li:before {
  background-color: #4bbbfa;
}

.es-main-blue-light .bar-task .bar-time-line>li .es-icon {
  color: #4bbbfa;
}

.es-main-blue-light .bar-history ul>li .icon {
  background-color: #4bbbfa;
}

.es-main-blue-light .es-filter .nav-sort>li>a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .es-filter .nav-sort>li>a.active {
  background-color: #4bbbfa;
}

.es-main-blue-light .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-blue-light .es-filter .btn-group.open .dropdown-toggle {
  color: #4bbbfa;
}

.es-main-blue-light .es-filter .filter .btn:hover {
  color: #4bbbfa;
  transition: all 0.3s ease;
}

.es-main-blue-light .es-filter .filter label:hover,
.es-main-blue-light .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .order-nav .on {
  background: #4bbbfa;
}

.es-main-blue-light .order-nav .on span {
  border: 23px solid #4bbbfa;
}

.es-main-blue-light .order-nav .on b {
  border-left-color: #4bbbfa;
}

.es-main-blue-light .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-blue-light .note-list .note-item .metas>.name:hover,
.es-main-blue-light .note-list .note-item .metas>.period,
.es-main-blue-light .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-blue-light .task-list.task-show .task-item.active.task-content .title,
.es-main-blue-light .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-blue-light .task-list.task-show .task-item:hover.task-content .title,
.es-main-blue-light .topic-list .topic-item .metas>.name:hover,
.es-main-blue-light .topic-list .topic-item .metas>.period,
.es-main-blue-light .topic-list .topic-item .title a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .select2-container-active .select2-choice,
.es-main-blue-light .select2-container-active .select2-choices,
.es-main-blue-light .select2-drop-active {
  border-color: #4bbbfa !important;
}

.es-main-blue-light .select2-results .select2-highlighted {
  background: #4bbbfa !important;
}

.es-main-blue-light .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #4bbbfa !important;
}

.es-main-blue-light .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-blue-light .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #4bbbfa !important;
}

.es-main-blue-light .noUi-horizontal .noUi-handle {
  border: 2px solid #4bbbfa;
}

.es-main-blue-light .noUi-horizontal .noUi-tooltip {
  color: #4bbbfa;
}

.es-main-blue-light .noUi-connect {
  background-color: #4bbbfa;
}

.es-main-blue-light .vip-new-member .member-list img:hover {
  border-color: #4bbbfa;
}

.es-main-blue-light .belongs-class .media-body>a:hover,
.es-main-blue-light .course-progress .cricle-progress .percent .num {
  color: #4bbbfa;
}

.es-main-blue-light .orderlearn-poster span.swiper-active-switch {
  background-color: #4bbbfa;
}

.es-main-blue-light .course-detail-section-responsive ul>li:hover,
.es-main-blue-light .course-detail-section-responsive ul>li:hover a {
  color: #4bbbfa;
}

.es-main-blue-light .panel-create-course .course-piece:after {
  background-color: #4bbbfa;
}

.es-main-blue-light .panel-create-course .course-select:hover {
  border: 2px solid #4bbbfa;
}

.es-main-blue-light .panel-create-course .course-select.active {
  background-color: #4bbbfa;
}

.es-main-blue-light .download-activity-list>li>a:hover,
.es-main-blue-light .download-activity-list>li>a:hover .download-icon,
.es-main-blue-light .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #4bbbfa;
}

.es-main-blue-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-blue-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-blue-light .testpaper-timer .btn-pause {
  background-color: #4bbbfa;
}

.es-main-blue-light .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #4bbbfa;
}

.es-main-blue-light .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #4bbbfa;
  border: 3px solid #4bbbfa;
}

.es-main-blue-light .article-sns .es-share>a:hover,
.es-main-blue-light .article-sns a.love:hover,
.es-main-blue-light .chooser-list .table-striped>tbody>tr.active>td,
.es-main-blue-light .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-blue-light .class-course-list .course-item .media .course-show:hover,
.es-main-blue-light .class-header.after .class-data>li>a:hover,
.es-main-blue-light .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-blue-light .class-header .class-data>li .dropdown-toggle:hover,
.es-main-blue-light .download-list li:hover>.btn-delete:hover,
.es-main-blue-light .topic-detail .topic-header .metas>a:hover,
.es-main-blue-light .topic-detail .topic-header .title>a:hover,
.es-main-blue-light .topic-detail .topic-num .num-more i:hover {
  color: #4bbbfa;
}

.es-main-blue-light .class-signin .btn-signin {
  background-color: #4bbbfa;
}

.es-main-blue-light .es-poster .swiper-slide .subtitle {
  color: #4bbbfa;
}

.es-main-blue-light .introduction-section {
  background-color: #4bbbfa;
}

.es-main-blue-light .live-course-body .es-live-back ul li .dat {
  background: #4bbbfa;
}

.es-main-blue-light .live-course-body .es-live-all .media-body .user a:hover,
.es-main-blue-light .live-course-body .es-live-back ul li a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .social-login .social-icon.social-more:hover {
  background: #4bbbfa;
  border-color: #4bbbfa;
}

.es-main-blue-light .es-materials-manage .nav-tabs>li.active>a,
.es-main-blue-light .es-materials-manage .nav-tabs>li>a:hover,
.es-main-blue-light .es-materillib-table a:hover,
.es-main-blue-light .material-search-list.material-tabs .right-content li.active a,
.es-main-blue-light .material-search-list.material-tabs .right-content li:hover a {
  color: #4bbbfa;
}

.es-main-blue-light .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-blue-light .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #4bbbfa;
}

.es-main-blue-light .es-mobile .step .member {
  background: #4bbbfa;
  box-shadow: 0 6px 20px rgba(75, 187, 250, 0.4);
}

.es-main-blue-light .open-course-panel .panel-heading:before {
  background: #4bbbfa;
}

.es-main-blue-light .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #4bbbfa;
}

.es-main-blue-light .open-course-tab .tab-live a.active,
.es-main-blue-light .open-course-tab .tab-live a:active,
.es-main-blue-light .open-course-tab .tab-live a:hover {
  background-color: #4bbbfa;
}

.es-main-blue-light .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #4bbbfa;
  color: #4bbbfa;
}

.es-main-blue-light .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #4bbbfa;
}

.es-main-blue-light .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-blue-light .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-blue-light .marker-manage .lesson-list .more-questions a:hover {
  color: #4bbbfa;
}

.es-main-blue-light .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #4bbbfa;
}

.es-main-blue-light .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #4bbbfa;
}

.es-main-blue-light .section-wxpay .text-qrcode,
.es-main-blue-light .subtitle-transcode-status.success {
  background: #4bbbfa;
}

.es-main-blue-light .btn-consult-default {
  background: #4bbbfa;
  border-color: #3aaae9;
}

.es-main-blue-light .btn-consult-default:hover {
  background: #3aaae9;
  border-color: #2999d8;
}

.es-main-blue-light .list-group-panel .list-group-item.active,
.es-main-blue-light .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #4bbbfa;
  font-weight: 700;
  border-left: 3px solid #4bbbfa;
}

.es-main-blue-light .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #4bbbfa;
}

.es-nav-blue-light .es-header {
  background-color: #4bbbfa;
}

.es-nav-blue-light .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-blue-light .es-header .nav.navbar-nav>li.active>a,
.es-nav-blue-light .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-blue-light .es-header .nav.navbar-nav>li.open>a,
.es-nav-blue-light .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-blue-light .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-blue-light .es-header .nav.navbar-nav>li>a:focus,
.es-nav-blue-light .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-blue-light .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-blue-light .es-header .nav.user-nav>li>a:focus,
.es-nav-blue-light .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-default .badge-primary {
  background-color: #46c37b;
}

.es-main-default .breadcrumb a:hover {
  color: #46c37b;
}

.es-main-default .btn-primary {
  border-color: #34a263;
  background-color: #46c37b;
}

.es-main-default .btn-primary.active,
.es-main-default .btn-primary.focus,
.es-main-default .btn-primary:focus,
.es-main-default .btn-primary:hover {
  background: #37a967;
  border-color: #34a263;
}

.es-main-default .btn-transparent {
  border-color: #46c37b;
  color: #46c37b;
}

.es-main-default .btn-transparent:after {
  background-color: #46c37b;
}

.es-main-default .btn-transparent.active,
.es-main-default .btn-transparent:hover {
  color: #fff;
}

.es-main-default .btn-link.focus,
.es-main-default .btn-link:focus,
.es-main-default .btn-link:hover {
  color: #46c37b;
}

.es-main-default.lump-card.done {
  border: 1px solid #46c37b;
  color: #46c37b;
}

.es-main-default.lump-card.doing {
  background-color: #46c37b;
  border: 1px solid #34a263;
}

.es-main-default .dropdown-menu>.active>a,
.es-main-default .dropdown-menu>.active>a:focus,
.es-main-default .dropdown-menu>.active>a:hover,
.es-main-default .dropdown-menu>li>a:hover {
  background: #46c37b;
}

.es-main-default .es-tabs .tab-body>ul>li.active>a,
.es-main-default .es-tabs .tab-body>ul>li>a:hover,
.es-main-default .es-tabs .tab-header>ul>li>a:hover {
  color: #46c37b;
}

.es-main-default .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-default .label-primary,
.es-main-default .label.label-hover-primary:hover {
  background-color: #46c37b;
}

.es-main-default .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #46c37b;
}

.es-main-default .comment-sns:hover,
.es-main-default .media-comment .reply-link:hover,
.es-main-default .media-subcomment .reply-link:hover,
.es-main-default .sidenav .list-group .list-group-item.active>a {
  color: #46c37b;
}

.es-main-default .nav-pills.nav-pills-gray>li.active>a,
.es-main-default .nav-pills>li.active>a {
  background: #46c37b;
}

.es-main-default .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #46c37b;
}

.es-main-default .nav-pills.nav-pills-transparent>li.active>a,
.es-main-default .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #46c37b;
  color: #46c37b;
}

.es-main-default .nav.nav-tabs .highlight {
  border-bottom: 2px solid #46c37b;
}

.es-main-default .nav.nav-tabs>li.active>a,
.es-main-default .nav.nav-tabs>li.active>a small,
.es-main-default .nav.nav-tabs>li:hover>a,
.es-main-default .nav.nav-tabs>li:hover>a small {
  color: #46c37b;
}

.es-main-default .nav.nav-tabs>li.active>a .badge,
.es-main-default .nav.nav-tabs>li:hover>a .badge,
.es-main-default .panel-primary>.panel-heading {
  background-color: #46c37b;
}

.es-main-default .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-default .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #46c37b;
}

.es-main-default .tabs-wrapper .tabs-mark.active a,
.es-main-default .tabs-wrapper .tabs-mark:focus a,
.es-main-default .tabs-wrapper .tabs-mark:hover a {
  color: #46c37b;
  border: 1px solid #46c37b;
}

.es-main-default .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-default .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-default .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #46c37b;
}

.es-main-default .progress-bar {
  background-color: #46c37b;
}

.es-main-default .pagination>.active>a,
.es-main-default .pagination>.active>a:focus,
.es-main-default .pagination>.active>a:hover,
.es-main-default .pagination>.active>span,
.es-main-default .pagination>.active>span:focus,
.es-main-default .pagination>.active>span:hover {
  background-color: #46c37b;
  border-color: #34a263;
}

.es-main-default .form-control:focus {
  border-color: #46c37b;
}

.es-main-default .es-piece .piece-header:after {
  background-color: #46c37b;
}

.es-main-default .bg-primary {
  background-color: #46c37b !important;
}

.es-main-default .color-primary,
.es-main-default .link-dark:hover,
.es-main-default .link-darker:hover,
.es-main-default .link-gray:hover,
.es-main-default .link-light:hover,
.es-main-default .link-lighter:hover,
.es-main-default .link-medium:hover,
.es-main-default .link-primary,
.es-main-default .link-white:hover {
  color: #46c37b !important;
}

.es-main-default .link-primary:hover {
  color: #34a263 !important;
}

.es-main-default .course-list .course-date .btn-circle.btn-live {
  background: #46c37b;
}

.es-main-default .class-serve>ul>li.active,
.es-main-default .es-bar-menu>ul>li.active,
.es-main-default .es-bar-menu>ul>li:hover {
  background-color: #46c37b;
}

.es-main-default .bar-menu-top .bar-user.active .badge,
.es-main-default .bar-menu-top .bar-user:hover .badge {
  color: #46c37b;
}

.es-main-default .bar-task .bar-task-header,
.es-main-default .bar-task .bar-time-line>li:before {
  background-color: #46c37b;
}

.es-main-default .bar-task .bar-time-line>li .es-icon {
  color: #46c37b;
}

.es-main-default .bar-history ul>li .icon {
  background-color: #46c37b;
}

.es-main-default .es-filter .nav-sort>li>a:hover {
  color: #46c37b;
}

.es-main-default .es-filter .nav-sort>li>a.active {
  background-color: #46c37b;
}

.es-main-default .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-default .es-filter .btn-group.open .dropdown-toggle {
  color: #46c37b;
}

.es-main-default .es-filter .filter .btn:hover {
  color: #46c37b;
  transition: all 0.3s ease;
}

.es-main-default .es-filter .filter label:hover,
.es-main-default .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #46c37b;
}

.es-main-default .order-nav .on {
  background: #46c37b;
}

.es-main-default .order-nav .on span {
  border: 23px solid #46c37b;
}

.es-main-default .order-nav .on b {
  border-left-color: #46c37b;
}

.es-main-default .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-default .note-list .note-item .metas>.name:hover,
.es-main-default .note-list .note-item .metas>.period,
.es-main-default .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-default .task-list.task-show .task-item.active.task-content .title,
.es-main-default .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-default .task-list.task-show .task-item:hover.task-content .title,
.es-main-default .topic-list .topic-item .metas>.name:hover,
.es-main-default .topic-list .topic-item .metas>.period,
.es-main-default .topic-list .topic-item .title a:hover {
  color: #46c37b;
}

.es-main-default .select2-container-active .select2-choice,
.es-main-default .select2-container-active .select2-choices,
.es-main-default .select2-drop-active {
  border-color: #46c37b !important;
}

.es-main-default .select2-results .select2-highlighted {
  background: #46c37b !important;
}

.es-main-default .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #46c37b !important;
}

.es-main-default .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-default .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #46c37b !important;
}

.es-main-default .noUi-horizontal .noUi-handle {
  border: 2px solid #46c37b;
}

.es-main-default .noUi-horizontal .noUi-tooltip {
  color: #46c37b;
}

.es-main-default .noUi-connect {
  background-color: #46c37b;
}

.es-main-default .vip-new-member .member-list img:hover {
  border-color: #46c37b;
}

.es-main-default .belongs-class .media-body>a:hover,
.es-main-default .course-progress .cricle-progress .percent .num {
  color: #46c37b;
}

.es-main-default .orderlearn-poster span.swiper-active-switch {
  background-color: #46c37b;
}

.es-main-default .course-detail-section-responsive ul>li:hover,
.es-main-default .course-detail-section-responsive ul>li:hover a {
  color: #46c37b;
}

.es-main-default .panel-create-course .course-piece:after {
  background-color: #46c37b;
}

.es-main-default .panel-create-course .course-select:hover {
  border: 2px solid #46c37b;
}

.es-main-default .panel-create-course .course-select.active {
  background-color: #46c37b;
}

.es-main-default .download-activity-list>li>a:hover,
.es-main-default .download-activity-list>li>a:hover .download-icon,
.es-main-default .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #46c37b;
}

.es-main-default .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-default .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-default .testpaper-timer .btn-pause {
  background-color: #46c37b;
}

.es-main-default .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #46c37b;
}

.es-main-default .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #46c37b;
  border: 3px solid #46c37b;
}

.es-main-default .article-sns .es-share>a:hover,
.es-main-default .article-sns a.love:hover,
.es-main-default .chooser-list .table-striped>tbody>tr.active>td,
.es-main-default .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-default .class-course-list .course-item .media .course-show:hover,
.es-main-default .class-header.after .class-data>li>a:hover,
.es-main-default .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-default .class-header .class-data>li .dropdown-toggle:hover,
.es-main-default .download-list li:hover>.btn-delete:hover,
.es-main-default .topic-detail .topic-header .metas>a:hover,
.es-main-default .topic-detail .topic-header .title>a:hover,
.es-main-default .topic-detail .topic-num .num-more i:hover {
  color: #46c37b;
}

.es-main-default .class-signin .btn-signin {
  background-color: #46c37b;
}

.es-main-default .es-poster .swiper-slide .subtitle {
  color: #46c37b;
}

.es-main-default .introduction-section {
  background-color: #46c37b;
}

.es-main-default .live-course-body .es-live-back ul li .dat {
  background: #46c37b;
}

.es-main-default .live-course-body .es-live-all .media-body .user a:hover,
.es-main-default .live-course-body .es-live-back ul li a:hover {
  color: #46c37b;
}

.es-main-default .social-login .social-icon.social-more:hover {
  background: #46c37b;
  border-color: #46c37b;
}

.es-main-default .es-materials-manage .nav-tabs>li.active>a,
.es-main-default .es-materials-manage .nav-tabs>li>a:hover,
.es-main-default .es-materillib-table a:hover,
.es-main-default .material-search-list.material-tabs .right-content li.active a,
.es-main-default .material-search-list.material-tabs .right-content li:hover a {
  color: #46c37b;
}

.es-main-default .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-default .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #46c37b;
}

.es-main-default .es-mobile .step .member {
  background: #46c37b;
  box-shadow: 0 6px 20px rgba(70, 195, 123, 0.4);
}

.es-main-default .open-course-panel .panel-heading:before {
  background: #46c37b;
}

.es-main-default .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #46c37b;
}

.es-main-default .open-course-tab .tab-live a.active,
.es-main-default .open-course-tab .tab-live a:active,
.es-main-default .open-course-tab .tab-live a:hover {
  background-color: #46c37b;
}

.es-main-default .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #46c37b;
  color: #46c37b;
}

.es-main-default .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #46c37b;
}

.es-main-default .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-default .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-default .marker-manage .lesson-list .more-questions a:hover {
  color: #46c37b;
}

.es-main-default .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #46c37b;
}

.es-main-default .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #46c37b;
}

.es-main-default .section-wxpay .text-qrcode,
.es-main-default .subtitle-transcode-status.success {
  background: #46c37b;
}

.es-main-default .btn-consult-default {
  background: #46c37b;
  border-color: #35b26a;
}

.es-main-default .btn-consult-default:hover {
  background: #35b26a;
  border-color: #24a159;
}

.es-main-default .list-group-panel .list-group-item.active,
.es-main-default .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #46c37b;
  font-weight: 700;
  border-left: 3px solid #46c37b;
}

.es-main-default .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #46c37b;
}

.es-nav-green .es-header {
  background-color: #46c37b;
}

.es-nav-green .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-green .es-header .nav.navbar-nav>li.active>a,
.es-nav-green .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-green .es-header .nav.navbar-nav>li.open>a,
.es-nav-green .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-green .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-green .es-header .nav.navbar-nav>li>a:focus,
.es-nav-green .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-green .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-green .es-header .nav.user-nav>li>a:focus,
.es-nav-green .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-green-light .badge-primary {
  background-color: #005bac;
}

.es-main-green-light .breadcrumb a:hover {
  color: #005bac;
}

.es-main-green-light .btn-primary {
  border-color: #005bac;
  background-color: #005bac;
}

.es-main-green-light .btn-primary.active,
.es-main-green-light .btn-primary.focus,
.es-main-green-light .btn-primary:focus,
.es-main-green-light .btn-primary:hover {
  background: #005bac;
  border-color: #005bac;
}

.es-main-green-light .btn-transparent {
  border-color: #005bac;
  color: #005bac;
}

.es-main-green-light .btn-transparent:after {
  background-color: #005bac;
}

.es-main-green-light .btn-transparent.active,
.es-main-green-light .btn-transparent:hover {
  color: #fff;
}

.es-main-green-light .btn-link.focus,
.es-main-green-light .btn-link:focus,
.es-main-green-light .btn-link:hover {
  color: #005bac;
}

.es-main-green-light.lump-card.done {
  border: 1px solid #005bac;
  color: #005bac;
}

.es-main-green-light.lump-card.doing {
  background-color: #005bac;
  border: 1px solid #005bac;
}

.es-main-green-light .dropdown-menu>.active>a,
.es-main-green-light .dropdown-menu>.active>a:focus,
.es-main-green-light .dropdown-menu>.active>a:hover,
.es-main-green-light .dropdown-menu>li>a:hover {
  background: #005bac;
}

.es-main-green-light .es-tabs .tab-body>ul>li.active>a,
.es-main-green-light .es-tabs .tab-body>ul>li>a:hover,
.es-main-green-light .es-tabs .tab-header>ul>li>a:hover {
  color: #005bac;
}

.es-main-green-light .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-green-light .label-primary,
.es-main-green-light .label.label-hover-primary:hover {
  background-color: #005bac;
}

.es-main-green-light .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #005bac;
}

.es-main-green-light .comment-sns:hover,
.es-main-green-light .media-comment .reply-link:hover,
.es-main-green-light .media-subcomment .reply-link:hover,
.es-main-green-light .sidenav .list-group .list-group-item.active>a {
  color: #005bac;
}

.es-main-green-light .nav-pills.nav-pills-gray>li.active>a,
.es-main-green-light .nav-pills>li.active>a {
  background: #005bac;
}

.es-main-green-light .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #005bac;
}

.es-main-green-light .nav-pills.nav-pills-transparent>li.active>a,
.es-main-green-light .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #005bac;
  color: #005bac;
}

.es-main-green-light .nav.nav-tabs .highlight {
  border-bottom: 2px solid #005bac;
}

.es-main-green-light .nav.nav-tabs>li.active>a,
.es-main-green-light .nav.nav-tabs>li.active>a small,
.es-main-green-light .nav.nav-tabs>li:hover>a,
.es-main-green-light .nav.nav-tabs>li:hover>a small {
  color: #005bac;
}

.es-main-green-light .nav.nav-tabs>li.active>a .badge,
.es-main-green-light .nav.nav-tabs>li:hover>a .badge,
.es-main-green-light .panel-primary>.panel-heading {
  background-color: #005bac;
}

.es-main-green-light .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-green-light .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #005bac;
}

.es-main-green-light .tabs-wrapper .tabs-mark.active a,
.es-main-green-light .tabs-wrapper .tabs-mark:focus a,
.es-main-green-light .tabs-wrapper .tabs-mark:hover a {
  color: #005bac;
  border: 1px solid #005bac;
}

.es-main-green-light .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-green-light .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-green-light .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #005bac;
}

.es-main-green-light .progress-bar {
  background-color: #005bac;
}

.es-main-green-light .pagination>.active>a,
.es-main-green-light .pagination>.active>a:focus,
.es-main-green-light .pagination>.active>a:hover,
.es-main-green-light .pagination>.active>span,
.es-main-green-light .pagination>.active>span:focus,
.es-main-green-light .pagination>.active>span:hover {
  background-color: #005bac;
  border-color: #005bac;
}

.es-main-green-light .form-control:focus {
  border-color: #005bac;
}

.es-main-green-light .es-piece .piece-header:after {
  background-color: #005bac;
}

.es-main-green-light .bg-primary {
  background-color: #005bac !important;
}

.es-main-green-light .color-primary,
.es-main-green-light .link-dark:hover,
.es-main-green-light .link-darker:hover,
.es-main-green-light .link-gray:hover,
.es-main-green-light .link-light:hover,
.es-main-green-light .link-lighter:hover,
.es-main-green-light .link-medium:hover,
.es-main-green-light .link-primary,
.es-main-green-light .link-white:hover {
  color: #005bac !important;
}

.es-main-green-light .link-primary:hover {
  color: #005bac !important;
}

.es-main-green-light .course-list .course-date .btn-circle.btn-live {
  background: #005bac;
}

.es-main-green-light .class-serve>ul>li.active,
.es-main-green-light .es-bar-menu>ul>li.active,
.es-main-green-light .es-bar-menu>ul>li:hover {
  background-color: #005bac;
}

.es-main-green-light .bar-menu-top .bar-user.active .badge,
.es-main-green-light .bar-menu-top .bar-user:hover .badge {
  color: #005bac;
}

.es-main-green-light .bar-task .bar-task-header,
.es-main-green-light .bar-task .bar-time-line>li:before {
  background-color: #005bac;
}

.es-main-green-light .bar-task .bar-time-line>li .es-icon {
  color: #005bac;
}

.es-main-green-light .bar-history ul>li .icon {
  background-color: #005bac;
}

.es-main-green-light .es-filter .nav-sort>li>a:hover,
.es-main-blue .es-filter .nav-sort>li>a:hover {
  color: #005bac;
}

.es-main-green-light .es-filter .nav-sort>li>a.active,
.es-main-blue .es-filter .nav-sort>li>a.active {
  background-color: transparent !important;
  border-bottom: 3px solid #005bac;
  color: #005bac;
}

.es-main-green-light .es-filter .nav-sort>li>a.active:hover {
  color: #005bac;
}

.es-main-green-light .es-filter .btn-group.open .dropdown-toggle {
  color: #005bac;
}

.es-main-green-light .es-filter .filter .btn:hover {
  color: #005bac;
  transition: all 0.3s ease;
}

.es-main-green-light .es-filter .filter label:hover,
.es-main-green-light .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #005bac;
}

.es-main-green-light .order-nav .on {
  background: #005bac;
}

.es-main-green-light .order-nav .on span {
  border: 23px solid #005bac;
}

.es-main-green-light .order-nav .on b {
  border-left-color: #005bac;
}

.es-main-green-light .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-green-light .note-list .note-item .metas>.name:hover,
.es-main-green-light .note-list .note-item .metas>.period,
.es-main-green-light .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-green-light .task-list.task-show .task-item.active.task-content .title,
.es-main-green-light .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-green-light .task-list.task-show .task-item:hover.task-content .title,
.es-main-green-light .topic-list .topic-item .metas>.name:hover,
.es-main-green-light .topic-list .topic-item .metas>.period,
.es-main-green-light .topic-list .topic-item .title a:hover {
  color: #005bac;
}

.es-main-green-light .select2-container-active .select2-choice,
.es-main-green-light .select2-container-active .select2-choices,
.es-main-green-light .select2-drop-active {
  border-color: #005bac !important;
}

.es-main-green-light .select2-results .select2-highlighted {
  background: #005bac !important;
}

.es-main-green-light .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #005bac !important;
}

.es-main-green-light .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-green-light .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #005bac !important;
}

.es-main-green-light .noUi-horizontal .noUi-handle {
  border: 2px solid #005bac;
}

.es-main-green-light .noUi-horizontal .noUi-tooltip {
  color: #005bac;
}

.es-main-green-light .noUi-connect {
  background-color: #005bac;
}

.es-main-green-light .vip-new-member .member-list img:hover {
  border-color: #005bac;
}

.es-main-green-light .belongs-class .media-body>a:hover,
.es-main-green-light .course-progress .cricle-progress .percent .num {
  color: #005bac;
}

.es-main-green-light .orderlearn-poster span.swiper-active-switch {
  background-color: #005bac;
}

.es-main-green-light .course-detail-section-responsive ul>li:hover,
.es-main-green-light .course-detail-section-responsive ul>li:hover a {
  color: #005bac;
}

.es-main-green-light .panel-create-course .course-piece:after {
  background-color: #005bac;
}

.es-main-green-light .panel-create-course .course-select:hover {
  border: 2px solid #005bac;
}

.es-main-green-light .panel-create-course .course-select.active {
  background-color: #005bac;
}

.es-main-green-light .download-activity-list>li>a:hover,
.es-main-green-light .download-activity-list>li>a:hover .download-icon,
.es-main-green-light .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #005bac;
}

.es-main-green-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-green-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-green-light .testpaper-timer .btn-pause {
  background-color: #005bac;
}

.es-main-green-light .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #005bac;
}

.es-main-green-light .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #005bac;
  border: 3px solid #005bac;
}

.es-main-green-light .article-sns .es-share>a:hover,
.es-main-green-light .article-sns a.love:hover,
.es-main-green-light .chooser-list .table-striped>tbody>tr.active>td,
.es-main-green-light .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-green-light .class-course-list .course-item .media .course-show:hover,
.es-main-green-light .class-header.after .class-data>li>a:hover,
.es-main-green-light .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-green-light .class-header .class-data>li .dropdown-toggle:hover,
.es-main-green-light .download-list li:hover>.btn-delete:hover,
.es-main-green-light .topic-detail .topic-header .metas>a:hover,
.es-main-green-light .topic-detail .topic-header .title>a:hover,
.es-main-green-light .topic-detail .topic-num .num-more i:hover {
  color: #005bac;
}

.es-main-green-light .class-signin .btn-signin {
  background-color: #005bac;
}

.es-main-green-light .es-poster .swiper-slide .subtitle {
  color: #005bac;
}

.es-main-green-light .introduction-section {
  background-color: #005bac;
}

.es-main-green-light .live-course-body .es-live-back ul li .dat {
  background: #005bac;
}

.es-main-green-light .live-course-body .es-live-all .media-body .user a:hover,
.es-main-green-light .live-course-body .es-live-back ul li a:hover {
  color: #005bac;
}

.es-main-green-light .social-login .social-icon.social-more:hover {
  background: #005bac;
  border-color: #005bac;
}

.es-main-green-light .es-materials-manage .nav-tabs>li.active>a,
.es-main-green-light .es-materials-manage .nav-tabs>li>a:hover,
.es-main-green-light .es-materillib-table a:hover,
.es-main-green-light .material-search-list.material-tabs .right-content li.active a,
.es-main-green-light .material-search-list.material-tabs .right-content li:hover a {
  color: #005bac;
}

.es-main-green-light .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-green-light .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #005bac;
}

.es-main-green-light .es-mobile .step .member {
  background: #005bac;
  box-shadow: 0 6px 20px rgba(129, 216, 103, 0.4);
}

.es-main-green-light .open-course-panel .panel-heading:before {
  background: #005bac;
}

.es-main-green-light .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #005bac;
}

.es-main-green-light .open-course-tab .tab-live a.active,
.es-main-green-light .open-course-tab .tab-live a:active,
.es-main-green-light .open-course-tab .tab-live a:hover {
  background-color: #005bac;
}

.es-main-green-light .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #005bac;
  color: #005bac;
}

.es-main-green-light .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #005bac;
}

.es-main-green-light .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-green-light .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-green-light .marker-manage .lesson-list .more-questions a:hover {
  color: #005bac;
}

.es-main-green-light .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #005bac;
}

.es-main-green-light .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #005bac;
}

.es-main-green-light .section-wxpay .text-qrcode,
.es-main-green-light .subtitle-transcode-status.success {
  background: #005bac;
}

.es-main-green-light .btn-consult-default {
  background: #005bac;
  border-color: #70c756;
}

.es-main-green-light .btn-consult-default:hover {
  background: #70c756;
  border-color: #5fb645;
}

.es-main-green-light .list-group-panel .list-group-item.active,
.es-main-green-light .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #005bac;
  font-weight: 700;
  border-left: 3px solid #005bac;
}

.es-main-green-light .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #005bac;
}

.es-nav-green-light .es-header {
  background-color: #005bac;
}

.es-nav-green-light .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-green-light .es-header .nav.navbar-nav>li.active>a,
.es-nav-green-light .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-green-light .es-header .nav.navbar-nav>li.open>a,
.es-nav-green-light .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-green-light .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-green-light .es-header .nav.navbar-nav>li>a:focus,
.es-nav-green-light .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-green-light .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-green-light .es-header .nav.user-nav>li>a:focus,
.es-nav-green-light .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-orange .badge-primary {
  background-color: #ff7200;
}

.es-main-orange .breadcrumb a:hover {
  color: #ff7200;
}

.es-main-orange .btn-primary {
  border-color: #cc5b00;
  background-color: #ff7200;
}

.es-main-orange .btn-primary.active,
.es-main-orange .btn-primary.focus,
.es-main-orange .btn-primary:focus,
.es-main-orange .btn-primary:hover {
  background: #d66000;
  border-color: #cc5b00;
}

.es-main-orange .btn-transparent {
  border-color: #ff7200;
  color: #ff7200;
}

.es-main-orange .btn-transparent:after {
  background-color: #ff7200;
}

.es-main-orange .btn-transparent.active,
.es-main-orange .btn-transparent:hover {
  color: #fff;
}

.es-main-orange .btn-link.focus,
.es-main-orange .btn-link:focus,
.es-main-orange .btn-link:hover {
  color: #ff7200;
}

.es-main-orange.lump-card.done {
  border: 1px solid #ff7200;
  color: #ff7200;
}

.es-main-orange.lump-card.doing {
  background-color: #ff7200;
  border: 1px solid #cc5b00;
}

.es-main-orange .dropdown-menu>.active>a,
.es-main-orange .dropdown-menu>.active>a:focus,
.es-main-orange .dropdown-menu>.active>a:hover,
.es-main-orange .dropdown-menu>li>a:hover {
  background: #ff7200;
}

.es-main-orange .es-tabs .tab-body>ul>li.active>a,
.es-main-orange .es-tabs .tab-body>ul>li>a:hover,
.es-main-orange .es-tabs .tab-header>ul>li>a:hover {
  color: #ff7200;
}

.es-main-orange .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-orange .label-primary,
.es-main-orange .label.label-hover-primary:hover {
  background-color: #ff7200;
}

.es-main-orange .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #ff7200;
}

.es-main-orange .comment-sns:hover,
.es-main-orange .media-comment .reply-link:hover,
.es-main-orange .media-subcomment .reply-link:hover,
.es-main-orange .sidenav .list-group .list-group-item.active>a {
  color: #ff7200;
}

.es-main-orange .nav-pills.nav-pills-gray>li.active>a,
.es-main-orange .nav-pills>li.active>a {
  background: #ff7200;
}

.es-main-orange .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #ff7200;
}

.es-main-orange .nav-pills.nav-pills-transparent>li.active>a,
.es-main-orange .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #ff7200;
  color: #ff7200;
}

.es-main-orange .nav.nav-tabs .highlight {
  border-bottom: 2px solid #ff7200;
}

.es-main-orange .nav.nav-tabs>li.active>a,
.es-main-orange .nav.nav-tabs>li.active>a small,
.es-main-orange .nav.nav-tabs>li:hover>a,
.es-main-orange .nav.nav-tabs>li:hover>a small {
  color: #ff7200;
}

.es-main-orange .nav.nav-tabs>li.active>a .badge,
.es-main-orange .nav.nav-tabs>li:hover>a .badge,
.es-main-orange .panel-primary>.panel-heading {
  background-color: #ff7200;
}

.es-main-orange .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-orange .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #ff7200;
}

.es-main-orange .tabs-wrapper .tabs-mark.active a,
.es-main-orange .tabs-wrapper .tabs-mark:focus a,
.es-main-orange .tabs-wrapper .tabs-mark:hover a {
  color: #ff7200;
  border: 1px solid #ff7200;
}

.es-main-orange .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-orange .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-orange .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #ff7200;
}

.es-main-orange .progress-bar {
  background-color: #ff7200;
}

.es-main-orange .pagination>.active>a,
.es-main-orange .pagination>.active>a:focus,
.es-main-orange .pagination>.active>a:hover,
.es-main-orange .pagination>.active>span,
.es-main-orange .pagination>.active>span:focus,
.es-main-orange .pagination>.active>span:hover {
  background-color: #ff7200;
  border-color: #cc5b00;
}

.es-main-orange .form-control:focus {
  border-color: #ff7200;
}

.es-main-orange .es-piece .piece-header:after {
  background-color: #ff7200;
}

.es-main-orange .bg-primary {
  background-color: #ff7200 !important;
}

.es-main-orange .color-primary,
.es-main-orange .link-dark:hover,
.es-main-orange .link-darker:hover,
.es-main-orange .link-gray:hover,
.es-main-orange .link-light:hover,
.es-main-orange .link-lighter:hover,
.es-main-orange .link-medium:hover,
.es-main-orange .link-primary,
.es-main-orange .link-white:hover {
  color: #ff7200 !important;
}

.es-main-orange .link-primary:hover {
  color: #cc5b00 !important;
}

.es-main-orange .course-list .course-date .btn-circle.btn-live {
  background: #ff7200;
}

.es-main-orange .class-serve>ul>li.active,
.es-main-orange .es-bar-menu>ul>li.active,
.es-main-orange .es-bar-menu>ul>li:hover {
  background-color: #ff7200;
}

.es-main-orange .bar-menu-top .bar-user.active .badge,
.es-main-orange .bar-menu-top .bar-user:hover .badge {
  color: #ff7200;
}

.es-main-orange .bar-task .bar-task-header,
.es-main-orange .bar-task .bar-time-line>li:before {
  background-color: #ff7200;
}

.es-main-orange .bar-task .bar-time-line>li .es-icon {
  color: #ff7200;
}

.es-main-orange .bar-history ul>li .icon {
  background-color: #ff7200;
}

.es-main-orange .es-filter .nav-sort>li>a:hover {
  color: #ff7200;
}

.es-main-orange .es-filter .nav-sort>li>a.active {
  background-color: #ff7200;
}

.es-main-orange .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-orange .es-filter .btn-group.open .dropdown-toggle {
  color: #ff7200;
}

.es-main-orange .es-filter .filter .btn:hover {
  color: #ff7200;
  transition: all 0.3s ease;
}

.es-main-orange .es-filter .filter label:hover,
.es-main-orange .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #ff7200;
}

.es-main-orange .order-nav .on {
  background: #ff7200;
}

.es-main-orange .order-nav .on span {
  border: 23px solid #ff7200;
}

.es-main-orange .order-nav .on b {
  border-left-color: #ff7200;
}

.es-main-orange .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-orange .note-list .note-item .metas>.name:hover,
.es-main-orange .note-list .note-item .metas>.period,
.es-main-orange .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-orange .task-list.task-show .task-item.active.task-content .title,
.es-main-orange .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-orange .task-list.task-show .task-item:hover.task-content .title,
.es-main-orange .topic-list .topic-item .metas>.name:hover,
.es-main-orange .topic-list .topic-item .metas>.period,
.es-main-orange .topic-list .topic-item .title a:hover {
  color: #ff7200;
}

.es-main-orange .select2-container-active .select2-choice,
.es-main-orange .select2-container-active .select2-choices,
.es-main-orange .select2-drop-active {
  border-color: #ff7200 !important;
}

.es-main-orange .select2-results .select2-highlighted {
  background: #ff7200 !important;
}

.es-main-orange .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #ff7200 !important;
}

.es-main-orange .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-orange .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #ff7200 !important;
}

.es-main-orange .noUi-horizontal .noUi-handle {
  border: 2px solid #ff7200;
}

.es-main-orange .noUi-horizontal .noUi-tooltip {
  color: #ff7200;
}

.es-main-orange .noUi-connect {
  background-color: #ff7200;
}

.es-main-orange .vip-new-member .member-list img:hover {
  border-color: #ff7200;
}

.es-main-orange .belongs-class .media-body>a:hover,
.es-main-orange .course-progress .cricle-progress .percent .num {
  color: #ff7200;
}

.es-main-orange .orderlearn-poster span.swiper-active-switch {
  background-color: #ff7200;
}

.es-main-orange .course-detail-section-responsive ul>li:hover,
.es-main-orange .course-detail-section-responsive ul>li:hover a {
  color: #ff7200;
}

.es-main-orange .panel-create-course .course-piece:after {
  background-color: #ff7200;
}

.es-main-orange .panel-create-course .course-select:hover {
  border: 2px solid #ff7200;
}

.es-main-orange .panel-create-course .course-select.active {
  background-color: #ff7200;
}

.es-main-orange .download-activity-list>li>a:hover,
.es-main-orange .download-activity-list>li>a:hover .download-icon,
.es-main-orange .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #ff7200;
}

.es-main-orange .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-orange .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-orange .testpaper-timer .btn-pause {
  background-color: #ff7200;
}

.es-main-orange .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #ff7200;
}

.es-main-orange .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #ff7200;
  border: 3px solid #ff7200;
}

.es-main-orange .article-sns .es-share>a:hover,
.es-main-orange .article-sns a.love:hover,
.es-main-orange .chooser-list .table-striped>tbody>tr.active>td,
.es-main-orange .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-orange .class-course-list .course-item .media .course-show:hover,
.es-main-orange .class-header.after .class-data>li>a:hover,
.es-main-orange .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-orange .class-header .class-data>li .dropdown-toggle:hover,
.es-main-orange .download-list li:hover>.btn-delete:hover,
.es-main-orange .topic-detail .topic-header .metas>a:hover,
.es-main-orange .topic-detail .topic-header .title>a:hover,
.es-main-orange .topic-detail .topic-num .num-more i:hover {
  color: #ff7200;
}

.es-main-orange .class-signin .btn-signin {
  background-color: #ff7200;
}

.es-main-orange .es-poster .swiper-slide .subtitle {
  color: #ff7200;
}

.es-main-orange .introduction-section {
  background-color: #ff7200;
}

.es-main-orange .live-course-body .es-live-back ul li .dat {
  background: #ff7200;
}

.es-main-orange .live-course-body .es-live-all .media-body .user a:hover,
.es-main-orange .live-course-body .es-live-back ul li a:hover {
  color: #ff7200;
}

.es-main-orange .social-login .social-icon.social-more:hover {
  background: #ff7200;
  border-color: #ff7200;
}

.es-main-orange .es-materials-manage .nav-tabs>li.active>a,
.es-main-orange .es-materials-manage .nav-tabs>li>a:hover,
.es-main-orange .es-materillib-table a:hover,
.es-main-orange .material-search-list.material-tabs .right-content li.active a,
.es-main-orange .material-search-list.material-tabs .right-content li:hover a {
  color: #ff7200;
}

.es-main-orange .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-orange .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #ff7200;
}

.es-main-orange .es-mobile .step .member {
  background: #ff7200;
  box-shadow: 0 6px 20px rgba(255, 114, 0, 0.4);
}

.es-main-orange .open-course-panel .panel-heading:before {
  background: #ff7200;
}

.es-main-orange .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #ff7200;
}

.es-main-orange .open-course-tab .tab-live a.active,
.es-main-orange .open-course-tab .tab-live a:active,
.es-main-orange .open-course-tab .tab-live a:hover {
  background-color: #ff7200;
}

.es-main-orange .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #ff7200;
  color: #ff7200;
}

.es-main-orange .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #ff7200;
}

.es-main-orange .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-orange .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-orange .marker-manage .lesson-list .more-questions a:hover {
  color: #ff7200;
}

.es-main-orange .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #ff7200;
}

.es-main-orange .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #ff7200;
}

.es-main-orange .section-wxpay .text-qrcode,
.es-main-orange .subtitle-transcode-status.success {
  background: #ff7200;
}

.es-main-orange .btn-consult-default {
  background: #ff7200;
  border-color: #ee6100;
}

.es-main-orange .btn-consult-default:hover {
  background: #ee6100;
  border-color: #dd5000;
}

.es-main-orange .list-group-panel .list-group-item.active,
.es-main-orange .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #ff7200;
  font-weight: 700;
  border-left: 3px solid #ff7200;
}

.es-main-orange .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #ff7200;
}

.es-nav-orange .es-header {
  background-color: #ff7200;
}

.es-nav-orange .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-orange .es-header .nav.navbar-nav>li.active>a,
.es-nav-orange .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-orange .es-header .nav.navbar-nav>li.open>a,
.es-nav-orange .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-orange .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-orange .es-header .nav.navbar-nav>li>a:focus,
.es-nav-orange .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-orange .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-orange .es-header .nav.user-nav>li>a:focus,
.es-nav-orange .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-orange-light .badge-primary {
  background-color: #f9b469;
}

.es-main-orange-light .breadcrumb a:hover {
  color: #f9b469;
}

.es-main-orange-light .btn-primary {
  border-color: #f79b38;
  background-color: #f9b469;
}

.es-main-orange-light .btn-primary.active,
.es-main-orange-light .btn-primary.focus,
.es-main-orange-light .btn-primary:focus,
.es-main-orange-light .btn-primary:hover {
  background: #f7a042;
  border-color: #f79b38;
}

.es-main-orange-light .btn-transparent {
  border-color: #f9b469;
  color: #f9b469;
}

.es-main-orange-light .btn-transparent:after {
  background-color: #f9b469;
}

.es-main-orange-light .btn-transparent.active,
.es-main-orange-light .btn-transparent:hover {
  color: #fff;
}

.es-main-orange-light .btn-link.focus,
.es-main-orange-light .btn-link:focus,
.es-main-orange-light .btn-link:hover {
  color: #f9b469;
}

.es-main-orange-light.lump-card.done {
  border: 1px solid #f9b469;
  color: #f9b469;
}

.es-main-orange-light.lump-card.doing {
  background-color: #f9b469;
  border: 1px solid #f79b38;
}

.es-main-orange-light .dropdown-menu>.active>a,
.es-main-orange-light .dropdown-menu>.active>a:focus,
.es-main-orange-light .dropdown-menu>.active>a:hover,
.es-main-orange-light .dropdown-menu>li>a:hover {
  background: #f9b469;
}

.es-main-orange-light .es-tabs .tab-body>ul>li.active>a,
.es-main-orange-light .es-tabs .tab-body>ul>li>a:hover,
.es-main-orange-light .es-tabs .tab-header>ul>li>a:hover {
  color: #f9b469;
}

.es-main-orange-light .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-orange-light .label-primary,
.es-main-orange-light .label.label-hover-primary:hover {
  background-color: #f9b469;
}

.es-main-orange-light .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #f9b469;
}

.es-main-orange-light .comment-sns:hover,
.es-main-orange-light .media-comment .reply-link:hover,
.es-main-orange-light .media-subcomment .reply-link:hover,
.es-main-orange-light .sidenav .list-group .list-group-item.active>a {
  color: #f9b469;
}

.es-main-orange-light .nav-pills.nav-pills-gray>li.active>a,
.es-main-orange-light .nav-pills>li.active>a {
  background: #f9b469;
}

.es-main-orange-light .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #f9b469;
}

.es-main-orange-light .nav-pills.nav-pills-transparent>li.active>a,
.es-main-orange-light .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #f9b469;
  color: #f9b469;
}

.es-main-orange-light .nav.nav-tabs .highlight {
  border-bottom: 2px solid #f9b469;
}

.es-main-orange-light .nav.nav-tabs>li.active>a,
.es-main-orange-light .nav.nav-tabs>li.active>a small,
.es-main-orange-light .nav.nav-tabs>li:hover>a,
.es-main-orange-light .nav.nav-tabs>li:hover>a small {
  color: #f9b469;
}

.es-main-orange-light .nav.nav-tabs>li.active>a .badge,
.es-main-orange-light .nav.nav-tabs>li:hover>a .badge,
.es-main-orange-light .panel-primary>.panel-heading {
  background-color: #f9b469;
}

.es-main-orange-light .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-orange-light .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #f9b469;
}

.es-main-orange-light .tabs-wrapper .tabs-mark.active a,
.es-main-orange-light .tabs-wrapper .tabs-mark:focus a,
.es-main-orange-light .tabs-wrapper .tabs-mark:hover a {
  color: #f9b469;
  border: 1px solid #f9b469;
}

.es-main-orange-light .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-orange-light .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-orange-light .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #f9b469;
}

.es-main-orange-light .progress-bar {
  background-color: #f9b469;
}

.es-main-orange-light .pagination>.active>a,
.es-main-orange-light .pagination>.active>a:focus,
.es-main-orange-light .pagination>.active>a:hover,
.es-main-orange-light .pagination>.active>span,
.es-main-orange-light .pagination>.active>span:focus,
.es-main-orange-light .pagination>.active>span:hover {
  background-color: #f9b469;
  border-color: #f79b38;
}

.es-main-orange-light .form-control:focus {
  border-color: #f9b469;
}

.es-main-orange-light .es-piece .piece-header:after {
  background-color: #f9b469;
}

.es-main-orange-light .bg-primary {
  background-color: #f9b469 !important;
}

.es-main-orange-light .color-primary,
.es-main-orange-light .link-dark:hover,
.es-main-orange-light .link-darker:hover,
.es-main-orange-light .link-gray:hover,
.es-main-orange-light .link-light:hover,
.es-main-orange-light .link-lighter:hover,
.es-main-orange-light .link-medium:hover,
.es-main-orange-light .link-primary,
.es-main-orange-light .link-white:hover {
  color: #f9b469 !important;
}

.es-main-orange-light .link-primary:hover {
  color: #f79b38 !important;
}

.es-main-orange-light .course-list .course-date .btn-circle.btn-live {
  background: #f9b469;
}

.es-main-orange-light .class-serve>ul>li.active,
.es-main-orange-light .es-bar-menu>ul>li.active,
.es-main-orange-light .es-bar-menu>ul>li:hover {
  background-color: #f9b469;
}

.es-main-orange-light .bar-menu-top .bar-user.active .badge,
.es-main-orange-light .bar-menu-top .bar-user:hover .badge {
  color: #f9b469;
}

.es-main-orange-light .bar-task .bar-task-header,
.es-main-orange-light .bar-task .bar-time-line>li:before {
  background-color: #f9b469;
}

.es-main-orange-light .bar-task .bar-time-line>li .es-icon {
  color: #f9b469;
}

.es-main-orange-light .bar-history ul>li .icon {
  background-color: #f9b469;
}

.es-main-orange-light .es-filter .nav-sort>li>a:hover {
  color: #f9b469;
}

.es-main-orange-light .es-filter .nav-sort>li>a.active {
  background-color: #f9b469;
}

.es-main-orange-light .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-orange-light .es-filter .btn-group.open .dropdown-toggle {
  color: #f9b469;
}

.es-main-orange-light .es-filter .filter .btn:hover {
  color: #f9b469;
  transition: all 0.3s ease;
}

.es-main-orange-light .es-filter .filter label:hover,
.es-main-orange-light .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #f9b469;
}

.es-main-orange-light .order-nav .on {
  background: #f9b469;
}

.es-main-orange-light .order-nav .on span {
  border: 23px solid #f9b469;
}

.es-main-orange-light .order-nav .on b {
  border-left-color: #f9b469;
}

.es-main-orange-light .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-orange-light .note-list .note-item .metas>.name:hover,
.es-main-orange-light .note-list .note-item .metas>.period,
.es-main-orange-light .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-orange-light .task-list.task-show .task-item.active.task-content .title,
.es-main-orange-light .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-orange-light .task-list.task-show .task-item:hover.task-content .title,
.es-main-orange-light .topic-list .topic-item .metas>.name:hover,
.es-main-orange-light .topic-list .topic-item .metas>.period,
.es-main-orange-light .topic-list .topic-item .title a:hover {
  color: #f9b469;
}

.es-main-orange-light .select2-container-active .select2-choice,
.es-main-orange-light .select2-container-active .select2-choices,
.es-main-orange-light .select2-drop-active {
  border-color: #f9b469 !important;
}

.es-main-orange-light .select2-results .select2-highlighted {
  background: #f9b469 !important;
}

.es-main-orange-light .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #f9b469 !important;
}

.es-main-orange-light .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-orange-light .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #f9b469 !important;
}

.es-main-orange-light .noUi-horizontal .noUi-handle {
  border: 2px solid #f9b469;
}

.es-main-orange-light .noUi-horizontal .noUi-tooltip {
  color: #f9b469;
}

.es-main-orange-light .noUi-connect {
  background-color: #f9b469;
}

.es-main-orange-light .vip-new-member .member-list img:hover {
  border-color: #f9b469;
}

.es-main-orange-light .belongs-class .media-body>a:hover,
.es-main-orange-light .course-progress .cricle-progress .percent .num {
  color: #f9b469;
}

.es-main-orange-light .orderlearn-poster span.swiper-active-switch {
  background-color: #f9b469;
}

.es-main-orange-light .course-detail-section-responsive ul>li:hover,
.es-main-orange-light .course-detail-section-responsive ul>li:hover a {
  color: #f9b469;
}

.es-main-orange-light .panel-create-course .course-piece:after {
  background-color: #f9b469;
}

.es-main-orange-light .panel-create-course .course-select:hover {
  border: 2px solid #f9b469;
}

.es-main-orange-light .panel-create-course .course-select.active {
  background-color: #f9b469;
}

.es-main-orange-light .download-activity-list>li>a:hover,
.es-main-orange-light .download-activity-list>li>a:hover .download-icon,
.es-main-orange-light .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #f9b469;
}

.es-main-orange-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-orange-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-orange-light .testpaper-timer .btn-pause {
  background-color: #f9b469;
}

.es-main-orange-light .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #f9b469;
}

.es-main-orange-light .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #f9b469;
  border: 3px solid #f9b469;
}

.es-main-orange-light .article-sns .es-share>a:hover,
.es-main-orange-light .article-sns a.love:hover,
.es-main-orange-light .chooser-list .table-striped>tbody>tr.active>td,
.es-main-orange-light .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-orange-light .class-course-list .course-item .media .course-show:hover,
.es-main-orange-light .class-header.after .class-data>li>a:hover,
.es-main-orange-light .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-orange-light .class-header .class-data>li .dropdown-toggle:hover,
.es-main-orange-light .download-list li:hover>.btn-delete:hover,
.es-main-orange-light .topic-detail .topic-header .metas>a:hover,
.es-main-orange-light .topic-detail .topic-header .title>a:hover,
.es-main-orange-light .topic-detail .topic-num .num-more i:hover {
  color: #f9b469;
}

.es-main-orange-light .class-signin .btn-signin {
  background-color: #f9b469;
}

.es-main-orange-light .es-poster .swiper-slide .subtitle {
  color: #f9b469;
}

.es-main-orange-light .introduction-section {
  background-color: #f9b469;
}

.es-main-orange-light .live-course-body .es-live-back ul li .dat {
  background: #f9b469;
}

.es-main-orange-light .live-course-body .es-live-all .media-body .user a:hover,
.es-main-orange-light .live-course-body .es-live-back ul li a:hover {
  color: #f9b469;
}

.es-main-orange-light .social-login .social-icon.social-more:hover {
  background: #f9b469;
  border-color: #f9b469;
}

.es-main-orange-light .es-materials-manage .nav-tabs>li.active>a,
.es-main-orange-light .es-materials-manage .nav-tabs>li>a:hover,
.es-main-orange-light .es-materillib-table a:hover,
.es-main-orange-light .material-search-list.material-tabs .right-content li.active a,
.es-main-orange-light .material-search-list.material-tabs .right-content li:hover a {
  color: #f9b469;
}

.es-main-orange-light .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-orange-light .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #f9b469;
}

.es-main-orange-light .es-mobile .step .member {
  background: #f9b469;
  box-shadow: 0 6px 20px hsla(31, 92%, 69%, 0.4);
}

.es-main-orange-light .open-course-panel .panel-heading:before {
  background: #f9b469;
}

.es-main-orange-light .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #f9b469;
}

.es-main-orange-light .open-course-tab .tab-live a.active,
.es-main-orange-light .open-course-tab .tab-live a:active,
.es-main-orange-light .open-course-tab .tab-live a:hover {
  background-color: #f9b469;
}

.es-main-orange-light .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #f9b469;
  color: #f9b469;
}

.es-main-orange-light .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #f9b469;
}

.es-main-orange-light .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-orange-light .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-orange-light .marker-manage .lesson-list .more-questions a:hover {
  color: #f9b469;
}

.es-main-orange-light .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #f9b469;
}

.es-main-orange-light .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #f9b469;
}

.es-main-orange-light .section-wxpay .text-qrcode,
.es-main-orange-light .subtitle-transcode-status.success {
  background: #f9b469;
}

.es-main-orange-light .btn-consult-default {
  background: #f9b469;
  border-color: #e8a358;
}

.es-main-orange-light .btn-consult-default:hover {
  background: #e8a358;
  border-color: #d79247;
}

.es-main-orange-light .list-group-panel .list-group-item.active,
.es-main-orange-light .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #f9b469;
  font-weight: 700;
  border-left: 3px solid #f9b469;
}

.es-main-orange-light .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #f9b469;
}

.es-nav-orange-light .es-header {
  background-color: #f9b469;
}

.es-nav-orange-light .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-orange-light .es-header .nav.navbar-nav>li.active>a,
.es-nav-orange-light .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-orange-light .es-header .nav.navbar-nav>li.open>a,
.es-nav-orange-light .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-orange-light .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-orange-light .es-header .nav.navbar-nav>li>a:focus,
.es-nav-orange-light .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-orange-light .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-orange-light .es-header .nav.user-nav>li>a:focus,
.es-nav-orange-light .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-purple .badge-primary {
  background-color: #773cec;
}

.es-main-purple .breadcrumb a:hover {
  color: #773cec;
}

.es-main-purple .btn-primary {
  border-color: #5916df;
  background-color: #773cec;
}

.es-main-purple .btn-primary.active,
.es-main-purple .btn-primary.focus,
.es-main-purple .btn-primary:focus,
.es-main-purple .btn-primary:hover {
  background: #5d17e8;
  border-color: #5916df;
}

.es-main-purple .btn-transparent {
  border-color: #773cec;
  color: #773cec;
}

.es-main-purple .btn-transparent:after {
  background-color: #773cec;
}

.es-main-purple .btn-transparent.active,
.es-main-purple .btn-transparent:hover {
  color: #fff;
}

.es-main-purple .btn-link.focus,
.es-main-purple .btn-link:focus,
.es-main-purple .btn-link:hover {
  color: #773cec;
}

.es-main-purple.lump-card.done {
  border: 1px solid #773cec;
  color: #773cec;
}

.es-main-purple.lump-card.doing {
  background-color: #773cec;
  border: 1px solid #5916df;
}

.es-main-purple .dropdown-menu>.active>a,
.es-main-purple .dropdown-menu>.active>a:focus,
.es-main-purple .dropdown-menu>.active>a:hover,
.es-main-purple .dropdown-menu>li>a:hover {
  background: #773cec;
}

.es-main-purple .es-tabs .tab-body>ul>li.active>a,
.es-main-purple .es-tabs .tab-body>ul>li>a:hover,
.es-main-purple .es-tabs .tab-header>ul>li>a:hover {
  color: #773cec;
}

.es-main-purple .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-purple .label-primary,
.es-main-purple .label.label-hover-primary:hover {
  background-color: #773cec;
}

.es-main-purple .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #773cec;
}

.es-main-purple .comment-sns:hover,
.es-main-purple .media-comment .reply-link:hover,
.es-main-purple .media-subcomment .reply-link:hover,
.es-main-purple .sidenav .list-group .list-group-item.active>a {
  color: #773cec;
}

.es-main-purple .nav-pills.nav-pills-gray>li.active>a,
.es-main-purple .nav-pills>li.active>a {
  background: #773cec;
}

.es-main-purple .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #773cec;
}

.es-main-purple .nav-pills.nav-pills-transparent>li.active>a,
.es-main-purple .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #773cec;
  color: #773cec;
}

.es-main-purple .nav.nav-tabs .highlight {
  border-bottom: 2px solid #773cec;
}

.es-main-purple .nav.nav-tabs>li.active>a,
.es-main-purple .nav.nav-tabs>li.active>a small,
.es-main-purple .nav.nav-tabs>li:hover>a,
.es-main-purple .nav.nav-tabs>li:hover>a small {
  color: #773cec;
}

.es-main-purple .nav.nav-tabs>li.active>a .badge,
.es-main-purple .nav.nav-tabs>li:hover>a .badge,
.es-main-purple .panel-primary>.panel-heading {
  background-color: #773cec;
}

.es-main-purple .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-purple .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #773cec;
}

.es-main-purple .tabs-wrapper .tabs-mark.active a,
.es-main-purple .tabs-wrapper .tabs-mark:focus a,
.es-main-purple .tabs-wrapper .tabs-mark:hover a {
  color: #773cec;
  border: 1px solid #773cec;
}

.es-main-purple .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-purple .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-purple .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #773cec;
}

.tabs-wrapper .tabs-group .content {
  margin-left: 56px !important;
  padding: 8px 0;
  /*margin-top: 8px;*/
}

.tabs-wrapper-new .tabs-group .content>li.active {
  background-color: #005bac;
  border-radius: 4px;
}

.tabs-wrapper .tabs-group .content>li.active {
  background-color: #e8f3ff;
  border-radius: 4px;
}

.tabs-wrapper .tabs-group .content>li.active a,
.tabs-wrapper .tabs-group .content>li.active a:hover {
  color: #4a90e2 !important;
}

.tabs-wrapper .tabs-group .content>li {
  padding: 7px 10px !important;
  line-height: 20px !important;
}

.tabs-wrapper .tabs-group .content>li>a {
  padding: 0 !important;
}

.tabs-wrapper .content>li>a:active,
.tabs-wrapper .content>li>a:hover {
  color: #005bac !important;
}

/* .tabs-wrapper .tabs-group .content>li.active a:hover {
    color: #fff !important;
} */

.es-main-purple .progress-bar {
  background-color: #773cec;
}

.es-main-purple .pagination>.active>a,
.es-main-purple .pagination>.active>a:focus,
.es-main-purple .pagination>.active>a:hover,
.es-main-purple .pagination>.active>span,
.es-main-purple .pagination>.active>span:focus,
.es-main-purple .pagination>.active>span:hover {
  background-color: #773cec;
  border-color: #5916df;
}

.es-main-purple .form-control:focus {
  border-color: #773cec;
}

.es-main-purple .es-piece .piece-header:after {
  background-color: #773cec;
}

.es-main-purple .bg-primary {
  background-color: #773cec !important;
}

.es-main-purple .color-primary,
.es-main-purple .link-dark:hover,
.es-main-purple .link-darker:hover,
.es-main-purple .link-gray:hover,
.es-main-purple .link-light:hover,
.es-main-purple .link-lighter:hover,
.es-main-purple .link-medium:hover,
.es-main-purple .link-primary,
.es-main-purple .link-white:hover {
  color: #773cec !important;
}

.es-main-purple .link-primary:hover {
  color: #5916df !important;
}

.es-main-purple .course-list .course-date .btn-circle.btn-live {
  background: #773cec;
}

.es-main-purple .class-serve>ul>li.active,
.es-main-purple .es-bar-menu>ul>li.active,
.es-main-purple .es-bar-menu>ul>li:hover {
  background-color: #773cec;
}

.es-main-purple .bar-menu-top .bar-user.active .badge,
.es-main-purple .bar-menu-top .bar-user:hover .badge {
  color: #773cec;
}

.es-main-purple .bar-task .bar-task-header,
.es-main-purple .bar-task .bar-time-line>li:before {
  background-color: #773cec;
}

.es-main-purple .bar-task .bar-time-line>li .es-icon {
  color: #773cec;
}

.es-main-purple .bar-history ul>li .icon {
  background-color: #773cec;
}

.es-main-purple .es-filter .nav-sort>li>a:hover {
  color: #773cec;
}

.es-main-purple .es-filter .nav-sort>li>a.active {
  background-color: #773cec;
}

.es-main-purple .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-purple .es-filter .btn-group.open .dropdown-toggle {
  color: #773cec;
}

.es-main-purple .es-filter .filter .btn:hover {
  color: #773cec;
  transition: all 0.3s ease;
}

.es-main-purple .es-filter .filter label:hover,
.es-main-purple .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #773cec;
}

.es-main-purple .order-nav .on {
  background: #773cec;
}

.es-main-purple .order-nav .on span {
  border: 23px solid #773cec;
}

.es-main-purple .order-nav .on b {
  border-left-color: #773cec;
}

.es-main-purple .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-purple .note-list .note-item .metas>.name:hover,
.es-main-purple .note-list .note-item .metas>.period,
.es-main-purple .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-purple .task-list.task-show .task-item.active.task-content .title,
.es-main-purple .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-purple .task-list.task-show .task-item:hover.task-content .title,
.es-main-purple .topic-list .topic-item .metas>.name:hover,
.es-main-purple .topic-list .topic-item .metas>.period,
.es-main-purple .topic-list .topic-item .title a:hover {
  color: #773cec;
}

.es-main-purple .select2-container-active .select2-choice,
.es-main-purple .select2-container-active .select2-choices,
.es-main-purple .select2-drop-active {
  border-color: #773cec !important;
}

.es-main-purple .select2-results .select2-highlighted {
  background: #773cec !important;
}

.es-main-purple .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #773cec !important;
}

.es-main-purple .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-purple .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #773cec !important;
}

.es-main-purple .noUi-horizontal .noUi-handle {
  border: 2px solid #773cec;
}

.es-main-purple .noUi-horizontal .noUi-tooltip {
  color: #773cec;
}

.es-main-purple .noUi-connect {
  background-color: #773cec;
}

.es-main-purple .vip-new-member .member-list img:hover {
  border-color: #773cec;
}

.es-main-purple .belongs-class .media-body>a:hover,
.es-main-purple .course-progress .cricle-progress .percent .num {
  color: #773cec;
}

.es-main-purple .orderlearn-poster span.swiper-active-switch {
  background-color: #773cec;
}

.es-main-purple .course-detail-section-responsive ul>li:hover,
.es-main-purple .course-detail-section-responsive ul>li:hover a {
  color: #773cec;
}

.es-main-purple .panel-create-course .course-piece:after {
  background-color: #773cec;
}

.es-main-purple .panel-create-course .course-select:hover {
  border: 2px solid #773cec;
}

.es-main-purple .panel-create-course .course-select.active {
  background-color: #773cec;
}

.es-main-purple .download-activity-list>li>a:hover,
.es-main-purple .download-activity-list>li>a:hover .download-icon,
.es-main-purple .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #773cec;
}

.es-main-purple .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-purple .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-purple .testpaper-timer .btn-pause {
  background-color: #773cec;
}

.es-main-purple .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #773cec;
}

.es-main-purple .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #773cec;
  border: 3px solid #773cec;
}

.es-main-purple .article-sns .es-share>a:hover,
.es-main-purple .article-sns a.love:hover,
.es-main-purple .chooser-list .table-striped>tbody>tr.active>td,
.es-main-purple .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-purple .class-course-list .course-item .media .course-show:hover,
.es-main-purple .class-header.after .class-data>li>a:hover,
.es-main-purple .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-purple .class-header .class-data>li .dropdown-toggle:hover,
.es-main-purple .download-list li:hover>.btn-delete:hover,
.es-main-purple .topic-detail .topic-header .metas>a:hover,
.es-main-purple .topic-detail .topic-header .title>a:hover,
.es-main-purple .topic-detail .topic-num .num-more i:hover {
  color: #773cec;
}

.es-main-purple .class-signin .btn-signin {
  background-color: #773cec;
}

.es-main-purple .es-poster .swiper-slide .subtitle {
  color: #773cec;
}

.es-main-purple .introduction-section {
  background-color: #773cec;
}

.es-main-purple .live-course-body .es-live-back ul li .dat {
  background: #773cec;
}

.es-main-purple .live-course-body .es-live-all .media-body .user a:hover,
.es-main-purple .live-course-body .es-live-back ul li a:hover {
  color: #773cec;
}

.es-main-purple .social-login .social-icon.social-more:hover {
  background: #773cec;
  border-color: #773cec;
}

.es-main-purple .es-materials-manage .nav-tabs>li.active>a,
.es-main-purple .es-materials-manage .nav-tabs>li>a:hover,
.es-main-purple .es-materillib-table a:hover,
.es-main-purple .material-search-list.material-tabs .right-content li.active a,
.es-main-purple .material-search-list.material-tabs .right-content li:hover a {
  color: #773cec;
}

.es-main-purple .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-purple .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #773cec;
}

.es-main-purple .es-mobile .step .member {
  background: #773cec;
  box-shadow: 0 6px 20px rgba(119, 60, 236, 0.4);
}

.es-main-purple .open-course-panel .panel-heading:before {
  background: #773cec;
}

.es-main-purple .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #773cec;
}

.es-main-purple .open-course-tab .tab-live a.active,
.es-main-purple .open-course-tab .tab-live a:active,
.es-main-purple .open-course-tab .tab-live a:hover {
  background-color: #773cec;
}

.es-main-purple .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #773cec;
  color: #773cec;
}

.es-main-purple .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #773cec;
}

.es-main-purple .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-purple .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-purple .marker-manage .lesson-list .more-questions a:hover {
  color: #773cec;
}

.es-main-purple .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #773cec;
}

.es-main-purple .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #773cec;
}

.es-main-purple .section-wxpay .text-qrcode,
.es-main-purple .subtitle-transcode-status.success {
  background: #773cec;
}

.es-main-purple .btn-consult-default {
  background: #773cec;
  border-color: #662bdb;
}

.es-main-purple .btn-consult-default:hover {
  background: #662bdb;
  border-color: #551aca;
}

.es-main-purple .list-group-panel .list-group-item.active,
.es-main-purple .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #773cec;
  font-weight: 700;
  border-left: 3px solid #773cec;
}

.es-main-purple .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #773cec;
}

.es-nav-purple .es-header {
  background-color: #773cec;
}

.es-nav-purple .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-purple .es-header .nav.navbar-nav>li.active>a,
.es-nav-purple .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-purple .es-header .nav.navbar-nav>li.open>a,
.es-nav-purple .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-purple .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-purple .es-header .nav.navbar-nav>li>a:focus,
.es-nav-purple .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-purple .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-purple .es-header .nav.user-nav>li>a:focus,
.es-nav-purple .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-purple-light .badge-primary {
  background-color: #9e9abd;
}

.es-main-purple-light .breadcrumb a:hover {
  color: #9e9abd;
}

.es-main-purple-light .btn-primary {
  border-color: #807ba9;
  background-color: #9e9abd;
}

.es-main-purple-light .btn-primary.active,
.es-main-purple-light .btn-primary.focus,
.es-main-purple-light .btn-primary:focus,
.es-main-purple-light .btn-primary:hover {
  background: #8681ad;
  border-color: #807ba9;
}

.es-main-purple-light .btn-transparent {
  border-color: #9e9abd;
  color: #9e9abd;
}

.es-main-purple-light .btn-transparent:after {
  background-color: #9e9abd;
}

.es-main-purple-light .btn-transparent.active,
.es-main-purple-light .btn-transparent:hover {
  color: #fff;
}

.es-main-purple-light .btn-link.focus,
.es-main-purple-light .btn-link:focus,
.es-main-purple-light .btn-link:hover {
  color: #9e9abd;
}

.es-main-purple-light.lump-card.done {
  border: 1px solid #9e9abd;
  color: #9e9abd;
}

.es-main-purple-light.lump-card.doing {
  background-color: #9e9abd;
  border: 1px solid #807ba9;
}

.es-main-purple-light .dropdown-menu>.active>a,
.es-main-purple-light .dropdown-menu>.active>a:focus,
.es-main-purple-light .dropdown-menu>.active>a:hover,
.es-main-purple-light .dropdown-menu>li>a:hover {
  background: #9e9abd;
}

.es-main-purple-light .es-tabs .tab-body>ul>li.active>a,
.es-main-purple-light .es-tabs .tab-body>ul>li>a:hover,
.es-main-purple-light .es-tabs .tab-header>ul>li>a:hover {
  color: #9e9abd;
}

.es-main-purple-light .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-purple-light .label-primary,
.es-main-purple-light .label.label-hover-primary:hover {
  background-color: #9e9abd;
}

.es-main-purple-light .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #9e9abd;
}

.es-main-purple-light .comment-sns:hover,
.es-main-purple-light .media-comment .reply-link:hover,
.es-main-purple-light .media-subcomment .reply-link:hover,
.es-main-purple-light .sidenav .list-group .list-group-item.active>a {
  color: #9e9abd;
}

.es-main-purple-light .nav-pills.nav-pills-gray>li.active>a,
.es-main-purple-light .nav-pills>li.active>a {
  background: #9e9abd;
}

.es-main-purple-light .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #9e9abd;
}

.es-main-purple-light .nav-pills.nav-pills-transparent>li.active>a,
.es-main-purple-light .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #9e9abd;
  color: #9e9abd;
}

.es-main-purple-light .nav.nav-tabs .highlight {
  border-bottom: 2px solid #9e9abd;
}

.es-main-purple-light .nav.nav-tabs>li.active>a,
.es-main-purple-light .nav.nav-tabs>li.active>a small,
.es-main-purple-light .nav.nav-tabs>li:hover>a,
.es-main-purple-light .nav.nav-tabs>li:hover>a small {
  color: #9e9abd;
}

.es-main-purple-light .nav.nav-tabs>li.active>a .badge,
.es-main-purple-light .nav.nav-tabs>li:hover>a .badge,
.es-main-purple-light .panel-primary>.panel-heading {
  background-color: #9e9abd;
}

.es-main-purple-light .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-purple-light .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #9e9abd;
}

.es-main-purple-light .tabs-wrapper .tabs-mark.active a,
.es-main-purple-light .tabs-wrapper .tabs-mark:focus a,
.es-main-purple-light .tabs-wrapper .tabs-mark:hover a {
  color: #9e9abd;
  border: 1px solid #9e9abd;
}

.es-main-purple-light .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-purple-light .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-purple-light .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #9e9abd;
}

.es-main-purple-light .progress-bar {
  background-color: #9e9abd;
}

.es-main-purple-light .pagination>.active>a,
.es-main-purple-light .pagination>.active>a:focus,
.es-main-purple-light .pagination>.active>a:hover,
.es-main-purple-light .pagination>.active>span,
.es-main-purple-light .pagination>.active>span:focus,
.es-main-purple-light .pagination>.active>span:hover {
  background-color: #9e9abd;
  border-color: #807ba9;
}

.es-main-purple-light .form-control:focus {
  border-color: #9e9abd;
}

.es-main-purple-light .es-piece .piece-header:after {
  background-color: #9e9abd;
}

.es-main-purple-light .bg-primary {
  background-color: #9e9abd !important;
}

.es-main-purple-light .color-primary,
.es-main-purple-light .link-dark:hover,
.es-main-purple-light .link-darker:hover,
.es-main-purple-light .link-gray:hover,
.es-main-purple-light .link-light:hover,
.es-main-purple-light .link-lighter:hover,
.es-main-purple-light .link-medium:hover,
.es-main-purple-light .link-primary,
.es-main-purple-light .link-white:hover {
  color: #9e9abd !important;
}

.es-main-purple-light .link-primary:hover {
  color: #807ba9 !important;
}

.es-main-purple-light .course-list .course-date .btn-circle.btn-live {
  background: #9e9abd;
}

.es-main-purple-light .class-serve>ul>li.active,
.es-main-purple-light .es-bar-menu>ul>li.active,
.es-main-purple-light .es-bar-menu>ul>li:hover {
  background-color: #9e9abd;
}

.es-main-purple-light .bar-menu-top .bar-user.active .badge,
.es-main-purple-light .bar-menu-top .bar-user:hover .badge {
  color: #9e9abd;
}

.es-main-purple-light .bar-task .bar-task-header,
.es-main-purple-light .bar-task .bar-time-line>li:before {
  background-color: #9e9abd;
}

.es-main-purple-light .bar-task .bar-time-line>li .es-icon {
  color: #9e9abd;
}

.es-main-purple-light .bar-history ul>li .icon {
  background-color: #9e9abd;
}

.es-main-purple-light .es-filter .nav-sort>li>a:hover {
  color: #9e9abd;
}

.es-main-purple-light .es-filter .nav-sort>li>a.active {
  background-color: #9e9abd;
}

.es-main-purple-light .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-purple-light .es-filter .btn-group.open .dropdown-toggle {
  color: #9e9abd;
}

.es-main-purple-light .es-filter .filter .btn:hover {
  color: #9e9abd;
  transition: all 0.3s ease;
}

.es-main-purple-light .es-filter .filter label:hover,
.es-main-purple-light .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #9e9abd;
}

.es-main-purple-light .order-nav .on {
  background: #9e9abd;
}

.es-main-purple-light .order-nav .on span {
  border: 23px solid #9e9abd;
}

.es-main-purple-light .order-nav .on b {
  border-left-color: #9e9abd;
}

.es-main-purple-light .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-purple-light .note-list .note-item .metas>.name:hover,
.es-main-purple-light .note-list .note-item .metas>.period,
.es-main-purple-light .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-purple-light .task-list.task-show .task-item.active.task-content .title,
.es-main-purple-light .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-purple-light .task-list.task-show .task-item:hover.task-content .title,
.es-main-purple-light .topic-list .topic-item .metas>.name:hover,
.es-main-purple-light .topic-list .topic-item .metas>.period,
.es-main-purple-light .topic-list .topic-item .title a:hover {
  color: #9e9abd;
}

.es-main-purple-light .select2-container-active .select2-choice,
.es-main-purple-light .select2-container-active .select2-choices,
.es-main-purple-light .select2-drop-active {
  border-color: #9e9abd !important;
}

.es-main-purple-light .select2-results .select2-highlighted {
  background: #9e9abd !important;
}

.es-main-purple-light .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #9e9abd !important;
}

.es-main-purple-light .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-purple-light .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #9e9abd !important;
}

.es-main-purple-light .noUi-horizontal .noUi-handle {
  border: 2px solid #9e9abd;
}

.es-main-purple-light .noUi-horizontal .noUi-tooltip {
  color: #9e9abd;
}

.es-main-purple-light .noUi-connect {
  background-color: #9e9abd;
}

.es-main-purple-light .vip-new-member .member-list img:hover {
  border-color: #9e9abd;
}

.es-main-purple-light .belongs-class .media-body>a:hover,
.es-main-purple-light .course-progress .cricle-progress .percent .num {
  color: #9e9abd;
}

.es-main-purple-light .orderlearn-poster span.swiper-active-switch {
  background-color: #9e9abd;
}

.es-main-purple-light .course-detail-section-responsive ul>li:hover,
.es-main-purple-light .course-detail-section-responsive ul>li:hover a {
  color: #9e9abd;
}

.es-main-purple-light .panel-create-course .course-piece:after {
  background-color: #9e9abd;
}

.es-main-purple-light .panel-create-course .course-select:hover {
  border: 2px solid #9e9abd;
}

.es-main-purple-light .panel-create-course .course-select.active {
  background-color: #9e9abd;
}

.es-main-purple-light .download-activity-list>li>a:hover,
.es-main-purple-light .download-activity-list>li>a:hover .download-icon,
.es-main-purple-light .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #9e9abd;
}

.es-main-purple-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-purple-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-purple-light .testpaper-timer .btn-pause {
  background-color: #9e9abd;
}

.es-main-purple-light .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #9e9abd;
}

.es-main-purple-light .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #9e9abd;
  border: 3px solid #9e9abd;
}

.es-main-purple-light .article-sns .es-share>a:hover,
.es-main-purple-light .article-sns a.love:hover,
.es-main-purple-light .chooser-list .table-striped>tbody>tr.active>td,
.es-main-purple-light .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-purple-light .class-course-list .course-item .media .course-show:hover,
.es-main-purple-light .class-header.after .class-data>li>a:hover,
.es-main-purple-light .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-purple-light .class-header .class-data>li .dropdown-toggle:hover,
.es-main-purple-light .download-list li:hover>.btn-delete:hover,
.es-main-purple-light .topic-detail .topic-header .metas>a:hover,
.es-main-purple-light .topic-detail .topic-header .title>a:hover,
.es-main-purple-light .topic-detail .topic-num .num-more i:hover {
  color: #9e9abd;
}

.es-main-purple-light .class-signin .btn-signin {
  background-color: #9e9abd;
}

.es-main-purple-light .es-poster .swiper-slide .subtitle {
  color: #9e9abd;
}

.es-main-purple-light .introduction-section {
  background-color: #9e9abd;
}

.es-main-purple-light .live-course-body .es-live-back ul li .dat {
  background: #9e9abd;
}

.es-main-purple-light .live-course-body .es-live-all .media-body .user a:hover,
.es-main-purple-light .live-course-body .es-live-back ul li a:hover {
  color: #9e9abd;
}

.es-main-purple-light .social-login .social-icon.social-more:hover {
  background: #9e9abd;
  border-color: #9e9abd;
}

.es-main-purple-light .es-materials-manage .nav-tabs>li.active>a,
.es-main-purple-light .es-materials-manage .nav-tabs>li>a:hover,
.es-main-purple-light .es-materillib-table a:hover,
.es-main-purple-light .material-search-list.material-tabs .right-content li.active a,
.es-main-purple-light .material-search-list.material-tabs .right-content li:hover a {
  color: #9e9abd;
}

.es-main-purple-light .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-purple-light .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #9e9abd;
}

.es-main-purple-light .es-mobile .step .member {
  background: #9e9abd;
  box-shadow: 0 6px 20px rgba(158, 154, 189, 0.4);
}

.es-main-purple-light .open-course-panel .panel-heading:before {
  background: #9e9abd;
}

.es-main-purple-light .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #9e9abd;
}

.es-main-purple-light .open-course-tab .tab-live a.active,
.es-main-purple-light .open-course-tab .tab-live a:active,
.es-main-purple-light .open-course-tab .tab-live a:hover {
  background-color: #9e9abd;
}

.es-main-purple-light .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #9e9abd;
  color: #9e9abd;
}

.es-main-purple-light .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #9e9abd;
}

.es-main-purple-light .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-purple-light .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-purple-light .marker-manage .lesson-list .more-questions a:hover {
  color: #9e9abd;
}

.es-main-purple-light .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #9e9abd;
}

.es-main-purple-light .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #9e9abd;
}

.es-main-purple-light .section-wxpay .text-qrcode,
.es-main-purple-light .subtitle-transcode-status.success {
  background: #9e9abd;
}

.es-main-purple-light .btn-consult-default {
  background: #9e9abd;
  border-color: #8d89ac;
}

.es-main-purple-light .btn-consult-default:hover {
  background: #8d89ac;
  border-color: #7c789b;
}

.es-main-purple-light .list-group-panel .list-group-item.active,
.es-main-purple-light .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #9e9abd;
  font-weight: 700;
  border-left: 3px solid #9e9abd;
}

.es-main-purple-light .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #9e9abd;
}

.es-nav-purple-light .es-header {
  background-color: #9e9abd;
}

.es-nav-purple-light .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-purple-light .es-header .nav.navbar-nav>li.active>a,
.es-nav-purple-light .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-purple-light .es-header .nav.navbar-nav>li.open>a,
.es-nav-purple-light .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-purple-light .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-purple-light .es-header .nav.navbar-nav>li>a:focus,
.es-nav-purple-light .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-purple-light .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-purple-light .es-header .nav.user-nav>li>a:focus,
.es-nav-purple-light .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-red .badge-primary {
  background-color: #cf010e;
}

.es-main-red .breadcrumb a:hover {
  color: #cf010e;
}

.es-main-red .btn-primary {
  border-color: #9c010b;
  background-color: #cf010e;
}

.es-main-red .btn-primary.active,
.es-main-red .btn-primary.focus,
.es-main-red .btn-primary:focus,
.es-main-red .btn-primary:hover {
  background: #a6010b;
  border-color: #9c010b;
}

.es-main-red .btn-transparent {
  border-color: #cf010e;
  color: #cf010e;
}

.es-main-red .btn-transparent:after {
  background-color: #cf010e;
}

.es-main-red .btn-transparent.active,
.es-main-red .btn-transparent:hover {
  color: #fff;
}

.es-main-red .btn-link.focus,
.es-main-red .btn-link:focus,
.es-main-red .btn-link:hover {
  color: #cf010e;
}

.es-main-red.lump-card.done {
  border: 1px solid #cf010e;
  color: #cf010e;
}

.es-main-red.lump-card.doing {
  background-color: #cf010e;
  border: 1px solid #9c010b;
}

.es-main-red .dropdown-menu>.active>a,
.es-main-red .dropdown-menu>.active>a:focus,
.es-main-red .dropdown-menu>.active>a:hover,
.es-main-red .dropdown-menu>li>a:hover {
  background: #cf010e;
}

.es-main-red .es-tabs .tab-body>ul>li.active>a,
.es-main-red .es-tabs .tab-body>ul>li>a:hover,
.es-main-red .es-tabs .tab-header>ul>li>a:hover {
  color: #cf010e;
}

.es-main-red .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-red .label-primary,
.es-main-red .label.label-hover-primary:hover {
  background-color: #cf010e;
}

.es-main-red .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #cf010e;
}

.es-main-red .comment-sns:hover,
.es-main-red .media-comment .reply-link:hover,
.es-main-red .media-subcomment .reply-link:hover,
.es-main-red .sidenav .list-group .list-group-item.active>a {
  color: #cf010e;
}

.es-main-red .nav-pills.nav-pills-gray>li.active>a,
.es-main-red .nav-pills>li.active>a {
  background: #cf010e;
}

.es-main-red .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #cf010e;
}

.es-main-red .nav-pills.nav-pills-transparent>li.active>a,
.es-main-red .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #cf010e;
  color: #cf010e;
}

.es-main-red .nav.nav-tabs .highlight {
  border-bottom: 2px solid #cf010e;
}

.es-main-red .nav.nav-tabs>li.active>a,
.es-main-red .nav.nav-tabs>li.active>a small,
.es-main-red .nav.nav-tabs>li:hover>a,
.es-main-red .nav.nav-tabs>li:hover>a small {
  color: #cf010e;
}

.es-main-red .nav.nav-tabs>li.active>a .badge,
.es-main-red .nav.nav-tabs>li:hover>a .badge,
.es-main-red .panel-primary>.panel-heading {
  background-color: #cf010e;
}

.es-main-red .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-red .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #cf010e;
}

.es-main-red .tabs-wrapper .tabs-mark.active a,
.es-main-red .tabs-wrapper .tabs-mark:focus a,
.es-main-red .tabs-wrapper .tabs-mark:hover a {
  color: #cf010e;
  border: 1px solid #cf010e;
}

.es-main-red .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-red .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-red .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #cf010e;
}

.es-main-red .progress-bar {
  background-color: #cf010e;
}

.es-main-red .pagination>.active>a,
.es-main-red .pagination>.active>a:focus,
.es-main-red .pagination>.active>a:hover,
.es-main-red .pagination>.active>span,
.es-main-red .pagination>.active>span:focus,
.es-main-red .pagination>.active>span:hover {
  background-color: #cf010e;
  border-color: #9c010b;
}

.es-main-red .form-control:focus {
  border-color: #cf010e;
}

.es-main-red .es-piece .piece-header:after {
  background-color: #cf010e;
}

.es-main-red .bg-primary {
  background-color: #cf010e !important;
}

.es-main-red .color-primary,
.es-main-red .link-dark:hover,
.es-main-red .link-darker:hover,
.es-main-red .link-gray:hover,
.es-main-red .link-light:hover,
.es-main-red .link-lighter:hover,
.es-main-red .link-medium:hover,
.es-main-red .link-primary,
.es-main-red .link-white:hover {
  color: #cf010e !important;
}

.es-main-red .link-primary:hover {
  color: #9c010b !important;
}

.es-main-red .course-list .course-date .btn-circle.btn-live {
  background: #cf010e;
}

.es-main-red .class-serve>ul>li.active,
.es-main-red .es-bar-menu>ul>li.active,
.es-main-red .es-bar-menu>ul>li:hover {
  background-color: #cf010e;
}

.es-main-red .bar-menu-top .bar-user.active .badge,
.es-main-red .bar-menu-top .bar-user:hover .badge {
  color: #cf010e;
}

.es-main-red .bar-task .bar-task-header,
.es-main-red .bar-task .bar-time-line>li:before {
  background-color: #cf010e;
}

.es-main-red .bar-task .bar-time-line>li .es-icon {
  color: #cf010e;
}

.es-main-red .bar-history ul>li .icon {
  background-color: #cf010e;
}

.es-main-red .es-filter .nav-sort>li>a:hover {
  color: #cf010e;
}

.es-main-red .es-filter .nav-sort>li>a.active {
  background-color: #cf010e;
}

.es-main-red .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-red .es-filter .btn-group.open .dropdown-toggle {
  color: #cf010e;
}

.es-main-red .es-filter .filter .btn:hover {
  color: #cf010e;
  transition: all 0.3s ease;
}

.es-main-red .es-filter .filter label:hover,
.es-main-red .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #cf010e;
}

.es-main-red .order-nav .on {
  background: #cf010e;
}

.es-main-red .order-nav .on span {
  border: 23px solid #cf010e;
}

.es-main-red .order-nav .on b {
  border-left-color: #cf010e;
}

.es-main-red .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-red .note-list .note-item .metas>.name:hover,
.es-main-red .note-list .note-item .metas>.period,
.es-main-red .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-red .task-list.task-show .task-item.active.task-content .title,
.es-main-red .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-red .task-list.task-show .task-item:hover.task-content .title,
.es-main-red .topic-list .topic-item .metas>.name:hover,
.es-main-red .topic-list .topic-item .metas>.period,
.es-main-red .topic-list .topic-item .title a:hover {
  color: #cf010e;
}

.es-main-red .select2-container-active .select2-choice,
.es-main-red .select2-container-active .select2-choices,
.es-main-red .select2-drop-active {
  border-color: #cf010e !important;
}

.es-main-red .select2-results .select2-highlighted {
  background: #cf010e !important;
}

.es-main-red .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #cf010e !important;
}

.es-main-red .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-red .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #cf010e !important;
}

.es-main-red .noUi-horizontal .noUi-handle {
  border: 2px solid #cf010e;
}

.es-main-red .noUi-horizontal .noUi-tooltip {
  color: #cf010e;
}

.es-main-red .noUi-connect {
  background-color: #cf010e;
}

.es-main-red .vip-new-member .member-list img:hover {
  border-color: #cf010e;
}

.es-main-red .belongs-class .media-body>a:hover,
.es-main-red .course-progress .cricle-progress .percent .num {
  color: #cf010e;
}

.es-main-red .orderlearn-poster span.swiper-active-switch {
  background-color: #cf010e;
}

.es-main-red .course-detail-section-responsive ul>li:hover,
.es-main-red .course-detail-section-responsive ul>li:hover a {
  color: #cf010e;
}

.es-main-red .panel-create-course .course-piece:after {
  background-color: #cf010e;
}

.es-main-red .panel-create-course .course-select:hover {
  border: 2px solid #cf010e;
}

.es-main-red .panel-create-course .course-select.active {
  background-color: #cf010e;
}

.es-main-red .download-activity-list>li>a:hover,
.es-main-red .download-activity-list>li>a:hover .download-icon,
.es-main-red .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #cf010e;
}

.es-main-red .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-red .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-red .testpaper-timer .btn-pause {
  background-color: #cf010e;
}

.es-main-red .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #cf010e;
}

.es-main-red .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #cf010e;
  border: 3px solid #cf010e;
}

.es-main-red .article-sns .es-share>a:hover,
.es-main-red .article-sns a.love:hover,
.es-main-red .chooser-list .table-striped>tbody>tr.active>td,
.es-main-red .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-red .class-course-list .course-item .media .course-show:hover,
.es-main-red .class-header.after .class-data>li>a:hover,
.es-main-red .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-red .class-header .class-data>li .dropdown-toggle:hover,
.es-main-red .download-list li:hover>.btn-delete:hover,
.es-main-red .topic-detail .topic-header .metas>a:hover,
.es-main-red .topic-detail .topic-header .title>a:hover,
.es-main-red .topic-detail .topic-num .num-more i:hover {
  color: #cf010e;
}

.es-main-red .class-signin .btn-signin {
  background-color: #cf010e;
}

.es-main-red .es-poster .swiper-slide .subtitle {
  color: #cf010e;
}

.es-main-red .introduction-section {
  background-color: #cf010e;
}

.es-main-red .live-course-body .es-live-back ul li .dat {
  background: #cf010e;
}

.es-main-red .live-course-body .es-live-all .media-body .user a:hover,
.es-main-red .live-course-body .es-live-back ul li a:hover {
  color: #cf010e;
}

.es-main-red .social-login .social-icon.social-more:hover {
  background: #cf010e;
  border-color: #cf010e;
}

.es-main-red .es-materials-manage .nav-tabs>li.active>a,
.es-main-red .es-materials-manage .nav-tabs>li>a:hover,
.es-main-red .es-materillib-table a:hover,
.es-main-red .material-search-list.material-tabs .right-content li.active a,
.es-main-red .material-search-list.material-tabs .right-content li:hover a {
  color: #cf010e;
}

.es-main-red .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-red .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #cf010e;
}

.es-main-red .es-mobile .step .member {
  background: #cf010e;
  box-shadow: 0 6px 20px rgba(207, 1, 14, 0.4);
}

.es-main-red .open-course-panel .panel-heading:before {
  background: #cf010e;
}

.es-main-red .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #cf010e;
}

.es-main-red .open-course-tab .tab-live a.active,
.es-main-red .open-course-tab .tab-live a:active,
.es-main-red .open-course-tab .tab-live a:hover {
  background-color: #cf010e;
}

.es-main-red .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #cf010e;
  color: #cf010e;
}

.es-main-red .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #cf010e;
}

.es-main-red .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-red .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-red .marker-manage .lesson-list .more-questions a:hover {
  color: #cf010e;
}

.es-main-red .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #cf010e;
}

.es-main-red .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #cf010e;
}

.es-main-red .section-wxpay .text-qrcode,
.es-main-red .subtitle-transcode-status.success {
  background: #cf010e;
}

.es-main-red .btn-consult-default {
  background: #cf010e;
  border-color: #be0000;
}

.es-main-red .btn-consult-default:hover {
  background: #be0000;
  border-color: #ad0000;
}

.es-main-red .list-group-panel .list-group-item.active,
.es-main-red .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #cf010e;
  font-weight: 700;
  border-left: 3px solid #cf010e;
}

.es-main-red .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #cf010e;
}

.es-nav-red .es-header {
  background-color: #cf010e;
}

.es-nav-red .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-red .es-header .nav.navbar-nav>li.active>a,
.es-nav-red .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-red .es-header .nav.navbar-nav>li.open>a,
.es-nav-red .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-red .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-red .es-header .nav.navbar-nav>li>a:focus,
.es-nav-red .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-red .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-red .es-header .nav.user-nav>li>a:focus,
.es-nav-red .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

.es-main-red-light .badge-primary {
  background-color: #fd5f56;
}

.es-main-red-light .breadcrumb a:hover {
  color: #fd5f56;
}

.es-main-red-light .btn-primary {
  border-color: #fc2f24;
  background-color: #fd5f56;
}

.es-main-red-light .btn-primary.active,
.es-main-red-light .btn-primary.focus,
.es-main-red-light .btn-primary:focus,
.es-main-red-light .btn-primary:hover {
  background: #fd392e;
  border-color: #fc2f24;
}

.es-main-red-light .btn-transparent {
  border-color: #fd5f56;
  color: #fd5f56;
}

.es-main-red-light .btn-transparent:after {
  background-color: #fd5f56;
}

.es-main-red-light .btn-transparent.active,
.es-main-red-light .btn-transparent:hover {
  color: #fff;
}

.es-main-red-light .btn-link.focus,
.es-main-red-light .btn-link:focus,
.es-main-red-light .btn-link:hover {
  color: #fd5f56;
}

.es-main-red-light.lump-card.done {
  border: 1px solid #fd5f56;
  color: #fd5f56;
}

.es-main-red-light.lump-card.doing {
  background-color: #fd5f56;
  border: 1px solid #fc2f24;
}

.es-main-red-light .dropdown-menu>.active>a,
.es-main-red-light .dropdown-menu>.active>a:focus,
.es-main-red-light .dropdown-menu>.active>a:hover,
.es-main-red-light .dropdown-menu>li>a:hover {
  background: #fd5f56;
}

.es-main-red-light .es-tabs .tab-body>ul>li.active>a,
.es-main-red-light .es-tabs .tab-body>ul>li>a:hover,
.es-main-red-light .es-tabs .tab-header>ul>li>a:hover {
  color: #fd5f56;
}

.es-main-red-light .es-tag {
  border-left: 2px solid #46c37b;
}

.es-main-red-light .label-primary,
.es-main-red-light .label.label-hover-primary:hover {
  background-color: #fd5f56;
}

.es-main-red-light .sidenav .list-group .list-group-item.active {
  border-left: 2px solid #fd5f56;
}

.es-main-red-light .comment-sns:hover,
.es-main-red-light .media-comment .reply-link:hover,
.es-main-red-light .media-subcomment .reply-link:hover,
.es-main-red-light .sidenav .list-group .list-group-item.active>a {
  color: #fd5f56;
}

.es-main-red-light .nav-pills.nav-pills-gray>li.active>a,
.es-main-red-light .nav-pills>li.active>a {
  background: #fd5f56;
}

.es-main-red-light .nav-pills.nav-pills-transparent>li>a:after {
  border-bottom-color: #fd5f56;
}

.es-main-red-light .nav-pills.nav-pills-transparent>li.active>a,
.es-main-red-light .nav-pills.nav-pills-transparent>li:hover>a {
  background: transparent;
  border-color: #fd5f56;
  color: #fd5f56;
}

.es-main-red-light .nav.nav-tabs .highlight {
  border-bottom: 2px solid #fd5f56;
}

.es-main-red-light .nav.nav-tabs>li.active>a,
.es-main-red-light .nav.nav-tabs>li.active>a small,
.es-main-red-light .nav.nav-tabs>li:hover>a,
.es-main-red-light .nav.nav-tabs>li:hover>a small {
  color: #fd5f56;
}

.es-main-red-light .nav.nav-tabs>li.active>a .badge,
.es-main-red-light .nav.nav-tabs>li:hover>a .badge,
.es-main-red-light .panel-primary>.panel-heading {
  background-color: #fd5f56;
}

.es-main-red-light .tabs-wrapper .tabs-mark-group .classify a:focus,
.es-main-red-light .tabs-wrapper .tabs-mark-group .classify a:hover {
  color: #fd5f56;
}

.es-main-red-light .tabs-wrapper .tabs-mark.active a,
.es-main-red-light .tabs-wrapper .tabs-mark:focus a,
.es-main-red-light .tabs-wrapper .tabs-mark:hover a {
  color: #fd5f56;
  border: 1px solid #fd5f56;
}

.es-main-red-light .tabs-wrapper .tabs-group .content>li.active>a,
.es-main-red-light .tabs-wrapper .tabs-group .content>li:focus>a,
.es-main-red-light .tabs-wrapper .tabs-group .content>li:hover>a {
  color: #fd5f56;
}

.es-main-red-light .progress-bar {
  background-color: #fd5f56;
}

.es-main-red-light .pagination>.active>a,
.es-main-red-light .pagination>.active>a:focus,
.es-main-red-light .pagination>.active>a:hover,
.es-main-red-light .pagination>.active>span,
.es-main-red-light .pagination>.active>span:focus,
.es-main-red-light .pagination>.active>span:hover {
  background-color: #fd5f56;
  border-color: #fc2f24;
}

.es-main-red-light .form-control:focus {
  border-color: #fd5f56;
}

.es-main-red-light .es-piece .piece-header:after {
  background-color: #fd5f56;
}

.es-main-red-light .bg-primary {
  background-color: #fd5f56 !important;
}

.es-main-red-light .color-primary,
.es-main-red-light .link-dark:hover,
.es-main-red-light .link-darker:hover,
.es-main-red-light .link-gray:hover,
.es-main-red-light .link-light:hover,
.es-main-red-light .link-lighter:hover,
.es-main-red-light .link-medium:hover,
.es-main-red-light .link-primary,
.es-main-red-light .link-white:hover {
  color: #fd5f56 !important;
}

.es-main-red-light .link-primary:hover {
  color: #fc2f24 !important;
}

.es-main-red-light .course-list .course-date .btn-circle.btn-live {
  background: #fd5f56;
}

.es-main-red-light .class-serve>ul>li.active,
.es-main-red-light .es-bar-menu>ul>li.active,
.es-main-red-light .es-bar-menu>ul>li:hover {
  background-color: #fd5f56;
}

.es-main-red-light .bar-menu-top .bar-user.active .badge,
.es-main-red-light .bar-menu-top .bar-user:hover .badge {
  color: #fd5f56;
}

.es-main-red-light .bar-task .bar-task-header,
.es-main-red-light .bar-task .bar-time-line>li:before {
  background-color: #fd5f56;
}

.es-main-red-light .bar-task .bar-time-line>li .es-icon {
  color: #fd5f56;
}

.es-main-red-light .bar-history ul>li .icon {
  background-color: #fd5f56;
}

.es-main-red-light .es-filter .nav-sort>li>a:hover {
  color: #fd5f56;
}

.es-main-red-light .es-filter .nav-sort>li>a.active {
  background-color: #fd5f56;
}

.es-main-red-light .es-filter .nav-sort>li>a.active:hover {
  color: #fff;
}

.es-main-red-light .es-filter .btn-group.open .dropdown-toggle {
  color: #fd5f56;
}

.es-main-red-light .es-filter .filter .btn:hover {
  color: #fd5f56;
  transition: all 0.3s ease;
}

.es-main-red-light .es-filter .filter label:hover,
.es-main-red-light .nav-filter .nav-pills>li.dropdown>a:hover {
  color: #fd5f56;
}

.es-main-red-light .order-nav .on {
  background: #fd5f56;
}

.es-main-red-light .order-nav .on span {
  border: 23px solid #fd5f56;
}

.es-main-red-light .order-nav .on b {
  border-left-color: #fd5f56;
}

.es-main-red-light .note-list .note-item .metas .metas-sns>span>a:hover,
.es-main-red-light .note-list .note-item .metas>.name:hover,
.es-main-red-light .note-list .note-item .metas>.period,
.es-main-red-light .task-list.task-show .task-item.active.task-content .left-menu,
.es-main-red-light .task-list.task-show .task-item.active.task-content .title,
.es-main-red-light .task-list.task-show .task-item:hover.task-content .left-menu,
.es-main-red-light .task-list.task-show .task-item:hover.task-content .title,
.es-main-red-light .topic-list .topic-item .metas>.name:hover,
.es-main-red-light .topic-list .topic-item .metas>.period,
.es-main-red-light .topic-list .topic-item .title a:hover {
  color: #fd5f56;
}

.es-main-red-light .select2-container-active .select2-choice,
.es-main-red-light .select2-container-active .select2-choices,
.es-main-red-light .select2-drop-active {
  border-color: #fd5f56 !important;
}

.es-main-red-light .select2-results .select2-highlighted {
  background: #fd5f56 !important;
}

.es-main-red-light .select2-container-multi.select2-container-active .select2-choices {
  box-shadow: none !important;
  border: 1px solid #fd5f56 !important;
}

.es-main-red-light .select2-dropdown-open.select2-drop-above .select2-choice,
.es-main-red-light .select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #fd5f56 !important;
}

.es-main-red-light .noUi-horizontal .noUi-handle {
  border: 2px solid #fd5f56;
}

.es-main-red-light .noUi-horizontal .noUi-tooltip {
  color: #fd5f56;
}

.es-main-red-light .noUi-connect {
  background-color: #fd5f56;
}

.es-main-red-light .vip-new-member .member-list img:hover {
  border-color: #fd5f56;
}

.es-main-red-light .belongs-class .media-body>a:hover,
.es-main-red-light .course-progress .cricle-progress .percent .num {
  color: #fd5f56;
}

.es-main-red-light .orderlearn-poster span.swiper-active-switch {
  background-color: #fd5f56;
}

.es-main-red-light .course-detail-section-responsive ul>li:hover,
.es-main-red-light .course-detail-section-responsive ul>li:hover a {
  color: #fd5f56;
}

.es-main-red-light .panel-create-course .course-piece:after {
  background-color: #fd5f56;
}

.es-main-red-light .panel-create-course .course-select:hover {
  border: 2px solid #fd5f56;
}

.es-main-red-light .panel-create-course .course-select.active {
  background-color: #fd5f56;
}

.es-main-red-light .download-activity-list>li>a:hover,
.es-main-red-light .download-activity-list>li>a:hover .download-icon,
.es-main-red-light .task-dashboard-page .dashboard-content .dashboard-header .back-link:hover {
  color: #fd5f56;
}

.es-main-red-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li.active>a,
.es-main-red-light .task-dashboard-page .dashboard-toolbar .dashboard-toolbar-nav>li:hover>a,
.es-main-red-light .testpaper-timer .btn-pause {
  background-color: #fd5f56;
}

.es-main-red-light .task-create-editor .task-create-type-list .task-create-type-item:hover>a {
  border: 3px solid #fd5f56;
}

.es-main-red-light .task-create-editor .task-create-type-list .task-create-type-item.active>a {
  background: #fd5f56;
  border: 3px solid #fd5f56;
}

.es-main-red-light .article-sns .es-share>a:hover,
.es-main-red-light .article-sns a.love:hover,
.es-main-red-light .chooser-list .table-striped>tbody>tr.active>td,
.es-main-red-light .chooser-list .table-striped>tbody>tr:hover>td,
.es-main-red-light .class-course-list .course-item .media .course-show:hover,
.es-main-red-light .class-header.after .class-data>li>a:hover,
.es-main-red-light .class-header.before .bottom-metas .btn-buy .btn-link:hover,
.es-main-red-light .class-header .class-data>li .dropdown-toggle:hover,
.es-main-red-light .download-list li:hover>.btn-delete:hover,
.es-main-red-light .topic-detail .topic-header .metas>a:hover,
.es-main-red-light .topic-detail .topic-header .title>a:hover,
.es-main-red-light .topic-detail .topic-num .num-more i:hover {
  color: #fd5f56;
}

.es-main-red-light .class-signin .btn-signin {
  background-color: #fd5f56;
}

.es-main-red-light .es-poster .swiper-slide .subtitle {
  color: #fd5f56;
}

.es-main-red-light .introduction-section {
  background-color: #fd5f56;
}

.es-main-red-light .live-course-body .es-live-back ul li .dat {
  background: #fd5f56;
}

.es-main-red-light .live-course-body .es-live-all .media-body .user a:hover,
.es-main-red-light .live-course-body .es-live-back ul li a:hover {
  color: #fd5f56;
}

.es-main-red-light .social-login .social-icon.social-more:hover {
  background: #fd5f56;
  border-color: #fd5f56;
}

.es-main-red-light .es-materials-manage .nav-tabs>li.active>a,
.es-main-red-light .es-materials-manage .nav-tabs>li>a:hover,
.es-main-red-light .es-materillib-table a:hover,
.es-main-red-light .material-search-list.material-tabs .right-content li.active a,
.es-main-red-light .material-search-list.material-tabs .right-content li:hover a {
  color: #fd5f56;
}

.es-main-red-light .materials-modal-body .nav.nav-tabs>li.active>a,
.es-main-red-light .materials-modal-body .nav.nav-tabs>li:hover>a {
  border-bottom: 1px solid #fd5f56;
}

.es-main-red-light .es-mobile .step .member {
  background: #fd5f56;
  box-shadow: 0 6px 20px rgba(253, 95, 86, 0.4);
}

.es-main-red-light .open-course-panel .panel-heading:before {
  background: #fd5f56;
}

.es-main-red-light .open-course-tab .tab-recommand .open-course-info .title:hover {
  color: #fd5f56;
}

.es-main-red-light .open-course-tab .tab-live a.active,
.es-main-red-light .open-course-tab .tab-live a:active,
.es-main-red-light .open-course-tab .tab-live a:hover {
  background-color: #fd5f56;
}

.es-main-red-light .open-course-mobile-tab ul .tab-header.active {
  border-bottom: 2px solid #fd5f56;
  color: #fd5f56;
}

.es-main-red-light .marker-manage .nav.nav-pills.nav-pills-difficulty>li.active>a {
  background-color: #fd5f56;
}

.es-main-red-light .marker-manage-content .manage-player-body .manage-player-header .title-link:hover,
.es-main-red-light .marker-manage .lesson-list .item-lesson .btn-preview:hover,
.es-main-red-light .marker-manage .lesson-list .more-questions a:hover {
  color: #fd5f56;
}

.es-main-red-light .marker-manage-content .editbox .scalebox .lesson-list .item-lesson:hover {
  background-color: #fd5f56;
}

.es-main-red-light .marker-manage-content .editbox .scalebox .lesson-list .placeholder:after {
  border-color: transparent transparent transparent #fd5f56;
}

.es-main-red-light .section-wxpay .text-qrcode,
.es-main-red-light .subtitle-transcode-status.success {
  background: #fd5f56;
}

.es-main-red-light .btn-consult-default {
  background: #fd5f56;
  border-color: #ec4e45;
}

.es-main-red-light .btn-consult-default:hover {
  background: #ec4e45;
  border-color: #db3d34;
}

.es-main-red-light .list-group-panel .list-group-item.active,
.es-main-red-light .list-group-panel .list-group-item.active:hover {
  background: #f3f3f3;
  color: #fd5f56;
  font-weight: 700;
  border-left: 3px solid #fd5f56;
}

.es-main-red-light .page-header .badge {
  margin-left: 5px;
  color: #fff;
  background-color: #fd5f56;
}

.es-nav-red-light .es-header {
  background-color: #fd5f56;
}

.es-nav-red-light .es-header .nav.navbar-nav>li>a {
  color: #f5f5f5;
}

.es-nav-red-light .es-header .nav.navbar-nav>li.active>a,
.es-nav-red-light .es-header .nav.navbar-nav>li.open.active>a,
.es-nav-red-light .es-header .nav.navbar-nav>li.open>a,
.es-nav-red-light .es-header .nav.navbar-nav>li.open>a:focus,
.es-nav-red-light .es-header .nav.navbar-nav>li.open>a:hover,
.es-nav-red-light .es-header .nav.navbar-nav>li>a:focus,
.es-nav-red-light .es-header .nav.navbar-nav>li>a:hover {
  color: #fff;
}

.es-nav-red-light .es-header .nav.user-nav>li>a {
  color: #f5f5f5;
}

.es-nav-red-light .es-header .nav.user-nav>li>a:focus,
.es-nav-red-light .es-header .nav.user-nav>li>a:hover {
  color: #fff;
}

html {
  height: 100%;
}

/* 移动端查看更多 */
.index-view-more {
  display: none;
  border: 1px solid #4a90e2;
  border-radius: 18px;
  font-size: 14px;
  color: #4a90e2;
  max-width: 102px;
  line-height: 34px;
  margin: 0 auto 30px;
  text-align: center;
}

/* 近期开课栏目 */
.quality-course {
  padding-top: 60px;
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
}

.quality-course .title-border-bg {
  text-align: center;
}

.quality-course .title-bg {
  display: inline-block;
  height: 45px;
  width: 142px;
  background: url(/static-dist/app/img/shenlan2020/01jinqi_pic@2x.png);
  background-size: 142px 45px;
}

.quality-course .course-list {
  padding: 0;
  margin-top: 30px;
}

@media (min-width: 768px) {

  /*头部导航*/
  .es-header {
    height: 60px;
  }

  .navbar-nav {
    margin-left: 10px;
  }

  .navbar-nav,
  .navbar-nav>li {
    height: 60px;
    line-height: 60px;
    font-size: 14px;
    color: #3f4a54;
  }

  .navbar-collapse.collapse {
    float: left;
  }

  .es-header .navbar-header .navbar-brand {
    padding: 0 !important;
  }

  .navbar-nav li a {
    /*line-height: 60px !important;*/
    position: relative;
    /*transition: .1s color;*/
  }

  .navbar-nav>li>a:after {
    content: "";
    position: absolute;
    width: 24px;
    height: 4px;
    background-color: #005BAC;
    /* 新年皮肤 */
    /* background-color: #e8543b; */
    border-radius: 5px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 12px;
    opacity: 0;
    /*transition: .1s opacity;*/
  }

  /* 首页的导航下标 */
  .headerIndex .navbar-nav li a:after {
    content: "";
    position: absolute;
    width: 24px;
    height: 4px;
    background-color: #4a90e2;
    border-radius: 5px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 8px;
    opacity: 0;
    /*transition: .1s opacity;*/
  }

  .navbar-nav li:hover a:after {
    opacity: 1;
  }

  .navbar-nav li.active a:after {
    opacity: 1 !important;
  }

  .navbar-nav>li:hover >a {
    color: #005BAC !important;
    /* 新年皮肤 */
    /* color: #e8543b !important; */
  }

  .navbar-form .form-control {
    padding: 0 0 0 10px !important;
    width: 173px;
    height: 28px;
    font-size: 12px;
    color: #bababa;
  }

  .navbar-form .form-control:focus {
    border: 1px solid #005bac !important;
    /* 新年皮肤 */
    /* border: 1px solid #ad5d33 !important; */
  }

  .navbar-form .form-group {
    height: 60px;
    /* line-height: 52px !important; */
    margin-right: 10px;
  }

  .navbar-form.navbar-right.hidden-xs.hidden-sm {
    height: 60px;
    line-height: 68px;
  }

  .es-header .navbar-form {
    margin-top: 0;
  }

  .navbar-form button.es-icon.es-icon-search {
    line-height: 56px;
  }

  .nav.user-nav .dropdown-menu li[role="presentation"] {
    line-height: 1.42857143 !important;
  }

  /*.user-nav .dropdown-menu {
        top: 100%!important;
    }*/
  .es-poster {
    margin-top: 10px;
  }

  .quality-course-title,
  .company-title,
  .pre-public-class-title,
  .newest-courses h2 {
    font-size: 28px;
    color: #3f4a54;
    margin-top: 40px;
    position: relative;
    line-height: 40px;
    text-align: center;
  }

  .quality-course-title:after,
  .company-title:after,
  .pre-public-class-title:after,
  .newest-courses h2:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 4px;
    background-color: #005bac;
    border-radius: 100px;
    left: 50%;
    transform: translateX(-50%);
    bottom: -8px;
  }

  /*模块标题*/
  .text-line h5 span {
    font-size: 28px;
    color: #3f4a54;
    position: relative;
    line-height: 40px;
    display: block;
    height: 40px;
  }

  .text-line h5 span:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 4px;
    background-color: #005bac;
    border-radius: 100px;
    left: 50%;
    transform: translateX(-50%);
    bottom: -8px;
  }

  .text-line .subtitle {
    display: none;
  }

  .course-img a img {
    padding: 0 !important;
  }
}

.quality-course-content.container li {
  margin-top: 20px;
}

@media (min-width: 992px) {
  #content-container {
    width: 1100px;
  }

  .quality-course-content.container {
    width: 1100px;
  }
}

.course-list .course-item,
.course-box .course-list {
  box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  -webkit-box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  -moz-box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
}

.new-homepage-course-box {
  display: none;
}

@media (min-width: 768px) and (max-width: 991px) {

  .homepage-course-box,
  .course-summary {
    display: none;
  }

  .new-homepage-course-box {
    display: block;
  }

  .course-grid-container .course-list .course-summary {
    display: none;
  }

  .course-grid-container .course-list.course-box .course-item {
    width: auto !important;
    height: auto !important;
  }

  .course-grid-container {
    width: 740px !important;
  }
}

.course-grid-container .course-list .course-summary {
  width: 165px;
  height: 250px;
  float: left;
}

.course-grid-container .course-list .course-summary img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
}

.course-grid-container .course-list.course-box {
  margin: 0 auto;
  width: 1080px;
}

.course-grid-container .course-list.course-box .course-item {
  width: 285px;
  float: left;
  margin-left: 20px;
}

.course-list .course-item .title {
  height: 40px !important;
}

.course-grid-container .text-line h5,
.course-list-section .text-line h5 {
  margin: 0 !important;
}

.course-grid-container {
  width: 1100px;
  margin: 0 auto;
  /*padding-bottom: 10px;*/
}

.course-grid-container .course-title {
  margin: 0 0 20px 0 !important;
}

.course-grid-container .course-title h3 {
  font-size: 18px;
  color: #3f4a54;
  float: left;
  line-height: 25px;
}

.course-grid-container .course-title a {
  float: right;
  font-size: 14px;
  color: #6d6d6d;
  line-height: 20px;
  margin-top: 2px;
}

.course-grid-container .course-title a:hover {
  color: #005bac;
}

/*}*/

@media (min-width: 1200px) {
  .public-course-container {
    width: 1110px !important;
  }
}

@media (min-width: 768px) {
  .quality-course-box li {
    transition: all 0.3s ease;
    /*height: 144px;*/
    box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
    -webkit-box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
    -moz-box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  }

  .quality-course-box li:hover {
    transform: translateY(-6px);
    -webkit-transform: translateY(-6px);
    -moz-transform: translateY(-6px);
    box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
    -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
    -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
    transition: all 0.3s ease;
  }
}

/* 老师列表页面 优化 */
.teacher-list-title-wrap {
  background-color: #313131;
  height: 200px;
  padding-top: 73px;
}

.teacher-list-title-wrap .title {
  font-size: 40px;
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(28, 31, 33, 0.2);
}

/*名师推荐*/

.teacher-item {
  /* height: 270px; */
  height: 234px;
  position: relative;
  background-color: #005bac;
  border-radius: 8px;
}

.teacher-item-box {
  position: absolute;
  top: 3px;
  background-color: #fff;
  border-radius: 8px;
  height: 270px;
  width: 100%;
  text-align: center;
  border: 1px solid #eeeeee;
}

.teacher-item-box .avatar img {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  margin: -30px auto 0;
  box-shadow: 0 5px 20px 0 rgba(73, 130, 186, 0.1);
  -webkit-box-shadow: 0 5px 20px 0 rgba(73, 130, 186, 0.1);
  -moz-box-shadow: 0 5px 20px 0 rgba(73, 130, 186, 0.1);
}

.teacher-item-box .title {
  font-size: 16px;
  color: #2c2e40;
  margin-top: 12px;
}

.teacher-item-box .subtitle {
  font-size: 12px;
  color: #9296b2;
  margin-top: 4px;
  padding: 0 15px;
}

.teacher-item-box .description {
  font-size: 13px;
  color: #666981;
  margin: 16px auto 0;
  width: 80%;
  height: 90px;
  /* text-align: justify; */
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

/*.teacher-item-blinex .metas .btn:nth-last-of-type() {
    margin-left: 20px;
    display: inline-block;
}*/

.teacher-item,
.teacher-item:hover {
  transition: all 0.3s ease;
}

.teacher-item:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
}

.teacher-item:hover .metas {
  opacity: 1;
  filter: alpha(opacity=100);
  transition: all 0.3s ease;
  height: 34px;
}

.teacher-item:hover .description {
  opacity: 0;
  filter: alpha(opacity=0);
  transition: all 0.3s ease;
}

@media (min-width: 992px) and (max-width: 1200px) {
  .teacher-item .metas .btn {
    width: 70px;
    height: 34px;
    line-height: 22px;
  }
}

@media (min-width: 1200px) {
  .teacher-item .metas .btn {
    width: 80px;
  }
}

/* @media (max-width:992px) {
    .teacher-item .metas .btn {
        width: 55px;
    }
} */

/* .teacher-item .metas .btn:nth-of-type(1) {
    background-color: #005BAC;
    border: none;
} */
.teacher-item .metas .follow-btn {
  background: #4a90e2;
  border: 1px solid #4a90e2;
  border-radius: 18px;
  color: #ffffff;
}

.teacher-item .metas .unfollow-btn,
.teacher-item .metas .letter-btn,
.teacher-item .metas .letter-btn:hover {
  border: 1px solid #4a90e2;
  background: #ffffff;
  border-radius: 18px;
  color: #4a90e2;
}

/*深蓝动态*/

.dynamic-section-main {
  width: auto !important;
}

.dynamic-section-main .panel-default.panel {
  border: 1px solid #e8e8e8;
  box-shadow: 0 4px 8px 0 rgba(69, 59, 57, 0.05) !important;
  /*width: 530px !important;*/
  /*height: 285px !important;*/
  border-top-color: #005bac;
  border-radius: 0 0 4px 4px;
}

.panel-default {
  padding: 0 30px;
}

.index-new-article .es-icon.es-icon-dot {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 4px solid #005bac;
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 9px !important;
}

.index-new-article .es-icon.es-icon-dot:before {
  content: "";
}

.index-new-article .link-dark {
  font-size: 14px;
  color: #3d464d !important;
}

.index-new-article .link-dark:hover {
  color: #005bac !important;
}

.media-dynamic .media-body .title {
  float: left;
  margin-right: 10px;
}

.media-dynamic .media-body .title a {
  font-size: 14px;
  color: #3d464d !important;
}

.media-dynamic .media-body .title:hover a {
  color: #005bac !important;
}

.media-dynamic .media-body .content {
  margin-left: 5px;
}

.media-dynamic .media-body .content .link-dark {
  color: #3d464d !important;
}

.media-dynamic {
  margin-left: 16px;
  position: relative;
  margin-top: 15px;
}

.media-dynamic:before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #005bac;
  top: 41%;
  left: -15px;
}

.media-dynamic .link-dark:hover {
  color: #005bac !important;
}

/* 新课推荐 */
.quality-course-new .course-item .course-img img {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.quality-course-new .course-info .metas {
  margin-top: 5px;
  margin-bottom: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  /* padding-right: 0px; */
  margin-right: 10px;
}

.quality-course-new .course-info .metas span {
  display: inline-block;
  background: #ebf4ff;
  border-radius: 4px;
  padding: 4px;
  margin-right: 6px;
  color: #6092cb;
}

/* 首页的热门方向 */

.hot-direction {
  background: #fff url("/static-dist/app/img/shenlan19/remenfangxiang_bg_pic.png") no-repeat;
  background-position: center 212px;
  padding-top: 60px;
  padding-bottom: 34px;
}

.hot-direction .hot-list {
  max-width: 1920px;
  margin: 0 auto;
  position: relative;
}

/* .hot-list img.position-left,
.hot-list img.position-right {
    width: 242px;
    height: 320px;
    position: absolute;
}

.hot-list img.position-left {
    bottom: 180px;
    left: 0px;
}

.hot-list img.position-right {
    right: 0px;
    top: 138px;
} */

.hot-direction .title-border-bg {
  margin-bottom: 10px;
}

.hot-direction .hot-direction-box {
  max-width: 1080px;
  overflow: hidden;
  margin: 0 auto;
  padding-top: 20px;
}

.hot-direction .hot-direction-box>li {
  margin-bottom: 26px;
}

.hot-direction .hot-direction-box .hot-item-wrap {
  display: block;
  width: 100%;
  height: 100%;
}

.hot-direction .hot-item {
  transition: all 0.3s ease;
  box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  -webkit-box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  -moz-box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  /* margin-bottom: 26px; */
  border-radius: 8px;
  border: 1px solid #e4ecf3;
  background-color: #fff;
}

.hot-direction .hot-item:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3) !important;
  -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3) !important;
  -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3) !important;
  transition: all 0.3s ease;
}

.hot-direction .hot-img img {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  width: 100%;
}

.hot-direction .hot-info .title {
  padding: 10px 12px;
  font-size: 14px;
  color: #666d7e;
}

.hot-direction .hot-info .title p {
  line-height: 24px;
  height: 48px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.hot-direction .link-join {
  max-width: 160px;
  margin: 32px auto;
}

.hot-direction .link-join span {
  display: block;
  border: 1px solid #a7b2c3;
  border-radius: 25px;
  color: #a7b2c3;
  text-align: center;
  padding-top: 9px;
  padding-bottom: 10px;
}

@media (max-width: 768px) {
  .hot-direction .link-join {
    max-width: 80px;
    margin: 8px auto 20px;
  }

  .hot-direction .link-join span {
    padding-top: 2px;
    padding-bottom: 3px;
    font-size: 12px;
  }

  .hot-direction .hot-info .title p {
    line-height: 18px;
    height: 36px;
    font-size: 13px;
  }
}

.hot-direction .link-join span:hover {
  background: #2e88f2;
  box-shadow: 0 8px 14px 0 rgba(0, 102, 222, 0.3);
  color: #ffffff;
  border-color: #2e88f2;
}

/* 首页的公开课模版 */

.open-class {
  max-width: 1080px;
  margin: 0 auto;
  padding: 34px 0 0;
}

.open-class h2 {
  text-align: center;
  max-width: 1080px;
  margin: 0 auto 30px;
  position: relative;
}

.open-class .title-bg {
  display: inline-block;
  height: 45px;
  width: 111px;
  background: url(/static-dist/app/img/shenlan2020/2gongkaike_pic@2x.png);
  background-size: 111px 45px;
}

.open-class h2 a,
.quality-course .title-border-bg a {
  float: right;
  font-size: 14px;
  color: #6d6d6d;
  padding-top: 20px;
  position: absolute;
  right: 0;
}

/* 公开课改版2021 */

.open-class .open-class-box {
  max-width: 1080px;
  overflow: hidden;
  margin: 0 auto;
  padding-top: 24px;
}

.open-class .open-class-box .title {
  width: 100%;
  height: 30px !important;
  display: block !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-class .open-class-box .num {
  float: right;
}

.open-class .open-class-box .course-author-widget {
  color: #646f80;
}

.open-class .open-class-box .course-img img.img-responsive {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

/* 学院优势 */
.college-advantage-box {
  max-width: 1080px;
  margin: 60px auto;
}

.college-advantage-box .title-border-bg {
  text-align: center;
  position: relative;
}

.college-advantage-box .title-bg {
  display: inline-block;
  height: 46px;
  width: 140px;
  background: url(/static-dist/app/img/shenlan2020/03xueyuan_pic@2x.png);
  background-size: 140px 46px;
}

.college-advantage-box .advantage-box {
  min-height: 416px;
  margin: 30px 0 50px;
  background: url(/static-dist/app/img/shenlan2020/xueyuanyoushi02_pic@2x.png) center no-repeat;
  background-size: 426px 416px;
  /* display: grid;
    grid-template-rows: repeat(2,1fr);
    grid-template-columns: 1fr 490px 1fr; */
  display: flex;
  flex-wrap: wrap;
}

.college-advantage-box.animatedsw {
  animation-name: swing;
  animation-duration: 2s;
}

.college-advantage-box .advantage-num:nth-of-type(1),
.college-advantage-box .advantage-num:nth-of-type(3) {
  padding-top: 30px;
  width: 295px;
}

.college-advantage-box .advantage-num:nth-of-type(2),
.college-advantage-box .advantage-num:nth-of-type(5) {
  width: 481px;
}

.college-advantage-box .advantage-num:nth-of-type(4),
.college-advantage-box .advantage-num:nth-of-type(6) {
  margin-top: 80px;
  width: 295px;
}

.college-advantage-box .advantage-num:nth-of-type(1) dd,
.college-advantage-box .advantage-num:nth-of-type(1) dt,
.college-advantage-box .advantage-num:nth-of-type(4) dd,
.college-advantage-box .advantage-num:nth-of-type(4) dt {
  text-align: right;
}

.college-advantage-box dt {
  font-weight: bold;
  font-size: 24px;
  color: #2f3c52;
  padding-bottom: 10px;
}

.college-advantage-box dd {
  font-size: 16px;
  color: #666d7e;
  text-align: justify;
  line-height: 33px;
}

.college-advantage-box dd strong {
  font-family: "din-blod";
  font-size: 32px;
  color: #0091ff;
  position: relative;
  top: 2px;
}

/* 为什么选择深蓝学院？ */
@keyframes course_hrtongv {
  from {
    right: 1200px;
  }

  to {
    right: 0px;
  }
}

@-webkit-keyframes course_hrtongv {
  from {
    right: 1200px;
  }

  to {
    right: 0px;
  }
}

.course_hrtongv {
  animation: course_hrtongv 1.25s, 100ms;
  -webkit-animation: course_hrtongv 1.25s, 100ms;
}

@keyframes course_h1tongv {
  from {
    left: 1200px;
  }

  to {
    left: 0px;
  }
}

@-webkit-keyframes course_h1tongv {
  from {
    left: 1200px;
  }

  to {
    left: 0px;
  }
}

.course_h1tongv {
  animation: course_h1tongv 1.25s, 100ms;
  -webkit-animation: course_h1tongv 1.25s, 100ms;
}

.choice-shenlan {
  background: #fff url("/static-dist/app/img/shenlan19/whychoose_bj_pic.png") no-repeat;
  background-position: top center;
  padding-top: 60px;
  padding-bottom: 60px;
}

.choice-shenlan .part-section img {
  width: 100%;
}

.choice-shenlan .course_h1tong,
.choice-shenlan .course_hrtong {
  margin-top: 48px;
}

.part-section:nth-of-type(2n + 1) .col-md-6:nth-of-type(1) {
  padding-left: 50px;
  padding-right: 20px;
}

@media (max-width: 1080px) {
  .part-section:nth-of-type(2n + 1) .col-md-6:nth-of-type(1) {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 1px;
  }

  /* 学员优势 */
  .college-advantage-box .advantage-num:nth-of-type(2),
  .college-advantage-box .advantage-num:nth-of-type(5) {
    display: none;
  }

  .college-advantage-box .advantage-num dt {
    font-size: 20px;
    text-align: left !important;
  }

  .college-advantage-box .advantage-box {
    display: flex;
    flex-direction: column;
    background: none;
    margin: 20px 0 0;
  }

  .college-advantage-box .advantage-num {
    position: relative;
    background: #fff;
    border: 1px solid #f2f4f7;
    box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
    border-radius: 4px;
    width: 90vw !important;
    margin: 0 auto 20px !important;
    padding: 20px 0 20px 100px !important;
  }

  .college-advantage-box .advantage-num::before {
    content: "";
    width: 68px;
    height: 68px;
    border-radius: 50%;
    position: absolute;
    left: 16px;
    border: 1px solid #ececec;
    box-shadow: 0 0 10px 0 rgba(0, 145, 255, 0.2);
  }

  .college-advantage-box .advantage-num:nth-of-type(1)::before {
    background: #fff url(/static-dist/app/img/shenlan2020/shizi_icon@2x.png) 11px 17px no-repeat;
    background-size: 45px 34px;
  }

  .college-advantage-box .advantage-num:nth-of-type(3)::before {
    background: #fff url(/static-dist/app/img/shenlan2020/kechengfuwu_pic@2x.png) 12px 14px no-repeat;
    background-size: auto 38px;
  }

  .college-advantage-box .advantage-num:nth-of-type(4)::before {
    background: #fff url(/static-dist/app/img/shenlan2020/jiaoyanyoushi_pic@2x.png) 12px 12px no-repeat;
    background-size: 44px 42px;
  }

  .college-advantage-box .advantage-num:nth-of-type(6)::before {
    background: #fff url(/static-dist/app/img/shenlan2020/hangyeziyuan_icon@2x.png) 15px 17px no-repeat;
    background-size: 38px 31px;
  }

  .college-advantage-box .advantage-num dd {
    text-align: left !important;
    font-size: 13px;
  }
}

.part-section-item {
  width: 83%;
  padding-top: 48px;
  text-align: justify;
}

.part-section-item .title {
  font-size: 20px;
  color: #4a90e2;
  margin-bottom: 12px;
}

.part-section-item .intro {
  font-size: 14px;
  color: #666d7e;
  line-height: 24px;
}

@media (max-width: 767px) {
  .part-section-item {
    width: 100%;
    padding-top: 0px;
    text-align: center;
  }
}

/*合作企业*/

body {
  background-color: #fff;
}

.company {
  padding-bottom: 120px;
}

.company .title-bg {
  display: inline-block;
  height: 46px;
  width: 139px;
  background: url(/static-dist/app/img/shenlan2020/06hezuoqiye_pic@2x.png);
  background-size: 139px 46px;
}

.company-animationv {
  animation: company_animation 1.25s, 100ms;
  -webkit-animation: company_animation 1.25s, 100ms;
  /* animation-fill-mode: both; */
}

@keyframes company_animation {
  0% {
    opacity: 0;
    transform: translate(0px, 150px);
  }

  to {
    opacity: 1;
    transform: translate(0px, 0px);
  }
}

/* .title-border-bg span {
    font-size: 26px;
    color: #2C3240;
    position: relative;
    z-index: 1;
}

.title-border-bg span::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: -6px;
    left: -12px;
    width: 36px;
    height: 36px;
    border-radius: 18px;
    background-color: #E6F1FF;
}

.title-border-bg span::after {
    content: '';
    position: absolute;
    z-index: -1;
    bottom: -3px;
    right: -7px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    border: 4px solid #E6F1FF;
} */

.company-title {
  margin: 0;
}

.company .company-content {
  max-width: 1080px;
  overflow: hidden;
  margin: 0 auto;
  opacity: 1;
  transform: translate(0px, 0px);
}

.company h2 {
  text-align: center;
  padding-top: 40px;
  max-width: 1080px;
  margin: 0 auto;
  position: relative;
}

.company h2 a {
  float: right;
  font-size: 14px;
  color: #6d6d6d;
  padding-top: 20px;
  position: absolute;
  right: 0;
}

.company .company-box {
  margin-top: 30px;
  /* width: 1100px; */
  padding: 0;
}

.company .company-box li img {
  /* border: 1px solid #E9E9E9;
    border-radius: 4px; */
  width: 100%;
  height: 100%;
  margin-bottom: 20px;
}

/* .company .company-box .company-list {
    width: 255px;
    height: 100px;
    border: 1px solid #E9E9E9;
    border-radius: 4px;
    list-style: none;
    float: left;
    margin-right: 20px;
    position: relative;
    margin-top: 20px;
}

.company .company-box .company-list img {
    width: 100%;
    height: 100%;
} */
/* 首页 学员就业 start */
@font-face {
  font-family: 'AlimamaShuHeiTi';
  src: url('/static-dist/app/fonts/AlimamaShuHeiTi-Bold.ttf');
}
.index-employment .container {
  max-width: 1288px;
  width: 100%;
}
.index-employment .container .container-cont {
  width: 100%;
  position: relative;
}
.index-employment .title-border-bg {
    text-align: center;
    margin: 30px 0;
}
.index-employment .title-border-bg .title-bg {
    display: inline-block;
    height: 45px;
    width: 139px;
    background: url('/static-dist/app/img/2021/index-employment/tit@2x.png');
    background-size: 139px 45px;
}
.index-employment .employment-container {
  max-width: 1100px;
  width: 100%;
}
.index-employment .employment-content {
  width: 100%;
}
.index-employment .employment-content .students-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto;
}

.index-employment .employment-content .students-list .student-item {
    display: block;
    width: 260px;
    height: 260px;
    background-repeat: no-repeat;
    background-size: 260px auto;
    background-color: #eef4fb;
    margin-bottom: 20px;
    padding: 26px 24px;
    border-radius: 10px;
    transition: all 0.5s;
}


.index-employment .employment-content .students-list .student-item .name-wrap {
    font-family: SourceHanSansSC-Bold;
    font-size: 16px;
    color: #31363F;
    letter-spacing: 0;
    font-weight: 700;
    display: flex;
    align-items: center;
    margin-bottom: 36px;
    transition: color 0.5s;
}

.index-employment .employment-content .students-list .student-item .avatar {
    width: 36px;
    height: 36px;
    margin-right: 10px;
}

.index-employment .employment-content .students-list .student-item .company {
    font-family: AlimamaShuHeiTi;
    font-size: 23px;
    color: #31363F;
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 2px;
    padding: 0;
    white-space: nowrap;
    transition: color 0.5s;
}

.index-employment .employment-content .students-list .student-item .job {
    font-family: SourceHanSansSC-Regular;
    font-size: 16px;
    color: #6A7B8E;
    letter-spacing: 0;
    font-weight: 400;
    margin-bottom: 52px;
    white-space: nowrap;
    transition: color 0.5s;
}

.index-employment .employment-content .students-list .student-item .study-course-num {
    background: #FFFFFF;
    border-radius: 14.5px;
    font-family: SourceHanSansSC-Regular;
    font-size: 12px;
    color: #6092CB;
    font-weight: 400;
    display: inline-block;
    padding: 0 12px;
    height: 27px;
}

.index-employment .employment-content .students-list .student-item .study-course-num .num {
    font-size: 20px;
    color: #6092CB;
    letter-spacing: 0;
    font-weight: 400;
}
.index-employment .employment-content {
  width: 1100px;
  margin: 0 auto;
}
.index-employment .employment-page {
  width: 1100px;
  margin-right: 98px;
}
.index-employment .swiper-button-next {
  right: 0;
  width: 54px;
  height: 54px;
  margin-top: -37px;
  background-size: 54px 54px;
  transition: all .3s ease;
  background-image: url('/static-dist/app/img/2021/index-employment/PC-youjiantou@2x.png');
}

.index-employment .swiper-button-prev {
  left: 0;
  width: 54px;
  height: 54px;
  margin-top: -37px;
  background-size: 54px 54px;
  transition: all .3s ease;
  background-image: url('/static-dist/app/img/2021/index-employment/PC-zuojiantou@2x.png');
}
/* 屏幕大于1100px时 */
@media (min-width: 1100px) {
  .index-employment .employment-content .students-list .student-item.item1 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing1@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item1:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj1@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item2 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing2@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item2:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj2@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item3 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing3@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item3:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj3@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item4 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing4@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item4:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj4@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item5 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing5@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item5:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj5@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item6 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing6@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item6:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj6@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item7 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing7@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item7:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj7@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item8 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing8@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item8:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj8@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item9 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing9@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item9:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj9@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item10 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing10@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item10:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj10@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item11 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing11@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item11:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj11@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item12 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing12@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item12:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj12@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item13 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing13@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item13:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj13@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item14 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing14@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item14:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj14@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item15 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing15@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item15:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj15@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item16 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing16@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item16:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj16@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item17 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing17@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item17:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj17@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item18 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing18@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item18:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj18@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item19 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing19@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item19:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj19@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item20 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing20@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item20:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj20@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item21 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing21@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item21:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj21@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item22 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing22@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item22:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj22@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item23 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing23@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item23:hover { background-image: url('/static-dist/app/img/2021/index-employment/PC-hoverbj23@2x.jpg'); }
  .index-employment .employment-content .students-list .student-item.item24 { background-image: url('/static-dist/app/img/2021/index-employment/PC-beijing24@2x.png'); }
  .index-employment .employment-content .students-list .student-item:hover .name-wrap {
      color: #FFF;
  }
  .index-employment .employment-content .students-list .student-item:hover .company {
      color: #FFF;
  }
  .index-employment .employment-content .students-list .student-item:hover .job {
      color: #FFF;
  }
}
/* 屏幕小于1100px时 */
@media (max-width: 1100px) {
  .index-employment .employment-content .students-list {
    justify-content: space-evenly;
  }
  .index-employment .employment-content .students-list .student-item {
      display: block;
      width: 172px;
      height: 186px;
      background-size: 172px auto;
      margin-bottom: 10px;
      padding: 20px 14px;
      border-radius: 5px;
  }
  .index-employment .employment-content .students-list .student-item .avatar {
    width: 32px;
    height: 32px;
  }
  .index-employment .employment-content .students-list .student-item .name-wrap {
    font-size: 14px;
    margin-bottom: 20px;
  }
  .index-employment .employment-content .students-list .student-item .company {
    font-size: 16px;
  }
  .index-employment .employment-content .students-list .student-item .job {
    font-size: 13px;
    margin-bottom: 23px;
  }
  .index-employment .employment-content .students-list .student-item .study-course-num {
    height: 25px;
  }
  .index-employment .employment-content .students-list .student-item .study-course-num .num {
    font-size: 18px;
  }
  .index-employment .swiper-button-next {
    width: 38px;
    height: 38px;
    margin-top: -24px;
    background-size: 38px 38px;
  }
  .index-employment .swiper-button-prev {
    width: 38px;
    height: 38px;
    margin-top: -24px;
    background-size: 38px 38px;
  }
  .index-employment .employment-content .students-list .student-item.item1 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing1@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item2 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing2@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item3 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing3@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item4 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing4@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item5 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing5@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item6 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing6@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item7 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing7@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item8 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing8@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item9 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing9@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item10 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing10@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item11 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing11@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item12 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing12@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item13 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing13@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item14 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing14@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item15 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing15@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item16 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing16@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item17 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing17@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item18 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing18@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item19 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing19@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item20 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing20@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item21 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing21@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item22 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing22@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item23 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing23@2x.png'); }
  .index-employment .employment-content .students-list .student-item.item24 { background-image: url('/static-dist/app/img/2021/index-employment/M-beijing24@2x.png'); }
}
@media (max-width: 740px) {
  .index-employment .employment-content .students-list {
    max-width: 514px;
  }
}
@media (max-width: 370px) {
  .index-employment .employment-content .students-list {
    justify-content: space-between;
  }
  .index-employment .employment-content .students-list .student-item {
    width: 49%;
    background-size: 100% 100%;
    padding: 15px 8px;
    white-space: nowrap;
  }
  .index-employment .employment-content .students-list .student-item .study-course-num {
    padding: 0 6px;
  }
}
@media (max-width: 320px) {
  .index-employment .employment-content .students-list .student-item .name-wrap {
    font-size: 12px;
  }
  .index-employment .employment-content .students-list .student-item .company {
    font-size:14px
  }
  .index-employment .employment-content .students-list .student-item .job {
    font-size: 12px;
  }
  .index-employment .employment-content .students-list .student-item .study-course-num {
    font-size:10px;
  }
  .index-employment .employment-content .students-list .student-item .study-course-num .num {
    font-size:14px;
  }
}
/* 首页 学员就业 end */

/*导航栏*/

.es-header .nav.navbar-nav>li>a {
  padding: 20px 13px;
}

/* .navbar-form .form-group .form-control {
    background: url('/static-dist/app/img/2018/1.0/common/search_icon.png') no-repeat #F1F1F1 149px !important;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/common/search_icon.png') 1x, url('/static-dist/app/img/2018/1.0/common/search_icon@2x.png') 2x) !important;
} */

.navbar-form .form-group .form-control {
  border: 1px solid rgba(255, 255, 255, 0.5);
}

.headerIndex .es-icon-search:before {
  color: #c5c5c5;
}

.defaultIndex .es-icon-search:before {
  color: #8590a6;
}

.headerIndex .navbar-form .form-group .form-control {
  background: rgba(241, 241, 241, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.5);
}

.defaultIndex .navbar-form .form-group .form-control {
  background: #f3f4f8 !important;
  border: 0;
}

.navbar-form .form-group .form-control:hover {
  border: 1px solid #bababa;
}

.navbar-form .form-group .form-control:focus {
  background-color: #fff !important;
}

.navbar-form .form-control.active {
  border: 1px solid #005bac !important;
}

.user-nav {
  /*float: right;*/
  /*width: 83px;*/
}

.navbar-user .navbar-form {
  padding: 0 !important;
  margin: 0 !important;
}

/* 遮罩弹窗 */
.alert-over-box,
.alert-over-hours-box,
.alert-over-pdf-box,
.alert-over-ques-hours-box,
.alert-over-ques-box,
.interest-tag,
.limit-data-wrap,
.questionnaire-dialog {
  position: fixed;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1050;
  color: #3f4a54;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.limit-data-wrap.courserenew-modal-page {
  z-index: 1000;
}

.alert-over-box.hide,
.limit-data-wrap.hide {
  display: none;
}

.alert-box .closeover {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 8px;
  right: 16px;
  color: #95abff;
  cursor: pointer;
}

.alert-box .weixin {
  width: 180px;
  height: 180px;
  border: 1px solid #eeeeee;
  margin: 20px 0 16px;
}

.alert-over-box .alert-box {
  background: url(/static-dist/app/img/mobile/weixinqun_bj_pic@2x.png) no-repeat top #fff;
  background-size: 100% 190px;
  width: 418px;
  min-height: 279px;
  border-radius: 17px;
  top: 50%;
  position: relative;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  text-align: center;
  padding-top: 32px;
}

.alert-over-box .stepnormal {
  padding-bottom: 24px;
}

.alert-over-box .logo {
  background: url(/static-dist/app/img/shenlan19/shenlanxueyuan@2x.svg) no-repeat;
  width: 138px;
  height: 40px;
  margin: 0px auto;
}

.alert-over-box .tips {
  font-size: 12px;
  color: #999999;
}

.alert-over-box .tip-wechat_number {
  font-size: 15px;
  color: #3d464d;
  margin-top: 20px;
  margin-bottom: 8px;
}

.alert-over-box .tip-text {
  font-size: 15px;
  color: #3f4a54;
}

.alert-over-box .tip {
  font-size: 15px;
  color: #3f4a54;
  padding: 15px 10px 39px;
}

.alert-over-box #mssk {
  display: block;
  font-size: 12px;
  text-decoration: underline;
  color: #909eab;
}

.alert-over-box #mssk:hover {
  cursor: pointer;
}

.alert-over-pdf-box .modal-dialog {
  width: 300px;
  text-align: center;
  margin: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) !important;
}

.alert-over-pdf-box .modal-content {
  padding: 23px 0;
}

.alert-over-pdf-box .preview_icon {
  width: 17px;
  margin-right: 6px;
}

.alert-over-pdf-box .preview_txt {
  font-size: 16px;
  color: #31363f;
}

.alert-over-pdf-box .preview_add {
  font-size: 16px;
  color: #31363f;
  font-weight: bold;
  margin: 15px 0 11px;
}

.alert-over-pdf-box .preview_code {
  width: 120px;
  height: 120px;
  border: 1px solid #90b2cc;
}

.alert-over-pdf-box .preview_arrow {
  width: 12px;
}

.alert-over-pdf-box .preview_mark {
  font-size: 12px;
  color: #485159;
  font-weight: bold;
  margin-bottom: 40px;
}

.alert-over-pdf-box .preview_mark b {
  color: #0091ff;
}

.alert-over-pdf-box .close {
  position: absolute;
  top: 26px;
  right: 26px;
  width: 14px;
  opacity: 1;
}

@media (max-width: 768px) {
  .question-dialog {
    width: 335px !important;
  }

  .question-dialog .question-content {
    padding: 20px 20px !important;
  }

  .question-title {
    justify-content: flex-end !important;
  }

  .question-title .page-number {
    display: none;
  }

  .relevant-information {
    flex: 1 !important;
    margin: 0 0 0 15px !important;
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
    border-top-right-radius: 10px !important;
  }

  .relevant-information .relevant-content {
    width: unset !important;
    margin: unset !important;
    font-size: 14px;
    line-height: 20px;
    padding: 12px 14px;
  }

  .question-dialog .question-content .question-info .question-sections {
    display: none !important;
  }

  .go-back {
    display: none;
  }

  .intelligence {
    display: block !important;
    margin: 10px auto 10px !important;
  }

  .robot {
    width: 100%;
    left: 0 !important;
    transform: translate(0, 0) !important;
  }

  .robot .robot-img-pc {
    display: none;
  }

  .robot .robot-img-m {
    display: block;
    width: 100%;
  }
}

.question-dialog {
  width: 700px;
  background: #ffffff;
  border-radius: 8px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.question-dialog .question-content {
  padding: 26px 30px;
  position: relative;
}

.question-content .ques-loading {
  width: 100%;
  height: 100%;
  z-index: 999;
  background: #fff;
  position: absolute;
  left: 0;
  top: 0;
}

.question-content .ques-loading .loading-box {
  width: 100%;
  height: 100%;
  position: relative;
}

.question-content .ques-loading img {
  width: 140px;
  height: 100px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.question-dialog .question-content .question-title {
  display: flex;
  justify-content: space-between;
}

.question-dialog .question-content .question-title .close-question {
  width: 14px;
  height: 14px;
  cursor: pointer;
}

.question-dialog .question-content .question-info {
  margin-top: 20px;
  padding-bottom: 20px;
}

.question-dialog .question-content .question-info .relevant-info {
  display: flex;
}

.question-dialog .question-content .question-info .bg-image {
  width: 50px;
  height: 50px;
  background-image: url("/static-dist/app/img/robot1_pic.png");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}

.question-dialog .question-content .question-info .question-sections {
  margin-top: 24px;
  display: flex;
}

.relevant-information {
  flex: 0.9;
  background: #f5f8fa;
  border: 1px solid #eeeeee;
  margin: 12px 0 0 15px;
  font-family: PingFang-SC-Regular;
  font-size: 16px;
  color: #3d464d;
  font-weight: 400;
  line-height: 30px;
}

.relevant-content {
  width: 487px;
  display: block;
  margin: 12px 13px;
}

.question-dialog .question-content .question-info .question-sections .relevant-information {
  height: auto;
}

.section-item-box {
  display: flex;
  flex-wrap: wrap;
}

.sections-content {
  width: 487px;
  margin: 12px 13px;
}

.section-item {
  height: 44px;
  background: #ffffff;
  border: 1px solid #eeebeb;
  border-radius: 4px;
  text-align: center;
  line-height: 44px;
  margin: 14px 16px 0 0;
  padding: 0 10px;
  cursor: pointer;
}

.section-item:hover {
  border: 1px solid #0091ff !important;
  color: #0091ff !important;
}

.search-college {
  margin-top: 5px;
  width: 480px;
  height: 35px;
  background: #ffffff;
  border: 1px solid #eeebeb;
  border-radius: 4px;
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #cccccc;
  font-weight: 400;
  padding-left: 12px;
  outline: none;
}

.search-college[type="text"] {
  color: #3d464d;
}

/* .active {
    border: 1px solid #0091FF;
    color: #0091FF;
} */
.question-content .go-back,
.generate,
.intelligence {
  width: 130px;
  height: 40px;
  background: #ffffff;
  border: 1px solid #0091ff;
  border-radius: 20px;
  text-align: center;
  line-height: 40px;
  margin: 0 auto;
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  color: #0091ff;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
  cursor: pointer;
  margin-bottom: 10px;
}

.question-content .generate_box .gen_back {
  color: #b2b2b2;
  text-align: center;
  cursor: pointer;
}

.intelligence {
  display: none;
}

.recommended-courses {
  width: 700px;
  height: 404px;
  background: #ffffff;
  border-radius: 8px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.recommended-courses .question-content {
  padding: 26px 30px;
}

.recommended-courses .question-content .question-title {
  display: flex;
  justify-content: flex-end;
}

.recommended-courses .question-content .question-title .close-question {
  width: 14px;
  height: 14px;
  cursor: pointer;
}

.recommended-courses .course-title {
  font-family: MicrosoftYaHeiUI;
  font-size: 20px;
  color: #31363f;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
  margin: 0;
}

.recommended-courses .recommend-box {
  margin-top: 29px;
  display: flex;
  justify-content: space-between;
}

.recommended-courses .recommend-box .recommend-class {
  flex: 0.3;
  height: 200px;
  background: #ffffff;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
}

.recommended-courses .bg-recommend {
  height: 50%;
}

.recommended-courses .bg-recommend img {
  width: 100%;
  height: 100%;
}

.recommended-courses .recommend-content {
  padding: 10px 10px 10px 10px;
  position: relative;
}

.recommended-courses .recommend-content .recommend-info {
  margin: 0;
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  color: #3f4a54;
  letter-spacing: 0;
  font-weight: 400;
}

.recommended-courses .recommend-content .speaker {
  position: absolute;
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #bcbcbc;
  letter-spacing: 0;
  font-weight: 400;
  top: 70px;
}

.recommended-courses .receive {
  width: 130px;
  height: 40px;
  margin: 40px auto;
  background: #ffffff;
  border: 1px solid #0091ff;
  border-radius: 20px;
  text-align: center;
  line-height: 40px;
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  color: #0091ff;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
  cursor: pointer;
}

.robot {
  max-width: 1100px;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 999;
  cursor: pointer;
}

.robot .robot-img-pc {
  max-width: 1100px;
}

.robot-img-m {
  display: none;
}

/* 移动端 */

/* 7天到期提醒 */
.limit-data-wrap .data-content {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90vw;
  max-width: 400px;
  text-align: center;
  background: #fff;
  border-radius: 8px;
}

@media (max-width: 768px) {
  .M_question .M-question-dialog {
    width: 335px !important;
  }

  .M_question .M-question-dialog .M-question-content {
    padding: 20px 20px !important;
  }

  .M_question .M-relevant-information {
    margin: 0 0 0 15px !important;
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
    border-top-right-radius: 10px !important;
  }

  .M_question .M-relevant-information .M-relevant-content {
    width: unset !important;
    margin: unset !important;
    font-size: 14px;
    line-height: 20px;
    padding: 12px 14px;
  }

  .M_question .M-question-dialog .M-question-content .M-question-info .M-question-sections {
    display: none !important;
  }

  .M_question .M-intelligence {
    display: block !important;
    margin: 10px auto 30px !important;
  }
}

.M_question .M-question-title {
  display: flex;
  justify-content: flex-end;
  font-size: 14px;
  color: #6d7278;
  letter-spacing: 0;
  font-weight: 400;
  margin: 20px 20px 0 0;
}

.M_question .M-question-title .M-close-question {
  width: 14px;
  height: 14px;
  background: #cccccc;
}

.M_question .M-question-info {
  margin: 20px 0 0 20px;
  padding-bottom: 20px;
}

.M_question .M-question-info .M-relevant-info {
  display: flex;
}

.M_question .M-question-info .M-bg-image {
  width: 50px;
  height: 50px;
  background-image: url("./assets/images/robot1_pic.png");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
}

.M_question .M-question-info .M-question-sections {
  margin-top: 24px;
  display: flex;
}

.M_question .M-relevant-information {
  flex: 0.8;
  background: #f5f8fa;
  border: 1px solid #eeeeee;
  margin: 12px 0 0 15px;
  font-family: PingFang-SC-Regular;
  font-size: 16px;
  color: #3d464d;
  font-weight: 400;
  line-height: 30px;
}

.M_question .M-relevant-content {
  width: 487px;
  display: block;
  margin: 12px 13px;
}

.M_question .M_question-info .M-question-sections .M-relevant-information {
  height: auto;
}

.M_question .M-sections-content {
  margin: 12px 13px;
}

.M_question .M-section-item {
  width: 160px;
  height: 44px;
  background: #ffffff;
  border: 1px solid #eeebeb;
  border-radius: 4px;
  text-align: center;
  line-height: 44px;
  margin: 14px 16px 0 0;
}

.M_question .M-active {
  border: 1px solid #0091ff;
  color: #0091ff;
}

.M_question .M-go-back,
.M_question .M-intelligence {
  display: block;
  text-decoration: none;
  width: 130px;
  height: 40px;
  background: #ffffff;
  border: 1px solid #0091ff;
  border-radius: 20px;
  text-align: center;
  line-height: 40px;
  margin: 39px auto 0;
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  color: #0091ff;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
  cursor: pointer;
}

.M_question .M-intelligence {
  display: none;
}

.M_question .M-sections-content .M-search-college {
  margin-top: 10px;
  width: 196px;
  height: 64px;
  background: #ffffff;
  border: 1px solid #eeebeb;
  border-radius: 4px;
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #cccccc;
  font-weight: 400;
}

.M_question .M-golast {
  margin-top: 20px;
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #b2b2b2;
  letter-spacing: 0;
  text-align: center;
  font-weight: 400;
}

/* 与续费提醒，公用关闭按钮样式 */
.limit-data-wrap .content-close {
  display: inline-block;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 34px;
  height: 34px;
  background: url("../img/shenlan19/guanbi_icon@2x.png") 10px 10px no-repeat;
  background-size: 14px 14px;
}

.limit-data-wrap .data-content .text {
  font-size: 20px;
  color: #2f3c52;
  padding: 64px 0 46px;
}

.limit-data-wrap .data-content .btn-boxs {
  padding: 0 0 30px;
}

.fixed-pay-container {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

@media (max-width: 650px) {
  .fixed-pay-container {
    display: block;
    padding: 0 10px 0 20px;
  }

  .fixed-pay-container .pay-rmb-box {
    float: left;
    line-height: 60px;
  }

  .play-block {
    float: right;
  }

  .fixed-pay-container #order-create-btn {
    margin-right: 0;
  }

  .displayhidden {
    margin-left: 10px;
  }
}

@media (max-width: 450px) {
  .fixed-pay-container {
    padding: 0 5px 0 10px;
  }

  .order-pay .pay-rmb.pay-rmb-big {
    font-size: 16px !important;
  }

  .play-block .btn {
    padding: 6px;
  }

  .fixed-pay-container #order-create-btn {
    width: 120px;
  }
}

/* 课程到期续费 */
.limit-data-wrap .course-modal-content {
  position: relative;
  background-color: #fff;
  display: inline-block;
  border-radius: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* text-align: center;
    max-width: 90vw;
    min-width: 630px; */
  width: 630px;
  padding: 20px;
}

.limit-data-wrap .course-modal-content .title {
  font-family: MicrosoftYaHeiUI-Bold;
  font-size: 16px;
  color: #333333;
  letter-spacing: 0;
  text-align: justify;
  font-weight: 700;
  text-indent: 8px;
  border-left: 4px solid #005bac;
}

@font-face {
  font-family: "iconfont";
  /* Project id 3774358 */
  src: url("//at.alicdn.com/t/c/font_3774358_aae6kfdpeii.woff2?t=1671430773285") format("woff2"),
    url("//at.alicdn.com/t/c/font_3774358_aae6kfdpeii.woff?t=1671430773285") format("woff"),
    url("//at.alicdn.com/t/c/font_3774358_aae6kfdpeii.ttf?t=1671430773285") format("truetype");
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon2-wenxintishi:before {
  content: "\e62e";
}

.icon2-naozhong1:before {
  content: "\e60c";
}

.icon-alarm_clock:before {
  content: "\e64b";
}

.icon-shijian:before {
  content: "\e619";
}

.icon-naozhong:before {
  content: "\e653";
}

.icon-shanchu:before {
  content: "\e603";
}

.icon-jiahao:before {
  content: "\e602";
}

.limit-data-wrap .course-modal-content .content {
  padding: 16px 0 20px 0;
  border-bottom: 1px solid #e9eef3;
}

.limit-data-wrap .course-modal-content .content .m-renew-set {
  display: none;
}

.limit-data-wrap .course-modal-content .pic {
  width: 200px;
  height: 114px;
  display: inline-block;
  vertical-align: middle;
}

.limit-data-wrap .course-modal-content .pic img {
  width: 100%;
  height: 100%;
}

.limit-data-wrap .course-modal-content .info {
  display: inline-block;
  vertical-align: middle;
  margin-left: 16px;
  width: calc(100% - 16px - 205px);
}

.limit-data-wrap .course-modal-content .info .name {
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-bottom: 20px;
  font-size: 16px;
}

.limit-data-wrap .course-modal-content .renew-day-label {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #213249;
  letter-spacing: 0;
  font-weight: 400;
}

.limit-data-wrap .course-modal-content .js-example-disabled-results {
  width: 103px;
  height: 30px;
  background: #f8f8f8;
  border: 1px solid rgba(225, 225, 225, 1);
  border-radius: 4px;
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #666666;
  /* text-indent: 12px; */
}

.limit-data-wrap .course-modal-content .js-example-disabled-results option {
  text-align: center;
}

.renew-error-text {
  color: #f56c6c;
  font-size: 12px;
  line-height: 1;
  display: none;
  margin-top: 4px;
}

.limit-data-wrap .course-modal-content .info .renew-set__select .renew-set-expiration-time {
  vertical-align: middle;
}

.limit-data-wrap .course-modal-content .info .renew-set__select .renew-day-label,
.limit-data-wrap .course-modal-content .info .renew-set__select .form-input {
  display: inline-block;
  vertical-align: middle;
}

.limit-data-wrap .course-modal-content .info .renew-set-expiration-time {
  border: 1px solid rgba(225, 225, 225, 1);
  border-radius: 4px;
  display: none;
  width: 68px;
  height: 30px;
}

.limit-data-wrap .course-modal-content .renew-set-expiration-time input {
  width: 46px;
  font-size: 12px;
  color: #666;
  height: 100%;
  border-radius: 4px;
  text-indent: 2px;
}

.limit-data-wrap .course-modal-content .renew-set-expiration-time .unit {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #666666;
}

.limit-data-wrap .course-modal-content .renew-set__tips {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #213249;
  letter-spacing: 0;
  font-weight: 400;
  margin-top: 10px;
}

.limit-data-wrap .course-modal-content .renew-set__tips span {
  color: #e83e2b;
}

.limit-data-wrap .course-modal-content .m-renew-set {
  display: none;
}

.limit-data-wrap .course-modal-content .renew-tips-list .renew-tips-head {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #666666;
  letter-spacing: 0;
  text-align: justify;
  line-height: 15px;
  font-weight: 400;
}

.limit-data-wrap .course-modal-content .renew-tips-list .renew-tips-head .iconfont {
  color: #666;
  display: inline-block;
  vertical-align: middle;
}

.limit-data-wrap .course-modal-content .renew-tips-list .renew-tips-head span {
  display: inline-block;
  vertical-align: middle;
}

.limit-data-wrap .course-modal-content .renew-tips-list {
  margin-top: 12px;
}

.limit-data-wrap .course-modal-content .renew-tips-list .renew-tips-item {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #bbbbbb;
  letter-spacing: 0;
  text-align: justify;
  line-height: 15px;
  font-weight: 400;
  margin-top: 4px;
}

.limit-data-wrap .course-modal-content .renew-footer {
  /* display: flex; */
  text-align: right;
  /* justify-content: end; */
  margin-top: 20px;
  /* align-items: center; */
}

.limit-data-wrap .course-modal-content .renew-footer-price {
  font-family: MicrosoftYaHeiUI;
  font-size: 18px;
  color: #e83e2b;
  letter-spacing: 0;
  font-weight: 400;
  margin-right: 10px;
  vertical-align: middle;
  display: inline-block;
}

.limit-data-wrap .course-modal-content .renew-footer-price span:first-child {
  font-size: 12px;
}

.limit-data-wrap .course-modal-content .btn-renew {
  width: 90px;
  height: 36px;
  text-align: center;
  line-height: 36px;
  background: #198ce6;
  cursor: pointer;
  border-radius: 4px;
  font-family: PingFang-SC-Bold;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  font-weight: 700;
  display: inline-block;
  vertical-align: middle;
}

.limit-data-wrap .course-modal-content .btn-renew.disabled {
  background: #a0cfff;
}

/* 公众号扫码成功 */
.wechatSetting-box .success-wechatimg {
  width: 45px;
  height: 76px;
  display: inline-block;
  margin-bottom: 18px;
  background: url(/static-dist/app/img/shenlan2020/success_icon@2x.png) no-repeat;
  background-size: 100% 100%;
}

.wechatSetting-box .wechat-text {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 62px;
}

/* 自定义续费老版css */
.limit-data-wrap .course-modal-content2 {
  position: relative;
  background-color: #fff;
  display: inline-block;
  border-radius: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  max-width: 90vw;
  min-width: 364px;
}

.limit-data-wrap .limit-data-wrap .course-modal-content2 .content-close {
  display: inline-block;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 34px;
  height: 34px;
  background: url(../img/shenlan19/guanbi_icon@2x.png) 10px 10px no-repeat;
  background-size: 14px 14px;
}

.limit-data-wrap .course-modal-content2 .title {
  font-size: 24px;
  color: #2f3c52;
  font-weight: bold;
  padding: 40px 0 10px;
}

.limit-data-wrap .course-modal-content2 .subtitle {
  font-size: 14px;
  color: #909eab;
  text-align: left;
  padding-left: 30px;
}

.limit-data-wrap .course-modal-content2 .day-list {
  display: flex;
  justify-content: space-between;
  padding: 30px 0 40px 30px;
}

.limit-data-wrap .course-modal-content2 .item.active {
  border-color: #0091ff;
}

.limit-data-wrap .course-modal-content2 .item.active:after {
  content: "";
  width: 44px;
  height: 44px;
  background: url(../img/shenlan2020/xuanzhong01_icon@2x.png) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  bottom: -1px;
  right: 0;
}

.limit-data-wrap .course-modal-content2 .item {
  position: relative;
  width: 200px;
  height: 200px;
  cursor: pointer;
  float: left;
  background: #ffffff;
  border: 1px solid #dfe9f2;
  border-radius: 10px;
  margin-right: 30px;
}

.limit-data-wrap .course-modal-content2 .daynum {
  background-image: linear-gradient(180deg, #45afff 0%, #2e87f5 100%);
  border-radius: 10px 10px 0 0;
  font-size: 22px;
  color: #ffffff;
  height: 80px;
  line-height: 80px;
  font-weight: bold;
}

.limit-data-wrap .course-modal-content2 .daynum strong {
  font-size: 40px;
}

.limit-data-wrap .course-modal-content2 .money {
  display: inline-block;
  font-size: 24px;
  color: #2f3c52;
  margin-top: 46px;
}

.limit-data-wrap .course-modal-content2 .money.sale {
  position: relative;
}

.limit-data-wrap .course-modal-content2 .money.sale:before {
  content: "优惠价";
  position: absolute;
  top: -30px;
  left: 0;
  background-image: linear-gradient(-45deg, #ff8082 0%, #eb494b 100%);
  color: #fff;
  padding: 0px 6px;
  border-radius: 10px 4px 10px 4px;
  font-size: 12px;
}

.limit-data-wrap .course-modal-content2 .money strong {
  font-size: 34px;
  min-width: 60px;
  display: inline-block;
  text-align: left;
}

.limit-data-wrap .course-modal-content2 .original-money {
  font-size: 14px;
  padding-top: 10px;
  color: #c0cad3;
}

.limit-data-wrap .course-modal-content2 .btn-renew {
  background: #2e88f2;
  box-shadow: 0 8px 14px 0 rgb(0 102 222 / 20%);
  border-radius: 25px;
  font-size: 16px;
  display: inline-block;
  color: #fff;
  padding: 11px 61px 12px 62px;
  font-weight: bold;
  margin-bottom: 30px;
}

/* 自定义续费老版css */
/* 公开课预约提醒弹窗样式 */
.openCourse-box .opencourse-text {
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
}

.openCourse-box .success-icon {
  width: 70px;
  height: 70px;
  display: inline-block;
  background: url(/static-dist/app/img/shenlan2020/yuyuechenggong_icon@2x.png) no-repeat;
  background-size: 100% 100%;
}

.openCourse-box .sub-text {
  font-size: 12px;
  color: #ffffff;
  margin-top: 10px;
}

.openCourse-box .text-count {
  margin-top: 60px;
  padding-bottom: 29px;
}

.openCourse-box .weixinOpen {
  width: 119px;
  height: 119px;
  border: 1px solid #eee;
}

.openCourse-box .stepOpenunbind .tip-text {
  font-size: 12px;
  color: #999999;
  text-align: center;
  line-height: 20px;
  padding: 10px 59px 20px;
}

/* 兴趣标签 */
.value-tag {
  font-size: 12px;
  color: #6092cb;
  padding: 4px;
  background: #ebf4ff;
  border-radius: 4px;
}

.interest-tag.toShow,
.success-tag.toShow {
  display: none;
}

.interest-tag-content {
  position: absolute;
  background: #ffffff;
  border-radius: 20px;
  width: 600px;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
}

.interest-tag-content.interest-wrap {
  position: static;
  margin: 0px auto !important;
  background: #fff;
  transform: none;
  -webkit-transform: none;
}

.interest-tag-content .header {
  position: relative;
  background: url(/static-dist/app/img/shenlan2020/xingqu_bj_pic@2x.png) no-repeat;
  height: 110px;
  background-size: 100% 100%;
  font-size: 24px;
  padding-left: 36px;
  padding-top: 41px;
  color: #ffffff;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0, 91, 172, 0.5);
}

.choose-interest-tag {
  padding: 40px 40px 22px;
}

.interest-taglist .item-tag-box {
  position: relative;
  display: inline-block;
  margin-right: 18px;
}

.interest-taglist .item-tag-box input {
  opacity: 0;
  position: absolute;
  width: 158px;
  height: 42px;
  margin-top: 0;
  cursor: pointer;
}

.choose-interest-tag .interest-taglist .text-tag,
.choose-interest-tag .footer .submit-tag {
  width: 158px;
  height: 42px;
  line-height: 42px;
  display: inline-block;
  background: #ffffff;
  border: 1px solid #a7b2c3;
  border-radius: 25px;
  font-size: 16px;
  color: #728198;
  text-align: center;
  margin-bottom: 20px;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 6px;
}

.choose-interest-tag .interest-taglist .item-tag-box:nth-of-type(3n) {
  margin-right: 0px;
}

.interest-taglist .item-tag-box:hover .text-tag,
.choose-interest-tag .footer .submit-tag {
  background: #f1f9ff;
  border: 1px solid #badeff;
  color: #005bac;
}

.interest-taglist .item-tag-box.active .text-tag {
  background: #2e88f2;
  box-shadow: 0 8px 14px 0 rgba(0, 102, 222, 0.2);
  color: #ffffff;
  border-color: #2e88f2;
}

.choose-interest-tag .footer .submit-tag {
  margin: 30px auto 10px;
}

.choose-interest-tag .footer .jump-tag {
  font-size: 14px;
  color: #bababa;
}

/* success-tag */
.success-tag .success-tagimg {
  display: block;
  width: 184px;
  height: 110px;
  background: url(/static-dist/app/img/shenlan2020/tijiaowancheng_pic@2x.png);
  background-size: 100% 100%;
  margin: 52px auto 12px;
}

.success-tag .text-tip {
  font-size: 15px;
  color: #909eab;
  padding-bottom: 35px;
}

.success-tag .text-count,
.success-tag .go-url {
  font-size: 14px;
  color: #909eab;
  margin-bottom: 60px;
}

.c0091FF {
  color: #0091ff;
}

@media (max-width: 700px) {
  .alert-over-box .alert-box {
    width: 314px;
  }

  .alert-over-box .tip,
  .openCourse-box .stepOpenunbind .tip-text {
    padding: 10px 26px;
  }

  .alert-box .weixin {
    width: 160px;
    height: 160px;
    margin-top: 12px;
  }

  .interest-tag-content {
    width: 320px;
  }

  .choose-interest-tag {
    padding: 30px 13px 20px;
  }

  .choose-interest-tag .interest-taglist .text-tag,
  .choose-interest-tag .footer .submit-tag {
    width: 130px;
    height: 32px;
    line-height: 32px;
    margin-bottom: 15px;
  }

  .choose-interest-tag .footer .submit-tag {
    margin-top: 10px;
  }

  .choose-interest-tag .interest-taglist .item-tag-box:nth-of-type(3n) {
    margin-right: 18px;
  }

  .choose-interest-tag .interest-taglist .item-tag-box:nth-of-type(2n) {
    margin-right: 0px;
  }

  .interest-taglist .item-tag-box input {
    width: 130px;
    height: 32px;
  }
}

/* 绑定成功 */
.login-main .bind-success {
  text-align: center;
  font-size: 13px;
  color: #bababa;
}

.login-main .bind-success .success-tip-img {
  background: url(/static-dist/app/img/mobile/bangdingchenggong_icon@2x.png) no-repeat top #fff;
  background-size: 100% 100%;
  width: 140px;
  height: 140px;
  display: inline-block;
}

.login-main .bind-success .bind-result {
  font-size: 18px;
  color: #3f4a54;
  padding: 30px 0 20px;
}

.login-main .bind-success .js-countdown {
  color: #0091ff;
}

.login-main .bind-success .go-url {
  color: #0091ff;
  text-decoration: underline !important;
}

/*登陆注册*/
#login-form .login_username_icon,
#login-form-pwd .login_username_icon {
  position: absolute;
  display: inline-block;
  width: 30px;
  height: 32px;
  background: url(/static-dist/app/img/2018/1.0/login_register/user_icon.png) no-repeat 12px 12px !important;
}

/* 9.2原有样式 */
/* #login-form .login_password_icon,
#login-form  .sms-code_icon,
#bind-mobile-form .sms-code_icon, #login-form-pwd .login_password_icon{
    position: absolute;
    display: inline-block;
    width: 30px;
    height: 32px;
    background: url('/static-dist/app/img/2018/1.0/login_register/password_icon.png') no-repeat 12px 12px !important;
} */
/* 9.2原有样式end */
/* 9.2修改样式 */
#login-form .login_password_icon,
#bind-mobile-form #login-form-pwd .login_password_icon {
  position: absolute;
  display: inline-block;
  width: 30px;
  height: 32px;
  background: url("/static-dist/app/img/2018/1.0/login_register/password_icon.png") no-repeat 12px 12px !important;
}

/* 账号密码的密码没有icon的添加 */
#login-form-pwd .login_password_icon {
  position: absolute;
  display: inline-block;
  width: 30px;
  height: 32px;
  background: url("/static-dist/app/img/2018/1.0/login_register/password_icon@2x.png") no-repeat 12px 12px !important;
  background-size: 14px 17px !important;
}

#login-form .sms-code_icon,
#bind-mobile-form .sms-code_icon {
  position: absolute;
  display: inline-block;
  width: 30px;
  height: 32px;
  background: url("/static-dist/app/img/2018/1.0/login_register/securitycode_icon.png") no-repeat 12px 12px !important;
}

/* 9.2修改样式end */
#login-form .form-control {
  padding-left: 37px;
  padding-right: 40px;
}

#login-form input[name="_remember_me"],
#user_terms,
#login-form-pwd input[name="_remember_me"] {
  display: none;
}

#login-form input[name="_remember_me"]+label,
#user_terms+label,
#login-form-pwd input[name="_remember_me"]+label {
  cursor: pointer;
  font-size: 1em;
  display: inline;
  padding: 6px;
  margin-right: 2px;
  background: url("/static-dist/app/img/2018/1.0/login_register/unchecked_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/login_register/unchecked_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/login_register/unchecked_icon@2x.png") 2x);
}

#login-form input[name="_remember_me"]:checked+label,
#user_terms:checked+label,
#login-form-pwd input[name="_remember_me"]:checked+label {
  background: url("/static-dist/app/img/2018/1.0/login_register/checked_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/login_register/checked_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/login_register/checked_icon@2x.png") 2x);
}

#login-form .password-reset a {
  color: #979797 !important;
}

#register_emailOrMobile,
#register_nickname {
  background: url("/static-dist/app/img/2018/1.0/login_register/user_icon.png") no-repeat 12px !important;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/login_register/user_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/login_register/user_icon@2x.png") 2x) !important;
}

#register_password {
  background: url("/static-dist/app/img/2018/1.0/login_register/password_icon.png") no-repeat 12px !important;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/login_register/password_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/login_register/password_icon@2x.png") 2x) !important;
}

#register_securitycode {
  background: url("/static-dist/app/img/2018/1.0/login_register/securitycode_icon.png") no-repeat 12px !important;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/login_register/securitycode_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/login_register/securitycode_icon@2x.png") 2x) !important;
}

.login-main .form-control {
  padding-left: 37px;
}

.login-main .controls {
  position: relative;
}

.login-main .controls .pre-tel-box {
  width: 86px;
  position: absolute;
  left: 32px;
  top: 3px;
  height: 30px;
}

.login-main .controls .no-password {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 13px;
  color: #005bac;
  line-height: 40px;
  padding: 0 10px;
  border: 0px !important;
}

.login-main .securitycode {
  width: 130px;
  height: 36px;
  position: absolute;
  top: 2px;
  right: 3px;
  background-color: #000;
}

/*大咖老师*/

.teacher-list.row .metas {
  width: 90%;
  margin-left: -5px;
}

/*app下载*/

.appdownload-wrapper {
  width: 1080px;
  margin: 0 auto;
  position: relative;
  height: 550px;
  margin-bottom: 90px;
}

.appdownload-content {
  position: absolute;
  width: 1920px;
  /*height: 418px;*/
  padding-top: 132px;
  left: 50%;
  transform: translateX(-50%);
  background: url("/static-dist/app/img/2018/1.0/download_app/appdownload_bg.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/appdownload_bg.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/appdownload_bg@2x.png") 2x);
}

.appdownload-content .summary .graph {
  width: 110px;
  height: 110px;
  background: url("/static-dist/app/img/2018/1.0/download_app/logo.png") no-repeat !important;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/logo.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/logo@2x.png") 2x) !important;
  background-size: 100% 100%;
  float: left;
}

.appdownload-content .summary .content {
  float: left;
  margin-left: 20px;
  color: #3f4a54;
  margin-top: 12px;
}

.appdownload-content .summary .content .title {
  font-size: 36px;
  line-height: 50px;
}

.appdownload-content .summary .content .subtitle {
  font-size: 18px;
  line-height: 25px;
}

.appdownload-content .download {
  margin-top: 66px;
}

.appdownload-content .download .download-btn {
  float: left;
}

.appdownload-content .download .qrcode {
  float: left;
  margin-left: 20px;
}

.appdownload-content .download button {
  display: block;
  width: 216px;
  height: 60px;
  border: 1px solid #005bac;
  border-radius: 10px;
  font-size: 18px;
  color: #005bac;
  /*transition: .1s background linear, .1s color linear;*/
}

.appdownload-content .download button:nth-of-type(1) {
  background: url("/static-dist/app/img/2018/1.0/download_app/apple_icon.png") no-repeat #fff 27px;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/apple_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/apple_icon@2x.png") 2x);
  padding-left: 38px;
}

.appdownload-content .download button:nth-of-type(1):hover {
  background: url("/static-dist/app/img/2018/1.0/download_app/apple_hover_icon.png") no-repeat #005bac 27px;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/apple_hover_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/apple_hover_icon@2x.png") 2x);
  color: #fff;
}

.appdownload-content .download button:nth-of-type(2) {
  background: url("/static-dist/app/img/2018/1.0/download_app/android_icon.png") no-repeat #fff 27px;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/android_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/android_icon@2x.png") 2x);
  margin-top: 20px;
  padding-left: 19px;
}

.appdownload-content .download button:nth-of-type(2):hover {
  background: url("/static-dist/app/img/2018/1.0/download_app/android_hover_icon.png") no-repeat #005bac 27px;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/android_hover_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/android_hover_icon@2x.png") 2x);
  color: #fff;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

.clearfix {
  zoom: 1;
}

.appdownload-content .download .qrcode .graph {
  width: 120px;
  height: 120px;
  border: 1px solid #979797;
  background: url("/static-dist/app/img/2018/1.0/download_app/qrcode.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_app/qrcode.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_app/qrcode.png") 2x);
  background-size: 100% 100%;
}

.appdownload-content .download .qrcode .text {
  font-size: 12px;
  color: #3f4a54;
  text-align: center;
  margin-top: 3px;
}

/*公开课*/

.publicclass-wrapper {
  width: 1080px;
  margin: 0 auto;
}

.publicclass-wrapper li {
  list-style: none;
}

.current-class {
  height: 265px;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  margin-top: 3px;
  background-color: #fff;
  padding: 20px;
}

.current-class img {
  float: left;
  width: 400px;
  height: 225px;
}

.current-class .content {
  width: 600px;
  float: left;
}

.current-class .title {
  margin-left: 20px;
  font-size: 24px;
  color: #424242;
  margin-top: 10px;
  max-width: 580px;
  line-height: 27px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}

.current-class .content .es-qrcode {
  position: absolute !important;
  right: -30px !important;
}

.current-class .title .es-icon:before {
  content: "\E615";
}

.current-class .text {
  font-size: 0;
  margin-top: 20px;
  padding-bottom: 14px;
  background-color: #fafafa;
  padding-left: 20px;
  width: 658px;
}

.current-class .text li {
  margin-top: 14px;
  padding-left: 14px;
  line-height: 14px;
}

.current-class .key {
  font-size: 12px;
  width: 81px;
  color: #999999;
  display: inline-block;
}

.current-class .key li:nth-child(1) {
  background: url("/static-dist/app/img/2018/1.0/public_class/validity_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/validity_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/validity_icon@2x.png") 2x);
}

.current-class .key li:nth-child(2) {
  background: url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/number_icon@2x.png") 2x);
}

.current-class .key li:nth-child(3) {
  background: url("/static-dist/app/img/2018/1.0/public_class/duration_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/duration_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/duration_icon@2x.png") 2x);
}

.current-class .value {
  font-size: 12px;
  display: inline-block;
  color: #3f4a54;
  padding: 0;
  margin: 0;
}

.current-class .price-key {
  width: 95px;
  float: left;
  font-size: 12px;
  color: #999999;
  margin-top: 46px;
  line-height: 14px;
  margin-left: 20px;
}

.current-class .price-value {
  float: left;
  font-size: 20px;
  color: #22bfa7;
  margin-top: 36px;
  line-height: 28px;
}

.current-class .price .study {
  font-size: 14px;
  color: #ffffff;
  background-color: #005bac;
  border-radius: 4px;
  float: right;
  width: 128px;
  height: 40px;
  margin-top: 30px;
  line-height: 40px;
  text-align: center;
}

@media (max-width: 768px) {
  .limit-data-wrap .course-modal-content .pic img {
    border-radius: 8px;
  }

  .current-class {
    width: 100% !important;
    margin: 0 auto;
    padding: 20px 0;
  }

  .current-class .content {
    width: 100% !important;
  }

  .current-class .content .text {
    width: 100% !important;
    background-color: #fafafa;
  }

  .current-class img {
    display: block;
    width: 90%;
    height: auto !important;
    margin: 0 auto;
  }

  .current-class img,
  .current-class .content {
    float: none;
  }

  .current-class {
    height: auto;
  }

  .current-class .price {
    position: relative;
  }

  .current-class .price .study {
    position: absolute;
    bottom: 0;
    right: 20px;
    width: 96px;
    height: 30px;
    line-height: 30px;
    /*margin-top: 40px*/
  }

  .public-class-title {
    display: none !important;
  }

  .new-tabs-wrapper {
    width: 100% !important;
    margin: 0px 0 0 0 !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
  }

  .tabs-wrapper .tabs-group {
    height: 46px;
    border-top: 1px solid #e9eef3;
    border-bottom: 1px solid #e9eef3;
    padding: 0;
    margin: 0;
  }

  .tabs-wrapper .tabs-group .title {
    clear: both !important;
    padding: 0 !important;
    display: none !important;
  }

  .tabs-wrapper .tabs-group .content {
    display: flex;
    flex: 1;
    height: 44px;
    align-items: center;
    white-space: nowrap;
    overflow-x: scroll;
    background-color: #fff;
    margin: 0 !important;
  }

  .tabs-wrapper .tabs-group .content>li {
    padding: 0 7px !important;
  }

  .tabs-wrapper .tabs-group .content>li.active {
    background-color: #ffffff;
  }

  .limit-data-wrap .course-modal-content .pic {
    width: 140px;
    height: 80px;
  }

  /* 课程到期续费移动 */
  .limit-data-wrap .course-modal-content {
    width: 335px;
  }

  .pc-renew-set {
    display: none;
  }

  .limit-data-wrap .course-modal-content .content .m-renew-set {
    display: block;
  }

  .limit-data-wrap .course-modal-content .js-example-disabled-results {
    width: 140px;
    height: 40px;
    margin-left: 8px;
  }

  .m-renew-set .m-renew-set__content {
    margin-top: 16px;
  }

  .renew-day-label__content {
    margin: 16px 0 4px 0;
    display: none;
  }

  .renew-anyday-label {
    display: inline-block;
    vertical-align: middle;
    font-family: MicrosoftYaHeiUI;
    font-size: 12px;
    color: #213249;
    letter-spacing: 0;
    font-weight: 400;
  }

  .m-renew-set .renew-set-expiration-time {
    /* display: inline-block; */
    position: relative;
    vertical-align: middle;
  }

  .limit-data-wrap .course-modal-content .renew-set-expiration-time input {
    background: #ffffff;
    border-radius: 4px;
    width: 120px;
    height: 40px;
    border: 1px solid rgba(225, 225, 225, 1);
    padding-right: 30px;
    margin-left: 8px;
    text-indent: 10px;
  }

  .m-renew-set .renew-set-expiration-time .unit {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 12px;
  }

  .limit-data-wrap .course-modal-content .info {
    margin-left: 7px;
    width: calc(100% - 144px - 15px);
  }

  .limit-data-wrap .course-modal-content .info .name {
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    white-space: normal;
    margin-bottom: 0;
  }

  .limit-data-wrap .course-modal-content2 {
    min-width: 90vw;
  }

  .limit-data-wrap .course-modal-content2 .title {
    font-size: 20px;
    padding: 20px 0 10px;
  }

  .limit-data-wrap .course-modal-content2 .subtitle {
    font-size: 12px;
  }

  .limit-data-wrap .course-modal-content2 .day-list {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding: 20px 0 10px 30px;
  }

  .limit-data-wrap .course-modal-content2 .item {
    margin-bottom: 20px;
    width: 70vw;
    height: 66px;
  }

  .limit-data-wrap .course-modal-content2 .item.active {
    border-color: #0091ff;
  }

  .limit-data-wrap .course-modal-content2 .item.active:after {
    width: 35px;
    height: 35px;
    right: -1px;
  }

  .limit-data-wrap .course-modal-content2 .daynum {
    border-radius: 4px 0 0 9px;
    font-size: 12px;
    height: 66px;
    line-height: 66px;
    float: left;
    width: 80px;
  }

  .limit-data-wrap .course-modal-content2 .daynum strong {
    font-size: 28px;
  }

  .limit-data-wrap .course-modal-content2 .money {
    font-size: 18px;
    margin-top: 18px;
  }

  .limit-data-wrap .course-modal-content2 .money.sale {
    position: static;
  }

  .limit-data-wrap .course-modal-content2 .money.sale:before {
    width: 50px;
    top: 0;
    left: calc(100% - 50px);
    border-radius: 0 4px 0 4px;
  }

  .limit-data-wrap .course-modal-content2 .money strong {
    font-size: 26px;
    font-weight: normal;
  }

  .limit-data-wrap .course-modal-content2 .original-money {
    font-size: 12px;
    /* padding-top: 0; */
    margin-top: -13px;
  }
}

/*@media (max-width: 768px) {
.current-class img,
.current-class .content {
float: none;
}
.current-class {
height: auto;
}
}*/
/* 公开课列表页 */

.pre-public-class-title {
  margin: 60px auto 0;
}

.public-class-title {
  background-image: url("/static-dist/app/img/shenlan19/public-title-bg2.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 200px;
  line-height: 200px;
  font-size: 40px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 2px 4px rgba(28, 31, 33, 0.2);
}

.pre-public-class .tabs-wrapper {
  font-size: 14px;
  /* margin-top: 52px; */
}

.pre-public-class .tabs-wrapper a {
  text-decoration: none;
}

ul,
li,
div,
body,
h1,
h2,
h3,
button,
span,
input,
section,
p,
dl,
dt,
dd,
header,
section {
  margin: 0;
  padding: 0;
}

h2 {
  font-weight: normal;
}

body,
html {
  overflow-x: hidden;
}

button {
  outline: none;
  border: none;
  cursor: pointer;
}

li {
  list-style: none;
}

a {
  text-decoration: none !important;
}

a,
input {
  outline: none;
  border: none;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

.clearfix {
  zoom: 1;
}

@media (min-width: 992px) {
  .public-class .course-box {
    width: 1100px;
    margin: 0 auto;
  }
}

.public-class .course-list {
  list-style: none;
  border-radius: 5px;
  margin-top: 20px;
}

.public-class .course-list img {
  max-width: 100%;
  height: auto;
  border-radius: 5px 5px 0 0;
  display: block;
}

.public-class .course-list .course-info {
  height: 95px;
  width: 100%;
  background-color: #fff;
  overflow: hidden;
  padding: 12px;
}

.public-class .course-list .course-info .title {
  width: 231px;
  font-size: 14px;
  line-height: 20px;
}

.public-class .course-list .course-info .title a {
  color: #4a4a4a;
}

.public-class .course-list .course-info .title:hover a {
  color: #005bac;
  text-decoration: none;
}

.public-class .course-list .course-info .number {
  font-size: 12px;
  color: #979797;
  margin-top: 12px;
}

.public-class .course-list .course-info .price {
  font-size: 14px;
  color: #e83d2c;
  margin-top: 11px;
  float: right;
}

.public-class .course-list {
  transition: all 0.3s ease;
}

.public-class .course-list:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -webkit-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  -moz-box-shadow: 0 26px 40px -24px rgba(0, 36, 100, 0.3);
  transition: all 0.3s ease;
}

.public-class .pagination {
  width: 186px;
  margin: 30px auto 0;
  display: block;
  padding-bottom: 100px;
}

.public-class .pagination button {
  background: #f7f7f7;
  border: 1px solid #dcdcdc;
  border-radius: 4px;
  height: 32px;
  color: #666666;
}

.public-class .pagination button:hover {
  background: #005bac;
  color: #fff;
}

.public-class .pagination button:nth-of-type(1),
.public-class .pagination button:nth-of-type(2) {
  width: 32px;
}

.public-class .pagination button:nth-of-type(3) {
  width: 50px;
}

.public-class .pagination button:nth-of-type(4) {
  width: 60px;
}

/*系列详情页 右侧班主任*/

#class-teacher-column {
  padding: 0 20px 30px 20px !important;
}

#class-teacher-column .teacher-title {
  font-size: 13px;
  color: #333333;
  margin-top: -10px;
}

#class-teacher-column .teacher-description {
  font-size: 12px;
  color: #666666;
  margin-top: 6px;
  line-height: 17px;
}

.about-course-heading {
  margin: 0 20px 0 20px;
}

.about-course-body {
  padding: 0 0 10px 0 !important;
  position: relative;
}

#about-course-content::-webkit-scrollbar {
  display: none;
}

#about-course-content {
  max-height: 431px;
  overflow-y: auto;
  padding: 14px 20px 0 20px;
  text-align: justify;
}

#about-course-content p {
  margin: 0 !important;
}

.about-course-body .scrollbar {
  width: 6px;
  height: 425px;
  position: absolute;
  right: 10px;
  top: 65px;
  background-color: #eeeeee;
  border-radius: 4px;
}

.about-course-body .scrollbar .bar {
  width: 100%;
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #cccccc;
  border-radius: 4px;
}

.recommend-course-content {
  padding: 0 20px !important;
}

.recommend-course-body {
  padding: 0 0 20px 0 !important;
}

.recommend-course-body img {
  float: left;
  border-radius: 4px;
  width: 96px;
  height: 54px;
}

.recommend-course-body li {
  margin-top: 14px;
}

.recommend-course-body .content {
  float: left;
  margin-left: 6px;
  width: 52%;
}

@media (max-width: 992px) {
  .recommend-course-body .content {
    width: 84% !important;
  }
}

.recommend-course-body .content .title {
  line-height: 17px;
  font-size: 12px;
  color: #3f4a54;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.recommend-course-body .content .subtitle {
  font-size: 12px;
  color: #bababa;
  line-height: 18px;
  margin-top: 2px;
}

@media (min-width: 1200px) {
  .user-center-container {
    width: 1020px;
  }
}

.user-center-container {
  padding-left: 0;
}

/*课程下方人数*/

.es-icon-people {
  width: 9px;
  height: 10px;
  display: inline-block;
  margin-left: 0 !important;
  margin: 3px 3px 0 20px;
  background: url("/static-dist/app/img/2018/1.0/series_courses/number_icon.png") no-repeat center center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/number_icon@2x.png") 2x);
}

/*学员详情页在学课程*/

/*.attention-metas a{
padding: 7px 0 0 0;
border-radius: 4px!important;
font-size: 13px!important;
}*/

/*课程详情页课程目录*/

.task-list .right-menu a {
  padding: 5px 16px;
}

.course-freelearn-section .line {
  line-height: 13px;
}

.course-freelearn-section h2 {
  position: absolute;
  top: 30px;
  left: 20px;
  font-size: 24px;
  color: #424242;
  line-height: 27px;
}

/* @media (min-width:768px) {
    .mobile-place,
    .mobile,
    .company-mobile {
        display: none;
    }
    .pc,
    .es-header,
    .common-pdt,
    .company-pc {
        display: block;
    }

} */

.new-course-detail {
  width: 1080px;
  height: 265px;
  /*border: 1px solid #EEEEEE;*/
  border-radius: 4px;
  /*padding: 20px 0 20px 20px;*/
  position: relative;
}

.new-course-detail .course-detail-section-responsive {
  position: absolute;
  right: 20px;
  top: 16px;
  display: inline-block !important;
}

@media (min-width: 768px) {
  .new-course-detail .graph {
    z-index: 2;
  }
}

.new-course-detail .graph {
  width: 400px;
  height: 225px;
  float: left;
  position: relative;
}

.new-course-detail .graph img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
}

.new-course-detail .content {
  float: left;
  position: relative;
  padding-left: 0;
  margin-left: 25px;
}

.course-img-cover {
  border-radius: 5px;
}

@media (max-width: 768px) {

  /*.es-section{
        padding-bottom: 10px !important;
    }*/
  .use-coupon .deduction {
    height: auto !important;
    /* padding: 10px 20px 0 0; */
    overflow: hidden;
  }

  .use-coupon .deduction .left_type p:first-child {
    padding-left: 20px;
  }

  .new-course-detail .content {
    float: none !important;
    margin-left: 0;
  }

  .new-course-detail .graph {
    float: none !important;
    margin: 20px !important;
    /*max-width: 90%!important;*/
    width: auto !important;
    height: auto !important;
    z-index: 1;
  }

  .new-course-detail.new-classroom-course-detail .graph {
    width: 3rem !important;
    height: 1.6875rem !important;
  }

  .new-classroom-course-detail .class-img:nth-of-type(3),
  .new-classroom-course-detail .class-img:nth-of-type(2) {
    display: none;
  }

  .new-course-detail .graph img {
    width: 100%;
    border-radius: 5px;
  }

  .course-img-cover {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #000;
    opacity: 0.4;
    filter: alpha(opacity=40);
    transition: all 0.3s ease;
    border-radius: 5px;
  }

  .new-course-detail,
  .new-course-detail .content {
    width: 100% !important;
  }

  .new-course-detail {
    height: auto !important;
    padding-left: 0;
  }

  .new-course-detail .content .text {
    width: 100% !important;
    height: 130px !important;
    padding: 0 !important;
    margin: 20px 0 !important;
  }

  .new-course-detail .content .title {
    max-width: 80% !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-left: 20px !important;
  }

  .new-course-detail .content .text .first-key {
    position: absolute;
    left: 23px !important;
    top: 0px !important;
  }

  .new-course-detail .content .text .first-value {
    position: absolute;
    left: 114px;
    top: 0px !important;
  }

  .new-course-detail .mb15 {
    margin-left: 20px !important;
    margin-bottom: 20px !important;
  }

  .course-detail-section .course-detail-bottom .course-detail-info .course-detail-price-money {
    margin-left: 20px;
  }

  .new-course-detail .mb15 {
    margin-left: 20px !important;
    margin-bottom: 20px !important;
  }

  .new-course-detail .content .text .second-key {
    position: absolute;
    left: 24px !important;
    top: 84px !important;
  }

  .new-course-detail .content .text .second-key-1 {
    position: absolute;
    left: 24px !important;
    top: 58px !important;
  }

  .new-course-detail .content .text .second-value {
    position: absolute;
    left: 93px !important;
    top: 82px !important;
    color: #3f4a54;
  }

  .new-course-detail .content .text .second-value-1 {
    position: absolute;
    left: 93px !important;
    top: 54px !important;
    color: #3f4a54;
  }

  .new-course-detail .content .price-key {
    position: absolute;
    left: 25px !important;
    top: 175px !important;
    font-size: 12px;
    color: #999999;
  }

  .new-course-detail .content .price-value {
    position: absolute;
    left: 92px !important;
    top: 173px !important;
    font-size: 24px;
    color: #ff6000;
    line-height: 33px;
  }

  .new-course-detail .content .price-key-1 {
    position: absolute;
    left: 25px !important;
    top: 216px !important;
    font-size: 12px;
    color: #999999;
  }

  .new-course-detail .content .price-value-1 {
    position: absolute;
    left: 92px !important;
    top: 210px !important;
    font-size: 24px;
    color: #ff6000;
    line-height: 33px;
  }

  .new-course-detail .buy-btn-group .btn {
    bottom: 0px !important;
    right: 10px !important;
  }

  .new-course-detail .buy-btn-group .btn-1 {
    bottom: -24px !important;
    right: 10px !important;
  }

  .new-course-detail .lump-sm {
    display: inline-block !important;
  }

  .new-course-detail .service {
    display: inline-block !important;
    /*margin-left: -5px;*/
  }

  .course-detail-section-responsive {
    margin: 0;
  }
}

.new-course-detail .content .title {
  font-size: 24px;
  color: #424242;
  margin: 10px 0 0 0px;
  max-width: 455px;
  float: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 32px;
}

.new-course-detail .content .es-qrcode {
  float: left;
  margin-top: 14px;
  font-size: 20px;
  padding: 0 !important;
}

.new-course-detail .content .text {
  width: 663px;
  margin-top: 20px;
  background-color: #fafafa;
  height: 98px;
  overflow: hidden;
  font-size: 12px;
  color: #999999;
  position: relative;
  /*padding: 0 0 14px 20px;*/
}

.new-course-detail .content .text li {
  margin-top: 14px;
}

.new-course-detail .content .text .key li {
  padding-left: 14px;
}

.new-course-detail .content .text .first-key {
  position: absolute;
  left: 32px;
  top: 13px;
}

.new-course-detail .content .text .first-value {
  position: absolute;
  left: 114px;
  top: 13px;
  color: #3f4a54;
}

.new-course-detail .content .text .second-key {
  position: absolute;
  left: 315px;
  top: 13px;
}

.new-course-detail .content .text .second-value {
  position: absolute;
  left: 390px;
  top: 10px;
  color: #3f4a54;
}

.new-course-detail .content .text .first-key li:nth-child(1) {
  background: url("/static-dist/app/img/2018/1.0/public_class/validity_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/validity_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/validity_icon@2x.png") 2x);
}

.new-course-detail .content .text .first-key li:nth-child(2) {
  background: url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/public_class/number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/public_class/number_icon@2x.png") 2x);
}

.new-course-detail .content .text .first-key li:nth-child(3) {
  background: url("/static-dist/app/img/2018/1.0/series_courses/courses_number_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/courses_number_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/courses_number_icon@2x.png") 2x);
}

.new-course-detail .content .text .second-key li:nth-child(1) {
  background: url("/static-dist/app/img/2018/1.0/series_courses/service_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/series_courses/service_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/series_courses/service_icon@2x.png") 2x);
}

.new-course-detail .content .text .second-key li:nth-child(2) {
  background: url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon@2x.png") 2x);
}

.new-course-detail .content .text .second-key li:nth-child(2) .value {
  background: url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon.png") no-repeat 0 center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/course_details/kechengmanyidu_icon@2x.png") 2x);
}

.new-course-detail .content .text .second-value li:nth-child(2) {
  margin-top: 10px;
}

.new-course-detail .content .price-key {
  position: absolute;
  left: 20px;
  top: 180px;
  font-size: 12px;
  color: #999999;
}

.new-course-detail .content .price-value {
  position: absolute;
  left: 115px;
  top: 176px;
  font-size: 24px;
  color: #ff6000;
  line-height: 33px;
}

.new-course-detail .btn {
  position: absolute;
  right: 20px;
  bottom: 20px;
}

.new-classroom-course-detail .buy-btn-group .btn {
  bottom: 20px;
}

@media (max-width: 1100px) {

  .js-favorite-btn,
  .js-unfavorite-btn {
    display: none !important;
  }
}

.download-activity-list li .link-darker {
  color: #005bac !important;
}

.download-activity-list li .es-icon-filedownload {
  display: inline-block;
  vertical-align: middle;
  background: url("/static-dist/app/img/2018/1.0/download_info/lijixiazai1_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_info/lijixiazai1_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_info/lijixiazai1_icon@2x.png") 2x);
}

.iframe-parent-content .warn {
  position: relative;
}

.iframe-parent-content .warn {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 14px;
  color: #424242;
  width: 100%;
  text-align: center;
}

.iframe-parent-content .warn-btn {
  width: 124px;
  height: 36px;
  border: 1px solid #005bac;
  border-radius: 4px;
  position: absolute;
  left: 50%;
  /* top: 35px; */
  top: 80px;
  transform: translateX(-50%);
  background-color: #fff;
  background: url("/static-dist/app/img/2018/1.0/download_info/lijixiazai1_icon.png") no-repeat 26px;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_info/lijixiazai1_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_info/lijixiazai1_icon@2x.png") 2x);
  text-align: center;
}

.iframe-parent-content .warn-btn a {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #005bac !important;
  padding-left: 20px;
}

.iframe-parent-content .warn-btn:hover {
  background: url("/static-dist/app/img/2018/1.0/download_info/lijixiazai2_icon.png") no-repeat #005bac 26px;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/download_info/lijixiazai2_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/download_info/lijixiazai2_icon@2x.png") 2x);
}

.iframe-parent-content .warn-btn:hover a {
  color: #fff !important;
}

@media (max-width: 767px) {
  .new-course-detail .course-detail-section-responsive {
    display: none !important;
  }
}

/**
 * Swiper 4.2.6
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2018 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: May 1, 2018
 */

.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

.swiper-container-no-flexbox .swiper-slide {
  float: left;
}

.swiper-container-vertical>.swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.swiper-container-multirow>.swiper-wrapper {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.swiper-container-free-mode>.swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-slide {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}

.swiper-invisible-blank-slide {
  visibility: hidden;
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;
  -o-transition-property: transform, height;
  transition-property: transform, height;
  transition-property: transform, height, -webkit-transform;
}

.swiper-container-3d {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}

.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear,
      right top,
      left top,
      from(rgba(0, 0, 0, 0.5)),
      to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(right,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(right,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: linear-gradient(to left,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear,
      left top,
      right top,
      from(rgba(0, 0, 0, 0.5)),
      to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(left,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(left,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: linear-gradient(to right,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear,
      left bottom,
      left top,
      from(rgba(0, 0, 0, 0.5)),
      to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(bottom,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(bottom,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: linear-gradient(to top,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear,
      left top,
      left bottom,
      from(rgba(0, 0, 0, 0.5)),
      to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(top,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(top,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
  background-image: linear-gradient(to bottom,
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0));
}

.swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal>.swiper-wrapper {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}

.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical>.swiper-wrapper {
  -ms-touch-action: pan-x;
  touch-action: pan-x;
}

.swiper-button-next,
.swiper-button-prev {
  position: absolute;
  top: 50%;
  width: 27px;
  height: 44px;
  margin-top: -22px;
  z-index: 10;
  cursor: pointer;
  background-size: 27px 44px;
  background-position: center;
  background-repeat: no-repeat;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  left: 10px;
  right: auto;
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  right: 10px;
  left: auto;
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-lock {
  display: none;
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  -webkit-transition: 0.3s opacity;
  -o-transition: 0.3s opacity;
  transition: 0.3s opacity;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}

.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
  position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}

.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: 0.2;
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  opacity: 1;
  background: #007aff;
}

.swiper-container-vertical>.swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 8px;
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  -webkit-transition: 0.2s top, 0.2s -webkit-transform;
  transition: 0.2s top, 0.2s -webkit-transform;
  -o-transition: 0.2s transform, 0.2s top;
  transition: 0.2s transform, 0.2s top;
  transition: 0.2s transform, 0.2s top, 0.2s -webkit-transform;
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  white-space: nowrap;
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 0.2s left, 0.2s -webkit-transform;
  transition: 0.2s left, 0.2s -webkit-transform;
  -o-transition: 0.2s transform, 0.2s left;
  transition: 0.2s transform, 0.2s left;
  transition: 0.2s transform, 0.2s left, 0.2s -webkit-transform;
}

.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 0.2s right, 0.2s -webkit-transform;
  transition: 0.2s right, 0.2s -webkit-transform;
  -o-transition: 0.2s transform, 0.2s right;
  transition: 0.2s transform, 0.2s right;
  transition: 0.2s transform, 0.2s right, 0.2s -webkit-transform;
}

.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #007aff;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  -webkit-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
}

.swiper-container-horizontal>.swiper-pagination-progressbar,
.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}

.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-container-vertical>.swiper-pagination-progressbar {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #fff;
}

.swiper-pagination-progressbar.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.25);
}

.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
  background: #fff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000;
}

.swiper-pagination-progressbar.swiper-pagination-black {
  background: rgba(0, 0, 0, 0.25);
}

.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
  background: #000;
}

.swiper-pagination-lock {
  display: none;
}

.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}

.swiper-container-horizontal>.swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}

.swiper-container-vertical>.swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-scrollbar-lock {
  display: none;
}

.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}

.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.swiper-slide-zoomed {
  cursor: move;
}

.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  -webkit-transform-origin: 50%;
  -ms-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}

.swiper-lazy-preloader:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-position: 50%;
  background-size: 100%;
  background-repeat: no-repeat;
}

.swiper-lazy-preloader-white:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

@-webkit-keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
  pointer-events: none;
  -webkit-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}

.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube {
  overflow: visible;
}

.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}

.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
  pointer-events: auto;
  visibility: visible;
}

.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}

.swiper-container-flip {
  overflow: visible;
}

.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-container-coverflow .swiper-wrapper {
  -ms-perspective: 1200px;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  list-style: none;
  text-decoration: none;
  font-family: Arial, "Microsoft YaHei", "Lantinghei SC", "PingFang SC",
    "HanHei SC", "Helvetica Neue", "Open Sans", "Hiragino Sans GB", 微软雅黑,
    STHeiti, "WenQuanYi Micro Hei", SimSun, sans-serif;
  border: none;
  outline: none;
}

p {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

button {
  cursor: pointer;
  background: none;
}

ul {
  margin-bottom: 0;
}

.row {
  margin-right: -10px;
  margin-left: -10px;
  padding-bottom: 15px;
}

.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
  padding-right: 10px;
  padding-left: 10px;
}

dl {
  margin-bottom: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

dt {
  font-weight: normal;
}

.container {
  zoom: 1;
}

.container:after {
  content: "";
  display: block;
  clear: both;
}

@media (min-width: 768px) {
  .container {
    width: 740px;
  }
}

@media (min-width: 992px) {
  .container {
    width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    width: 1100px;
  }
}

.society-activity-bg {
  width: 100%;
  height: 200px;
  background-color: #333;
  background-image: url("/static-dist/app/img/shenlan19/xianxiahuodongbj_pic.png");
  background-size: cover;
  background-repeat: no-repeat;
  text-align: center;
  margin-bottom: 30px;
}

.society-activity-bg h2 {
  line-height: 200px;
  font-size: 40px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 2px 4px rgba(28, 31, 33, 0.2);
}

/* .society-activity-list .activity-list {
    background: #FFFFFF;
    border: 1px solid #EEEEEE;
    border-radius: 4px;
    padding: 20px 20px 0 20px
} */
.society-activity-list .activity-list dt {
  font-weight: bold;
  font-size: 16px;
  color: #3f4a54;
  padding-bottom: 20px;
}

/* .society-activity-list .activity-list dd {
    padding: 30px 0;
    border-top: 1px solid #e4e4e4
} */
.society-activity-list .activity-list .dd-content-wrap {
  background: #ffffff;
  border: 1px solid #e5ecf7;
  box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  border-radius: 8px;
}

@media (max-width: 767px) {
  .society-activity-list .activity-list {
    padding: 10px 10px 0 10px;
    margin: 0px;
  }

  .society-activity-list .activity-list dt {
    padding-bottom: 10px;
  }

  .society-activity-list .activity-list dd {
    padding: 10px 0;
    margin-bottom: 0 !important;
  }

  .society-activity-list-new .activity-list dd .state {
    right: 0px !important;
    top: 196px !important;
  }
}

.society-activity-list .activity-list dd {
  position: relative;
  margin-bottom: 28px;
}

.society-activity-list-new .activity-list dd .content {
  display: inline-block;
  width: 100%;
}

.society-activity-list .activity-list dd .content {
  /* margin-left: 252px */
  padding: 14px 12px;
}

.society-activity-list .activity-list dd .content h2 {
  font-size: 16px;
  color: #465270;
  line-height: 24px;
  font-weight: 500;
  padding-right: 70px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.society-activity-list .activity-list dd .content .text {
  margin-top: 9px;
  font-size: 12px;
  color: #666;
}

.society-activity-list .activity-list dd .content .text.further {
  margin-top: 27px;
}

.society-activity-list .activity-list dd .content .text li {
  line-height: 24px;
  font-size: 12px;
  color: #8892aa;
  height: 24px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 767px) {
  .society-activity-list .activity-list dd .content {
    margin-left: 0;
    /* margin-top: 8px; */
    font-size: 0;
  }

  .society-activity-list .activity-list dd .content .title {
    zoom: 1;
  }

  .society-activity-list .activity-list dd .content .title:after {
    content: "";
    display: block;
    clear: both;
  }

  .society-activity-list .activity-list dd .content .tag {
    padding: 3px 5px;
    border-radius: 2px;
    font-size: 10px;
    margin-top: 5px;
    line-height: 1;
    float: left;
  }

  .society-activity-list .activity-list dd .content h2 {
    font-size: 16px;
    padding-bottom: 6px;
    white-space: normal;
    /* font-weight: bold;
        float: left */
  }

  .society-activity-list .activity-list dd .content .text {
    margin-top: 0;
    font-size: 10px;
  }

  .society-activity-list .activity-list dd .content .text li {
    line-height: 20px;
    height: 20px;
  }
}

.society-activity-list .activity-list dd.apply-underway .state {
  color: #e83d2c;
}

.society-activity-list .activity-list dd.activity-underway .state {
  color: #005bac;
}

.society-activity-list .activity-list dd.apply-underway .tag {
  color: #d0021b;
  background-color: #ffe4e4;
}

.society-activity-list .activity-list dd.activity-underway .tag {
  color: #005bac;
  background-color: #e2f1ff;
}

.society-activity-list .activity-list dd.will-activity .state {
  color: #22bfa7;
}

.society-activity-list .activity-list dd.will-activity .tag {
  color: #038c77;
  background-color: #ddfef9;
}

.society-activity-list .activity-list dd.will-apply .state {
  color: #f07300;
}

.society-activity-list .activity-list dd.will-apply .tag {
  color: #d04700;
  background-color: #fff2dd;
}

.society-activity-list .activity-list dd.over .state {
  color: #fff;
}

.society-activity-list .activity-list dd.over .tag {
  color: #565656;
  background-color: #e4e4e4;
}

.society-activity-list .activity-list dd .state {
  font-size: 12px;
  position: absolute;
  top: 186px;
  right: 11px;
  width: 64px;
  padding-left: 10px;
  line-height: 32px;
  text-align: center;
  background: #bebebe;
}

.society-activity-list-new .activity-list dd.over .state {
  background: url("/static-dist/app/img/shenlan19/yijiesu@2x.png");
  background-size: 74px;
}

.society-activity-list-new .activity-list dd.will-apply .state {
  background: url("/static-dist/app/img/shenlan19/jijiangbaoming@2x.png");
  background-size: 84px;
  width: 84px;
  color: #fff;
}

.society-activity-list-new .activity-list dd.apply-underway .state {
  background: url("/static-dist/app/img/shenlan19/baomingzhong@2x.png");
  background-size: 74px;
  color: #fff !important;
}

.society-activity-list-new .activity-list dd.will-activity .state {
  background: url("/static-dist/app/img/shenlan19/weikaishi@2x.png");
  background-size: 74px;
  color: #fff !important;
}

.society-activity-list-new .activity-list dd.activity-underway .state {
  background: url("/static-dist/app/img/shenlan19/jinxingzhong@2x.png");
  background-size: 74px;
  color: #fff !important;
}

.society-activity-list .activity-list dd button {
  position: absolute;
  font-size: 14px;
  width: 84px;
  height: 30px;
  background-color: #005bac;
  border-radius: 4px;
  bottom: 20px;
  right: 0;
  line-height: 30px;
  text-align: center;
  color: #ffffff;
}

.society-activity-list .society-list {
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  padding: 20px 20px 0 20px;
}

.society-activity-list .society-list dt {
  font-weight: bold;
  font-size: 16px;
  color: #3f4a54;
  padding-bottom: 20px;
}

.society-activity-list .society-list dd {
  padding: 20px 0;
  border-top: 1px solid #e4e4e4;
}

@media (max-width: 767px) {
  .society-activity-list .society-list {
    padding: 10px 10px 0 10px;
  }

  .society-activity-list .society-list dt {
    padding-bottom: 10px;
  }

  .society-activity-list .society-list dd {
    padding: 10px 0;
  }
}

.society-activity-list .society-list dd img {
  width: 100%;
}

.society-list-wrap {
  background-color: #fff;
  padding-bottom: 60px;
}

.society-list-wrap .society-list dt {
  display: block;
  font-size: 30px;
  color: #2c2e40;
  padding-bottom: 30px;
  padding-top: 40px;
  text-align: center;
}

.society-list-wrap .society-list dd img {
  width: 100%;
}

.society-list-wrap .society-list .dd-content {
  border: 1px solid #e5ecf7;
  box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  border-radius: 8px;
  margin-bottom: 20px;
}

.society-list-wrap .society-list .content {
  font-size: 12px;
  color: #8892aa;
  text-align: justify;
  padding: 12px;
}

.society-activity-list .society-list dd .content {
  margin-top: 12px;
}

.society-activity-list .society-list dd .content p {
  font-size: 12px;
  color: #666;
  line-height: 18px;
  text-align: justify;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

@media (max-width: 992px) {
  .society-activity-list .society-list {
    margin-top: 20px;
  }

  /* 师资团队 */
  .techer-fivecolumn-item .teacher-itemlink {
    height: 280px;
  }

  .techer-fivecolumn-item .teacher-info-box .subtitle {
    font-size: 12px;
    padding: 2px 0 6px;
  }

  .techer-fivecolumn-item .teacher-info-box {
    height: 140px;
    padding: 36px 10px 10px;
  }

  .recommend-teacher-new .teacher-box {
    grid-template: 1fr / repeat(2, 47vw);
    gap: 2vw;
    padding: 2vw;
  }
}

@media (max-width: 767px) {
  .society-detail .activity {
    margin-bottom: 20px;
  }

  .society-activity-list .society-list {
    padding: 10px 10px 0 10px;
  }

  .society-activity-list .society-list dd {
    padding: 10px 0 10px 0;
  }
}

@media (max-width: 992px) and (min-width: 768px) {
  .society-activity-list .society-list dd {
    zoom: 1;
  }

  .society-activity-list .society-list dd:after {
    content: "";
    display: block;
    clear: both;
  }

  .society-activity-list .society-list dd img {
    float: left;
    width: 240px;
    height: 90px;
  }

  .society-activity-list .society-list dd .content {
    margin-left: 252px;
    margin-top: 0;
  }

  .society-activity-list .society-list dd .content h2 {
    font-size: 20px;
    color: #3f4a54;
    line-height: 28px;
  }

  .society-activity-list .society-list dd .content p {
    margin-top: 8px;
  }
}

.society-activity-detail .banner {
  width: 100%;
  border-radius: 8px;
}

.society-activity-detail .row {
  margin-top: 20px;
}

.society-activity-detail .activity-content {
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  padding: 20px 20px 0 20px;
  margin-bottom: 120px;
}

.society-activity-detail .activity-content dt {
  font-weight: bold;
  font-size: 16px;
  color: #3f4a54;
  padding-bottom: 20px;
}

.society-activity-detail .activity-content dd {
  padding: 20px 0;
  border-top: 1px solid #e4e4e4;
}

@media (max-width: 767px) {
  .society-activity-detail .activity-content {
    padding: 10px 10px 0 10px;
  }

  .society-activity-detail .activity-content dt {
    padding-bottom: 10px;
  }

  .society-activity-detail .activity-content dd {
    padding: 10px 0;
  }
}

@media (max-width: 992px) {
  .society-activity-detail .activity-content {
    margin-bottom: 20px;
  }
}

.society-activity-detail .info {
  margin-bottom: 120px;
}

.society-activity-detail .activity-info {
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  padding: 20px 20px 0 20px;
}

.society-activity-detail .activity-info dt {
  font-weight: bold;
  font-size: 16px;
  color: #3f4a54;
  padding-bottom: 20px;
}

.society-activity-detail .activity-info dd {
  padding: 20px 0;
  border-top: 1px solid #e4e4e4;
}

@media (max-width: 767px) {
  .society-activity-detail .activity-info {
    padding: 10px 10px 0 10px;
  }

  .society-activity-detail .activity-info dt {
    padding-bottom: 10px;
  }

  .society-activity-detail .activity-info dd {
    padding: 10px 0;
  }
}

.society-activity-detail .activity-info dd {
  zoom: 1;
  border: none;
  padding: 14px 0 0 0;
}

.society-activity-detail .activity-info dd:after {
  content: "";
  display: block;
  clear: both;
}

.society-activity-detail .activity-info dd .name {
  font-size: 12px;
  color: #333333;
  width: 54px;
  float: left;
  font-weight: bold;
}

.society-activity-detail .activity-info dd .name:after {
  content: "";
  width: 100%;
  height: 0;
  display: inline-block;
  overflow: hidden;
}

.society-activity-detail .activity-info dd .value {
  margin-left: 55px;
  font-size: 12px;
  color: #666666;
  border-bottom: 1px solid #e4e4e4;
  padding-bottom: 14px;
  text-align: justify;
}

.society-activity-detail .activity-info dd .value p {
  margin-top: 2px;
}

.society-activity-detail .activity-info dd .value p:first-child {
  margin-top: 0;
}

.society-activity-detail .activity-info dd:first-of-type {
  border-top: 1px solid #e4e4e4;
}

.society-activity-detail .activity-info dd:last-of-type .value {
  border: none;
  padding-bottom: 20px;
}

@media (max-width: 767px) {
  .society-activity-detail .activity-info dd:last-of-type .value {
    padding-bottom: 0;
  }
}

.society-activity-detail .apply-btn {
  margin-top: 20px;
  width: 100%;
  height: 40px;
  background-color: #005bac;
  border-radius: 4px;
  font-size: 14px;
  color: #ffffff;
}

.society-activity-detail .apply-btn.over {
  background-color: #ccc;
}

@media (max-width: 767px) {
  .society-activity-detail .apply-btn {
    position: fixed;
    border-radius: 0;
    bottom: 0;
    left: 0;
  }
}

.society-activity-detail .share {
  margin-top: 20px;
  zoom: 1;
}

.society-activity-detail .share:after {
  content: "";
  display: block;
  clear: both;
}

.society-activity-detail .share .title {
  float: left;
  font-size: 14px;
  color: #3d464d;
  line-height: 24px;
}

.society-activity-detail .share ul {
  margin-left: 4px;
  float: left;
}

.society-activity-detail .share ul li {
  float: left;
  margin-left: 6px;
  width: 24px;
  height: 24px;
}

.society-activity-detail .share ul li span {
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.society-activity-detail .share ul .qq {
  background: url("/static-dist/app/img/2018/1.0/society/QQ_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/QQ_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/QQ_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/QQ_icon@3x.png") 3x);
}

.society-activity-detail .share ul .wechat {
  background: url("/static-dist/app/img/2018/1.0/society/wechat_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/wechat_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/wechat_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/wechat_icon@3x.png") 3x);
}

.society-activity-detail .share ul .weibo {
  background: url("/static-dist/app/img/2018/1.0/society/weibo_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/weibo_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/weibo_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/weibo_icon@3x.png") 3x);
}

.society-activity-detail .share ul .qqzone {
  background: url("/static-dist/app/img/2018/1.0/society/QQzone_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/QQzone_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/QQzone_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/QQzone_icon@3x.png") 3x);
}

.society-activity-detail .share ul .qqweibo {
  background: url("/static-dist/app/img/2018/1.0/society/QQweibo_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/QQweibo_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/QQweibo_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/QQweibo_icon@3x.png") 3x);
}

@media (max-width: 992px) {
  .society-activity-detail .share {
    display: none;
  }
}

.society-detail .banner {
  border-radius: 8px;
}

.society-detail .banner .bg {
  width: 100%;
}

.society-detail .banner .logo {
  width: 16.67%;
  position: absolute;
  left: 50%;
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  transform: translateX(-50%);
  top: 16%;
  border: 1px solid #e4e4e4;
  border-radius: 50%;
}

.society-detail .banner .title {
  font-size: 20px;
  color: #333333;
  font-weight: bold;
  position: absolute;
  left: 50%;
  top: 73%;
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  transform: translateX(-50%);
}

@media (max-width: 1200px) {
  .society-detail .banner .title {
    font-size: 16px;
  }
}

@media (max-width: 992px) {
  .society-detail .banner .title {
    font-size: 12px;
  }
}

.society-detail .production {
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  padding: 20px 20px 0 20px;
  margin-top: 20px;
}

.society-detail .production dt {
  font-weight: bold;
  font-size: 16px;
  color: #3f4a54;
  padding-bottom: 20px;
}

.society-detail .production dd {
  padding: 20px 0;
  border-top: 1px solid #e4e4e4;
}

@media (max-width: 767px) {
  .society-detail .production {
    padding: 10px 10px 0 10px;
  }

  .society-detail .production dt {
    padding-bottom: 10px;
  }

  .society-detail .production dd {
    padding: 10px 0;
  }
}

.society-detail .production dd {
  line-height: 26px;
  font-size: 16px;
  color: #666;
}

.society-detail .production dd p {
  text-indent: 2em;
  margin-bottom: 10px;
  text-align: justify;
}

.society-detail .production dd p:last-of-type {
  margin: 0;
}

.society-detail .activity {
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  padding: 20px 20px 0 20px;
  margin-top: 20px;
  margin-bottom: 100px;
}

.society-detail .activity dt {
  font-weight: bold;
  font-size: 16px;
  color: #3f4a54;
  padding-bottom: 20px;
}

.society-detail .activity dd {
  padding: 30px 0;
  border-top: 1px solid #e4e4e4;
}

@media (max-width: 767px) {
  .society-detail .activity {
    padding: 10px 10px 0 10px;
  }

  .society-detail .activity dt {
    font-weight: bold;
    padding-bottom: 10px;
  }

  .society-detail .activity dd {
    padding: 10px 0;
  }
}

.society-detail .activity dd {
  position: relative;
}

.society-detail .activity dd .content {
  margin-left: 252px;
}

.society-detail .activity dd .content h2 {
  font-size: 20px;
  color: #3f4a54;
  line-height: 28px;
}

.society-detail .activity dd .content .text {
  margin-top: 9px;
  font-size: 12px;
  color: #666;
}

.society-detail .activity dd .content .text.further {
  margin-top: 27px;
}

.society-detail .activity dd .content .text li {
  margin-top: 4px;
  line-height: 17px;
}

@media (max-width: 767px) {
  .society-detail .activity dd img {
    width: 100%;
    float: none;
  }

  .society-detail .activity dd .content {
    margin-left: 0;
    margin-top: 8px;
    font-size: 0;
  }

  .society-detail .activity dd .content .title {
    zoom: 1;
  }

  .society-detail .activity dd .content .title:after {
    content: "";
    display: block;
    clear: both;
  }

  .society-detail .activity dd .content .tag {
    padding: 3px 5px;
    border-radius: 2px;
    font-size: 10px;
    margin-top: 5px;
    line-height: 1;
    float: left;
  }

  .society-detail .activity dd .content h2 {
    font-size: 16px;
    font-weight: bold;
    float: left;
  }

  .society-detail .activity dd .content .text {
    margin-top: 0;
    font-size: 10px;
  }

  .society-detail .activity dd .content .text li {
    line-height: 14px;
  }
}

.society-detail .activity dd.apply-underway .state {
  color: #e83d2c;
}

.society-detail .activity dd.activity-underway .state {
  color: #005bac;
}

.society-detail .activity dd.apply-underway .tag {
  color: #d0021b;
  background-color: #ffe4e4;
}

.society-detail .activity dd.activity-underway .tag {
  color: #005bac;
  background-color: #e2f1ff;
}

.society-detail .activity dd.will-activity .state {
  color: #22bfa7;
}

.society-detail .activity dd.will-activity .tag {
  color: #038c77;
  background-color: #ddfef9;
}

.society-detail .activity dd.will-apply .state {
  color: #f07300;
}

.society-detail .activity dd.will-apply .tag {
  color: #d04700;
  background-color: #fff2dd;
}

.society-detail .activity dd.over .state {
  color: #888888;
}

.society-detail .activity dd.over .tag {
  color: #565656;
  background-color: #e4e4e4;
}

.society-detail .activity dd .state {
  font-size: 12px;
  position: absolute;
  bottom: 56px;
  right: 0;
  width: 84px;
  text-align: center;
}

.society-detail .activity dd button {
  position: absolute;
  font-size: 14px;
  width: 84px;
  height: 30px;
  background-color: #005bac;
  border-radius: 4px;
  bottom: 20px;
  right: 0;
  line-height: 30px;
  text-align: center;
  color: #ffffff;
}

.society-detail .activity dd.empty {
  padding: 68px 0;
}

.society-detail .activity dd.empty .graph {
  width: 70px;
  height: 70px;
  background: url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon@3x.png") 3x);
  margin: 0 auto;
}

.society-detail .activity dd.empty .text {
  font-size: 14px;
  color: #424242;
  margin-top: 20px;
  text-align: center;
}

.society-activity-over {
  text-align: center;
}

.society-activity-over .graph {
  width: 70px;
  height: 70px;
  background: url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon@2x.png") 2x,
      url("/static-dist/app/img/2018/1.0/society/huodongguanbi_icon@3x.png") 3x);
  margin: 235px auto 0;
}

.society-activity-over .text {
  font-size: 14px;
  color: #424242;
  margin-top: 34px;
}

.society-activity-over button {
  border: 1px solid #005bac;
  border-radius: 4px;
  font-size: 14px;
  color: #005bac;
  width: 140px;
  height: 36px;
  margin-top: 48px;
  margin-bottom: 231px;
}

.society-container:after {
  content: "";
  display: block;
  clear: both;
}

.society-container {
  zoom: 1;
}

.society-activity-list .activity-list dd:after {
  content: "";
  display: block;
  clear: both;
}

.society-activity-list .activity-list dd {
  zoom: 1;
}

@media (max-width: 767px) {
  .society-activity-over .graph {
    margin: 30% auto 0;
  }

  .society-activity-over button {
    margin-bottom: 40%;
  }
}

@media (min-width: 768px) {
  .society-container {
    width: 720px;
    margin: 0 auto;
  }
}

@media (min-width: 992px) {
  .society-container {
    width: 940px;
    margin: 0 auto;
  }
}

@media (min-width: 1200px) {
  .society-container {
    width: 1080px;
    margin: 0 auto;
  }
}

.society-activity-detail .activity-content dd table,
.society-activity-detail .activity-content dd td,
.society-activity-detail .activity-content dd th {
  border: 1px solid #000;
}

.society-activity-detail .activity-content dd u {
  text-decoration: underline !important;
}

.society-activity-detail .activity-content dd s {
  text-decoration: line-through !important;
}

.society-activity-detail .activity-content dd p img {
  max-width: 100% !important;
}

.society-activity-detail .activity-content dd p {
  margin: 20px auto 30px;
  line-height: 30px;
}

.cover-img {
  width: 240px;
  height: 142px;
  float: left;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}

.society-activity-list-new .cover-img {
  /* width: 240px; */
  width: 100%;
  height: 172px;
  /* float: left; */
  border-radius: 8px 8px 0 0;
  display: block;
}

@media (max-width: 767px) {
  .cover-img {
    width: 100%;
    float: none;
    display: block;
  }

  .society-activity-list .activity-list dd.over .tag {
    margin-right: 6px;
  }

  .society-detail .activity dd .tag {
    margin-right: 6px;
  }
}

.cover-img img {
  height: 100%;
  width: auto;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

/* @media (max-width: 767px) {
    .task-dashboard-page .dashboard-content .dashboard-body {
        height: 343px !important;
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }
} */

/*以老带新活动*/

.advertisement-banner {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100px;
  z-index: 1;
}

.advertisement-banner .banner-content {
  width: 1px;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

.advertisement-banner a {
  display: block;
  height: 100%;
}

.advertisement-banner img {
  width: auto;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.advertisement-banner .advertisement-close {
  position: absolute;
  cursor: pointer;
  width: 16px;
  height: 16px;
  top: 14%;
  right: -535px;
  background: url("/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon@2x.png") 2x);
}

.advertisement-banner img.advertisement-lg-md {
  display: block;
}

.advertisement-banner img.advertisement-sm {
  display: none;
}

@media (max-width: 991px) {
  .advertisement-banner img.advertisement-lg-md {
    display: none;
  }

  .advertisement-banner img.advertisement-sm {
    display: block;
  }

  .advertisement-banner .advertisement-close {
    right: -420px;
  }
}

@media (max-width: 767px) {
  .advertisement-banner img.advertisement-sm {
    display: none;
  }

  .advertisement-banner img.advertisement-xs {
    display: block;
  }
}

/*.advertisement-banner:after {
    content: '';
    width: 16px;
    height: 16px;
    position: absolute;
    top: 14px;
    right: 425px;
    background: url('/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon.png') 1x, url('/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon@2x.png') 2x);
}*/

.advertisement-banner-mobile {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 1;
}

.advertisement-banner-mobile img {
  width: 100%;
  height: auto;
}

.advertisement-banner-mobile .advertisement-close {
  position: absolute;
  cursor: pointer;
  width: 12px;
  height: 12px;
  top: 14%;
  right: 1.9%;
  background: url("/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/homepage/xuanfukuangguanbi_icon@2x.png") 2x);
}

.activity-banner {
  height: 450px;
  position: relative;
}

.activity-banner img {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 450px;
}

@media (min-width: 992px) and (max-width: 1199px) {

  .activity-banner,
  .activity-banner img {
    height: 400px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {

  .activity-banner,
  .activity-banner img {
    height: 300px;
  }
}

.ticket-number {
  background-color: #f4f4f4;
}

.ticket-number .ticket-number-content {
  text-align: center;
}

.ticket-number .ticket-number-content li {
  display: inline-block;
  vertical-align: middle;
}

@media (min-width: 650px) {
  .ticket-number {
    height: 150px;
    padding-top: 35px;
  }

  .ticket-number .ticket-number-content.ticket-pc {
    display: block;
  }

  .ticket-number .ticket-number-content.ticket-pc li {
    font-size: 16px;
    color: #333;
  }

  .ticket-number .ticket-number-content.ticket-pc li span {
    padding: 3px 4px;
    font-size: 28px;
    color: #fff;
    background-color: #3f4a54;
    border-radius: 4px;
  }

  .ticket-number .ticket-number-content.ticket-pc li span:first-child {
    margin-right: 2px;
  }

  .ticket-number .ticket-number-content.ticket-pc li div {
    float: left;
  }

  .ticket-number .ticket-number-content.ticket-pc li .ticket-text {
    margin-top: 31px;
  }

  .ticket-number .ticket-number-content.ticket-pc li .ticket-graph {
    width: 200px;
    height: 80px;
    background: url(/static-dist/app/img/2018/1.0/oldLeadNew/50youhuiquan_pic.png) no-repeat center center;
    background-image: -webkit-image-set(url(/static-dist/app/img/2018/1.0/oldLeadNew/50youhuiquan_pic.png) 1x,
        url(/static-dist/app/img/2018/1.0/oldLeadNew/50youhuiquan_pic@2x.png) 2x);
    margin: 0 18px;
  }

  .ticket-number .ticket-number-content.ticket-pc li .ticket-graph a {
    display: block;
    width: 100%;
    height: 100%;
  }

  .ticket-number .ticket-number-content.ticket-pc li:last-child {
    margin-left: 59px;
  }

  .ticket-number .ticket-number-content.ticket-mobile {
    display: none;
  }
}

@media (max-width: 649px) {
  .ticket-number {
    height: 58px;
    padding-top: 20px;
  }

  .ticket-number .ticket-number-content.ticket-pc {
    display: none;
  }

  .ticket-number .ticket-number-content.ticket-mobile {
    display: block;
  }

  .ticket-number .ticket-number-content.ticket-mobile li {
    font-size: 12px;
    color: #3f4a54;
  }

  .ticket-number .ticket-number-content.ticket-mobile li:first-child {
    padding-right: 15px;
    border-right: 1px solid #bebebe;
  }

  .ticket-number .ticket-number-content.ticket-mobile li:last-child {
    padding-left: 15px;
  }

  .ticket-number .ticket-number-content.ticket-mobile li span {
    color: #f07300;
  }
}

@media (min-width: 768px) {
  .activity-banner img.pc-banner {
    display: block;
  }

  .activity-banner img.mobile-banner {
    display: none;
  }
}

@media (max-width: 767px) {
  .activity-banner img.pc-banner {
    display: none;
  }

  .activity-banner img.mobile-banner {
    display: block;
    width: 100%;
    position: static;
    transform: translateX(0);
  }

  .activity-banner,
  .activity-banner img.mobile-banner {
    height: auto;
  }

  .activity-banner {
    padding: 0;
  }
}

.newest-courses {
  margin-top: 50px;
}

.newest-courses h2 {
  margin-top: 0;
}

.newest-courses-box {
  margin-top: 52px;
}

.newest-courses-box li {
  margin-bottom: 20px;
  font-size: 0;
}

.newest-courses-box li .course-content {
  box-shadow: 0 5px 10px 0 rgba(62, 94, 188, 0.1);
  border-radius: 8px;
  position: relative;
}

.newest-courses-box img {
  width: 100%;
  border-radius: 8px 8px 0 0;
}

.newest-courses-box .tag-live {
  position: absolute;
  top: 0;
  left: 10px;
  width: 40px;
  height: 50px;
  background: url("/static-dist/app/img/tag_live.png") no-repeat;
  background-image: -webkit-image-set(url("/static-dist/app/img/tag_live.png") 1x,
      url("/static-dist/app/img/tag_live@2x.png") 2x);
}

.newest-courses-box .course-info-top,
.newest-courses-box .course-info-bottom {
  padding: 13px 16px;
}

.newest-courses-box .course-info-top .title {
  font-size: 16px;
  color: #4a4a4a;
  text-align: justify;
  line-height: 24px;
  height: 48px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.newest-courses-box .course-info-top .timeAndNumber {
  font-size: 12px;
  color: #979797;
}

.newest-courses-box .course-info-top .time {
  margin-left: 15px;
  position: relative;
  float: left;
}

.newest-courses-box .course-info-top .number {
  position: relative;
  float: right;
}

.newest-courses-box .course-info-top .time:before {
  content: "";
  position: absolute;
  top: 3px;
  left: -15px;
  width: 12px;
  height: 10px;
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/xilieshipinshuliang_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/oldLeadNew/xilieshipinshuliang_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/oldLeadNew/xilieshipinshuliang_icon@2x.png") 2x);
}

.newest-courses-box .course-info-top .number:before {
  content: "";
  position: absolute;
  top: 3px;
  left: -13px;
  width: 9px;
  height: 10px;
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/guankanrenshu_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/oldLeadNew/guankanrenshu_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/oldLeadNew/guankanrenshu_icon@2x.png") 2x);
}

.newest-courses-box .course-info-bottom {
  border-top: 1px solid #eeeeee;
}

.newest-courses-box .course-info-bottom .price {
  float: right;
  font-size: 18px;
  color: #e83d2c;
}

.newest-courses-box .course-info-bottom .people {
  font-size: 16px;
  color: #3d464d;
}

.newest-courses-box .course-info-bottom .people span {
  color: #e83d2c;
}

.newest-courses .more-courses {
  margin: 40px auto 0;
  border: 1px solid #e9e9e9;
  border-radius: 4px;
  width: 146px;
  height: 44px;
  line-height: 44px;
}

.newest-courses .more-courses a {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 14px;
  color: #666666;
  text-align: center;
}

.newest-courses .more-courses a .es-icon-chevronright:before {
  font-size: 14px;
}

.old-lead-new .company {
  background-color: #f7f7f7;
  margin-top: 60px;
  padding-top: 20px;
}

/*优惠券页面*/

.coupons-box {
  overflow-x: auto;
}

.coupons-box li {
  border: 1px solid #f5f5f5;
  border-radius: 2px;
  margin-top: 16px;
  height: 120px;
}

.coupons-box li .graph {
  width: 140px;
  height: 100%;
  text-align: center;
  float: left;
}

.coupons-box li .graph-top {
  font-size: 26px;
  color: #fff;
  line-height: 45px;
  margin-top: 13px;
}

.coupons-box li .graph-top span {
  font-size: 40px;
  font-weight: 500;
  line-height: 67px;
}

.coupons-box li .graph-bottom {
  width: 80px;
  height: 20px;
  border-radius: 4px;
  font-size: 12px;
  text-align: center;
  line-height: 20px;
  margin: 0 auto;
}

.coupons-box li .text {
  margin-top: 38px;
  margin-left: 26px;
  font-size: 12px;
  width: calc(100% - 140px - 100px - 26px - 30px);
  color: #3f4a54;
  float: left;
}

.coupons-box li .text p:first-child {
  margin-bottom: 4px;
}

/* .coupons-box li .text p:first-child span {
    font-weight: bold;
} */

.coupons-box li .use-btn {
  float: right;
  width: 100px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  margin: 40px 30px 0 0;
  border-radius: 4px;
  color: #fff;
}

.coupons-box li .use-btn a {
  color: #fff;
  display: block;
  width: 100%;
  height: 100%;
}

.coupons-box.unused .graph {
  /* background: url('/static-dist/app/img/2018/1.0/oldLeadNew/youhuiquan01_pic.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/oldLeadNew/youhuiquan01_pic.png') 1x, url('/static-dist/app/img/2018/1.0/oldLeadNew/youhuiquan01_pic@2x.png') 2x); */
  /* background: url('/static-dist/app/img/shenlan19/youhuiquanbj_pic@2x.png') no-repeat center;
    background-size: 140px; */
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/myhq-bg.jpg") no-repeat center;
  background-size: 140px;
}

.coupons-box.unused .graph.ygq {
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/yhq02_icon@2x.png") no-repeat center;
  background-size: 140px;
}

.coupons-box.unused .graph-bottom.stacked {
  background-color: #0070d5;
  color: #ffffff;
}

.coupons-box.unused .graph-bottom.unstacked {
  background-color: #77b6ff;
  color: #005bac;
}

.coupons-box.unused .use-btn {
  background-color: #005bac;
}

.coupons-box.used-expired .graph {
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/youhuiquan02_pic.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/oldLeadNew/youhuiquan02_pic.png") 1x,
      url("/static-dist/app/img/2018/1.0/oldLeadNew/youhuiquan02_pic@2x.png") 2x);
}

.coupons-box.used-expired .graph-bottom.stacked {
  background-color: #999999;
  color: #ffffff;
}

.coupons-box.used-expired .graph-bottom.unstacked {
  background-color: #e4e4e4;
  color: #888;
}

.coupons-box.used-expired .use-btn {
  background-color: #d8d8d8;
}

/*下单页面*/

.use-coupon .coupon-title span {
  float: left;
}

.use-coupon .coupon-title .graph {
  width: 26px;
  height: 20px;
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/shiyongyouhuiquan01_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/oldLeadNew/shiyongyouhuiquan01_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/oldLeadNew/shiyongyouhuiquan01_icon@2x.png") 2x);
}

.use-coupon .coupon-title .text {
  margin-left: 8px;
  font-weight: 500;
}

.use-coupon .coupon-title .coupon-tip {
  font-size: 12px;
  color: #909eab;
  /* padding-left: 10px; */
}

.use-coupon .coupon-title .coupon-tip.warning {
  color: #f00;
  /* padding-left: 10px; */
}

.use-coupon .coupon-title .icon {
  margin-left: 10px;
  margin-top: 5px;
  width: 17px;
  height: 10px;
  cursor: pointer;
}

.use-coupon .coupon-title .icon.expand {
  /* background: url('/static-dist/app/img/2018/1.0/oldLeadNew/zhankai01_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/oldLeadNew/zhankai01_icon.png') 1x, url('/static-dist/app/img/2018/1.0/oldLeadNew/zhankai01_icon@2x.png') 2x); */
  background: url("/static-dist/app/img/shenlan19/youhuiquanzhankai_icon@2x.png") no-repeat center;
  background-size: 12px;
}

.use-coupon .coupon-title .icon.fold {
  /* background: url('/static-dist/app/img/2018/1.0/oldLeadNew/shouqi01_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/oldLeadNew/shouqi01_icon.png') 1x, url('/static-dist/app/img/2018/1.0/oldLeadNew/shouqi01_icon@2x.png') 2x); */
  background: url("/static-dist/app/img/shenlan19/youhuiquanshouqi_icon@2x.png") no-repeat center;
  background-size: 12px;
}

.use-coupon .coupon-content {
  /* border: 1px solid #EEEEEE;
    border-radius: 4px; 
    margin-top: 20px; */
  padding: 20px 20px 0 20px;
  /* display: none; */
}

@media (max-width: 768px) {
  .use-coupon .coupon-content {
    padding: 20px 4px 0;
  }
}

.use-coupon .coupon-content .coupon-code {
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}

.use-coupon .coupon-content .coupon-code-title,
.choose-coupon-title {
  font-size: 14px;
  color: #424242;
}

.use-coupon .coupon-content .coupon-code-input {
  margin-top: 10px;
}

.use-coupon .coupon-content .coupon-code-input input {
  border: 1px solid #cccccc;
  border-radius: 4px;
  float: left;
  width: 200px;
  height: 36px;
  padding-left: 10px;
}

.use-coupon .coupon-content .coupon-code-input button {
  float: left;
  font-size: 14px;
}

.use-coupon .coupon-content .coupon-code-input .use-btn {
  /*padding: 8px 17px;*/
  background-color: #0091ff;
  border-radius: 4px;
  color: #fff;
  margin-left: 10px;
  width: 62px;
  height: 36px;
}

.use-coupon .coupon-content .coupon-code-input .coupon-use-cancel {
  line-height: 36px;
  padding-left: 14px;
  color: #bababa;
  float: left;
}

@media (max-width: 380px) {
  .use-coupon .coupon-content .coupon-code-input .use-btn {
    margin-left: 0;
  }
}

.use-coupon .coupon-content .coupon-code-input .cancle-use-btn {
  color: #3f4a54;
  margin-left: 14px;
  margin-top: 8px;
}

.use-coupon .coupon-content .choose-coupon {
  padding-top: 20px;
}

.use-coupon .coupon-content .choose-coupon .more {
  /*text-align: center;*/
  height: 50px;
  line-height: 50px;
  font-size: 14px;
  color: #3f4a54;
  position: relative;
}

.use-coupon .coupon-content .choose-coupon .check-more {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  cursor: pointer;
}

.use-coupon .coupon-content .choose-coupon .check-more:after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -18px;
  width: 12px;
  height: 7px;
  background: url("/static-dist/app/img/2018/1.0/oldLeadNew/zhankai01_icon.png") no-repeat center;
  background-image: -webkit-image-set(url("/static-dist/app/img/2018/1.0/oldLeadNew/zhankai01_icon.png") 1x,
      url("/static-dist/app/img/2018/1.0/oldLeadNew/zhankai01_icon@2x.png") 2x);
  background-size: 100% 100%;
}

.use-coupon .coupons-box {
  margin-top: -10px;
  padding-bottom: 20px;
  max-width: 100%;
}

.use-coupon .coupons-box li {
  border: none;
  border-radius: 0;
  margin-top: 20px;
  min-width: auto;
  height: 120px;
}

/* 不可用优惠券 */
.use-coupon .coupons-box li.unUsedItem {
  opacity: 0.6;
}

.use-coupon .coupons-box li .center {
  border: 1px solid #f5f5f5;
  border-radius: 2px;
  height: 100%;
  cursor: pointer;
  position: relative;
}

.use-coupon .coupons-box li .center.ygq:after {
  width: 67px;
  height: 52px;
  position: absolute;
  top: 50%;
  right: 6px;
  background: url(/static-dist/app/img/2018/1.0/oldLeadNew/yiguoqiyinzhang_pic@2x.png) no-repeat center;
  background-size: 100%;
  margin-top: -32px;
}

.use-coupon .coupons-box li .center .check-mark {
  display: none;
}

.use-coupon .coupons-box li.active .center {
  border: 2px solid #0091ff;
  position: relative;
}

.use-coupon .coupons-box li.active .center .check-mark {
  display: block;
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 40px;
  height: 40px;
  /* background: url('/static-dist/app/img/2018/1.0/oldLeadNew/xuanzhong01_icon.png') no-repeat center;
    background-image: -webkit-image-set(url('/static-dist/app/img/2018/1.0/oldLeadNew/xuanzhong01_icon.png') 1x, url('/static-dist/app/img/2018/1.0/oldLeadNew/xuanzhong01_icon@2x.png') 2x); */
  background: url("/static-dist/app/img/shenlan19/xuanzhong01_icon@2x.png") no-repeat center;
  background-size: 40px;
}

@media (max-width: 630px) {
  .use-coupon .coupons-box {
    max-width: 100%;
    margin: 0;
  }

  .cartCoupon-box .coupon-content .coupon-name {
    margin-left: 14px;
  }

  /*下单页、优惠券页面通用样式*/
  .coupons-box li {
    height: auto !important;
  }

  /* 7.1 m优惠券改版*/
  .use-coupon .coupons-box li .center {
    display: flex;
  }

  .coupons-box li .graph {
    /* width: 100%;
        height: 110px; */
    width: 100px;
    height: 100px;
    float: none;
    display: inline-block;
    padding-top: 4px;
  }

  .coupons-box.unused .graph {
    background: url("/static-dist/app/img/2018/1.0/oldLeadNew/myhq-bg.jpg") no-repeat center;
    background-size: 100%;
    display: inline-block;
  }

  .coupons-box.unused .graph.ygq {
    background: url("/static-dist/app/img/2018/1.0/oldLeadNew/yhq02_icon@2x.png") no-repeat center;
    background-size: 100%;
  }

  .coupons-box li .graph-top {
    margin-top: 0;
  }

  .coupons-box li .text {
    margin-top: 12px;
    margin-left: 20px;
    /* margin-bottom: 12px; */
    width: calc(100% - 100px - 100px - 26px - 30px);
    float: none;
    font-size: 12px;
    display: inline-block;
  }

  .coupons-box li .text p:first-child {
    margin-bottom: 7px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    /* max-height: 40px; */
    white-space: normal;
    line-height: 18px;
  }

  /*我的优惠券页面*/
  .coupons-box li .use-btn {
    float: none;
    margin: 0 auto 12px;
    display: inline-block;
  }
}

@media (max-width: 498px) {
  .coupons-box li .text {
    width: calc(100% - 100px - 30px);
  }

  .coupons-box li .use-btn {
    display: inherit;
  }
}

.use-coupon .deduction {
  /* background: #F6F8FA; */
  /*background-color: #FCFCFC;*/
  border-radius: 4px 4px 0 0;
  /* margin-top: 20px; */
  font-size: 14px;
  color: #3f4a54;
  padding-right: 20px;
  height: 40px;
  line-height: 40px;
}

.use-coupon .deduction span {
  color: #ff6000;
}

.use-coupon .deduction .left_type {
  float: left;
}

.use-coupon .deduction .left_type p:first-child {
  font-size: 14px;
  color: #424242;
  line-height: 30px;
  float: left;
  width: 120px;
  border-right: 1px solid #d8d8d8;
  height: 30px;
  margin-top: 10px;
  background: url("/static-dist/app/img/libao_icon@2x.png") no-repeat left center;
  background-size: 21px 20px;
  padding-left: 40px;
}

.use-coupon .deduction .left_type p {
  font-size: 14px;
  color: #888888;
  float: left;
  margin-left: 20px;
}

.use-coupon .deduction .right_maney {
  float: right;
  line-height: 40px;
}

#order-create-btn {
  margin-right: 10px;
  width: 128px;
  height: 40px;
  border-radius: 20px;
  outline: none;
  border-color: #fe5400;
  background: #fe5400;
}

#order-create-btn.cart-btn {
  background: #fe5400;
  border-color: #fe5400;
}

.order-pay .toast {
  display: none;
  width: 260px;
  /* height: .5rem;*/
  padding: 19px 48px;
  line-height: 15px;
  border-radius: 10px;
  background-color: #00020c;
  color: #fff;
  font-size: 12px;
  text-align: center;
  position: fixed;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
}

/* 往期学员评价 */
.recommend-student.indexstu-evaluate {
  position: relative;
}

.recommend-student.indexstu-evaluate:before {
  content: "";
  position: absolute;
  width: 410px;
  height: 349px;
  top: 50px;
  left: -100px;
  background: url("/static-dist/app/img/shenlan2020/zhuangshi02_pic@2x.png") no-repeat;
  background-size: 100% 100%;
  z-index: -1;
  /* 新年皮肤 */
  /* width: 316px;
  height: 589px;
  top: -340px;
  left: 0;
  background: url("/static-dist/app/img/2021/2023_left@2x.png") no-repeat;
  background-size: 100% 100%; */
}

.recommend-student.indexstu-evaluate::after {
  content: "";
  position: absolute;
  width: 410px;
  height: 320px;
  bottom: 0;
  right: -100px;
  background: url("/static-dist/app/img/shenlan2020/zhuangshi03_pic@2x.png") no-repeat;
  background-size: 100% 100%;
  z-index: -1;
  /* 新年皮肤 */
  /* width: 338px;
  height: 589px;
  top: 500px;
  right: 0;
  background: url("/static-dist/app/img/2021/2023_right.png") no-repeat;
  background-size: 100% 100%; */
}

.recommend-student.course-wrap {
  background: #fff;
  max-width: 1920px;
  padding-top: 20px;
  padding-bottom: 20px;
  margin: 0 auto;
}

.recommend-student.course-wrap-mobile {
  padding-top: 20px;
  padding-bottom: 20px;
}

.recommend-student .swiper-pagination-student {
  margin-top: 30px;
  text-align: center;
}

.recommend-student .title-border-bg {
  margin-bottom: 30px;
  text-align: center;
}

.recommend-student .title-bg {
  display: inline-block;
  height: 46px;
  width: 139px;
  background: url(/static-dist/app/img/shenlan2020/05xueyuanpingjia_pic@2x.png);
  background-size: 139px 46px;
}

/* vio title */

.allTalk {
  width: 100%;
  /* height: 285px; */
}

.allTalkPc {
  padding-bottom: 60px !important;
}

.studentRem {
  display: none;
}

.allTalk .swiper-slide {
  font-size: 13px;
  /* background: #fff; */
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.allTalk .allTalk-box {
  width: 347px;
  height: 304px;
  background: #ffffff;
  border: 1px solid #e5ecf7;
  box-shadow: 0 0 20px 0 rgba(73, 130, 186, 0.1);
  border-radius: 8px 40px 8px 8px;
  margin-right: 15px;
}

.allTalk .allTalk-box.course-show {
  width: 530px;
  height: 240px;
}

.allTalk-box:nth-last-of-type(1) {
  margin-right: 0px;
}

.allTalk .allTalk-box a {
  width: 100%;
  height: 100%;
  color: #84889a;
  cursor: default;
}

.allTalk .allTalk-box img {
  width: 60px;
  height: 60px;
}

.allTalk .allTalk-box .tx {
  padding: 20px;
  position: relative;
}

.allTalk .allTalk-box .tx .name {
  position: absolute;
  top: 30px;
  left: 96px;
  font-size: 16px;
  color: #2c3240;
}

.allTalk .allTalk-box .tx .school {
  position: absolute;
  top: 55px;
  left: 96px;
  font-size: 12px;
  color: #a6afbf;
}

.allTalk .allTalk-box p.text {
  padding: 0 31px 20px 48px;
  background-image: url("/static-dist/app/img/shenlan19/yinhao_icon@2x.png");
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: 14px 0;
  text-align: justify;
}

/* 上传附件作业按钮 */

.testpaper-card-up {
  text-align: center;
  margin-top: 30px;
  margin-bottom: 30px;
}

/* 职业方向页面样式设置 */
.orientation-banner-wrap {
  max-width: 1920px;
  height: 403px;
  margin: 0 auto;
  background: url("/static-dist/app/img/shenlan19/01shenduxuexi02_pic.png") no-repeat;
  background-position: top center;
  text-align: center;
}

.wechatimg {
  position: relative;
  width: 90px;
  height: 90px;
  border-radius: 4px;
  display: none;
}

.wechatimg:before {
  content: "";
  position: absolute;
  top: -10px;
  left: 40px;
  border-bottom: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
}

.wechatimg img {
  width: 90px;
  height: 90px;
}

/* 开始学习 */
.mt43 {
  margin-top: 43px;
}

.start-student {
  text-align: center;
  display: inline-flex;
}

.start-student .teacher-hover-wechat {
  white-space: nowrap;
}

@media (max-width: 767px) {
  /* 23.03.19 详情页优化 start */
  .apply-main .main-right {
    text-align: center;
  }
  .start-student {
    flex-direction: column;
    max-width: 50%;
  }
  /* 23.03.19 详情页优化 end */

  .start-student .teacher-hover-wechat {
    /* margin: 0 50px; */
  }

  .start-student {
    /* display: block; */
    display: inline-flex;
  }

  .threads-box {
    text-align: center;
    margin-top: 20px;
  }
}

.start-student .tooltip-inner {
  background: #ffffff !important;
  padding: 0 !important;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);
}

.start-student .tooltip-arrow {
  border-right-color: #ffffff !important;
}

.start-student .tooltip-inner img {
  width: 90px;
  height: 90px;
}

@media (max-width: 767px) {
  .immed-signup-ripe {
    width: 375px;
    height: 60px;
    background: #fffbf4;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
  }

  .immed-signup-ripe .time-limited-price .limited-price .top-price {
    font-family: MicrosoftYaHeiUI;
    font-size: 14px;
    color: #202e3a;
    letter-spacing: 0;
    font-weight: 400;
  }

  .immed-signup-ripe .time-limited-price .limited-price .top-price .top-money {
    font-family: MicrosoftYaHeiUI-Bold;
    font-size: 18px;
    color: #e83d2c;
    letter-spacing: 0;
    font-weight: 700;
  }

  .immed-signup-ripe .time-limited-price .limited-price .top-price .original-price {
    font-family: MicrosoftYaHeiUI;
    font-size: 14px;
    color: #a7b2c3;
    letter-spacing: 0;
    line-height: 18px;
    font-weight: 400;
    padding-top: 7px;
  }

  .immed-signup-ripe .remaining-places {
    display: flex;
    align-items: center;
    width: 135px;
    height: 40px;
    background-image: linear-gradient(180deg, #ffe2b0 0%, #c9aa70 100%);
    border-radius: 4px;
  }

  /* .immed-signup-ripe .remaining-places .surplus {
        font-size: 12px;
        color: #6E4631;
        letter-spacing: 0;
        font-weight: 400;
        padding: 0 7px 0 10px;
    }
    .immed-signup-ripe .remaining-places .surplus-num {
        width: 64px;
        height: 30px;
        background: #FFFFFF;
        border-radius: 4px;
        text-align: center;
        line-height: 30px;
        font-size: 16px;
        color: #987A43;
        letter-spacing: 0;
        font-weight: 700;
    } */
}

.immed-signup .tooltip-inner,
.remain-scroll .tooltip-inner {
  width: 240px;
  max-width: 300px !important;
  background: rgba(0, 0, 0, 0.8) !important;
}

.vipPrice-explain .tooltip-inner {
  width: 263px;
  max-width: 340px !important;
  background: rgba(0, 0, 0, 0.8) !important;
}

.tooltipxl .tooltip-inner {
  width: 300px;
  max-width: 300px !important;
  background: rgba(0, 0, 0, 0.8) !important;
}

.orientation-banner-wrap h2 {
  padding-top: 60px;
  padding-bottom: 14px;
  font-size: 40px;
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(28, 31, 33, 0.2);
}

.orientation-banner-wrap p {
  font-size: 16px;
  color: rgba(245, 248, 250, 0.7);
  line-height: 24px;
  max-width: 920px;
  margin: 0 auto;
  padding: 0 10px;
  box-sizing: border-box;
}

.orientation-banner-wrap a {
  display: block;
  font-size: 14px;
  width: 120px;
  line-height: 40px;
  margin: 30px auto 12px;
  background: #ffffff;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  text-align: center;
  color: #003e87;
  letter-spacing: 1.17px;
}

.orientation-banner-wrap span {
  font-size: 12px;
  color: #4a90e2;
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .orientation-banner-wrap h2 {
    padding-top: 40px;
    font-size: 30px;
  }

  .orientation-banner-wrap p {
    font-size: 12px;
  }

  .orientation-banner-wrap a {
    margin: 20px auto 12px;
  }
}

/* 应用领域 */
.orientation-field {
  max-width: 920px;
  margin: 0 auto;
  margin-top: -92px;
  background: #ffffff;
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
  border-radius: 8px;
  text-align: center;
}

.orientation-field h2 {
  font-size: 20px;
  color: #2c2e40;
  padding-top: 27px;
  padding-bottom: 26px;
}

.orientation-field ul {
  display: inline-block;
}

.orientation-field .field-item {
  padding-bottom: 40px;
  margin-right: 45px;
  display: inline-block;
}

.orientation-field li:nth-last-of-type(1) {
  margin-right: 0px !important;
}

.orientation-field .field-item div {
  display: inline-block;
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background: #e9eef3;
  margin-bottom: 12px;
}

@media (max-width: 768px) {
  .orientation-field .field-item {
    padding-bottom: 20px;
    margin-right: 20px;
  }
}

/* 领域图片宽高设置。 */
.orientation-field .field-item img {
  width: 60px;
  height: 60px;
}

.orientation-field .field-item p {
  font-size: 14px;
  color: #6b778e;
}

/* 课程 */
.orientation-course-wrap {
  max-width: 920px;
  margin: 60px auto 30px;
  text-align: center;
}

.orientation-course-wrap h3 {
  font-size: 30px;
  color: #2c2e40;
  margin-bottom: 12px;
}

.orientation-course-wrap .course-deltitle {
  font-size: 14px;
  color: #a7b2c3;
  margin-top: 10px;
  margin-bottom: 12px;
}

.orientation-course-item {
  padding: 20px;
  background: #ffffff;
  border: 1px solid #e9eef3;
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
  border-radius: 8px;
  margin-top: 20px;
}

.orientation-course-item .spanTags {
  display: inline-block;
  height: 30px;
  width: 65%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.orientation-course-item .aimg-wrap {
  display: inline-block;
  margin-right: 20px;
}

.orientation-course-item div.img {
  max-width: 255px;
  display: inline-block;
}

.orientation-course-item div.img img {
  width: 100%;
  border-radius: 8px;
}

.orientation-course-item .text_con {
  /* max-width: 600px; */
  width: 100%;
  text-align: left;
  padding-top: 10px;
}

@media (min-width: 900px) {
  .orientation-course-item .text_con {
    width: 600px;
  }
}

.orientation-course-item .text_con a {
  font-size: 18px;
  color: #213249;
}

.orientation-course-item .text_con p.desc {
  font-size: 14px;
  color: #a7b2c3;
  height: 46px;
  margin-top: 12px;
  margin-bottom: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.orientation-course-item .price_con p.num {
  font-size: 12px;
  color: #a7b2c3;
  line-height: 30px;
}

.orientation-course-item .sale-price .ori {
  font-size: 18px;
  color: #fa4661;
}

/* 相关推荐 */
.about-recommend {
  background: #ffffff;
  /* margin-top:30px; */
}

.about-recommend h2 {
  font-size: 30px;
  color: #2c2e40;
  text-align: center;
}

/* 手机等移动设备的头部 */
@media (min-width: 767px) {
  .mobile-place {
    display: none;
  }

  .common-pdt {
    padding-top: 60px;
  }

  .common-pdt.announce {
    padding-top: 120px;
  }

  .public-course-container {
    margin-left: -20px;
  }
}

@media (max-width: 767px) {

  /* 首页查看更多 */
  .index-view-more {
    display: block;
  }

  html {
    font-size: 100px;
  }

  .common-pdt {
    padding-top: 0px;
  }

  .mobile-place {
    display: block;
    /* 新年皮肤 */
    /* background: url(/static-dist/app/img/2021/Mzhan_bj@2x.png) no-repeat top center;
    height: 60px;
    background-size: 100% 100%; */
  }

  .mobile-place.announce {
    margin-top: 40px;
  }

  .defaultIndex,
  .headerIndex {
    display: none;
  }

  .company h2 {
    padding-bottom: 0px;
    padding-top: 0px;
  }

  .main-wrap {
    padding-top: 0 !important;
  }

  .mobile {
    background-color: #f5f8fa;
    color: #3f4a54;
    /*font-size: 100px;*/
    display: block;
  }

  .company-mobile {
    display: block;
  }

  .mobile .place {
    width: 100%;
    height: 0.6rem;
  }

  html {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .wrapper {
    border-top: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
    padding: 0.2rem 0.16rem;
    background-color: #fff;
    margin-top: 0.1rem;
  }

  .wrapper span.more {
    font-size: 0.14rem;
    color: #999999;
    line-height: 0.2rem;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
  }

  .wrapper .title {
    font-size: 0.16rem;
    line-height: 0.22rem;
    position: relative;
    margin-left: 0.09rem;
    /*margin-bottom: 0.14rem;*/
  }

  .wrapper .title:before {
    content: "";
    width: 0.03rem;
    height: 0.16rem;
    background-color: #005bac;
    border-radius: 0.03rem;
    position: absolute;
    left: -0.09rem;
    top: 50%;
    transform: translateY(-50%);
  }

  .wrapper li:nth-child(even) {
    margin-left: 0.13rem;
  }

  .wrapper li img {
    width: 1.65rem;
    height: 0.93rem;
    border-radius: 0.05rem;
  }

  .wrapper li a {
    color: #3f4a54;
  }

  .wrapper .info .details .number {
    font-size: 0.12rem;
    color: #979797;
    line-height: 0.17rem;
  }

  .wrapper .info .details .price {
    font-size: 0.14rem;
    color: #e83d2c;
    line-height: 0.2rem;
    font-weight: 500;
  }

  /*返回顶部*/
  .toTop {
    cursor: pointer;
    position: fixed;
    bottom: 20vh;
    right: 0.14rem;
    width: 0.4rem;
    height: 0.4rem;
    border: 1px solid #ffffff;
    border-radius: 50%;
    background: url("/static-dist/app/img/2018/mobile1.1.0/fanhuidingbu_icon1.png") rgba(0, 0, 0, 0.5) no-repeat center;
    background-image: -webkit-image-set(url("/static-dist/app/img/2018/mobile1.1.0/fanhuidingbu_icon1.png") 1x,
        url("/static-dist/app/img/2018/mobile1.1.0/fanhuidingbu_icon1@2x.png") 2x,
        url("/static-dist/app/img/2018/mobile1.1.0/fanhuidingbu_icon1@3x.png") 3x);
    background-size: 0.14rem 0.22rem;
    z-index: 1;
  }

  /*头部*/
  header {
    height: 0.6rem;
    position: relative;
    /* background-color: #fff; */
    z-index: 2000;
  }

  header .logo img {
    width: 1rem;
    position: absolute;
    left: 0.14rem;
    top: 50%;
    transform: translateY(-50%);
  }

  header .search {
    width: 1.79rem;
    height: 0.3rem;
    position: absolute;
    left: 1.46rem;
    top: 50%;
    transform: translateY(-50%);
  }

  header .search input {
    width: 1.79rem;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 1rem;
    font-size: 0.12rem;
    padding-left: 0.15rem;
    padding-right: 30px;
    background-color: #f1f1f1;
  }

  /* 新年皮肤 */
  /* header .search input:focus {
    border-color: #ad5d33 !important;
  } */

  header .search input::-webkit-input-placeholder {
    color: #bababa;
  }

  header .search input:-moz-input-placeholder {
    color: #bababa;
  }

  header .search input::-moz-input-placeholder {
    color: #bababa;
  }

  header .search input::-ms-input-placeholder {
    color: #bababa;
  }

  header .search .icon-search {
    color: #949494;
    position: absolute;
    top: 0.09rem;
    right: 0.1rem;
  }

  header .icon-personal-center {
    /* width: 0.22rem;
        height: 0.22rem;
        background: url('/static-dist/app/img/2018/mobile1.1.0/personal_center_icon.png') no-repeat;
        background-image: -webkit-image-set(url('/static-dist/app/img/2018/mobile1.1.0/personal_center_icon.png') 1x, url('/static-dist/app/img/2018/mobile1.1.0/personal_center_icon@2x.png') 2x, url('/static-dist/app/img/2018/mobile1.1.0/personal_center_icon@3x.png') 3x);
        background-size: 100% 100%; */
    font-size: 0.18rem;
    position: absolute;
    right: 0.14rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
  }

  header .dropdown-menu {
    width: 1.6rem;
    box-shadow: 0 0.04rem 0.08rem 0 rgba(0, 0, 0, 0.1);
    position: absolute;
    top: 0.61rem;
    right: 0.05rem !important;
    z-index: 200;
    display: none;
    cursor: pointer;
    font-size: 0.14rem;
  }

  /* #content-container {
        margin:0 !important;
    } */
  /*导航栏*/
  .nav-bar {
    position: relative;
    /* 新年皮肤 */
    /* background-color: #fff; */
    z-index: 199;
    width: 100vw;
    height: 0.34rem;
    /* overflow-y: hidden; */
    position: relative;
  }

  .nav-bar .nav-container {
    overflow-x: scroll;
    overflow-y: hidden;
    position: absolute;
    left: 0;
    top: 0;
  }

  /*.nav-bar .nav-container::-webkit-scrollbar {
        display: none
    }*/
  .nav-bar li {
    font-size: 0.14rem;
    display: inline-block;
    /*margin-left: 0.25rem;*/
  }

  .nav-bar li:last-of-type {
    padding-right: 0.2rem;
  }

  .nav-bar li a {
    padding: 0 0.125rem;
    color: #3f4a54;
    /* 新年皮肤 */
    /* color: #AD5D33; */
  }

  .nav-bar ul {
    white-space: nowrap;
    /*overflow-x: scroll;*/
    /* background-color: #fff; */
    width: 100vw;
    height: 0.34rem;
    line-height: 0.34rem;
    box-shadow: 0 0.04rem 0.04rem 0 rgba(0, 0, 0, 0.1);
  }

  .nav-bar ul::-webkit-scrollbar {
    display: none;
  }

  /* m站二级导航样式 */
  .nav-bar ul.sub-dropdown-menu {
    line-height: 0.26rem;
    padding: 5px;
    border-radius: 0 0 4px 4px;
    text-align: center;
    left: 285px;
    width: auto;
    height: auto;
    padding: 5px 0;
  }
  .nav-bar ul.sub-dropdown-menu>li {
    display: block;
    padding: 0;
  }
  .nav-bar ul.sub-dropdown-menu>li>a {
    padding: 10px 16px;
  }

  .nav-bar .mask {
    width: 7%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: -webkit-linear-gradient(left,
        rgba(255, 255, 255, 0) -50%,
        rgba(255, 255, 255, 1));
    background-image: -o-linear-gradient(right,
        rgba(255, 255, 255, 0) -50%,
        rgba(255, 255, 255, 1));
    background-image: -moz-linear-gradient(right,
        rgba(255, 255, 255, 0) -50%,
        rgba(255, 255, 255, 1));
    background-image: linear-gradient(to right,
        rgba(255, 255, 255, 0) -50%,
        rgba(255, 255, 255, 1));
  }

  /*banner M站适配*/
  .open-class .open-class-box .course-author-widget .nickname {
    display: none;
  }

  .es-footer .container .mts span {
    padding-left: 2px;
    padding-right: 0px;
  }

  /* .course-list-nav{
        margin-top:0px;
    } */
  .es-footer .container .mts {
    display: block;
    font-size: 12px;
  }

  /* 职业方向 */
  .orientation-course-item .aimg-wrap {
    margin-right: 0px;
    width: 100%;
  }

  .orientation-course-item div.img {
    max-width: 100%;
  }

  .row {
    position: relative;
  }

  /* 课程中心 */
  .course-list-sections {
    display: block;
  }

  .course-list-sections .title-sections {
    display: flex;
    justify-content: space-between;
    height: 46px;
    border-top: 1px solid #e9eef3;
    border-bottom: 1px solid #e9eef3;
  }

  .course-list-sections .flag-options {
    position: relative;
  }

  .course-list-sections .title-sections .title-sections-content {
    display: flex;
    flex: 1;
    height: 44px;
    align-items: center;
    white-space: nowrap;
    overflow-x: scroll;
    background-color: #fff;
  }

  .course-list-sections .title-sections .title-sections-content li {
    padding: 0 20px;
  }

  .course-list-sections .title-sections .title-sections-content li a {
    color: unset;
  }

  .course-list-sections .title-sections .drop-down {
    width: 44px;
    height: 44px;
    border-left: 1px solid #e9eef3;
    box-sizing: border-box;
    text-align: center;
    line-height: 44px;
    background-color: #fff;
  }

  .course-list-sections .title-sections .drop-down .pull-down-triangle {
    width: 8.07px;
    height: 13.3px;
    transform: rotate(-270deg);
    background: #28435d;
  }

  .course-list-sections .title-nav {
    display: flex;
    height: 44px;
    border-bottom: 1px solid #e9eef3;
    align-items: center;
    font-family: MicrosoftYaHei;
    font-size: 14px;
    color: #9eadbc;
    font-weight: 400;
    padding-left: 14px;
  }

  .active {
    color: #005bac !important;
    font-weight: 700 !important;
  }

  .title-nav h2 {
    color: #9eadbc;
    font-size: 14px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    display: flex;
    align-items: center;
  }

  .title-nav h2:nth-child(2) {
    padding-left: 40px;
  }

  .title-nav h2 p {
    width: 0;
    height: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-bottom: 5px solid #909eab;
    margin-left: 6px;
  }

  .title-nav h2:nth-child(2) .triangle-stage {
    transform: rotate(180deg);
  }

  .btn-course-submit {
    display: flex;
    margin-top: 40px;
    padding-bottom: 26px;
  }

  .btn-course-submit button {
    height: 36px;
    font-family: FZLTHK--GBK1-0;
    font-size: 14px;
    text-align: center;
    font-weight: 400;
    line-height: 36px;
  }

  .btn-course-submit button a {
    color: #516577;
  }

  .btn-course-submit .reset {
    flex: 0.3;
    background: #ffffff;
    border: 1px solid #516577;
    border-radius: 18px;
    box-sizing: border-box;
    margin-left: 20px;
  }

  .btn-course-submit .determine {
    flex: 0.7;
    background: #0091ff;
    border-radius: 18px;
    margin: 0 25px;
    color: #ffffff;
  }

  .course-list-sections .course-type {
    width: 100vw;
    position: absolute;
    background-color: #ffffff;
    z-index: 999;
  }

  .course-type::after {
    position: relative;
  }

  .course-type .sections-container {
    margin-top: 20px;
    padding-bottom: 25px;
  }

  .course-type .course-footer {
    position: absolute;
    bottom: 0;
    width: 100vw;
    height: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1px solid #f0f0f0;
  }

  .course-footer img {
    width: 35;
    height: 7px;
  }

  .course-list-sections .course-type span {
    display: inline-block;
    margin: 5px 5px 5px 20px;
    width: 24vw;
    height: 32px;
    background: #ffffff;
    border: 1px solid #e1e1e1;
    border-radius: 16px;
    text-align: center;
    line-height: 32px;
    font-size: 12px;
    color: #9c9c9c;
  }

  .course-list-sections .course-type p {
    display: inline-block;
    margin: 15px 5px 10px 20px;
    width: 24vw;
    height: 32px;
    background: #ffffff;
    border: 1px solid #e1e1e1;
    border-radius: 16px;
    text-align: center;
    line-height: 32px;
    font-size: 12px;
    color: #9c9c9c;
  }

  .course-active {
    background: #ecf8ff !important;
    border: 1px solid #0091ff !important;
    color: #0091ff !important;
  }

  .course-list-nav {
    display: none;
  }

  .bgblack-dialog {
    display: none;
    position: absolute;
    top: 44px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
  }

  /* tooltip提示 */
  .immed-signup .remain .es-icon-help1 {
    display: none;
  }

  /* 间距调整 */
  .quality-course {
    padding-top: 20px;
  }

  .quality-course .course-list,
  .company .company-box {
    margin-top: 20px;
  }

  .open-class h2,
  .recommend-student .title-border-bg {
    margin-bottom: 20px;
  }
}

/* 通知样式 */
.notification-list .notification-list__media.active {
  background-color: rgba(0, 129, 230, 0.08);
}

/* 咨询服务模块 */
.service-module-wrap {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  height: 0px;
  z-index: 999;
  /* z-index: 1034; */
}

/* 引导广告标志 口 */
.service-module-wrap .c-intro-banner {
  display: inline-block;
  position: fixed;
  bottom: 400px !important;
}

.service-module-wrap .c-intro-banner img {
  width: 102px;
}

.c-intro-banner-close {
  position: fixed;
  z-index: 10;
  right: 0px;
  bottom: 279px;
  width: 22px;
  height: 22px;
  cursor: pointer;
}

.c-intro-banner-close.pc {
  position: absolute;
  /* right: -35px;
    bottom: 326px; */
  right: 8px;
  bottom: 331px;
}

.c-intro-banner-close.cMobile {
  position: absolute;
  right: -2px;
  bottom: 331px;
}

/* 右下角位置 */
.service-module {
  position: fixed;
  margin-left: 1126px;
  bottom: 150px;
  z-index: 20;
}

/* 侧边栏 */
.service-module-con {
  padding-top: 10px;
  width: 120px;
}

@media (max-width: 767px) {
  .service-module-con {
    display: none;
  }

  .service-moblie-con {
    display: block !important;
  }
}

.service-moblie-con {
  display: none;
  padding-top: 10px;
}

.service-module-con .btnbox {
  display: flex;
  align-items: center;
  margin-bottom: 6px;
}

.service-moblie-box {
  display: none;
}

.service-moblie-con .btnbox {
  display: flex;
  align-items: center;
  margin-bottom: 6px;
}

.service-module-box {
  display: none;
  transition: 0.5s;
}

.service-module-con .btnbox .btnbox_icon {
  display: block;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255, 255, 255, 1);
  box-shadow: 0px 2px 10px 0px rgba(65, 89, 140, 0.1);
  border-radius: 50%;
  margin-right: 8px;
}

/* 返回顶部hover */
.gotoptxt {
  display: none;
}

.gotopA:hover .gotoptxt {
  display: block;
}

.service-moblie-con .btnbox .btnbox_icon {
  display: block;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255, 255, 255, 1);
  box-shadow: 0px 2px 10px 0px rgba(65, 89, 140, 0.1);
  border-radius: 50%;
}

.mr4 {
  margin-right: 4px !important;
}

.xsanjiao {
  position: absolute;
  top: 10px;
  left: -4px;
  display: inline-block;
  width: 4px;
  height: 8px;
  background: url("../assets/sanjiao.svg") center center no-repeat;
  background-size: cover;
}

/* 新增折叠优化 */

.changjianwenti:hover .cjwtTxt {
  display: block;
  margin-left: 5px;
}

.zhengshuchaxun:hover .zscxTxt {
  display: block;
  margin-left: 5px;
}

.gongzhonghao:hover .gzhTxt {
  display: block;
  margin-left: 5px;
}

.zaixianzixun:hover .zxzxTxt {
  display: block;
  margin-left: 5px;
}

/* 新增折叠优化 end */

.icon_changjianwenti {
  background: #fff url("../assets/QA_icon.svg") center center no-repeat;
}

.icon_zhengshuchaxun {
  background: #fff url("../assets/zhengshu01_icon.svg") center center no-repeat;
}

.icon_gongzhonghao {
  background: #fff url("../assets/gongzhonghao_icon.svg") center center no-repeat;
}

.icon_zaixianzixun {
  background: #fff url("../assets/zixun_icon.svg") center center no-repeat;
}

.icon_fhdb {
  background: #237be2 url("../assets/topIcon.svg") center center no-repeat;
}

.icon_menu {
  background: #237be2 url("../assets/icons_menu.svg") center center no-repeat;
}

.service-module-con:hover .service-module-box {
  display: block;
}

.service-module-con:hover .gotoptxt {
  display: block;
}

.service-module-con .btnbox span {
  display: none;
  position: relative;
  height: 28px;
  line-height: 28px;
  text-align: center;
  color: #f7f7f7;
  font-family: PingFang-SC-Regular;
  font-size: 12px;
  color: #f7f7f7;
  background: #33383d;
  border-radius: 4px;
  padding: 0 8px;
}

.service-module a.btntags {
  position: relative;
  background: #fff;
  display: block;
  color: #2f3c52;
  text-align: center;
  width: 60px;
  height: 60px;
  /* transition: all 0.3s; */
  z-index: 3;
}

.service-module .btn_icon-setting::before,
.service-module .btn_icon-setting::after {
  content: "";
  position: absolute;
  width: 40px;
  height: 1px;
  background: #d8d8d8;
  left: 50%;
  margin-left: -20px;
  bottom: 0;
  z-index: 2;
}

.service-module .btn_icon-setting::before {
  bottom: 100%;
}

.service-module .btn_icon {
  font-size: 18px;
  position: relative;
  top: 8px;
}

.service-module .btn_text {
  display: block;
  font-size: 12px;
  margin-top: 2px;
}

.service-module .btn_icon-first {
  border: 1px solid #eaebec;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.service-module .btn_icon-setting {
  border-left: 1px solid #eaebec;
  border-right: 1px solid #eaebec;
}

.service-module .btn_icon-top {
  border: 1px solid #eaebec;
  border-top: 0;
  border-radius: 0 0 8px 8px;
}

.service-module a.btntags:hover::after {
  height: 0;
}

.service-module .btntags.highlight {
  background-image: linear-gradient(180deg, #45afff 0%, #0076ff 100%);
  /* box-shadow: 0 8px 12px 0 rgba(176,213,255,0.50); */
  border-radius: 8px;
  transform: scale(1.05);
  z-index: 4;
  font-weight: bold;
  color: #fff;
  border: 0;
}

.service-module .btntags:not(.highlight):hover {
  font-weight: bold;
  color: #fff;
  border: 0;
  background: #0091ff;
}

.service-module .service-module-con {
  transition: all 0.5s ease;
}

.service-module .service-module-con.visihidden {
  opacity: 0;
  visibility: hidden;
}

.service-module .entry-collapse {
  width: 0;
  height: 0;
  position: absolute;
  top: 50%;
  right: -12px;
  margin-left: 5px;
  border: 10px solid transparent;
  -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.15));
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.15));
  transition: all 0.3s ease;
}

.service-module .entry-collapse.normal {
  border-left: 10px solid #fff;
  border-right: 0 solid #fff;
}

.service-module .entry-collapse.collapsed {
  border-left: 0 solid #fff;
  border-right: 10px solid #fff;
}

#unreadNum {
  display: none;
  position: absolute;
  right: 10px;
  top: 3px;
  min-width: 16px;
  height: 16px;
  border: 2px solid #dd5e6e;
  border-radius: 50%;
  background: #dd5e6e;
  color: #fff;
  font-size: 12px;
  text-align: center;
  line-height: 13px;
  z-index: 23;
  cursor: pointer;
}

/* 移动端上的在线咨询 */
@media (max-width: 767px) {
  .service-module {
    position: fixed;
    bottom: 57px;
    right: 12px;
  }

  .service-module a.btntags {
    width: 52px;
    height: 52px;
  }

  .service-module .btn_text {
    font-size: 10px;
  }

  .service-module-wrap .c-intro-banner {
    position: absolute;
    z-index: 10;
    right: 7px;
    bottom: 290px !important;
  }

  .service-module-wrap .c-intro-banner img {
    width: 60px;
  }

  /* 展开收起效果 */
  .service-module .entry-collapse {
    right: -10px;
  }
}

/* 搜索的课程列表页面 和详情页的相关推荐 */
.course-item-search .metas,
.about-recommend .metas {
  margin-top: 5px;
  margin-bottom: 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-right: 10px;
}

.course-item-search .metas span,
.about-recommend .metas span,
.orientation-course-item .spanTags span {
  background: #ebf4ff;
  border-radius: 4px;
  padding: 4px;
  margin-right: 6px;
  color: #6092cb;
}

/* 课程详情页分享操作按钮 */
.courseSet-btn-js a,
.courseSet-btn-js .courseSet-share span {
  color: #fff;
  /* font-size: 16px; */
  /* 因收藏字号巨大，需要12px，暂不知道和什么地方关联，记录原因 */
  font-size: 12px;
  padding: 0px 2px;
}

.courseSet-btn-js .btn-default-ff {
  color: #fff;
  background: none !important;
  border: 0;
}

.courseSet-btn-js .courseSet-share {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 30px;
  padding: 5px 12px 5px;
}

/* 销售转化 */
.sales-change {
  width: 100%;
  /* height: 32px; */
  display: block;
  /* position: absolute; */
  /* background: rgba(0,0,0,0.2); */
  /* border: 1px solid rgba(255,255,255,0.2); */
  /* border-radius: 30px; */
  /* float: right; */
  margin-top: 10px;
  text-align: right;
  font-size: 0;
}

.sales-change .input-hidden {
  width: 100px;
  position: absolute;
  top: -1000px;
  z-index: -10;
}

.sales-change .saleschange {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 30px;
  background: rgba(0, 0, 0, 0.2) url(/static-dist/app/img/shenlan2020/copylianjie_icon@2x.png) 13px 7px no-repeat;
  background-size: 16px 16px;
  padding: 4px 13px 5px 35px;
  color: #fff;
  font-size: 12px;
}

.sales-change .space {
  width: 28px;
  display: inline-block;
}

.immed-signup-ripe {
  display: none;
}

@media (max-width: 767px) {
  .immed-signup {
    display: none !important;
  }

  .immed-signup-ripe {
    width: 100%;
    height: 60px;
    background: #fffbf4;
    margin-top: 0;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
  }

  .immed-signup-ripe .time-limited-price .limited-price .top-price {
    font-family: MicrosoftYaHeiUI;
    font-size: 14px;
    color: #202e3a;
    letter-spacing: 0;
    font-weight: 400;
  }

  .immed-signup-ripe .time-limited-price .limited-price .top-price .top-money {
    font-family: MicrosoftYaHeiUI-Bold;
    font-size: 18px;
    color: #e83d2c;
    letter-spacing: 0;
    font-weight: 700;
  }

  .immed-signup-ripe .time-limited-price .limited-price .top-price .original-price {
    font-family: MicrosoftYaHeiUI;
    font-size: 14px;
    color: #a7b2c3;
    letter-spacing: 0;
    line-height: 18px;
    font-weight: 400;
    padding-top: 7px;
  }

  .immed-signup-ripe .remaining-places {
    display: flex;
    align-items: center;
    width: 135px;
    height: 40px;
    background-image: linear-gradient(180deg, #ffe2b0 0%, #c9aa70 100%);
    border-radius: 4px;
  }

  .immed-signup-ripe .remaining-places .surplus {
    font-size: 12px;
    color: #6e4631;
    letter-spacing: 0;
    font-weight: 400;
    padding: 0 0 0 8px;
    line-height: 14px;
    flex: 1;
  }

  .immed-signup-ripe .remaining-places .surplus-num {
    width: 64px;
    height: 30px;
    background: #ffffff;
    border-radius: 4px;
    text-align: center;
    line-height: 30px;
    font-size: 16px;
    color: #987a43;
    letter-spacing: 0;
    font-weight: 700;
    margin-right: 5px;
  }

  .pc-successdisbtn {
    display: none !important;
  }

  .cd-button.go-apply.successdisbtn {
    width: 100% !important;
    height: 44px !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
}

/* 课程详情页学习时长 */
.course-study-time {
  max-width: 1080px;
  margin: -82px auto 20px;
  background: #fff url("/static-dist/app/img/shenlan19/kechengtese_bg_pic.png") no-repeat;
  /* background-size:920px; */
  box-shadow: 0 8px 16px 0 rgba(208, 217, 227, 0.1);
  border-radius: 8px;
  height: 132px;
  text-align: center;
}

.course-study-time ul {
  display: inline-block;
  /* width:100%; */
}

.course-study-time li {
  width: 268px;
  height: 92px;
  margin-top: 20px;
  margin-bottom: 12px;
  border-right: 1px solid #e7ebef;
  /* padding-left:45px; */
  position: relative;
  /* float: left; */
}

.course-study-time li:nth-last-of-type(1) {
  border-right: 0;
}

.course-study-time li img {
  width: 72px;
  height: 72px;
  position: absolute;
  top: 10px;
  left: 45px;
}

.course-study-time li h3 {
  position: absolute;
  top: 16px;
  left: 131px;
  font-size: 16px;
  color: #2c2e40;
  text-align: left;
}

.course-study-time li p {
  width: 120px;
  position: absolute;
  left: 131px;
  top: 42px;
  font-size: 13px;
  color: #7b8fab;
  text-align: left;
}

/* 售后页面tab */
.course-tabs-wrap {
  width: 100%;
  box-shadow: 0px 20px 20px -20px rgb(0 0 0 / 5%);
  height: 64px;
  background: #fff;
  /* margin: 40px 0; */
}

.course-tabs-wrap-fixed {
  position: fixed;
  top: 60px;
  z-index: 9;
}

.m-course-tabs-wrap-fixed {
  position: fixed;
  top: 0px;
  z-index: 9;
  margin-top: 0;
}

.course-tabs {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  width: 288px;
  margin: auto;
  font-size: 16px;
  color: #333333;
  font-weight: 400;
}

.course-tabs-item {
  cursor: pointer;
  position: relative;
}

.course-tabs .active {
  color: #006ec2;
  font-weight: 600;
}

.course-tabs .active::after {
  position: absolute;
  content: "";
  width: 24px;
  height: 3px;
  background: #006ec2;
  border-radius: 2px;
  left: 50%;
  margin-left: -12px;
  bottom: -6px;
}

.course-tabs-content>.course-tabs-pane {
  display: none;
}

.course-tabs-content .is-show {
  display: block;
}

/* 售后详情页-课程模块 */
.cs-card {
  padding: 16px;
  background: #ffffff;
  box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  margin-bottom: 20px;
}

.cs-course .cs-one-outline .r-outline {
  margin-left: 40px;
}

.cs-course .cs-course-progress {
  padding: 24px 20;
}

.cs-course .cs-course-progress .cs-course-icon {
  width: 39px;
  height: 48px;
  display: inline-block;
  vertical-align: middle;
}

.cs-course .cs-course-progress .cs-course-describe {
  display: inline-block;
  vertical-align: middle;
  margin-left: 20px;
}

.cs-course-progress .cs-course-describe .cs-course-update {
  margin-bottom: 10px;
  font-family: MicrosoftYaHeiUI;
  font-size: 16px;
  color: #333333;
  letter-spacing: 0;
  line-height: 20px;
  font-weight: 400;
}

.cs-course-progress .cs-course-describe .cs-course-update span {
  color: #1a8ce6;
}

.cs-course-progress .cs-course-progress-tips {
  font-family: MicrosoftYaHeiUILight;
  font-size: 14px;
  color: #333;
  letter-spacing: 0;
  line-height: 18px;
}

.cs-course-progress .cs-course-progress-tips span {
  font-family: MicrosoftYaHeiUI;
  color: #aaa;
}

.cs-course .contact-headmaster .contact-headmaster-title {
  font-family: MicrosoftYaHeiUI;
  font-size: 16px;
  color: #333333;
  display: inline;
  letter-spacing: 0;
  text-align: left;
  font-weight: 400;
  position: relative;
}

.cs-course .contact-headmaster .contact-headmaster-title:after {
  position: absolute;
  right: -20px;
  top: 50%;
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #d8d8d8;
  transform: translateY(-50%) scale(0.6);
}

.cs-course .contact-headmaster .contact-headmaster-qrcode {
  width: 80px;
  height: 80px;
  border: 2px solid rgba(26, 140, 230, 1);
}

.cs-course .contact-headmaster .contact-headmaster-tips {
  flex: 1;
  margin-left: 8px;
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #999999;
  letter-spacing: 0;
  line-height: 18px;
  display: flex;
  font-weight: 400;
  align-items: center;
}

.teacher-introduction-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #666;
}

.teacher-info {
  flex: 1;
  margin-left: 8px;
}

.teacher-info .teacher-name {
  font-family: PingFang-SC-Heavy;
  font-size: 14px;
  color: #31363f;
  font-weight: 800;
  margin-bottom: 2px;
}

.teacher-info .teacher-school {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #9da3af;
  text-align: justify;
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  font-weight: 400;
  line-height: 17px;
}

.teacher-introduction-content {
  font-family: MicrosoftYaHei;
  font-size: 12px;
  color: #9da3af;
  text-align: justify;
  line-height: 18px;
  font-weight: 400;
}

/* 售后详情页-课程模块end */

/* 售后详情页-讨论区 */

/* .cs-discuss-area {
    margin-bottom: 40px;
} */

/* 售后详情页-讨论区end */

/* 售后详情页-笔记模块 */
.course-tabs-content .cs-note {
  border: 1px solid rgba(227, 236, 243, 1);
  padding: 30px;
  max-width: 780px;
  margin: auto;
  border-radius: 6px;
  margin-bottom: 7px;
}

.cs-note .note-list {
  min-height: 200px;
}

.cs-note .note-list .empty {
  line-height: 200px;
}

.course-tabs-content .cs-note .note-item {
  border-bottom: 1px solid #e9eef3;
  margin-bottom: 20px;
}

.course-tabs-content .cs-note .note-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.cs-note .note-item .note-header {
  display: flex;
  justify-content: space-between;
}

.note-item .note-header .note-header-left {
  font-size: 0;
  width: calc(100% - 290px);
}

.note-item .note-header .note-header-left .note-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: middle;
}

.note-item .note-header .note-header-left .name {
  font-family: MicrosoftYaHeiUI-Bold;
  font-size: 14px;
  color: #333333;
  font-weight: 700;
  width: calc(100% - 20px);
  text-overflow: ellipsis;
  display: inline-block;
  vertical-align: middle;
  overflow: hidden;
  white-space: nowrap;
  margin-left: 6px;
}

.course-tabs-content .cs-note .note-item:hover .note-header .note-header-left .name {
  color: #005bac;
}

.note-item .note-header .note-header-left .name.is-active {
  color: #005bac;
}

.cs-note .note-item .note-header .note-header-right {
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #c6c6c6;
  font-weight: 400;
  flex-shrink: 0;
}

.cs-note .note-item .note-content {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #aaaaaa;
  line-height: 18px;
  font-weight: 400;
  margin: 10px 0;
}

.cs-note .note-item .note-content img {
  width: 100%;
}

.cs-note .note-item .note-content u {
  text-decoration: underline;
}

.cs-note .note-item .note-content ul,
.cs-note .note-item .note-content ol {
  padding-left: 15px;
}

.cs-note .note-item .note-content ul>li {
  list-style: disc;
}

.cs-note .note-item .note-content ol>li {
  list-style: decimal;
}

.broken-sentences {
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.is-note-show {
  text-align: right;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 10px;
}

.is-note-show:last-child {
  margin-bottom: 0;
}

.is-note-show .note-del {
  font-size: 14px;
  color: #5092e3;
  display: none;
}

.is-note-show span {
  margin: 0 2px 0 8px;
  font-size: 12px;
  cursor: pointer;
  font-weight: 400;
}

.is-note-show.show-operation .note-del {
  display: inline-block;
}

.is-note-show.hide-operation .note-del {
  display: none;
}

.is-note-show .note-arrow {
  cursor: pointer;
  width: 12px;
  transform: rotate(-180deg);
}

.course-update-to {
  display: none;
}

/* 售后详情页-笔记end */

/* 售后详情页-作业 */
.cs-task-wrap {
  border: 1px solid rgba(227, 236, 243, 1);
  padding: 30px;
  max-width: 780px;
  margin: auto;
  border-radius: 6px;
  margin-bottom: 7px;
}

.cs-task-wrap .cs-task-item {
  border-bottom: 1px solid #e9eef3;
  margin-bottom: 10px;
  cursor: pointer;
}

/* .cs-task-wrap .cs-task-item:last-child {
    border-bottom: none;
    margin-bottom: 0px;
} */
.cs-task-wrap .cs-task-title {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
}

.cs-task-wrap .cs-task-title .cs-task-title-left {
  font-size: 0px;
  width: calc(100% - 70px);
}

.cs-task-wrap .cs-task-title .cs-task-title-left img {
  width: 15px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
}

.cs-task-wrap .cs-task-title .cs-task-title-left span {
  font-size: 14px;
  color: #333333;
  display: inline-block;
  font-weight: 700;
  margin-left: 5px;
  vertical-align: middle;
  width: calc(100% - 20px);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.cs-task-wrap .cs-task-title .cs-task-title-right {
  font-size: 14px;
  color: #ff8f44;
  flex-shrink: 0;
}

.cs-task-wrap .cs-task-title .cs-task-title-right span.blue {
  color: #4a90e2;
}

.m-cs-task-title-right {
  display: none;
}

.m-cs-task-source {
  display: none;
}

.cs-task-wrap .cs-task-content {
  font-size: 12px;
  color: #aaaaaa;
  line-height: 18px;
  margin-bottom: 20px;
}
.cs-task-wrap .cs-task-content img {
  max-width: 100%;
}

.cs-task-wrap .cs-task-footer {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #aaa;
  padding-bottom: 6px;
}

.cs-task-wrap .cs-task-footer .cs-task-source {
  max-width: auto;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.cs-task-wrap .cs-task-footer .cs-task-source span {
  color: #424242;
}

.cs-task-wrap .cs-task-footer .cs-task-source {
  text-align: left !important;
}

.cs-task-wrap .cs-task-footer .cs-task-source,
.cs-task-wrap .cs-task-footer .publish-tiem,
.cs-task-wrap .cs-task-footer .end-time {
  flex: 1;
  text-align: right;
  max-width: 221px;
}

.cs-task-detail {
  display: none;
  max-width: 780px;
  margin: auto;
  margin-bottom: 12px;
}

.cs-task-goback {
  margin-bottom: 20px;
  cursor: pointer;
}

.cs-task-detail-content {
  margin-bottom: 20px;
}

.cs-task-detail-content .detail-taks-name {
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}

.cs-task-detail-content .detail-taks-content {
  color: #444;
}

.cs-task-detail-content .detail-task-time {
  display: flex;
  justify-content: flex-end;
  margin-top: 15px;
  font-size: 13px;
}

.cs-task-detail-content .detail-task-time .end-time2 {
  margin-left: 20px;
}

.cs-task-detail .cs-task-detail-footer {
  display: flex;
}

.cs-task-detail .cs-task-data {
  flex: 0.7;
}

.cs-task-detail .cs-task-submit {
  flex: 1.3;
  margin-left: 60px;
}

.cs-task-card {
  border: 1px solid #198ce6;
  border-radius: 6px;
}

.cs-task-card .task-card-header {
  background: #198ce6;
  color: #fff;
  padding: 5px 15px;
  font-weight: 700;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.cs-task-card .task-card-content {
  padding: 5px 15px;
}

.cs-task-card .task-card-content.submit-task-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cs-task-card .submit-task-content .submit-task-btn {
  background: #fff;
  border: 1px solid #dcdfe6;
  color: #606266;
  border-radius: 20px;
  cursor: pointer;
  padding: 5px 20px;
}

/* 售后详情页-作业end */
.cs-study-status {
  width: 1200px;
  height: 80px;
  font-size: 16px;
  margin: auto;
  padding: 20px 30px;
  background: #ffffff;
  box-shadow: 0px -2px 20px 0px rgba(93, 93, 93, 0.1);
  border-radius: 8px 8px 0px 0px;
}

.study-status-box {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 22;
  width: 100%;
  margin-top: 30px;
}

.cs-study-status-wrap__hide {
  visibility: hidden;
}

.cs-study-status-wrap {
  position: relative;
}

.cs-study-status .cs-study-statu-avatar {
  width: 40px;
  height: 40px;
  background: #999;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 50%;
  margin-right: 20px;
}

.study-info {
  padding: 0 120px 0 40px;
}

.study-info>li:first-child {
  margin-left: 20px;
  margin-right: 38px;
}

.study-info>li {
  display: inline-block;
  margin-right: 30px;
}

.study-info>li h5 {
  color: #aaaaaa;
  font-family: PingFangSC-Regular;
  font-weight: 400;
}

.study-info>li p {
  color: #333333;
  letter-spacing: 0;
  font-family: PingFangSC-Regular;
  font-weight: 600;
  min-height: 22px;
  margin-top: 2px;
}

.study-info>li:last-child {
  margin-right: 0;
  padding-right: 70px;
  margin-left: 60px;
  /*width: calc(100% - 315px); */
  width: calc(100% - 405px);
}

.study-info>li p:last-child {
  font-family: PingFangSC-Regular;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.study-status-btn {
  width: 120px;
  height: 40px;
  position: absolute;
  right: 0;
  top: 0;
}

.study-status-btn .cd-button {
  width: 100%;
  height: 100%;
  display: block;
  text-align: center;
  line-height: 40px;
  background: #198ce6;
  border-radius: 20px;
  font-size: 15px;
  color: #ffffff;
  cursor: pointer;
  font-weight: 700;
}

.study-status-btn .cd-button.cd-button-disabled {
  background: #d8d8d8;
  color: #fff;
}

@media (max-width: 750px) {
  .cs-course .cs-one-outline .r-outline {
    margin-left: 0px;
  }

  .course-tabs-wrap {
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
  }

  .course-update-to {
    display: flex;
    align-items: center;
    height: 24px;
    background: #ffd7ab;
    font-size: 0;
    padding: 0 6px;
  }

  .time-icon {
    width: 11px;
    height: 11px;
  }

  .course-update-tips {
    font-family: MicrosoftYaHeiUI;
    font-size: 12px;
    color: #5c3500;
    letter-spacing: 0;
    margin-left: 6px;
    font-weight: 400;
  }

  .cs-study-status {
    width: 100%;
    box-shadow: none;
    font-size: initial;
    border-radius: 0px;
    height: 0.5rem;
    padding: 0.05rem 0.05rem 0.05rem 0.1rem;
  }

  .cs-study-status-wrap {}

  .cs-study-status .cs-study-statu-avatar {
    width: 0.3rem;
    height: 0.3rem;
    margin-right: 0.1rem;
    vertical-align: middle;
    top: 50%;
    transform: translateY(-50%);
  }

  .study-info {
    padding: 0 1.2rem 0 0.4rem;
    line-height: 0;
  }

  .study-info>li {
    margin: 0;
    line-height: 0;
    font-size: 0;
  }

  .study-info>li h5,
  .study-info>li p {
    min-height: 0.17rem;
    display: inline-block;
    vertical-align: middle;
    font-size: 0.12rem;
    line-height: normal;
    margin-top: 0;
  }

  .study-info>li:first-child {
    margin-left: 0.01rem;
    margin-right: 0;
  }

  .study-info>li:nth-child(2) {
    margin-left: 0.08rem;
  }

  .study-info>li:last-child {
    margin-right: 0.17rem;
    padding-right: 0;
    margin-left: 0;
    margin-top: 0.06rem;
    width: auto;
    display: block;
  }

  .study-info>li>p {
    margin-left: 0.02rem;
  }

  .study-info>li:last-child h5 {
    display: none;
  }

  .study-info>li:last-child p {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: normal;
  }

  .study-status-btn {
    width: 1.2rem;
    height: 0.4rem;
    top: 50%;
    transform: translateY(-50%);
  }

  .study-status-btn .cd-button {
    font-size: 0.15rem;
    line-height: 0.4rem;
    border-radius: 0.2rem;
  }

  .cs-task-wrap .cs-task-title {
    display: block;
  }

  .cs-task-wrap .cs-task-title .cs-task-title-left {
    width: 100%;
  }

  .cs-task-wrap .cs-task-title .cs-task-title-right {
    display: none;
  }

  .cs-task-content {
    margin-bottom: 0;
  }

  .m-cs-task-title-right {
    font-family: MicrosoftYaHei;
    font-size: 14px;
    color: #ff8f44;
    letter-spacing: 0;
    text-align: right;
    font-weight: 400;
    margin: 10px 0;
    display: block;
    line-height: normal;
  }

  .cs-task-wrap .cs-task-title .cs-task-title-right span.blue {
    color: #4a90e2;
  }

  .cs-task-wrap .cs-task-title .cs-task-title-right span.wait {
    color: #4c8d00;
  }

  .cs-task-wrap .cs-task-title .cs-task-title-right span.invalid {
    color: #999999;
  }

  .cs-task-wrap .cs-task-title .cs-task-title-right span.success {
    color: #ff1313;
  }

  .cs-task-wrap .cs-task-footer .cs-task-source {
    display: none;
  }

  .m-cs-task-source {
    display: block;
    font-family: MicrosoftYaHei;
    font-size: 12px;
    color: #2c2e40;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 10px;
  }
}

@media (max-width: 450px) {
  .course-tabs-content .cs-task {
    margin: 0 10px;
  }

  /* 售后详情页-笔记模块 */
  .course-tabs-content .cs-note {
    width: auto;
    padding: 12px;
    margin: 0 10px;
    margin-bottom: 46px;
  }

  .cs-note .note-item .note-header {
    display: unset;
  }

  .note-header-left {
    width: 100% !important;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .note-header-left .name {
    white-space: nowrap;
    width: calc(100% - 20px);
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .cs-note .note-item .note-header .note-header-right {
    width: 100%;
  }

  /* 售后详情页-笔记模块end */

  /* 售后详情页-底部学习状态 */

  /* 售后详情页-底部学习状态end */
  .cs-task-detail {
    padding: 0 15px;
  }
}

/* 售后页面tab end */

/* 视频大纲 */
.course-task-wrap {
  text-align: center;
}

.course-task-wrap .course-detail-content {
  max-width: 958px;
  margin: -10px auto 0;
}

.course-task-wrap>h2 {
  color: #2c3240;
  font-size: 30px;
  padding: 60px 0 21px 0;
  margin: 0 auto;
  max-width: 900px;
  font-weight: 500;
}

.course-task-wrap>p {
  font-size: 14px;
  color: #969da8;
}

.course-detail-content ul {
  text-align: left;
  background: #ffffff;
  border: 1px solid #e6eef3;
  border-radius: 4px;
}

/* 8.1新增 */
.course-detail-content ul.one-outline {
  border: 0;
  padding-bottom: 10px;
  margin-top: 20px;
  border-bottom: 1px solid #e6eef3;
}

.course-detail-content .js-task-chapter {
  /* background: url(/static-dist/app/img/shenlan19/zhangjie_bg_pic@2x.png) no-repeat top center; */
  background: #eaecef;
  /* background-size:918px; */
  background-size: cover;
  height: 60px !important;
  border-radius: 4px;
  /* margin-bottom:10px; */
  display: table;
  width: 100%;
}

.course-detail-content .js-task-chapter .es-icon-keyboardarrowup:before,
.course-detail-content .js-task-chapter .es-icon-keyboardarrowdown:before {
  font-size: 24px;
}

/* 讨论区 */
.threads-box {
  margin-top: 30px;
  display: inline-flex;
  white-space: nowrap;
  position: relative;
}

.threads-box .threads-text {
  visibility: hidden;
  display: inline-block;
}

.courser-info-second>img {
  display: none;
  /* position: absolute; */
  position: relative;
  z-index: -1;
  width: 100%;
}

.price-increase {
  position: relative;
}

.next-period-price-increase {
  position: absolute;
  right: 0;
  top: -12px;
  width: 64px;
  height: 24px;
  font-family: MicrosoftYaHeiUI;
  font-size: 12px;
  color: #f7d3a3;
  letter-spacing: 0;
  font-weight: 400;
  text-align: center;
  line-height: 24px;
  background-image: linear-gradient(135deg, #49515f 0%, #232831 100%);
  border-radius: 12px 12px 12px 2px;
  z-index: 1000;
}

.go-apply.disbtn {
  background: #cbcdd2 !important;
  box-shadow: none !important;
  outline: none;
  cursor: default;
}

.go-apply.successdisbtn {
  background: #fff !important;
  box-shadow: none !important;
  outline: none;
  border: 2px solid #198ce6;
  color: #198ce6 !important;
}

/*预约成功：已预约下一期：hover‘取消预约下一期’ */
.success-nextcourse::before {
  content: "已预约下一期";
}

.success-nextcourse2::before {
  content: "已成功预约";
}

.go-apply.successdisbtn:hover .success-nextcourse::before,
.go-apply.successdisbtn:hover .success-nextcourse2::before {
  content: "取消预约";
}

/* 6,27 释放，购物车的时候，还需要删除 */
/* .color-go-apply .go-apply {
    background: #FFFF00 !important;
    color: #000 !important;
    font-weight: 500;
    box-shadow: none !important;
} */

.course-open-nextbtn {
  display: inline-block;
  position: relative;
}

.open-nextips {
  position: absolute;
  bottom: -28px;
  left: 0;
  font-size: 12px;
  color: #a7b2c3;
}

/* 详情期数课程状态  */
.tooltip-inner {
  padding: 10px 16px;
  line-height: 18px;
  text-align: left;
  font-size: 12px;
  color: #ced3da;
}

.apply-main {
  max-width: 830px;
  margin: 50px auto;
}

.apply-main .time_contener {
  text-align: center;
}

.time_open {
  border: 1px solid rgba(198, 206, 215, 0.85);
  background: #fff;
  width: 100%;
  border-radius: 4px;
  font-size: 16px;
  color: #2c3240;
  position: relative;
  margin-bottom: 30px;
  padding: 1px;
  cursor: pointer;
}

.time_contener li:nth-last-of-type(1) {
  margin-bottom: 0;
}

.time_open .start_time {
  display: inline-block;
  text-align: left;
}

.time_open>a {
  color: #2c3240;
  display: block;
  padding: 15px 0;
}

.time_open.course-btn-active,
.time_open:hover {
  border-color: #198ce6;
}

.time_open.course-btn-active:before {
  width: 26px;
  height: 26px;
  background: url("/static-dist/app/img/shenlan19/kechengqishu_icon@2x.png") no-repeat;
  position: absolute;
  bottom: 0;
  right: -1px;
  background-size: 26px;
  content: "";
}

.fixed-bottom-zero .time_open.course-btn-active:before {
  background-image: url(/static-dist/app/img/shenlan19/kechengqishu01_icon@2x.png);
}

.apply-main .time_open .paopaotip {
  font-size: 12px;
  color: #ffffff;
  position: absolute;
  right: -1px;
  top: -18px;
  display: inline-block;
  padding: 4px 16px;
  background: #198ce6;
  color: #fff;
  border-radius: 13px 13px 0 13px;
}

span.paopaotip:before {
  border-bottom-left-radius: 50px;
  position: absolute;
  height: 12px;
  width: 12px;
  background: #198ce6;
  bottom: -12px;
  right: 0px;
  display: block;
  content: "";
}

.apply-main .time_open .color-orange,
span.paopaotip.color-orange:before {
  background: #f59423;
}

.apply-main .time_open .color-green,
span.paopaotip.color-green:before {
  background: #22bf7a;
}

.apply-main .time_open .color-cbcdd2,
span.paopaotip.color-cbcdd2:before {
  background: #cbcdd2;
}

span.paopaotip:after {
  border-bottom-left-radius: 50px;
  position: absolute;
  height: 12px;
  width: 12px;
  background: #fff;
  bottom: -12px;
  right: 1px;
  display: block;
  content: "";
  z-index: 0;
  transform: rotate(180deg);
}

/* 23.03.17 学习最新一期课程 按钮 start*/
.study-newstage-btn {
  background: #198CE6;
  border: 1px solid rgba(198, 206, 215, 0.85);
  width: 100%;
  border-radius: 4px;
  font-size: 16px;
  color: #2c3240;
  position: relative;
  padding: 1px;
  cursor: pointer;
}
.study-newstage-btn .ns-btn {
  color: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 0;
}
.study-newstage-btn .ns-btn .ico {
  background: #FFF;
  width: 16px;
  height: 16px;
  display: inline-block;
  border-radius: 50%;
  margin-left: 14px;
  position: relative;
}
.study-newstage-btn .ns-btn .ico::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border: 1px solid #3a8ce6;
  border-top: 0;
  border-right: 0;
  transform: rotate(225deg);
  position: absolute;
  top: 5px;
  left: 3px;
}

/* 23.03.17 学习最新一期课程 按钮 end */

/* 倒计时 */
.down-time {
  color: #202e3a;
  font-size: 14px;
  margin-bottom: 23px;
}

.down-time .index-time-times {
  display: inline-block;
  position: relative;
  top: 2px;
}

.down-time .index-time-times div {
  float: left;
}

.down-time .index-time-bj {
  background: #198ce6 url("/static-dist/app/img/shenlan19/daojishi_pic@2x.png") no-repeat left center;
  background-size: 22px;
  width: 22px;
  height: 18px;
  line-height: 18px;
  font-size: 14px;
  color: #fff;
  text-align: center;
}

.down-time .index-time-left {
  width: 22px;
  height: 18px;
  line-height: 18px;
  text-align: center;
}

.apply-main .main-right {
  font-size: 14px;
  color: #202e3a;
  /* text-align: center; */
}

.cd-button.go-disabled {
  display: inline-block;
  cursor: default;
  width: 180px;
  text-align: center;
  background: #cbcdd2;
  border-radius: 30px;
  font-size: 16px;
  color: #fff;
  padding: 13px 0px 14px;
  margin-right: 20px;
}

/* 2.14 完善 */
.go-disabled.slperfect {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cd-button.go-threads {
  display: inline-block;
  width: 40vw;
  min-width: 130px;
  max-width: 180px;
  text-align: center;
  background: #fff;
  border-radius: 30px;
  font-size: 16px;
  color: #198ce6;
  border: 2px solid #198ce6;
  padding: 13px 0px 14px;
  margin-right: 20px;
}

/* 9.3新加样式 */
.cd-button.go-threads_popup {
  display: inline-block;
  width: 40vw;
  height: 34px;
  line-height: 34px;
  min-width: 62px;
  max-width: 112px;
  text-align: center;
  background: #0091ff;
  border-radius: 4px;
  font-size: 14px;
  color: #fff;
  border: 1px solid #198ce6;
  /* padding: 13px 0px 14px; */
  margin-right: 20px;
}

/* 9.3新加样式end */

.cd-button.go-apply {
  position: relative;
  display: inline-block;
  width: 40vw;
  min-width: 130px;
  max-width: 180px;
  text-align: center;
  background: #198ce6;
  box-shadow: 0 8px 12px 0 #b0d5ff;
  border-radius: 30px;
  font-size: 16px;
  color: #ffffff;
  padding: 15px 0px 16px;
  margin-right: 12px;
  /* float: left; */
}

/* 22.6.13 */
.go-apply.go-shop {
  background-image: linear-gradient(90deg, #fecb01 0%, #fe9202 100%);
  border-radius: 26px 0px 0px 26px;
  margin-right: 0;
  box-shadow: none;
  font-weight: 500;
}

.go-apply.go-shop1 {
  background: #fe5400;
  border-radius: 0px 26px 26px 0px;
  box-shadow: none;
  font-weight: 500;
}

/*.cs-scroll  */
.cs-scroll .cd-button.go-apply {
  max-width: 140px;
}

/* 9.3新加样式 */
.cd-button.go-apply_popup {
  position: relative;
  display: inline-block;
  width: 40vw;
  height: 34px;
  line-height: 34px;
  min-width: 62px;
  max-width: 112px;
  text-align: center;
  background: #fff;
  /* box-shadow: 0 8px 12px 0 #B0D5FF; */
  border: 1px solid #dedede;
  border-radius: 4px;
  font-size: 14px;
  color: #000;
  /* padding: 15px 0px 16px; */
  margin-right: 12px;
  /* float: left; */
}

/* 9.3新加样式end */
.cd-button.remindbtn {
  width: 180px !important;
}

.color-go-apply {
  font-size: 0;
  margin-right: 0px;
  margin-left: 16px;
  display: inline-block;
  float: right;
  position: absolute;
  left: 130px;
  top: 0px;
  width: 300px;
}

/* 拼团立即报名样式 */
.pintuan-space20 {
  width: 18px;
  height: 10px;
  display: inline-block;
}

.pintuan-apply-btn {
  display: inline-block;
  cursor: pointer;
  background: #e1f2ff;
  color: #238ee3;
  border: 1px solid #238ee3;
  border-radius: 4px;
  padding: 14px 26px;
  margin-right: 10px;
}

.pintuan-apply-btn:hover,
.pintuan-apply-btn:focus {
  color: #238ee3 !important;
}

.pintuan-btn {
  display: inline-block;
  cursor: pointer;
  background: #238ee3;
  border: 1px solid #198ce6;
  color: #ffff00;
  font-weight: bold;
  border-radius: 4px;
  padding: 14px 26px;
  animation: scaleDrew 2s ease-in-out infinite;
}

.pintuan-btn:hover,
.pintuan-btn:focus {
  color: #ffffff !important;
}

.color-go-apply .pintuan-btn {
  background: #ffff00;
  border: 1px solid #ffff00;
  color: #000;
}

.color-go-apply .pintuan-btn:hover,
.color-go-apply .pintuan-btn:focus {
  color: #000 !important;
}

.color-go-apply .pintuan-apply-btn {
  background: #0091ff;
  border: 1px solid #ffffff;
  color: #fff;
  font-size: 14px;
}

.color-go-apply .pintuan-apply-btn:hover,
.color-go-apply .pintuan-apply-btn:focus {
  color: #ffffff !important;
}

.pintuan-es-qrcode {
  position: relative;
  text-align: center;
  display: inline-block;
  /* line-height: 0; */
  font-size: 14px;
}

.pintuan-es-qrcode2 {
  height: 45px;
  line-height: 45px;
}

.pintuan-es-qrcode.open .qrcode-popover {
  display: block\9;
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
  filter: alpha(opacity=100);
  line-height: 18px;
}

.pintuan-es-qrcode .qrcode-popover {
  position: absolute;
  padding: 5px 10px;
  font-size: 12px;
  background: #fff;
  color: #313131;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  display: none\9;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transform: scale(0);
  transform: scale(0);
  transition: all 0.3s ease;
  z-index: 1;
  top: 60px;
  left: 0;
}

.pintuan-es-qrcode .qrcode-popover2 {
  top: -150px !important;
  left: 20px !important;
  display: flex;
  flex-direction: column;
}

.color-go-apply .pintuan-es-qrcode .qrcode-popover {
  top: -160px;
}

/* end */
.redtip-topreface {
  position: absolute;
  background: #fc4946;
  border: 1px solid #ffffff;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  top: 4px;
  right: 2px;
}

.fixed-bottom-zero {
  margin: 0 auto;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 18;
  background: #0091ff;
  box-shadow: 0 -4px 8px 0 rgba(179, 179, 179, 0.2);
  color: #fff;
  display: none;
}

.m-fixed-bottom-zero {
  margin: 0 auto;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 18;
  background: #0091ff;
  box-shadow: 0 -4px 8px 0 rgba(179, 179, 179, 0.2);
  color: #fff;
  display: none;
}

/* 课程详情页简介图片 */
.courseshow-img {
  max-width: 1920px;
  margin: 0 auto;
}

/* 限制文案宽度 */
.courseshow-img>p {
  margin: 0 auto;
  padding: 0 20px;
}

.courseshow-img>div img {
  max-width: 100%;
}

/* 新增视频322 */
.courser-video322 {
  max-width: 1920px;
  margin: 0 auto;
  background: #f5f8fa;
  padding-bottom: 60px;
  padding-top: 20px;
}

.courser-video322 .videoBox {
  max-width: 1080px;
  margin: 0 auto;
  background: #fff;
  border-radius: 8px;
  font-size: 0;
  padding-bottom: 36px;
  border: 1px solid #ffe9dd;
}

.courser-video322 .title {
  background-image: linear-gradient(131deg, #ff930e 2%, #ff7d4e 100%);
  border-radius: 8px 8px 0 0;
  font-size: 18px;
  color: #ffffff;
  letter-spacing: 0;
  text-align: center;
  font-weight: bold;
  line-height: 60px;
}

.courser-video322 .title span {
  font-weight: normal;
}

.courser-video322 .video-text {
  font-size: 14px;
  color: #777777;
  letter-spacing: 0;
  text-align: justify;
  line-height: 30px;
  padding: 20px 35px 30px;
}

.courser-video322 .player-course-id {
  width: 916px;
  height: 515px;
  margin: 0 auto;
}

/* 563 一行1个视频 */
.courser-video563 {
  margin: 0 auto 25px;
  width: 100vw;
  max-width: 800px;
  padding: 30px 100px;
  /* height: 398px; */
  background: #ffffff;
  box-shadow: 0px 2px 16px 0px rgba(26, 88, 223, 0.1);
  box-sizing: border-box;
}

.courser-video563 .video-con-border {
  width: 100%;
  height: 338px;
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.courser-video563 .player-course-id {
  width: 100%;
  height: 338px;
}

/* 384 无人机实战视频效果展示，一行3个视频 */
.mt60 {
  margin-top: 60px;
}

.mt70 {
  margin-top: 70px;
}

.courser-video384 .mtit {
  display: none;
  font-size: 15px;
  color: #181c34;
  margin: 10px 0 25px;
  font-weight: 500;
}

.courser-video384 {
  display: flex;
  max-width: 1540px;
  margin: 0 auto;
  padding: 0 50px;
}

.courser-video384.video478 {
  max-width: 1340px;
}

.courser-video384.cidtwo {
  max-width: 1096px;
}

.courser-video384 .item {
  flex: 1;
  text-align: center;
}

.courser-video384 .item:not(:last-child) {
  margin-right: 40px;
}

.courser-video384 .player-course-id {
  width: 100%;
  height: 248px;
  margin: 0 auto;
}
.courser-video384 .player-course-one {
  width: 1000px;
  height: 570px;
  margin: 0 auto;
}
.courser-video384 .tit {
  position: relative;
  display: block;
  font-size: 24px;
  color: #181c34;
  display: inline-block;
  margin-bottom: 30px;
  margin-top: 30px;
}

.courser-video384.video478 .tit {
  font-size: 20px;
}

.courser-video384 .tit:after {
  width: 100%;
  height: 18px;
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  bottom: -6px;
  background-image: linear-gradient(90deg,
      rgba(255, 255, 255, 0) 0%,
      #ff9114 47%,
      rgba(255, 255, 255, 0) 100%);
}

/* 588 同532样式类似，但需要针对性调整 */
.courser-video384.video588 .tit {
  display: block;
  margin-bottom: 8px;
  margin-top: 40px;
  height: 47px;
  line-height: 47px;
  color: #fff;
}

.courser-video384.video588 .tit:after {
  width: 100%;
  height: 49px;
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  bottom: 0;
  background-image: linear-gradient(218deg, #8094FE 0%, #2864FC 100%);
  border-radius: 6px;
}

.courser-video725 {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 1540px;
    margin: 0 auto;
    padding: 0px 50px 60px 50px;

}
.courser-video725 .item {
    display: flex;
    width: 1148px;
    margin-top: 43px;
}
.courser-video725 img {
  width: 517px;
  margin-top: 60px;
}
.courser-video725 .item .item-left {
    width: 565px;
}
.courser-video725 .item .item-right {
    width: 635px;
    height: 318px;
    border-radius: 5px;
    background: #fafbff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 70px;
    position: relative;

}
.courser-video725 .item .item-left2 {
  width: 565px;
}
.courser-video725 .item .item-right2 {
  width: 635px;
  height: 318px;
  border-radius: 5px;
  background: #fafbff;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 26px;
  position: relative;
}

.courser-video725 .item .item-right2 .item-title {
  width: 514px;
  color: #333333;
  font-family: SourceHanSansSC-Bold;
  font-weight: 800;
  font-size: 18px;
  line-height: 27px;
  margin-bottom: 25px;
  position: relative;
  z-index: 1;
}
.courser-video725 .item .item-right2 .item-content {
  color: #666666;
  font-family: SourceHanSansSC-Regular;
  font-weight: 400;
  font-size: 16px;
  line-height: 27px;
  width: 500px;
}
.courser-video725 .item .item-right .item-title {
  width: 500px;
  color: #333333;
  font-family: SourceHanSansSC-Bold;
  font-weight: 800;
  font-size: 18px;
  line-height: 27px;
  margin-bottom: 25px;
  position: relative;
  z-index: 1;
}
.courser-video725 .item .item-right .item-title::before {
  position: absolute;
  content: "";
  top: -50px;
  left: 0px;
  background: url('/static-dist/app/img/PC-01@2x.png') no-repeat 0 0 / 100% 100%;
  width: 62px;
  height: 74px;
  z-index: -1;
}
.courser-video725 .item .item-right2 .item-title::before {
  position: absolute;
  content: "";
  top: -50px;
  left: 0px;
  background: url('/static-dist/app/img/PC-02@2x.png') no-repeat 0 0 / 100% 100%;
  width: 62px;
  height: 74px;
  z-index: -1;
}
.courser-video725 .item .item-right .item-content {
  color: #666666;
  font-family: SourceHanSansSC-Regular;
  font-weight: 400;
  font-size: 16px;
  line-height: 27px;
  width: 500px;
}
.courser-video725 .player-course-id {
    width: 100%;
    height: 319px;
    margin: 0 auto;
}

@media (max-width: 450px) {
  .courser-video725 img {
    width: 236px;
    margin-top: 30px;
  }
  .courser-video725 .mitem1 {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    width: 345px;
    height: 374px;
    background: url('/static-dist/app/img/M-beijing1@2x.png') no-repeat 0 0 / 100% 100%;
  }
  .courser-video725 .mitem2 {
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    width: 345px;
    height: 374px;
    background: url('/static-dist/app/img/M-beijing2@2x.png') no-repeat 0 0 / 100% 100%;
  }
  .courser-video725 .mitem-content {
    color: #666666;
    font-family: SourceHanSansSC-Regular;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    padding: 63px 23px 15px;
  }
  .courser-video725 .player-course-id {
    margin: 0 14px;
    width: 317px !important;
    height: 178px !important;
  }
}

/* 384 无人机实战视频效果展示，一行3个视频 */
@media (max-width: 1079px) {
  .courser-video563 {
    padding: 0;
    box-shadow: none;
    margin: 0 auto;
  }

  .courser-video563 .video-con-border {
    height: auto;
  }

  /* 384 无人机实战视频效果展示 */

  .courser-video384 {
    flex-direction: column;
    padding: 0 20px;
  }

  .courser-video384 .tit {
    display: none !important;
  }

  .courser-video384 .item {
    margin-right: 0 !important;
  }

  .courser-video384 .mtit {
    display: block;
  }

  /* 384 无人机实战视频效果展示end */

  /* 详情页322 */
  .courser-video322 {
    max-width: 800px;
    margin: 0 20px;
    padding: 8px 18px 18px;
  }

  .courser-video322 .videoBox {
    border-radius: 2px;
    padding-bottom: 20px;
  }

  .courser-video322 .title {
    border-radius: 2px 2px 0 0;
    font-size: 13px;
    line-height: 34px;
  }

  .courser-video322 .title span {
    font-weight: bold;
  }

  .courser-video322 .video-text {
    font-size: 13px;
    line-height: 22px;
    padding: 12px;
  }

  .player-course-id {
    width: 100% !important;
    height: 56vw !important;
    max-height: 280px !important;
  }

  .player-course-one {
    width: 100% !important;
    height: 56vw !important;
    max-height: 280px !important;
  }

  .courser-video-wrap2 {
    max-width: 800px;
    margin: 0 20px;
    padding: 0 15px;
  }

  .courser-video-wrap2 .video-item {
    width: 100%;
    margin: 0 !important;
    padding: 0 15px;
  }

  .courser-video-wrap2 .title {
    font-size: 13px;
    line-height: 34px;
  }

  .courser-video-wrap2 .title.title321 {
    background: #2065c9;
  }

  .courser-video-wrap2 .video-item>p {
    padding: 13px 0 5px;
  }
}

/* 课程571，理由4变成视频 */
.courser-video571 {
  position: relative;
}

.courser-video571 .video-item {
  position: absolute;
  width: 1080px;
  margin: 0 auto;
  height: 256px;
  top: 182px;
  left: 50%;
  margin-left: -540px;
}

.courser-video571 .video-item .player-course-id {
  position: absolute;
  width: 430px;
  height: 256px;
  top: 8px;
  left: 139px;
}

@media (max-width: 1079px) {}

/* 立即报名 */
@media (min-width: 769px) {
  .mTextcenter {
    text-align: left;
  }
}

@media (max-width: 768px) {
  .apply-main {
    margin: 20px auto;
    /* margin: 20px auto 0 ; */
  }

  .time_open {
    margin-bottom: 20px;
  }

  .apply-main .time_open .paopaotip {
    padding: 1px 16px;
    top: -13px;
  }

  .mt43 {
    margin-top: 0 !important;
  }

  .relevant-class {
    margin: 0 4px !important;
  }

  .courser-info-second .course-detail-top .course-operation,
  .courser-info-second .course-detail-bottom {
    display: none;
  }

  .course-study-time {
    display: block !important;
  }

  .course-study-time .clearfix-public {
    /* width: 150px;
    height: 50px;
    margin: 0 auto; */
    display: none;
  }
  .course-study-time .contact-tip {
    text-align: center;
    padding: 0;
  }

  .course-study-time ul {
    width: 100% !important;
    padding-top: 15px;
    display: flex;
    justify-content: space-around;
    /* align-items: center; */
  }

  .course-study-time li {
    text-align: center;
    position: unset;
    border: none;
    width: unset;
    height: unset;
    padding: 0;
    margin: 0;
  }

  .course-study-time li img {
    position: static;
    width: 40px;
    height: 40px;
    left: 10px;
  }

  .course-study-time li h3 {
    padding: 8px 0 4px;
    position: unset;
    text-align: center;
  }

  .course-study-time li p {
    font-size: 12px;
    line-height: 16px;
    position: unset;
    text-align: center;
    width: unset;
  }

  /* .course-study-time ul {
        width: 100%;
        height: 121px;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }
    .course-study-time .threeline{
        display:flex;
    }

    .course-study-time li {
        flex: .4;
        width: unset;
        height: unset;
        margin: 0;
        padding: 0;
        border: none;
        position: unset;
        float: none;
    }

    .course-study-time li img {
        position: static;
        width: 40px;
        height: 40px;
        left: 10px;
    } */

  /* .course-study-time li h3,
    .course-study-time li p {
        position: static;
        width: 100%;
        text-align: center;
    }
    .course-study-time li h3 {
        padding:8px 0 4px;
    }
    .course-study-time li p {
        font-size: 12px;
        line-height: 16px;
    } */

  /* 详情页面 */
  .fixed-bottom-zero .col-md-3,
  .fixed-bottom-zero .col-md-5 {
    display: none !important;
  }

  .m-fixed-bottom-zero .ptip-m {
    font-size: 14px;
    color: #718098;
    font-weight: 500;
    line-height: 43px;
    display: inline-block !important;
    float: left;
  }

  .fixed-bottom-zero .ptip-m {
    font-weight: 500;
    line-height: 43px;
    display: inline-block !important;
    float: left;
  }

  .m-fixed-bottom-zero .cd-button.go-apply {
    width: 140px !important;
    height: 44px;
    padding: 0;
    line-height: 44px;
    max-width: 100% !important;
    box-shadow: none !important;
    margin-bottom: 12px;
    font-weight: 300;
    /*margin-top: -10px; */
    margin-right: 0px;
    background: #4a90e2 !important;
    color: #fff !important;
  }

  .fixed-bottom-zero .cd-button.go-apply {
    width: 140px !important;
    height: 44px;
    padding: 0;
    line-height: 44px;
    max-width: 100% !important;
    box-shadow: none !important;
    margin-bottom: 12px;
    font-weight: 300;
    /*margin-top: -10px; */
    margin-right: 0px;
    background: #4a90e2 !important;
    color: #fff !important;
  }

  .m-fixed-bottom-zero .chaptersm {
    width: 100 !important;
  }

  .fixed-bottom-zero .chaptersm {
    width: 100 !important;
  }

  /* 课程详情为了移动适配 */
  .course-task-wrap>h2 {
    font-size: 20px;
    padding: 20px 0px;
  }

  .about-recommend h2 {
    font-size: 20px;
  }

  /* 课程详情banner */
  .courser-info-second {
    background: none !important;
    height: 212px !important;
    overflow: hidden;
  }

  .courser-info-second>h2 {
    display: none;
  }

  .courser-info-second>img {
    display: block !important;
    max-height: 244px;
  }

  .course-study-time {
    margin-top: -10px;
  }

  .threads-box .threads-text {
    display: block;
    position: absolute;
    bottom: -30px;
    right: 0;
  }

  /* 拼团 */
  .pintuan-space20 {
    width: 6px;
  }

  .pintuan-apply-btn,
  .pintuan-btn {
    /* animation-play-state: paused; */
    padding: 14px 13px;
    font-size: 14px;
  }

  /* 底部滚动拼团按钮 */
  .color-go-apply {
    left: unset !important;
    top: unset !important;
    /* width: 0; */
    margin-top: -2px;
    margin-left: 0;
    margin-left: -35px;
    text-align: right;
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }

  .cd-button.go-threads {
    margin-right: 0 !important;
  }

  .color-go-apply .pintuan-apply-btn {
    margin-right: 0;
    padding: 9px 8px;
    border-radius: 4px 0 0 4px;
  }

  .color-go-apply .pintuan-btn {
    padding: 9px 8px;
    border-radius: 0 4px 4px 0;
    /* margin-left: -6px; */
  }

  .next-period-price-increase {
    display: none;
  }
}

/* 详情页过渡 */
@media (min-width: 1080px) {
  .courseshow-img>p {
    text-align: center;
    font-size: 16px;
    line-height: 28px;
    color: #333333;
  }

  .courseshow-img>p>img,
  .courseshow-img>div>img {
    max-width: 1920px;
    margin: 0 calc(50% - 960px);
  }

  .div-summary {
    display: block;
  }

  .div-msummary {
    display: none;
  }
}

@media (max-width: 1079px) {

  .courseshow-img>p>img,
  .courseshow-img>div>img {
    max-width: 100%;
    margin-top: -3px;
  }

  .div-summary {
    display: none;
  }

  .div-msummary {
    display: block;
  }
}

/* 订单确认页面 */
.vipPrice-explain {
  margin-bottom: 22px;
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 26px;
}

.vipPrice-explain span {
  font-size: 14px;
  color: #424242;
  font-weight: 500;
  padding-right: 6px;
}

.vipPrice-explain .radiolist {
  font-size: 14px;
  color: #494c5e;
  margin-top: 6px;
}

/* 动画效果 */
@keyframes scaleDrew {

  /* 定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称 */
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  /* 0% {
        transform: scale(1);
    }
    
    25% {
        transform: scale(1.2);
    }

    50% {
        transform: scale(1);
    }
    
    75% {
        transform: scale(1.2);
    }  */
}

/* 动画效果 end*/

/* 登录下拉框美化 */
.ailogin .select {
  width: 95px;
  padding-left: 40px;
  position: absolute;
  display: inline-block;
}

.ailogin .select .placeholder {
  position: relative;
  display: block;
  z-index: 1;
  line-height: 40px;
  cursor: pointer;
}

.ailogin .select .placeholder:after {
  content: "";
  position: absolute;
  right: 0px;
  width: 8px;
  height: 6px;
  background: url(/static-dist/app/img/shenlan21/m-cooperation/xiala_icon@2x.png) no-repeat;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background-size: 100%;
}

.ailogin .select.is-open ul {
  display: block;
}

.ailogin .select.select--white .placeholder {
  background: #fff;
  color: #999;
}

.ailogin .select.select--white .placeholder:hover {
  background: #fafafa;
}

.ailogin .select ul {
  display: none;
  position: absolute;
  overflow: hidden;
  width: 200px;
  background: #fff;
  border: 1px solid #e6efff;
  border-radius: 4px;
  top: 100%;
  left: 0;
  list-style: none;
  margin: 5px 0 0 0;
  padding: 0;
  z-index: 100;
  padding-top: 8px;
  max-height: 200px;
  overflow-y: auto;
}

.ailogin .select ul li {
  display: block;
  text-align: left;
  padding: 8px 8px 8px 16px;
  cursor: pointer;
  font-size: 14px;
  color: #31363f;
}

.ailogin .select ul li:hover {
  color: #3385ff;
}

/* 登录下拉框美化end */

#login-form .page_mobile {
  padding-left: 108px;
}

@media (max-width: 768px) {

  #login-form .page_mobile,
  #info_login_form .page_mobile {
    padding-left: 108px;
  }
}

#password-reset-by-mobile-form .ailogin .select {
  margin-left: 10px;
}

/* 普通课程登录/注册弹窗 */
.ordinary_mask {
  display: none;
}

.pad_top10 {
  padding-top: 10px;
}

#login-form .mob_input {
  padding-left: 108px;
}

/* 重设密码 */
.repwd_code {
  position: relative;
}

.repwd_code .repwd_code_btn {
  position: absolute;
  right: 0;
  top: 0;
}

.repwd_code .repwd_code_btn>a {
  padding: 11px 12px !important;
  border: none !important;
  background: none !important;
  color: #005bac !important;
  display: block;
}

/* 重设密码end */

@media (max-width: 1024px) {
  .mar_top30 {
    margin-top: 30px;
  }

  .ordinary-pop {
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 999;
    color: #3f4a54;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
  }

  .ordinary-pop.hide {
    display: none;
  }

  .ordinary_mask .alert-box {
    width: 100%;
    background: #fff;
    bottom: -400px;
    border-radius: 20px 20px 0px 0px;
    position: absolute;
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    min-height: 380px;
    left: 50%;
  }

  .ordinary_mask .alert-box .closeover {
    padding: 14px;
    width: auto;
    height: auto;
    top: 0;
    right: 0;
  }

  .ordinary_mask .es-icon {
    font-size: 20px;
  }

  .ordinary_mask .ordinary_logo {
    text-align: center;
    padding-top: 20px;
  }

  .ordinary_mask .ordinary_logo img {
    width: 104px;
  }

  .ordinary_mask .ordinary_box {
    padding: 20px 20px;
  }

  .ordinary_mask .ordinary_box .ailogin .select ul {
    max-height: 180px;
  }

  .ordinary_mask .switch_btn a {
    font-size: 12px;
    color: #909eab;
    display: block;
    text-align: center;
  }

  .ordinary_mask .switch_btn .pwd_icon {
    position: relative;
    top: 0;
    left: 0;
    display: inline-block;
    width: 12px;
    height: 14px;
    background: url(/static-dist/app/img/2018/1.0/login_register/password_icon.png) no-repeat;
    background-size: cover;
    vertical-align: sub;
  }

  .ordinary_mask .agreement_tips {
    padding-top: 5px;
  }

  .ordinary_mask .agreement_tips p {
    text-align: center;
    font-size: 12px;
    color: #909eab;
  }

  .ordinary_mask .agreement_tips p a {
    text-align: center;
    font-size: 12px;
    color: #3385ff;
  }

  .ordinary_mask .iphone_icon {
    vertical-align: bottom;
  }

  .layui-layer-hui .layui-layer-content {
    padding: 5px 25px !important;
  }

  .outerDiv_block {
    bottom: 0;
    animation: myMoveBlock 0.2s linear;
    animation-fill-mode: forwards;
  }

  .outerDiv_hide {
    bottom: -400px;
    animation: myMoveHide 0.2s linear;
    animation-fill-mode: forwards;
  }

  @keyframes myMoveBlock {
    from {
      bottom: -400px;
    }

    to {
      bottom: 0px;
    }
  }

  @keyframes myMoveHide {
    from {
      bottom: 0px;
    }

    to {
      bottom: -400px;
    }
  }

  /* 完善资料弹窗 */
  .ordinary_mask .unregistered_box .info_tips {
    font-family: MicrosoftYaHei;
    font-size: 16px;
    color: #31363f;
    text-align: center;
    padding-bottom: 30px;
  }

  .ordinary_mask .unregistered_box .info_bound {
    background: #f4f4f4;
    border-radius: 4px;
    line-height: 40px;
    height: 40px;
    text-indent: 10px;
    font-family: MicrosoftYaHei;
    font-size: 13px;
    color: #aaaaaa;
  }

  .ordinary_mask .unregistered_box .form-control {
    height: 40px !important;
  }

  /* 完善资料弹窗end */

  /* 选择兴趣领域弹窗（注册完） */
  .info-interest-tag .interest-tag-content {
    overflow: hidden;
  }

  .info-interest-tag .interest-tag-content .header {
    height: 54px !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 54px !important;
    font-size: 18px !important;
    background: url(/static-dist/app/img/title_bj@2x.png) no-repeat !important;
  }

  .info-interest-tag .header .closeover {
    position: absolute;
    right: 20px;
    width: 14px;
    height: 14px;
    top: 20px;
  }

  .info-interest-tag .interest-tag-content .choose-interest-tag .interest-taglist .text-tag,
  .info-interest-tag .interest-tag-content .choose-interest-tag .footer .submit-tag {
    font-size: 14px !important;
  }

  .info-interest-tag .interest-tag-content .tag_des {
    font-size: 12px;
    color: #b4bdc5;
  }

  /* 选择兴趣领域弹窗（注册完）end */

  /* 微信服务号绑定 */
  .disabled_pointer {
    cursor: not-allowed;
    opacity: 0.65;
    filter: alpha(opacity=65);
    box-shadow: none;
    pointer-events: none;
  }

  .pad30 {
    padding: 30px;
  }

  .unregistered_mask .unregistered_body,
  .bind_other_mask .bind_other_body {
    position: absolute;
    background: #ffffff;
    border-radius: 14px;
    width: 290px;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
  }

  .unregistered_mask .unregistered_text {
    padding: 30px 20px;
    border-bottom: 1px solid #e6e6e6;
    font-size: 16px;
    color: #424242;
  }

  .unregistered_mask .group {
    display: flex;
  }

  .unregistered_mask .group a {
    width: 50%;
    padding: 10px 0;
    text-align: center;
    font-size: 18px;
  }

  .unregistered_mask .cancle {
    color: #424242;
    border-right: 1px solid #e6e6e6;
  }

  .unregistered_mask .go_regist {
    color: #005bac;
  }

  .binding_succeeded .success_text {
    font-size: 12px;
    color: #909eab;
    line-height: 20px;
  }

  .binding_succeeded .success_mobile {
    background: #ecf3fa;
    font-size: 16px;
    color: #31363f;
    text-align: center;
    height: 52px;
    line-height: 52px;
    margin: 20px 0 40px;
  }

  .binding_succeeded .success_mobile>span {
    font-weight: bold;
  }

  .bind_common_btn,
  .bind_common_btn:hover,
  .bind_common_btn:active,
  .bind_common_btn:focus {
    background: #005bac;
    border-radius: 4px;
    display: block;
    font-size: 16px;
    color: #ffffff;
    text-align: center;
    height: 45px;
    line-height: 45px;
  }

  .binding_failed .fail_body {
    width: 200px;
    text-align: center;
    margin: 10px auto 40px;
  }

  .binding_failed .fail_body .fail_img {
    width: 140px;
  }

  .binding_failed .fail_body .fail_tip {
    font-family: MicrosoftYaHei;
    font-size: 16px;
    color: #31363f;
    margin: 20px 0;
  }

  .binding_failed .fail_body dl {
    text-align: left;
    font-size: 12px;
    color: #909eab;
    line-height: 20px;
  }

  .otherer_link {
    margin: 30px auto;
    display: block;
    text-align: center;
    /* position: fixed;
        bottom: 40px;
        padding: 20px;
        left: 50%;
        -webkit-transform: translate(-50%,0%);
        transform: translate(-50%,0%);
        text-decoration: underline !important; */
  }

  .unbind_wrapper .unbind_header {
    background: #ecf3fa;
    padding: 13px;
    text-align: center;
    margin-top: 30px;
  }

  .unbind_wrapper .unbind_header .unbind_title {
    font-family: MicrosoftYaHei-Bold;
    font-size: 16px;
    color: #31363f;
    font-weight: bold;
  }

  .unbind_wrapper .unbind_header .unbind_des {
    font-size: 12px;
    color: #909eab;
    margin-top: 10px;
  }

  .unbind_wrapper .reason {
    margin: 30px 0;
  }

  .unbind_wrapper .reason_title {
    font-size: 16px;
    color: #31363f;
    font-weight: bold;
  }

  .unbind_wrapper .unbind_reason_val {
    background: #ffffff;
    border: 1px solid #cecece;
    border-radius: 4px;
    width: 100%;
    height: 104px;
    padding: 10px;
    margin-top: 10px;
    font-size: 13px;
  }

  .bind_other_mask .bind_other_body {
    padding-top: 20px;
    white-space: nowrap;
    z-index: 9999;
  }

  .bind_other_mask .bind_other_title {
    font-weight: bold;
    text-align: center;
    font-size: 18px;
    color: #424242;
  }

  .bind_other_mask .bind_other_text {
    font-size: 14px;
    color: #424242;
    text-align: center;
    padding: 16px 0 20px;
    border-bottom: 1px solid #e6e6e6;
  }

  .bind_other_mask .bind_other_btn {
    text-align: center;
    font-size: 18px;
    color: #005bac;
    line-height: 45px;
    height: 45px;
    /*<<<<<<< HEAD*/
  }

  /* 微信服务号绑定end */
}

/* 普通课程登录/注册弹窗end */

/* 微信接入支付宝，支付成功 */
.alipay_wrapper {
  text-align: center;
  padding: 20px 0;
}

.alipay_wrapper .state-course {
  background: url(/static-dist/app/img/shenlan19/success_pic@2x.png) no-repeat center;
  background-size: 112px;
  width: 112px;
  height: 112px;
  display: block;
  margin: 0 auto 16px;
}

.alipay_wrapper .alipay_tit,
.paypal_wrapper .suc_decs {
  font-size: 16px;
  color: #31363f;
  font-weight: bold;
}

.alipay_wrapper .distinguish,
.paypal_wrapper .distinguish {
  padding: 20px 0 10px;
  font-size: 14px;
  color: #485159;
}

/*=======*/
/*    }*/
/* */
/* */
/*    !* 微信服务号绑定end *!*/
/*>>>>>>> origin/testing*/

.alipay_wrapper .alipay_remark,
.paypal_wrapper .alipay_remark {
  color: #485159;
  font-weight: bold;
  margin-bottom: 18px;
}

.alipay_wrapper .alipay_remark>span,
.paypal_wrapper .alipay_remark>span {
  color: #0091ff;
}

.alipay_wrapper .contact_code,
.paypal_wrapper .contact_code {
  border: 1px solid #90b2cc;
  width: 120px;
  display: block;
  margin: auto;
}

.alipay_wrapper .contact_arrow,
.paypal_wrapper .contact_arrow {
  width: 12px;
  display: block;
  margin: 7px auto;
}

.alipay_wrapper .contact_name,
.paypal_wrapper .contact_name {
  font-size: 12px;
  color: #909eab;
  margin: 10px 0;
}

.alipay_wrapper .succ_back,
.paypal_wrapper .succ_back {
  color: #0091ff;
  width: 124px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #ffffff;
  border: 1px solid #0091ff;
  border-radius: 20px;
  margin: auto;
  display: block;
}

/* 微信接入支付宝，支付成功end */

/* paypal支付 */
.layui-layer-page .layui-layer-content {
  height: auto !important;
}

.order-codepay .paypal_img {
  width: 112px;
  margin: 30px 0 15px;
}

.order-codepay .paypal_tit {
  font-size: 14px;
  color: #485159;
}

.order-codepay .payapl_cont {
  margin: 10px 0 25px;
  font-size: 12px;
  color: #c2c2c2;
}

.order-codepay .paypal_btn {
  background: #ffffff;
  border: 1px solid #0091ff;
  border-radius: 20px;
  width: 130px;
  height: 40px;
  line-height: 40px;
  display: block;
  margin: auto;
  color: #0091ff;
}

.order-codepay .re_election {
  margin: 13px 0 30px;
}

.order-codepay .re_election>img {
  width: 12px;
}

.order-codepay .re_election>.re_choose {
  font-size: 12px;
  color: #909eab;
  text-decoration: underline !important;
  margin-left: 5px;
}

.paypal_wrapper {
  position: relative;
}

.paypal_wrapper .bg_strip {
  position: absolute;
  width: 100%;
  height: 200px;
  z-index: -1;
}

.paypal_wrapper .payapl_fail,
.paypal_wrapper .payapl_success {
  max-width: 1100px;
  margin: auto;
}

.paypal_wrapper .paypal_title {
  padding: 40px 0;
  font-family: AlibabaPuHuiTiL;
  font-size: 28px;
  color: #ffffff;
  text-align: left;
}

.paypal_wrapper .cont_body {
  background: #ffffff;
  box-shadow: 0 8px 16px 0 rgb(153 165 177 / 10%);
  border-radius: 4px;
  height: auto;
  margin-bottom: 70px;
  text-align: center;
  padding-bottom: 50px;
}

.paypal_wrapper .fail_icon {
  width: 112px;
  margin: 50px 0 12px;
}

.paypal_wrapper .decs {
  font-family: MicrosoftYaHeiUI;
  font-size: 14px;
  color: #485159;
}

.paypal_wrapper .decs_kf {
  font-size: 12px;
  color: #fc4946;
  margin: 10px 0 20px;
}

.paypal_wrapper .course_box {
  background: #fafafa;
  max-width: 470px;
  margin: auto;
  height: 138px;
  text-align: left;
  padding: 20px 33px;
  margin-bottom: 50px;
}

.paypal_wrapper .circle_title {
  font-size: 14px;
  color: #3d464d;
  font-weight: bold;
}

.paypal_wrapper .circle_title .circle {
  width: 8px;
  margin-right: 5px;
}

.paypal_wrapper .explain {
  font-size: 12px;
  color: #6d7278;
  /*text-indent: 18px;*/
  margin: 5px 0 10px;
  padding-left: 18px;
}

.paypal_wrapper .explain>a {
  padding: 0 5px;
  text-decoration: underline !important;
  color: #0091ff;
}

.payment_method {
  padding: 25px 0 10px 30px !important;
  border-color: #eee;
  border-left: 0;
  border-right: 0;
  border: none;
  margin-bottom: 40px;
}

@media (max-width: 768px) {
  .payment_method {
    margin-bottom: 0px;
    padding: 25px 0 0 30px !important;
  }

  .form-paytype .payment_method .check {
    width: 95px;
  }
}

/* paypal支付end */

/* 对公转账 */
.rel {
  position: relative;
}

.abs {
  position: absolute;
}

.hide {
  display: none;
}

.cur {
  cursor: pointer;
}

.text_center {
  text-align: center;
}

.mar_r20 {
  margin-right: 20px;
}

.mar_t50 {
  margin-top: 50px;
}

.time-down-wrap {
  background: #fffdfa !important;
  font-weight: bold !important;
  border: none !important;
}

@media (max-width: 768px) {
  .panel-body .time-down-wrap {
    padding: 9px 5px 9px 0px;
    margin-bottom: 0;
  }
}

.time-down-wrap>i {
  font-weight: normal !important;
}

.transfer_btn,
.transfer_btn:hover,
.transfer_btn:active,
.transfer_btn:focus {
  right: 0;
  top: 0;
  font-size: 14px;
  color: #31363f;
  text-decoration: underline !important;
}

.transfer_cont {
  padding: 20px 20px 30px;
}

.transfer_cont .trans_title {
  text-align: center;
  border-bottom: 1px solid #dedede;
  padding-bottom: 14px;
  margin-bottom: 20px;
  font-size: 18px;
  color: #2c2e40;
}

.transfer_cont .trans_tips {
  font-size: 14px;
  color: #31363f;
  font-weight: bold;
  margin-bottom: 10px;
}

.transfer_cont .tip_text {
  font-size: 13px;
  color: #31363f;
  line-height: 24px;
}

.transfer_cont .trans_group {
  margin-top: 40px;
  display: flex;
  justify-content: center;
}

.transfer_cont .transfer_cancle {
  background: #ffffff;
  border: 1px solid #dedede;
  border-radius: 4px;
  width: 112px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  font-size: 14px;
  color: #3f4a54;
}

.transfer_cont .immediate_transfer {
  background: #0091ff;
  border: 1px solid #dedede;
  border-radius: 4px;
  width: 112px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  margin-left: 20px;
}

.transfer_cont .tip_cont {
  font-size: 14px;
  color: #31363f;
  text-align: center;
}

.transfer_process {
  padding: 30px 140px;
}

.transfer_process .transfer_body {
  margin-top: 50px;
}

.transfer_process .trans_line {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding-bottom: 70px;
  align-items: center;
}

.transfer_process .trans_line .item {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  text-align: center;
  background: #eeeeee;
  font-size: 18px;
  color: #888888;
  line-height: 26px;
  position: relative;
}

.transfer_process .trans_line .item_active {
  background: #0091ff;
  color: #fff;
}

.transfer_process .trans_line .item .item_text {
  color: #888888;
  font-size: 15px;
  top: 40px;
}

.transfer_process .trans_line .item_active .item_text {
  color: #0091ff;
}

.transfer_process .trans_line .item_first_text,
.transfer_process .trans_line .item_second_text {
  width: 135px;
  left: -41px;
}

.transfer_process .trans_line .item_third_text {
  width: 183px;
  left: -78px;
}

.transfer_process .line_active {
  background: #0091ff !important;
}

.transfer_process .trans_line .line1,
.transfer_process .trans_line .line2 {
  height: 4px;
  background: #eeeeee;
  width: 45%;
}

.transfer_body .step_title {
  font-size: 18px;
  color: #31363f;
  text-indent: 16px;
}

.transfer_body .step_title::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0px;
  background: #0091ff;
  height: 20px;
  width: 6px;
}

.transfer_body .account_cont {
  background: #f9fcff;
  border: 1px solid #c8e5ff;
  margin: 25px 0 20px;
  padding: 20px;
}

.first_step .account_cont {
  display: flex;
  justify-content: space-between;
}

.first_step .company_til {
  font-size: 18px;
  color: #31363f;
  font-weight: bold;
  margin-bottom: 14px;
}

.first_step .company_text {
  font-size: 14px;
  color: #31363f;
  line-height: 25px;
}

.first_step .reminder_style {
  width: 290px;
  height: 30px;
  text-align: center;
  background-color: #fff3eb;
  line-height: 30px;
  color: #fa6400;
  font-weight: bold;
  border-radius: 5px;
}

.first_step .copy_btn {
  background: #ffffff;
  border: 1px solid #dedede;
  border-radius: 4px;
  width: 134px;
  height: 34px;
  line-height: 34px;
  text-align: center;
}

.first_step .copy_btn .copy_pic,
.first_step .consult_btn .copy_pic {
  width: 16px;
  margin-right: 5px;
  cursor: pointer;
}

.first_step .step_foot {
  display: flex;
  justify-content: space-between;
}

.first_step .online_consult {
  display: flex;
}

.first_step .online_consult .consult_btn {
  background: #ffffff;
  border: 1px solid #dedede;
  border-radius: 4px;
  width: 112px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  font-size: 14px;
  color: #3f4a54;
}

.first_step .consult_tip {
  font-size: 12px;
  color: #000000;
  line-height: 34px;
  margin-left: 10px;
}

.transfer_body .red_text {
  color: #fc4946;
}

.transfer_body .blue_common_btn {
  background: #0091ff;
  border-radius: 4px;
  width: 112px;
  height: 34px;
  color: #fff;
  display: inline-block;
  text-align: center;
  line-height: 34px;
  font-size: 14px;
}

.transfer_body .gray_common_btn {
  background: #ffffff;
  border: 1px solid #dedede;
  border-radius: 4px;
  width: 112px;
  height: 34px;
  color: #3f4a54;
  display: inline-block;
  text-align: center;
  line-height: 34px;
  font-size: 14px;
}

.two_step .remittance_item {
  margin-bottom: 15px;
}

.two_step .rem_title {
  font-size: 16px;
  color: #001800;
  min-width: 120px;
  display: inline-block;
}

.two_step .rem_input {
  background: #ffffff;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  width: 230px;
  height: 38px;
  text-indent: 12px;
}

.two_step .two_btn_group {
  display: flex;
  justify-content: flex-end;
}

.three_step .success_pic {
  width: 112px;
}

.three_step .transfer_suc {
  font-size: 16px;
  color: #485159;
  font-weight: bold;
  padding: 14px 0 7px;
}

.three_step .transfer_txt {
  font-size: 12px;
  color: #999999;
  margin-bottom: 40px;
}

.three_step .transfer_txt>a {
  color: #0091ff;
}

.three_step .suc_tips {
  font-size: 12px;
  color: #3f3f3f;
  margin-top: 20px;
}

.three_step {
  text-align: center;
  margin-top: 50px;
}

.transfer_body .exam_box {
  margin-bottom: 30px;
}

.transfer_body .remitter .company_info>p {
  line-height: 40px !important;
}

.copy_hidden {
  width: 100px;
  position: absolute;
  top: -1000px;
  z-index: -100;
}

.look_foot {
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 768px) {
  .pay-title-bg h2 {
    font-size: 18px;
    padding-top: 20px;
    padding-bottom: 102px;
  }

  .order-pay .es-section {
    padding: 20px 10px;
  }

  .transfer_process {
    padding: 0;
  }

  .look_foot {
    justify-content: center;
  }

  .transfer_process .trans_line {
    width: 70%;
    margin: auto;
  }

  .transfer_process .trans_line .item_first_text,
  .transfer_process .trans_line .item_second_text {
    font-size: 12px !important;
    width: 98px;
    line-height: 16px;
  }

  .transfer_process .trans_line .item_third_text {
    font-size: 12px !important;
    width: 98px;
    line-height: 16px;
    left: -41px;
  }

  .transfer_process .transfer_body {
    margin-top: 10px;
  }

  .first_step .account_cont {
    display: block;
  }

  .company_copy {
    margin-top: 20px;
  }

  .first_step .step_foot {
    margin-bottom: 30px;
  }

  .first_step .online_consult {
    display: block;
  }

  .first_step .online_consult .consult_btn {
    display: block;
  }

  .first_step .consult_tip {
    position: absolute;
    margin-left: 0;
  }

  .two_step .rem_input {
    width: 100%;
  }

  .two_step .remittance_item {
    margin-bottom: 20px;
  }

  .two_step .two_btn_group {
    justify-content: space-between;
  }

  .transfer_process .trans_line .line1,
  .transfer_process .trans_line .line2 {
    width: 38%;
  }

  .transfer_box .table>tbody>tr>th,
  .transfer_box .table>tbody>tr>.td_operation {
    white-space: nowrap;
    padding: 10px 8px !important;
  }

  .transfer_box .table>tbody>tr>td {
    /* white-space: nowrap; */
    padding: 10px 8px !important;
  }

  .layui-layer.layer-transfer-myskin {
    width: 350px !important;
  }
}

/* 对公转账end */

/* paypal支付end */

/* 普通课程登录/注册弹窗end */

/* 课程详情增加视频需求341 */
.courser-video-wrap2 .spec_video_box {
  max-width: 1080px;
  margin: 0px auto;
  padding-bottom: 24px;
}

.courser-video-wrap2 .spec_video_box .video_block {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj {
  width: 48%;
  z-index: 0;
  position: relative;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj .examples_title {
  background: url(/static-dist/app/img/double11/341/green.png) no-repeat;
  text-align: center;
  font-size: 22px;
  color: #fff;
  width: 155px;
  display: inline-block;
  height: 54px;
  background-size: 100% 100%;
  line-height: 54px;
  font-weight: bold;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 2px;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box {
  background: #fff;
  padding: 20px;
  border-radius: 16px;
  z-index: 100;
  margin-top: 45px;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box>p {
  margin-bottom: 10px;
  font-size: 16px;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box .hei_a {
  height: 30px;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box .hei_b {
  height: 66px;
}

.courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box .hei_c {
  height: 44px;
}

@media (max-width: 1079px) {
  .courser-video-wrap2 .spec_video_box {
    max-width: 920px;
    padding-top: 80px;
  }

  .courser-video-wrap2 .spec_video_box .video_block {
    display: block;
  }

  .courser-video-wrap2 .spec_video_box .video_block .video_obj {
    width: 100%;
  }

  .courser-video-wrap2 .spec_video_box .video_block .video_obj .examples_title {
    top: -44px;
  }

  .courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box {
    margin-top: 80px;
  }

  .courser-video-wrap2 .spec_video_box .video_block:first-child>.video_obj:first-child>.obj_box {
    margin-top: 0px !important;
  }

  .courser-video-wrap2 .spec_video_box .video_block .video_obj .obj_box>p {
    height: auto !important;
    font-size: 12px;
  }
}

/* 课程详情增加视频需求341-end */

/* 发票支付页面 */
.invoice_paytype .check {
  width: 135px !important;
}

.invoice_paytype .check:nth-child(odd) {
  margin-right: 10px !important;
}

/* 发票支付页面end */

/* 课程转化记录 */
@font-face {
  font-family: "zhuanhua";
  src: url(/static-dist/app/fonts/zhuanhua.eot?pu6tna);
  src: url(/static-dist/app/fonts/zhuanhua.eot?pu6tna#iefix) format("embedded-opentype"),
    url(/static-dist/app/fonts/zhuanhua.ttf?pu6tna) format("truetype"),
    url(/static-dist/app/fonts/zhuanhua.woff?pu6tna) format("woff"),
    url(/static-dist/app/fonts/zhuanhua.svg?pu6tna#zhuanhua) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.es-icon-zhuanhua {
  font-family: "zhuanhua" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-zhuanhuajilu_icon:before {
  content: "\e900";
  font-size: 14px;
  padding: 2px 3px 0 3px;
  /* color: #616161; */
}

.mar_r20,
.pay_mar_r20 {
  margin-right: 20px;
}

.mar_bom10 {
  margin-bottom: 10px;
}

.text_rigth {
  text-align: right;
}

.conversion_box {
  margin-top: 40px;
  padding: 30px 40px;
}

.conversion_title {
  font-size: 20px;
  color: #3d464d;
  font-weight: bold;
  padding: 0 0 20px 10px;
  position: relative;
  border-bottom: 1px solid #e4ecf3;
}

.conversion_title::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0px;
  border-radius: 0 2px 2px 0;
  width: 4px;
  height: 20px;
  background: #005bac;
}

.conversion_num {
  display: flex;
  color: #3d464d;
}

.conversion_num .conveersion_ordernum {
  margin-right: 20px;
}

.conversion_num b {
  color: #31363f;
}

#mobileTable,
.mobileTable {
  display: none;
  border-top: none;
}

.conversion_mobile {
  color: #3d464d;
}

.conversion_mobile .conversion_til {
  font-size: 14px;
  color: #31363f;
  font-weight: bold;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

.conversion_mobile .conversion_span {
  width: 65px;
  display: inline-block;
  white-space: nowrap;
}

.conversion_mobile .mobile_xqbtn {
  background: #ffffff;
  border: 1px solid #dedede;
  border-radius: 4px;
  width: 70px;
  height: 36px;
  display: inline-block;
  line-height: 36px;
  text-align: center;
  font-size: 14px;
  color: #31363f;
}

.organce_num {
  color: #fa6400;
}

.mobile_searchbtn {
  display: none;
}

.screen_sel {
  display: inline-block;
}

.searchbtn_sty {
  background: #005bac !important;
  border-radius: 4px !important;
  padding: 7px 20px !important;
}

@media (max-width: 999px) {

  #pcTable,
  .pcTable {
    display: none;
  }

  #mobileTable,
  .mobileTable,
  .mobile_searchbtn {
    display: block;
  }

  #mobileTable tr td {
    white-space: normal;
  }

  .screen_sel {
    display: flex;
    justify-content: space-between;
  }

  .pay_mar_r20 {
    margin-right: 0;
  }

  .stutas_mar_r20 {
    margin-right: 20px;
  }

  .ordermar_bom10 {
    margin-bottom: 10px;
  }
}

/* 课程转化记录 end */

/* 小蓝卡 */
.cus {
  cursor: pointer;
}

.dis_block {
  display: block;
}

.blue_scale {
  transform: scale(0);
  transition: all 0.5s;
}

.blue_card_mask .blue-box,
.index_card_mask .blue-box {
  background: none !important;
  /* width: 400px;
    min-height: 420px; */
  width: 80vw;
  max-width: 400px;
  top: 50%;
  position: relative;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  text-align: center;
}

.blue_card_mask .blue-box .closeover,
.index_card_mask .blue-box .closeover {
  position: absolute;
  width: 30px;
  height: 30px;
  top: -30px;
  right: -30px;
  cursor: pointer;
}

.blue_card_mask .bluecard_bg,
.blue_card_mask .blue-box .closeover>img,
.index_card_mask .bluecard_bg,
.index_card_mask .blue-box .closeover>img {
  width: 100%;
}

.blue_card_wrapper {
  background: #050954;
  position: relative;
  z-index: 1;
}

.blue_card_wrapper .topic_banner {
  width: 100%;
  text-align: center;
  max-width: 1920px;
  height: 500px;
  min-height: 80px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: top center;
}

.blue_card_wrapper .blue_card_body,
.topic_block .blue_card_body {
  max-width: 1080px;
  margin: auto;
}

.blue_card_wrapper .topic_block {
  text-align: center;
}

.blue_card_wrapper .topic_title {
  padding: 25px 0 15px;
}

.blue_card_wrapper .section_1 {
  background: #ffffff;
  border: 1px solid #5887ff;
  border-radius: 10px;
  display: flex;
  padding: 30px;
  justify-content: space-between;
  align-items: center;
}

.blue_card_wrapper .section_1 .card_img {
  width: 376px;
  height: 238px;
  margin-right: 50px;
  border-radius: 8px;
}

.blue_card_wrapper .section_1 .section1_text {
  text-align: left;
  font-size: 22px;
  color: #001800;
  line-height: 36px;
}

.blue_card_wrapper .section_1 .section1_text i {
  color: #0067ff;
  font-weight: bold;
}

.blue_card_wrapper .section_2 {
  /* padding: 30px 40px;
    background: #FFFFFF;
    border-radius: 10px; */
}

.blue_card_wrapper .topic_title2 {
  padding: 25px 0 5px;
}

.blue_card_wrapper .title_des {
  font-size: 22px;
  color: #ffffff;
  text-align: center;
  margin-bottom: 30px;
}

.blue_card_wrapper .section_2 .section2_item1 {
  background: #ffffff;
  border-radius: 10px;
  padding: 30px 40px 10px;
}

.blue_card_wrapper .section_2 .section2_item1>p {
  font-size: 18px;
  color: #050954;
  line-height: 30px;
  font-weight: bold;
  text-align: left;
}

.blue_card_wrapper .section_2 .section2_item1>img {
  margin: 10px 0 20px;
}

.blue_card_wrapper .section_2 .section2_item2,
.blue_card_wrapper .section2_item3 {
  border: 1px solid #1b1fa0;
  border-radius: 10px;
  margin: 30px 0;
  padding: 30px 40px;
}

.blue_card_wrapper .section2_item3 {
  background: #010345;
}

.blue_card_wrapper .section_2 .section2_item2 {
  background: #fff;
}

.blue_card_wrapper .item2_title,
.blue_card_wrapper .item3_title {
  font-size: 18px;
  color: #010345;
  line-height: 30px;
  font-weight: bold;
  text-align: left;
}

.blue_card_wrapper .item2_title>i {
  font-weight: normal;
  font-size: 16px;
}

.blue_card_wrapper .section_2 .item2_imgs {
  display: flex;
  justify-content: space-between;
  margin-top: 25px;
}

.blue_card_wrapper .section_2 .item2_bok>p {
  margin-top: 14px;
  color: #010345;
  font-size: 14px;
}

.blue_card_wrapper .section_2 .item2_imgs>p {
  font-size: 14px;
  color: #ffffff;
  margin-top: 10px;
}

.blue_card_wrapper .item3_title {
  font-size: 18px;
  color: #ffffff;
  line-height: 30px;
}

.blue_card_wrapper .item3_title>i {
  color: yellow;
}

.blue_card_wrapper .item3_title>image {
  color: yellow;
}

.blue_card_wrapper .item3_cont {
  font-size: 20px;
  color: #ffffff;
  line-height: 30px;
  display: flex;
  margin-top: 25px;
}

.blue_card_wrapper .item3_cont .coupon {
  margin-right: 40px;
}

.blue_card_wrapper .item3_cont .coupon>p {
  font-size: 20px;
  color: #ffffff;
  line-height: 30px;
  font-weight: bold;
  margin-top: 10px;
}

.blue_card_wrapper .item3_cont .coupon>p>i {
  color: yellow;
}

.blue_card_wrapper .item4_title {
  font-size: 24px;
  color: #ffffff;
  font-weight: bold;
  text-align: left;
  margin: 40px 0 30px;
}

.blue_card_wrapper .item4_img>img {
  width: 100%;
}

.blue_card_wrapper .section_3 {
  background: #ffffff;
  border: 1px solid #5887ff;
  border-radius: 10px;
  text-align: left;
  padding: 50px;
}

.blue_card_wrapper .section_3 .section3_item {}

.blue_card_wrapper .section_3 .section3_item .sec3_item_title {}

.blue_card_wrapper .section_3 .section3_item .sec3_item_title>i {
  font-size: 20px;
  color: #ffffff;
  font-weight: bold;
  background-image: linear-gradient(135deg, #45afff 0%, #2966e9 100%);
  border-radius: 2px;
  width: 33px;
  display: inline-block;
  text-align: center;
}

.blue_card_wrapper .section_3 .section3_item .sec3_item_title>span {
  position: relative;
  font-size: 22px;
  color: #31363f;
  z-index: 1;
  font-weight: bold;
}

.blue_card_wrapper .section_3 .section3_item .item3sec3_item_title_title>span::before {
  position: absolute;
  content: "";
  background: #e4efff;
  height: 13px;
  z-index: -1;
  bottom: 0;
}

.blue_card_wrapper .section_3 .section3_item .itme_answer {
  margin: 14px 0 40px;
  font-size: 18px;
  color: #2f3c52;
}

.blue_card_wrapper .section_3 .section3_item .itme_answer>i {
  color: #0067ff;
  font-weight: bold;
}

.blue_card_wrapper .section_3 .section3_item:last-child .itme_answer {
  margin-bottom: 0;
}

.blue_card_wrapper .foot_code {
  position: relative;
  z-index: 5;
  overflow: hidden;
}

.foot_code .section_4 .sec4_bg1 {
  position: absolute;
  top: 0;
  left: 100px;
}

.foot_code .section_4 .sec4_bg2 {
  position: absolute;
  top: -357px;
  right: 100px;
}

.blue_card_wrapper .sec4_title {
  font-size: 18px;
  color: #ffffff;
  font-weight: bold;
  margin: 15px 0 25px;
}

.blue_card_wrapper .sec4_code {
  margin-bottom: 18px;
}

.blue_card_wrapper .sec4_code>img {
  width: 160px;
}

.blue_card_wrapper .sec4_arrow>img {
  width: 12px;
}

.blue_card_wrapper .sec4_remark {
  font-size: 14px;
  color: #ffffff;
  padding-bottom: 70px;
}

.blue_line_fixed {
  height: 80px;
  position: fixed;
  /* bottom: 40px; */
  bottom: 0;
  width: 100%;
  z-index: 999;
}

.blue_line_fixed .buy_cont {
  max-width: 1080px;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 80px;
  background: #ffffff;
  box-shadow: 0 -12px 20px 0 rgb(36 41 48 / 8%);
  border-radius: 10px;
  padding: 12px 20px;
  height: 100%;
}

.blue_line_fixed .buy_cont .line_left {
  margin-top: 0;
}

.blue_line_fixed .line_left>img {
  width: 89px;
  display: inline-block;
  margin: -12px 50px 12px 0;
  border-radius: 4px;
}

.blue_line_fixed .line_left>span {
  display: inline-block;
  font-size: 14px;
  color: #202e3a;
  margin-right: 10px;
  margin-left: -5px;
  padding-top: 15px;
}

.blue_line_fixed .line_left>span>i {
  font-size: 22px;
  color: #e83d2c;
}

.blue_line_fixed .line_left>span>b {
  color: #e83d2c;
  font-size: 44px;
  font-weight: 500;
}

.blue_line_fixed .line_left .bule_card_moud {
  display: inline-block;
  margin-top: 20px;
  padding-top: 12px;
}

.blue_line_fixed .line_left .bule_card_moud .quota_num {
  font-size: 18px;
  font-weight: 700;
  color: #202e3a;
  display: flex;
  align-items: center;
}

.blue_line_fixed .line_left .bule_card_moud .quota_num span {
  margin-left: 6px;
  background: url("/static-dist/app/img/act-mid-autumn/label_pc.png") no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  width: 155px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
}

.blue_line_fixed .line_left .bule_card_moud .card_date {
  font-size: 12px;
  color: #a7b2c3;
}

.blue_line_fixed .line_right .blue_card_btn {
  background: #198ce6;
  border-radius: 30px;
  font-size: 16px;
  color: #ffffff;
  display: inline-block;
  width: 180px;
  height: 52px;
  text-align: center;
  line-height: 52px;
  cursor: pointer;
}

.blue_line_fixed .line_right .blue_card_btn1,
.blue_line_fixed .line_right .blue_card_btn2 {
  width: 180px;
  height: 52px;
  color: #fff;
  display: inline-block;
  border-radius: 28px;
  text-align: center;
  cursor: pointer;
  line-height: 52px;
}

.blue_line_fixed .line_right .blue_card_btn1 {
  background-image: linear-gradient(90deg, #fdc106 0%, #fc9701 100%);
  margin-right: 20px;
}

.blue_line_fixed .line_right .blue_card_btn2 {
  background: #fc5302;
}

.blue_line_fixed .line_right .blue_card_btn.buy_out {
  background: #c6c6c6;
}

.blue_line_fixed .line_right .blue_card_btn.purchased {
  background: #abdaff;
}

.wrapper_left_fixed {
  position: absolute;
  top: 230px;
  left: -150px;
  z-index: -1;
}

.wrapper_left_fixed .left_bg2 {
  margin-top: 320px;
}

.wrapper_left_fixed .left_bg2 {
  margin-top: 240px;
}

.wrapper_right_fixed {
  position: absolute;
  top: 230px;
  right: 0;
  z-index: -1;
}

.wrapper_right_fixed .right_bg2 {
  margin-top: 320px;
}

.wrapper_right_fixed .right_bg2 {
  margin-top: 240px;
}

.wrapper_left_fixed img,
.wrapper_right_fixed img {
  display: block;
}

.blue_pay_til {
  font-size: 16px;
  color: #31363f;
  font-weight: bold;
}

.blue_tips {
  background: #f9f9f9;
  border-radius: 4px;
  width: 65%;
  text-align: center;
  margin: 20px auto 40px;
  padding: 20px;
}

.blue_tips>p:first-child {
  font-size: 16px;
  font-weight: 600;
}

.blue_tips>p:last-child {
  font-size: 14px;
}

.blue_tips>p {
  color: #485159;
  line-height: 24px;
}

.title_common {
  margin: auto;
  width: 70%;
}

.blue_t1 {
  width: 658px;
}

.blue_t2 {
  width: 736px;
}

.blue_t3,
.blue_t4 {
  width: 552px;
}

.pc_show {
  display: block;
}

.m_show {
  display: none;
}

/* 小蓝卡等级表弹窗 */
.grade_table_mask .blue-box {
  background: #fff;
  width: 300px;
  min-height: 331px;
  top: 50%;
  position: relative;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  text-align: center;
  border-radius: 8px;
  padding: 30px 0;
}

.grade_table_mask .blue-box>p {
  font-size: 16px;
  color: #2c2e40;
  font-weight: bold;
}

.grade_table_mask .blue-box>img {
  width: 160px;
  height: 160px;
  margin: 10px auto 20px;
  display: block;
}

.grade_table_mask .blue-box>a {
  background: #ffffff;
  border: 1px solid #0091ff;
  border-radius: 20px;
  width: 130px;
  height: 40px;
  display: inline-block;
  line-height: 40px;
  cursor: pointer;
  font-size: 14px;
  color: #0091ff;
}

@media (max-width: 768px) {
  .blue_card_mask .blue-box {
    width: 70%;
  }

  .pc_show {
    display: none !important;
  }

  .m_show {
    display: block !important;
  }

  .title_common {
    width: 100%;
  }

  .blue_card_body {
    max-width: 100%;
    margin: auto 20px !important;
  }

  .blue_card_wrapper .section_1 {
    display: block;
    padding: 20px;
  }

  .blue_card_wrapper .section_1 .card_img {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
  }

  .blue_card_wrapper .section_1 .section1_text {
    font-size: 14px;
    color: #001800;
    line-height: 22px;
  }

  .blue_card_wrapper .title_des {
    font-size: 12px;
  }

  .blue_card_wrapper .section_2 .section2_item1 {
    padding: 16px;
  }

  .blue_card_wrapper .section_2 .section2_item1>p {
    font-size: 14px;
    line-height: 20px;
  }

  .blue_card_wrapper .section_2 .section2_item1>img {
    width: 100%;
    margin: 8px 0 20px;
    line-height: 18px;
  }

  .blue_line_fixed .line_left .bule_card_moud .quota_num span {
    margin-left: 6px;
    background: url("/static-dist/app/img/act-mid-autumn/label_m.png") no-repeat;
    background-size: cover;
    color: #fff;
    display: inline-block;
    width: 145px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    font-size: 12px;
    font-weight: 400;
  }

  .blue_line_fixed .line_left .bule_card_moud .quota_num {
    font-size: 14px;
  }

  .blue_card_wrapper .item2_title>i {
    font-size: 12px;
  }

  .blue_card_wrapper .section_2 .item2_imgs {
    flex-wrap: wrap;
  }

  .blue_card_wrapper .section_2 .item2_imgs .item2_bok {
    width: 48%;
  }

  .blue_card_wrapper .section_2 .item2_imgs .item2_bok>img {
    width: 100%;
    border-radius: 4px;
  }

  .blue_card_wrapper .section_2 .item2_imgs .item2_bok>p {
    font-size: 12px;
    color: #010345;
    padding: 5px 0;
    display: block;
    margin-bottom: 10px;
    margin-top: 0;
  }

  .blue_card_wrapper .section_2 .section2_item2,
  .blue_card_wrapper .section2_item3 {
    padding: 16px;
  }

  .blue_card_wrapper .item2_title,
  .blue_card_wrapper .item3_title {
    text-align: center;
    line-height: 20px;
  }

  .blue_card_wrapper .item3_title {
    font-size: 14px;
    color: #ffffff;
    text-align: center;
  }

  .blue_card_wrapper .item3_cont {
    display: block;
    margin-top: 10px;
  }

  .blue_card_wrapper .item3_cont .coupon {
    margin: 0;
  }

  .blue_card_wrapper .item3_cont .coupon>img {
    width: 100%;
  }

  .blue_card_wrapper .item3_cont .coupon>p {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .blue_card_wrapper .item4_title {
    font-size: 14px;
    width: 223px;
    text-align: center;
    display: inline-block;
    margin: 0 0 10px;
  }

  .blue_card_wrapper .section_3 {
    padding: 20px 16px;
  }

  .blue_card_wrapper .section_3 .section3_item .sec3_item_title>i {
    width: 24px;
    height: 22px;
    font-size: 14px;
  }

  .blue_card_wrapper .section_3 .section3_item .sec3_item_title>span {
    font-size: 16px;
  }

  .blue_card_wrapper .section_3 .section3_item .itme_answer {
    font-size: 12px;
    line-height: 18px;
    margin: 8px 0 20px;
    padding-left: 30px;
  }

  .blue_card_wrapper .sec4_title {
    font-size: 16px;
    margin: 0 0 13px;
  }

  .blue_line_fixed {
    height: auto;
    bottom: 0 !important;
  }

  .blue_line_fixed .buy_cont {
    max-width: 100%;
    line-height: 52px;
    border-radius: 0;
    padding: 0 10px 0 12px;
    display: flex;
    flex-direction: column;
  }

  .blue_line_fixed .buy_cont .line_left {
    margin: 0;
  }

  .blue_line_fixed .buy_cont .m_show {
    display: flex !important;
  }

  .blue_line_fixed .line_left>span>i {
    font-size: 18px;
    color: #e83d2c;
  }

  .blue_line_fixed .line_left>span>b {
    font-size: 30px;
    font-weight: 500;
  }

  .blue_line_fixed .line_left .bule_card_moud {
    margin: 0;
    font-size: 12px;
  }

  .blue_line_fixed .line_right {
    display: flex;
    margin-bottom: 10px;
  }

  .blue_line_fixed .line_right .blue_card_btn1 {
    background-image: linear-gradient(270deg, #fc9701 0%, #fdc106 100%);
    border-radius: 39px 0 0 39px;
    height: 45px;
    line-height: 45px;
    margin-right: -1px;
  }

  .blue_line_fixed .line_right .blue_card_btn2 {
    border-radius: 0px 39px 39px 0;
    height: 45px;
    line-height: 45px;
  }

  .blue_line_fixed .line_right .blue_card_btn {
    width: 100px;
    height: 40px;
    font-size: 14px;
    line-height: 40px;
  }

  .blue_tips {
    width: 95%;
  }

  .blue_card_wrapper .topic_banner {
    height: auto;
  }
}

/* 小蓝卡end */

/* 公开课分享优化 */
@font-face {
  font-family: "openshare";
  src: url(/static-dist/app/fonts/openshare.eot?tsi3jf);
  src: url(/static-dist/app/fonts/openshare.eot?tsi3jf#iefix) format("embedded-opentype"),
    url(/static-dist/app/fonts/openshare.ttf?tsi3jf) format("truetype"),
    url(/static-dist/app/fonts/openshare.woff?tsi3jf) format("woff"),
    url(/static-dist/app/fonts/openshare.svg?tsi3jf#openshare) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.open_share {
  font-family: "openshare" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-weixin_icon:before {
  content: "\e901";
  color: #fff;
}

.icon-weibo_icon:before {
  content: "\e902";
  color: #fff;
}

.icon-QQkongjian_icon:before {
  content: "\e903";
  color: #fff;
}

.icon-qq_icon:before {
  content: "\e904";
  color: #fff;
}

.icon-fuzhilianjie_icon:before {
  content: "\e900";
  color: #fff;
}

.courseSet-btn-js .open_share_li {
  background: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.courseSet-btn-js .open_share_li .invite_button {
  background-image: linear-gradient(180deg, #ffd890 0%, #f2a542 100%);
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 2px 0 0 #d27f11;
  border-radius: 30px;
  font-size: 12px;
  color: #ffffff;
  font-weight: bold;
  width: 148px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  cursor: pointer;
  animation: scaleDrew 2.5s ease-in-out infinite;
}

@keyframes scaleDrew {
  0% {
    transform: scale(1);
  }

  25% {
    transform: scale(1.05);
  }

  50% {
    transform: scale(1);
  }

  75% {
    transform: scale(1.05);
  }
}

.courseSet-btn-js .open_share_li .share_cont {
  background: url(/static-dist/app/img/sharing_opt/xiaosanjiao_pic@2x_1.png) no-repeat;
  width: 148px;
  height: 38px;
  line-height: 45px;
  text-align: center;
  background-size: cover;
  display: none;
  margin-top: 4px;
}

.courseSet-btn-js .open_share_li .share_cont .es-icon {
  font-size: 21px !important;
}

.courseSet-btn-js .open_share_li .share_cont .js-social-share-params .copy_link {
  font-size: 17px;
}

.copy-share-modal .modal-content,
.weixin-share-modal .modal-content {
  padding: 32px 30px;
  text-align: center;
}

.copy-share-modal .share-modal-cont,
.weixin-share-modal .share-modal-cont {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
}

.copy-share-modal .share-modal-cont {
  width: 420px;
  height: 198px;
}

.copy-share-modal .modal-content .share_title,
.weixin-share-modal .modal-content .share_title {
  font-size: 18px;
  color: #485159;
}

.copy-share-modal .modal-content .share_title .share_close,
.weixin-share-modal .modal-content .share_title .share_close {
  width: 14px;
  height: 14px;
  background: url(/static-dist/app/img/sharing_opt/guanbi_icon@2x.png) no-repeat;
  background-size: 100% 100%;
  right: 20px;
  top: 26px;
  cursor: pointer;
  opacity: 1;
}

.copy-share-modal .modal-content .copylink_val {
  background: #ffffff;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
  display: block;
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-indent: 12px;
  font-size: 13px;
  color: #666666;
  margin-top: 17px;
}

.copy-share-modal .modal-content .copylink_btn {
  background: #198ce6;
  border-radius: 22px;
  font-size: 14px;
  color: #f8f8f8;
  display: inline-block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  margin-top: 20px;
}

.weixin-share-modal .share-modal-cont {
  width: 400px;
  height: 300px;
}

.weixin-share-modal .weixin_share_code {
  margin: 20px auto 0;
  width: 170px;
  height: 170px;
  background: #ffffff;
  box-shadow: 0 0 4px 0 rgb(164 164 164 / 50%);
  padding: 10px;
}

.weixin-share-modal .weixin_share_code img {
  width: 100%;
  height: 100%;
}

.task-dashboard-page .dashboard-content.public {
  top: 100px !important;
}

.wechat_share,
.mobile_share {
  position: fixed;
  right: -1px;
  top: 20%;
  z-index: 9999;
}

.wechat_share .wechat_body,
.mobile_share .mobile_body {
  background-image: linear-gradient(90deg, #f7c568 0%, #f2a542 100%);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 10px 0 0 10px;
  width: 32px;
  height: auto;
  padding: 7px 7px;
  line-height: 13px;
  font-size: 12px;
  color: #ffffff;
  font-weight: bold;
}

.invitation {
  display: block;
  width: 10px;
}

.wechat_share .wechat_body .share_icon,
.mobile_share .mobile_body .share_icon {
  width: 16px;
  margin-right: 5px;
}

.wechat_share .m_close,
.mobile_share .m_close {
  width: 22px;
  top: -9px;
  left: -9px;
  padding: 3px;
}

.wechat_mask,
.mobile_mask {
  z-index: 9999;
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}

.wechat_mask .wechat_mask_img {
  width: 279px;
  right: 10px;
  top: 15px;
}

.mobile_mask .mobile_share_box {
  width: 270px;
  /* height: 270px; */
  position: absolute;
  background: #fff;
  box-shadow: 0 2px 10px 0 rgb(0 0 0 / 10%);
  border-radius: 14px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mobile_mask .mobile_share_box .mobile_title {
  font-size: 14px;
  color: #3f4a54;
  text-align: center;
  margin: 18px 0 14px;
}

.mobile_mask .mobile_share_cont {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 20px;
}

.mobile_mask .mobile_share_cont .mobile_share_item {
  width: 33%;
  text-align: center;
  margin-bottom: 20px;
}

.mobile_mask .mobile_share_cont .mobile_share_item>img {
  width: 46px;
}

.mobile_mask .mobile_share_cont .mobile_share_item>span {
  font-size: 12px;
  color: #3d464d;
  display: block;
  margin-top: 3px;
}

.mobile_mask .mobile_cancle {
  font-size: 17px;
  color: #888888;
  border-top: 1px solid #d8d8d8;
  display: block;
  text-align: center;
  padding: 11px 0;
}

.flowers-payment {
  display: none;
}

@media (max-width: 768px) {

  .copy-share-modal .share-modal-cont,
  .weixin-share-modal .share-modal-cont {
    width: 90%;
  }
}

/* 小蓝卡end */

/* 课程小序章 */
.preface-form .checkbox {
  margin-top: 16px;
  margin-bottom: 16px;
}

.preface-form .checkbox input {
  opacity: 0;
}

.preface-form .checkbox input[type="checkbox"] {
  position: absolute;
  margin-left: -20px;
}

.preface-form .checkbox .input-icon {
  background: url(/static-dist/app/img/fuxuan01_icon@2x.png) no-repeat;
  width: 16px;
  height: 16px;
  display: inline-block;
  position: absolute;
  left: -1px;
  top: 2px;
  background-size: 100% 100%;
}

.preface-form .checkbox input[type="checkbox"]:checked+.input-icon {
  background: url(/static-dist/app/img/fuxuan02_icon@2x.png) no-repeat;
  background-size: 100% 100%;
}

.check_cont {
  padding-left: 10px;
  display: flex;
  margin-top: 10px;
}

.check_cont i {
  color: red;
}

.check_cont .textarea_cont {
  border: 1px solid #e1e1e1;
  border-radius: 4px;
  width: 100%;
  padding: 6px 12px;
  margin-left: 5px;
}

/* 课程小序章end */

.white_nowrap {
  white-space: nowrap;
}

.txt_center {
  text-align: center;
}

.rel {
  position: relative;
}

.abs {
  position: absolute;
}

/* 章节解锁 */
.chapter_body .chapter_item {
  cursor: pointer;
}

.chapter_body .chapter_item:hover {
  background: #f9f9f9;
}

.detail_btns {
  text-align: left;
}

.chapter_price—increase {
  position: absolute;
  font-size: 14px;
  color: #a7b2c3;
  bottom: -31px;
  font-size: 12px;
}

.chapter_price—increase .asterisk {
  font-size: 12px;
  color: #e02020;
}

.chapter_txt {
  font-size: 14px;
  color: #a7b2c3;
  bottom: -23px;
  left: 0;
  width: 100%;
  text-align: center;
  padding-right: 20px;
}

.lin_h {
  line-height: 34px !important;
}

.chapter_poster {
  width: 780px;
  margin: 20px auto;
  background: #ffffff;
  border: 1px solid #e4ecf3;
  border-radius: 4px;
  padding: 30px 40px;
}

.chapter_poster .poster_title {
  font-size: 20px;
  color: #3d464d;
  font-weight: bold;
  padding: 0 0 20px 12px;
  border-bottom: 1px solid #e4ecf3;
  margin-bottom: 20px;
}

.chapter_poster .poster_title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 20px;
  background: #005bac;
  border-radius: 0 2px 2px 0;
}

.chapter_poster .poster_show {
  display: flex;
}

.poster_wrap {
  width: 540px;
  height: 960px;

  background: #d8d8d8;
  border-radius: 10px;
  position: absolute;
  top: -3000px;
  left: -3000px;
}

.poster_wrap .avatar {
  width: 300px;
  font-size: 18px;
  position: absolute;
  top: 25px;
  left: 34px;
  color: #fff;
}

.poster_wrap .user-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.poster_wrap .user-name {
  position: absolute;
  top: 4px;
  width: 100%;
  left: 63px;
}

.poster_wrap .user-text {
  position: absolute;
  top: 28px;
  width: 100%;
  left: 63px;
}

.poster_show .poster {
  width: 340px;
  height: 604px;
}

.poster_wrap .poster_bg {
  width: 100%;
  height: 100%;
}

.poster_wrap .qrcode {
  bottom: 48px;
  right: 35px;
  width: 130px;
  height: 130px;
  border: 7px solid #fff;
  box-sizing: border-box;
  background: #fff;
}

.poster_wrap .qrcode>canvas {
  width: 116px;
  height: 116px;
}

.poster_wrap .qrcodeurl {
  position: absolute;
  top: -1000px;
  left: -3000px;
}

/* 特殊的 */
.poster_wrap.only .avatar {
  width: 400px;
  top: 30px;
  left: 30px;
}

.poster_wrap.only .avatar .user-avatar {
  width: 70px;
  height: 70px;
}

.poster_wrap.only .avatar .user-name {
  top: 7px;
  width: 100%;
  left: 87px;
  font-weight: bold;
  font-size: 25px;
}

.poster_wrap.only .avatar .user-text {
  top: 44px;
  left: 87px;
}

.poster_wrap.only .qrcode {
  bottom: 30px;
  right: 60px;
  width: 114px;
  height: 114px;
  border-radius: 4px;
}

.poster_wrap.only .qrcode>canvas {
  width: 100px;
  height: 100px;
}

/* 特殊的end */
.chapter_poster .invite_mode {
  margin-left: 40px;
}

.chapter_poster .invite_mode .share_mode {
  font-size: 18px;
  color: #3d464d;
  font-weight: bold;
}

.chapter_poster .invite_mode .share_mode img {
  width: 15px;
  margin-right: 8px;
}

.chapter_poster .invite_mode .share_txt {
  font-size: 14px;
  color: #3d464d;
  margin: 12px 0 10px;
}

.chapter_poster .invite_mode .share_box {
  width: 100%;
}

.chapter_poster .share_box .copylink_val {
  background: #ffffff;
  border: 1px solid #eaeaea;
  border-radius: 4px;
  width: 100%;
  padding: 14px;
  height: 100px;
}

.chapter_poster .share_box .copylink_btn {
  width: 128px;
  margin: 12px 0 40px;
}

.chapter_poster .chapter_invite {
  margin-top: 40px;
}

.chapter_invite .table_invite_list {
  border: 1px solid #e1e1e1;
}

.chapter_invite .table_invite_list>thead>tr>th {
  background: #fafafa;
  border-bottom: 1px solid #e1e1e1 !important;
  white-space: nowrap;
}

.chapter_invite .table_invite_list>thead>tr>th,
.chapter_invite .table_invite_list tbody>tr>td:first-child {
  font-size: 14px;
  color: #31363f;
  text-align: center;
  font-weight: bold;
}

.chapter_invite .table_invite_list tbody>tr>td {
  font-size: 14px;
  border: none;
  color: #31363f;
  text-align: center;
}

.chapter_invite .table_invite_list tbody>tr:nth-child(even) {
  background: #f7faff;
}

.chapter_invite .table_invite_list .invite_suc {
  color: #22bf7c;
  white-space: nowrap;
}

.chapter_invite .table_invite_list .invite_progress {
  color: #fa6400;
  white-space: nowrap;
}

.chapter_invite .table_invite_list .invite_fail {
  color: #a6a6a6;
  white-space: nowrap;
}

.chapter_wrap>.container {
  margin: 15px !important;
  padding: 0 !important;
}

.join_dec {
  position: absolute;
  bottom: -35px;
  left: 0;
  font-size: 14px;
  color: #8190ab;
  width: auto;
  text-align: center;
  padding-left: 20px;
}

/* 9.3样式修改 */
.chapterModal .modal-content {
  width: 340px;
  height: 200px;
  text-align: center;
  padding: 20px;
}

.chapterModal .modal-content_friend {
  width: 700px;
  height: 342px;
  text-align: center;
  padding: 40px 54px;
}

.chapterModal .modal-content .cpmodal_title {
  font-size: 20px;
  color: #31363f;
  font-weight: bold;
}

.chapterModal .modal-content .cp_invitenum {
  margin: 10px 0 40px;
  /* background: #E8F5FF;
    border-radius: 16px; */
  display: inline-block;
  padding: 6px 16px;
  font-size: 14px;
  color: #31363f;
  font-weight: 400;
}

.chapterModal .modal-content .cp_process {
  /* width: 522px; */
  width: 100%;
  height: 10px;
  /* background: pink; */
  margin: auto;
  margin-bottom: 60px;
}

.cp_process .progress_bar {
  height: 10px;
  border-radius: 10px;
  background: #daedff;
  position: relative;
}

.cp_process .progress_point {
  width: 100%;
  height: 10px;
  top: -10px;
  left: -1%;
  position: relative;
  /* display: flex;
    justify-content: space-between; */
}

.cp_process .progress_point .point_item {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #bfbfbf;
  margin-top: -3px;
  border: 2px solid #fff;
  box-sizing: border-box;
  position: absolute;
  /* position: relative; */
}

.cp_process .progress_point .point_item:first-child {
  background: #0091ff;
}

.cp_process .progress_point .point_item.point_item_blue {
  background: #0091ff;
}

.cp_process .progress_point .point_item .item_peo {
  font-size: 14px;
  color: #485159;
  top: -21px;
  left: -18px;
  position: absolute;
  white-space: nowrap;
  width: 50px;
  text-align: center;
}

.cp_process .progress_point .point_item .item_chapter {
  font-size: 14px;
  color: #0091ff;
  position: absolute;
  bottom: -29px;
  white-space: nowrap;
  left: -46px;
  width: 100px;
  text-align: center;
  font-weight: bold;
}

.chapterModal .modal-content .cp_btns>a {
  width: 200px;
}

.chapterModal .modal-content .cp_tips {
  font-size: 12px;
  color: #999999;
  display: inline-block;
  margin-top: 20px;
}

.chapterModal .modal-content .cp_tips>span {
  font-size: 14px;
}

.chapterModal .modal-content .closeover {
  right: 26px;
  top: 25px;
}

.z_index {
  z-index: 999;
}

.lock_chapter {
  padding: 0 30px 30px 30px;
}

.lock_chapter .lock_item {
  width: 200px;
  height: 90px;
  padding-top: 19px;
  margin: auto;
  color: #999999;
  box-shadow: 0 8px 16px 0 rgb(153 165 177 / 10%);
  border-radius: 4px;
  margin-right: 20px;
}

.lock_chapter .lock_til {
  width: 110px;
  margin: auto;
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 5px;
  font-size: 20px;
  font-weight: bold;
}

.form-chapter .lock_til.active {
  color: #0091ff;
}

.lock_chapter .lock_invite {
  font-size: 12px;
}

.chapter_disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.6;
}

.filter_blur {
  filter: blur(3px);
}

.cp_tips .tooltip-inner,
.chapterModal .tooltip-inner {
  width: 210px;
  max-width: 210px;
  text-align: left !important;
  padding: 8px !important;
}

.unlocking_btn {
  animation: scaleDrew 0.7s ease-in-out infinite;
}

@media (max-width: 768px) {
  .detail_btns {
    text-align: center;
  }

  .invite_poster_page {
    background: #f5f8f9;
  }

  .chapter_poster {
    width: 100%;
    margin: 0 auto 60px;
    padding: 22px 15px;
  }

  .chapter_poster .poster_title {
    font-size: 14px;
    padding: 0 0 8px 8px;
  }

  .chapter_poster .poster_title::before {
    height: 14px;
    top: 4px;
  }

  .chapter_poster .poster_show {
    display: block;
  }

  /* .chapter_poster .poster_wrap{
        width: 240px;
        height: 426px;
        margin: auto; 
    } */

  .chapter_poster .poster_show .poster {
    width: 80vw;
    height: 143vw;
    margin: 0 auto 20px;
    display: block;
  }

  /* .chapter_poster .poster_wrap .qrcode{
        width: 70px;
        height: 70px;
        bottom: 15px;
        right: 15px;
    }

    .chapter_poster .poster_wrap .qrcode > canvas{
        width: 58px;
        height: 58px;
    } */

  .chapter_poster .tips_txt {
    font-size: 14px;
    color: #a2abb4;
    margin-top: 8px;
    text-align: center;
  }

  .chapter_poster .invite_foot {
    position: fixed;
    bottom: 0;
    left: 0;
    height: 54px;
    background: #ffffff;
    width: 100%;
  }

  .chapter_poster .m_show .look_more {
    width: 90%;
    height: 40px;
    background: #0091ff;
    border-radius: 4px;
    display: block;
    margin: 7px 5%;
    color: #fff;
    text-align: center;
    line-height: 40px;
    font-size: 14px;
  }

  .chapter_mask .blue-box {
    width: 275px;
    background: #ffffff !important;
    border-radius: 8px;
    top: 50%;
    position: relative;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    text-align: left;
    min-height: 240px;
    padding: 18px 16px;
  }

  .chapter_mask .blue-box .closeover,
  .invite_mask .blue-box .closeover {
    position: absolute;
    width: 14px;
    height: 14px;
    top: 16px;
    right: 16px;
    cursor: pointer;
  }

  .chapter_mask .blue-box .share_mode,
  .invite_mask .blue-box .share_mode {
    font-size: 16px;
    color: #3d464d;
    font-weight: bold;
  }

  .chapter_mask .blue-box .share_mode>img,
  .invite_mask .blue-box .share_mode>img {
    margin-right: 8px;
  }

  .chapter_mask .blue-box .share_txt {
    margin: 15px 0 11px;
    font-size: 12px;
    color: #3d464d;
  }

  .chapter_mask .blue-box .share_box {
    text-align: center;
  }

  .chapter_mask .blue-box .copylink_val {
    background: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    width: 100%;
    padding: 10px;
    font-size: 12px;
    color: #999999;
    height: 90px;
  }

  .chapter_mask .blue-box .copylink_btn {
    margin-top: 15px;
  }

  .m_invite_box {
    width: 28px;
    height: 85px;
    background: #0091ff;
    border-radius: 8px 0 0 8px;
    writing-mode: vertical-lr;
    margin: auto;
    padding: 14px 5px;
    font-size: 13px;
    color: #ffffff;
    line-height: 20px;
    position: fixed;
    right: -14px;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
  }

  .invite_mask .blue-box {
    width: 345px;
    background: #ffffff !important;
    border-radius: 8px;
    top: 50%;
    position: relative;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    text-align: left;
    min-height: 375px;
    padding: 18px 16px;
  }

  .chapter_invite {
    margin-top: 20px;
  }

  .chapter_invite .table_invite_list {
    table-layout: fixed;
  }

  .chapter_invite .table_invite_list .invite_nick {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 108px;
  }

  .chapter_invite .table_invite_list>thead>tr>th,
  .chapter_invite .table_invite_list tbody>tr>td:first-child,
  .chapter_invite .table_invite_list>thead>tr>th {
    padding: 14px 0;
  }

  .flowers_pay {
    position: absolute;
    bottom: -50px;
    left: 9px;
  }

  @media (max-width: 768px) {
    .flowers_pay {
      bottom: 0;
      left: 45vw;
      top: -1px;
    }
  }

  .chapter_txt {
    bottom: -35px;
  }

  /* .cd-button.go-apply, .cd-button.go-threads{
        width: 140px;
    } */

  .chapterModal .modal-content {
    width: 96%;
    padding: 30px 30px;
    height: 310px;
    margin: 20% 2%;
  }

  .cp_process .cp_btns {
    display: flex;
    justify-content: space-between;
  }

  .chapterModal .modal-content .cp_btns>a {
    width: 130px;
    font-size: 12px;
    margin: 0;
    height: 45px;
    line-height: 45px;
    padding: 0;
    margin: 0 4px;
    text-align: center;
  }

  .chapterModal .modal-content .closeover {
    right: 16px;
    top: 12px;
  }

  .lock_chapter {
    padding: 0 15px 30px 15px;
  }

  .lock_chapter .lock_item {
    width: 130px;
    height: 70px;
    padding-top: 10px;
    margin-right: 10px;
  }

  .lock_chapter .lock_til {
    width: 100px;
    font-size: 12px;
  }

  .cp_tips .tooltip-inner,
  .chapterModal .tooltip-inner {
    width: 160px;
    max-width: 160px;
  }

  .cp_tips .tooltip-inner .tooltip-wrap p,
  .chapterModal .tooltip-inner .tooltip-wrap p {
    white-space: normal;
  }

  /* .dashboard-sidebar-leftlist{
        display: none !important;
    } */

  .color-go-apply-chapter {
    width: 90vw !important;
    display: inherit !important;
    margin-left: -5px !important;
  }

  .immed-signup .remain {
    display: inline-block !important;
  }

  .chapter_countdown {
    margin: 15px 0 0 0 !important;
  }

  .m_chapter_time {
    display: flex !important;
    justify-content: center;
    align-items: center;
    height: 36px;
    background: #fff5d8;
    font-family: PingFangHK-Semibold;
    font-size: 14px;
    color: #fa6400;
    font-weight: 600;
  }

  .m_chapter_time>img {
    width: 14px;
    height: 14px;
  }
}

@media (max-width: 375px) {

  .cp_tips .tooltip-inner,
  .chapterModal .tooltip-inner {
    width: 130px;
    max-width: 130px;
  }
}

.chapter_unlock_btn {
  width: 40vw;
  min-width: 130px;
  max-width: 180px;
  height: 52px;
  background-image: linear-gradient(180deg, #ffd577 0%, #ff9225 100%);
  border-radius: 30px;
  border: none;
  font-size: 16px;
  color: #ffffff;
  font-weight: bold;
  text-shadow: 0 1px 0 #cc7000;
  display: inline-block;
  text-align: center;
  padding: 13px 0px 14px;
  margin-right: 20px;
}

.chapter_unlock_btn:hover,
.chapter_unlock_btn:focus {
  color: #ffffff;
}

.chapter_countdown {
  margin-left: 30px;
  font-size: 14px;
  color: #202e3a;
}

.chapter_countdown .chapter_time {
  height: 20px;
  background: #fff5d8;
  border-radius: 2px;
  font-size: 14px;
  color: #fa6400;
  padding: 2px 8px;
  font-weight: bold;
}

.immed-signup .remain {
  display: flex;
}

.m_chapter_time {
  display: none;
}

/* 章节解锁 end */

.qiyi_icon {
  right: -70px;
  bottom: 5px;
  width: 60px !important;
  height: 30px !important;
}

/* 附件上传 */
.attachment_upload {
  position: relative;
  border: 1px dashed #e4ecf3;
  padding: 18px 10px;
  background-color: #ffffff;
  margin-top: 10px;
  width: 100%;
  height: 84px;
}

.attachment_upload,
.upload_btn {
  display: inline-block;
  padding-left: 120px;
}

.attachment_upload .qn-name-box {
  background: #ffffff;
  padding: 5px 13px;
  color: #4a90e2;
  border: 1px solid #4a90e2;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  border-radius: 3px;
  font-weight: 600;
}

.attachment_upload .js_upload_pic_btn {
  position: absolute;
  opacity: 0;
  display: block;
  cursor: pointer;
  background: rgb(255, 255, 255);
  top: 0;
  right: 0;
  width: 90px;
  height: 34px;
}

.attachment_upload .progressbar {
  position: absolute;
  text-align: center;
  width: 90%;
  height: 80px;
  background: #fff;
  top: 1px;
  left: 0;
  padding: 40px 5% 0;
}

.attachment_upload .progressbar .progressbar_cont {
  border-radius: 5px;
  width: 100%;
  height: 10px;
  background: #cccccc4f;
}

.attachment_upload .progress-label {
  line-height: 14px;
  position: absolute;
  top: 17px;
  color: #333;
}

.attachment_upload .ui-progressbar-value {
  width: 100%;
  height: 10px;
  background: #4a90e2;
  border-radius: 5px;
  overflow: hidden;
}

.alert-over-ques-hours-box .modal-dialog {
  width: 300px;
  text-align: center;
  margin: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.alert-over-ques-hours-box .modal-content {
  padding: 23px 0;
}

.alert-over-ques-hours-box .preview_icon {
  width: 17px;
  margin-right: 6px;
}

.alert-over-ques-hours-box .preview_txt {
  font-size: 16px;
  color: #31363f;
}

.alert-over-ques-hours-box .preview_add {
  font-size: 16px;
  color: #31363f;
  font-weight: bold;
  margin: 15px 0 11px;
}

.alert-over-ques-hours-box .preview_code {
  width: 120px;
  height: 120px;
  border: 1px solid #90b2cc;
}

.alert-over-ques-hours-box .preview_arrow {
  width: 12px;
}

.alert-over-ques-hours-box .preview_mark {
  font-size: 12px;
  color: #485159;
  font-weight: bold;
  margin-bottom: 40px;
}

.alert-over-ques-hours-box .preview_mark b {
  color: #0091ff;
}

.alert-over-ques-hours-box .close {
  position: absolute;
  top: 26px;
  right: 26px;
  width: 14px;
  opacity: 1;
}

/* 附件上传end */

/* 公开课预约弹窗 */
.openPreviewModal .modal-dialog {
  width: 300px;
  text-align: center;
  margin: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) !important;
}

.openPreviewModal .modal-content {
  padding: 23px 0;
}

.openPreviewModal .preview_icon {
  width: 17px;
  margin-right: 6px;
}

.openPreviewModal .preview_txt {
  font-size: 16px;
  color: #31363f;
}

.openPreviewModal .preview_add {
  font-size: 16px;
  color: #31363f;
  font-weight: bold;
  margin: 15px 0 11px;
}

.openPreviewModal .preview_code {
  width: 120px;
  height: 120px;
  border: 1px solid #90b2cc;
}

.openPreviewModal .preview_arrow {
  width: 12px;
}

.openPreviewModal .preview_mark {
  font-size: 12px;
  color: #485159;
  font-weight: bold;
  margin-bottom: 40px;
}

.openPreviewModal .preview_mark b {
  color: #0091ff;
}

.openPreviewModal .close {
  position: absolute;
  top: 26px;
  right: 26px;
  width: 14px;
  opacity: 1;
}

/* 公开课预约弹窗end */

/* 中秋活动 */
/* 中秋活动页面 */

/* 中秋活动end */

.xlk-page {
  background: #171f6c;
  padding: 30px 0 20px;
}

.xlk-page .xlk-view-after {
  background-image: linear-gradient(180deg, #38a4f4 0%, #3771e1 100%);
  border: 1px solid #5eb5f5;
  border-radius: 16px;
  border-radius: 16px;
  width: 1018px;
  height: 378px;
  box-sizing: border-box;
  position: relative;
  left: 60px;
  bottom: 0;
  box-sizing: border-box;
  padding: 40px;
  margin: 0 auto;
}

.xlk-page .xlk-view-after .xlk-view-after-list {
  float: right;
  width: 294px;
}

.xlk-page .xlk-view-after .xlk-view-after-list>div {
  width: 90px;
  height: 90px;
  float: left;
  margin-right: 12px;
  margin-bottom: 12px;
  border-radius: 8px;
  font-size: 0;
  position: relative;
  cursor: pointer;
  overflow: hidden;
}

.xlk-page .xlk-view-after .xlk-view-after-list>div>img {
  width: 90px;
}

.xlk-page .xlk-view-after .xlk-view-after-list>div>span {
  position: absolute;
  position: absolute;
  width: 90px;
  height: 90px;
  z-index: 1;
  left: 0;
  top: 0;
  display: none;
  border: 1px solid #f89510;
  box-sizing: border-box;
  border-radius: 8px;
}

.xlk-page .xlk-view-after .xlk-view-after-list>div:nth-child(3n) {
  margin-right: 0;
}

.xlk-page .xlk-view-after .xlk-view-befor {
  background: #2a39c6;
  border-radius: 8px;
  border-radius: 8px;
  width: 703px;
  height: 370px;
  position: absolute;
  left: -60px;
  top: -13px;
  overflow: hidden;
}

.xlk-page .xlk-view-after .xlk-view-befor>img {
  width: 250px;
  position: absolute;
  bottom: 0;
  cursor: pointer;
}

.xlk-page .xlk-view-after .xlk-view-befor>.xlk-view-befor-ads {
  margin-left: 38px;
  float: right;
  width: 395px;
  margin-right: 40px;
  padding-top: 40px;
}

.xlk-page .xlk-view-after .xlk-view-befor>.xlk-view-befor-ads>h2 {
  font-size: 24px;
  color: #ffffff;
}

.xlk-page .xlk-view-after .xlk-view-befor>.xlk-view-befor-ads>h3 {
  font-size: 18px;
  color: #ffffff;
  margin-top: 6px;
}

.xlk-page .xlk-view-after .xlk-view-befor>.xlk-view-befor-ads>span {
  display: inline-block;
  border-bottom: 1px dashed #ffffff;
  width: 395px;
  margin-bottom: 13px;
  margin-top: 24px;
}

.xlk-page .xlk-view-after .xlk-view-befor>.xlk-view-befor-ads>p {
  font-size: 15px;
  color: #ffffff;
  max-height: 196px;
  line-height: 28px;
  overflow-y: auto;
}

.xlk-page-m {
  background: #171f6c;
  padding: 30px 5% 20px;
}

.xlk-page-m .xlk-view-after {
  background-image: linear-gradient(180deg, #38a4f4 0%, #3771e1 100%);
  border: 1px solid #5eb5f5;
  border-radius: 16px;
  border-radius: 16px;
  width: 100%;
  height: 396px;
  box-sizing: border-box;
  position: relative;
  box-sizing: border-box;
  padding: 5%;
  margin: 0 auto;
}

.xlk-page-m .xlk-view-after .xlk-view-after-list-bg {
  width: 100vw;
  overflow: hidden;
}

.xlk-page-m .xlk-view-after .xlk-view-after-list-bg .xlk-view-after-list {
  width: 90%;
  height: 90px;
  position: absolute;
  bottom: 0;
  white-space: nowrap;
  overflow-x: scroll;
  overflow-y: hidden;
}

.xlk-page-m .xlk-view-after .xlk-view-after-list-bg .xlk-view-after-list>div {
  width: 66px;
  height: 66px;
  margin-right: 12px;
  margin-bottom: 12px;
  border-radius: 8px;
  font-size: 0;
  position: relative;
  cursor: pointer;
  overflow: hidden;
  display: inline-block;
}

.xlk-page-m .xlk-view-after .xlk-view-after-list-bg .xlk-view-after-list>div>img {
  width: 66px;
}

.xlk-page-m .xlk-view-after .xlk-view-after-list-bg .xlk-view-after-list>div>span {
  position: absolute;
  position: absolute;
  width: 66px;
  height: 66px;
  z-index: 1;
  left: 0;
  top: 0;
  display: none;
  border: 1px solid #f89510;
  box-sizing: border-box;
  border-radius: 8px;
}

.xlk-page-m .xlk-view-after .xlk-view-after-line {
  position: absolute;
  bottom: 104px;
  border-bottom: 1px dashed #ffffff;
  width: 90%;
  opacity: 0.4;
}

.xlk-page-m .xlk-view-after .xlk-view-after-ads {
  position: absolute;
  bottom: 120px;
  font-size: 14px;
  color: #ffffff;
  min-height: 140px;
  line-height: 28px;
  overflow-y: auto;
  width: 90%;
}

.xlk-page-m .xlk-view-after .xlk-view-after-user {
  width: 96%;
  height: 100px;
  background: #2a39c6;
  position: absolute;
  top: -5%;
  left: -1px;
  border-radius: 8px;
}

.xlk-page-m .xlk-view-after .xlk-view-after-user>img {
  width: 100px;
  position: absolute;
  bottom: 0;
  cursor: pointer;
}

.xlk-page-m .xlk-view-after .xlk-view-after-user>.xlk-view-befor-ads {
  margin-left: 112px;
  float: left;
  margin-top: 20px;
}

.xlk-page-m .xlk-view-after .xlk-view-after-user>.xlk-view-befor-ads>h2 {
  font-size: 24px;
  color: #ffffff;
}

.xlk-page-m .xlk-view-after .xlk-view-after-user>.xlk-view-befor-ads>h3 {
  font-size: 16px;
  color: #ffffff;
  margin-top: 6px;
}

@keyframes fadeInLeft___1T4wP {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-60px, 0, 0);
    transform: translate3d(-60px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

.fadeInLeft___1T4wP {
  -webkit-animation-name: fadeInLeft___1T4wP;
  animation-name: fadeInLeft___1T4wP;
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
}

/* 我的教室的悬浮框 */
.visible-lg {
  position: relative;
}

.visible-hover-box {
  z-index: 30;
  position: absolute;
  top: 60px;
  right: -50px;
  width: 358px;
  height: 447px;
  background-image: linear-gradient(180deg,
      #f7f9ff 0%,
      #ffffff 20%,
      #ffffff 100%);
  box-shadow: 0px 5px 10px 0px rgba(106, 133, 188, 0.1);
  border-radius: 10px;
}

.overflow-auto {
  width: 358px;
  height: 447px;
  padding: 20px 14px;
  overflow-x: auto;
}

.visible-hover-box::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid #f7f9ff;
  position: absolute;
  left: 75%;
  top: -15px;
  transform: rotate(90deg);
}

.overflow-auto::-webkit-scrollbar {
  display: none;
}

/* .visible-lg:hover .visible-hover-box {
  display: block;
} */

.hover-box-block {
  margin-bottom: 20px;
}

.hover-box-block:last-child {
  margin-bottom: 0;
}

.h-box-title {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}

.h-box-title .h-box-icon {
  display: inline-block;
  margin-right: 8px;
}

.h-box-title .study-icon {
  width: 18px;
  height: 20px;
  background: url("../assets/xuexijindu_icon.svg") center center no-repeat;
}

.h-box-title .homework-icon {
  width: 20px;
  height: 21px;
  background: url("../assets/homework_icon.svg") center center no-repeat;
}

.h-box-title .kaoshi-icon {
  width: 18px;
  height: 25px;
  background: url("../assets/kaoshi_icon.svg") center center no-repeat;
}

.h-box-title span {
  font-family: PingFangSC-;
  font-size: 18px;
  color: #121212;
  font-weight: 500;
}

.h-box-item {
  background: #f5f7f8;
  border-radius: 4px;
  padding: 12px;
  display: flex;
  margin-bottom: 12px;
  align-items: center;
  justify-content: center;
}

.h-box-item:last-child {
  margin: 0;
}

.h-box-text {
  text-align: center;
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #aaaaaa;
  text-align: center;
  font-weight: 400;
}

/* 悬浮框有内容 */

.studybox {
  background: #f5f7f8;
  border-radius: 4px;
  padding: 12px;
  margin-bottom: 12px;
}

.studybox:last-child {
  margin: 0;
}

.study-title {
  display: flex;
  justify-content: space-between;
}

.study-title span:nth-child(1) {
  font-family: PingFangSCSemibold-;
  font-size: 13px;
  color: #111111;
  font-weight: 600;
}

.study-title span:nth-child(2) {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #aaaaaa;
  font-weight: 400;
}

.study-desc {
  margin-top: 6px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.study-desc a {
  color: #666;
}

/* 学习进度任务类型图标 */

/* 图文 */
.study-desc .tuwen-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/wenben_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 视频 */
.study-desc .shipin-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/shipin_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 音频 */
.study-desc .yinpin-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/yinpin_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 直播 */
.study-desc .zhibo-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/zhibo_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 讨论 */
.study-desc .taolun-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/taolun_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 考试 */
.study-desc .kaoshi-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/kaoshi02_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 作业 */
.study-desc .zuoye-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/zuoye_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 练习 */
.study-desc .lianxi-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/lianxi_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 下载 */
.study-desc .xiazai-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../assets/xiazai_icon.svg") center center no-repeat;
  margin-right: 6px;
}

/* 学习进度任务类型图标 end */

.study-desc span {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #666666;
  letter-spacing: 0;
  font-weight: 400;
}

.progressBar {
  position: relative;
  width: 295px;
  height: 10px;
  background: #e0e8f6;
  border: 1px solid rgba(255, 255, 255, 1);
  border-radius: 6px;
}

.progressBar span {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 40px;
  height: 8px;
  border-radius: 6px;
  background: #348bf1;
}

.study-title2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.study-title2 span:nth-child(1) {
  width: 247px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 6px;
  color: #111111;
  font-weight: 600;
  font-size: 13px;
}

.study-title2 span:nth-child(2) {
  color: #aaa;
  font-size: 12px;
}

.study-desc2 {
  display: flex;
  align-items: center;
}

.study-wenben-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 6px;
  background: url("../assets/wenben_icon.svg") center center no-repeat;
}

.study-desc2 span {
  width: 288px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 12px;
  color: #666;
}

.homework-title {
  width: 308px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: PingFangSCSemibold-;
  font-size: 13px;
  color: #111111;
  font-weight: 600;
  margin-bottom: 6px;
}

.homework-con {
  display: flex;
  /* flex-direction: row; */
}

.homework-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  /* margin-top: 4px; */
  margin-right: 6px;
  background: url("../assets/wenben_icon.svg") center center no-repeat;
}

.homework-text {
  display: flex;
  flex-direction: column;
  font-family: PingFangSC-Regular;
  font-size: 12px;
  letter-spacing: 0;
  font-weight: 400;
  /* display: inline-block; */
}

.homework-text span:nth-child(1) {
  color: #666;
}

.homework-text span:nth-child(2) {
  color: #a8a8a8;
}

.kaoshi-con p {
  display: flex;
  align-items: center;
  margin-bottom: 6px;
}

.kaoshi-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 6px;
  background: url("../assets/kaoshi02_icon.svg") center center no-repeat;
}

.kaoshi-con p span {
  font-family: PingFangSC-Regular;
  font-size: 12px;
  color: #666666;
  letter-spacing: 0;
  font-weight: 400;
}

/* 我的教室的悬浮框 end */

/* pc端新增购物车图标 */

.shopcart-box {
  margin-right: 10px;
  position: relative;
  top: -2px;
}

.gouwuche-icon {
  display: inline-block;
  width: 21px;
  height: 21px;
  background: url("../assets/gouwuche01_icon.svg") center center no-repeat;
  cursor: pointer;
}

.shopCount {
  position: absolute;
  left: 23px;
  top: -5px;
  padding: 1px 4px;
  min-width: 16px;
  height: 16px;
  text-align: center;
  line-height: 14px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  background: #e83d2c;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 1);
  font-size: 12px;
}

/* pc端新增购物车图标 end */

/* 购物车页面 */

.cartBox {
  width: 100vw;
}

.cart-Bg {
  width: 100vw;
  height: 200px;
  background: url("../assets/bj_pic.png") no-repeat;
}

.cart-Container {
  width: 900px;
  margin: -120px auto 0;
}

.mycart-title {
  font-size: 32px;
  font-weight: 700;
  color: #222;
  margin-bottom: 30px;
  font-family: PingFangSC-Bold;
}

.mycart-content {
  position: relative;
  width: 900px;
  /* min-height: 470px; */
  margin-bottom: 60px;
  background: #fff;
  border-radius: 10px;
  padding: 0 20px 46px 20px;
  box-shadow: 0px 8px 16px 0px rgba(153, 165, 177, 0.1);
}

/* 购物车没有内容 */
.noGoods {
  /* position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%); */
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 100px 0 70px;
}

.emptyImg {
  background: url("../assets/gouwuchekong_icon@2x.png") no-repeat;
  width: 95px;
  height: 80px;
  background-size: cover;
  margin-bottom: 20px;
}

.emptyTxt {
  font-family: PingFang-SC-Regular;
  font-size: 13px;
  color: #6c6f75;
  text-align: center;
  line-height: 22px;
  font-weight: 400;
}

.emptyTxt a {
  text-decoration: underline !important;
}

/* 购物车没有内容  end*/

/* 购物车有内容 */

.cartHeader {
  display: flex;
  height: 62px;
  align-items: center;
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #6d7278;
  letter-spacing: 0;
  font-weight: 400;
  border-bottom: 1px solid #f3f5f7;
}

.checkAll-box {
  display: flex;
  align-items: center;
}

.inp-all {
  margin-right: 8px !important;
  margin-top: -2px !important;
  width: 18px;
  height: 18px;
}

/* 购物车有内容 end*/

/* 购物车页面 end */

/* 反馈入口 */
.course-list-dk .cert-listwrap .emptydata .empty-con,
.course-list-open .cert-listwrap .emptydata .empty-con {
  font-size: 14px;
  color: #333;
  font-weight: 400;
}

.feedback-door {
  text-align: center;
  margin-top: 28px;
}

.feedback-door a {
  color: #0091ff;
  text-decoration: underline !important;
}

.course-list .feedback-door {
  margin-top: 10px;
  color: #333;
  font-weight: 400;
}

.pop-feedback-bg {
  position: fixed;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1050;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
}

.pop-feedback-box {
  position: absolute;
  background: #ffffff;
  border-radius: 4px;
  width: 500px;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  padding: 20px;
  font-size: 14px;
  color: #31363f;
}

.pop-feedback-tit {
  font-family: "MicrosoftYaHeiUI-Bold";
  font-size: 16px;
  color: #333333;
  letter-spacing: 0;
  text-align: justify;
  font-weight: 700;
  margin-bottom: 20px;
  position: relative;
  padding-left: 15px;
}

.pop-feedback-tit::after {
  content: " ";
  display: block;
  position: absolute;
  left: 0px;
  top: 2px;
  width: 4px;
  height: 16px;
  background: #005bac;
  border-radius: 2px;
}

.pop-feedback-box label {
  font-weight: 400;
}

.pop-feedback-box .form-control {
  min-height: 42px;
  color: #31363f;
  font-size: 14px;
}

.pop-feedback-box .btn-primary {
  border-radius: 4px;
  margin-left: 20px;
}

.pop-feedback-box .btn-default {
  color: #a8a8a8;
}

input.pop-feedback-tel::-webkit-outer-spin-button,
input.pop-feedback-tel::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input.pop-feedback-tel {
  -moz-appearance: textfield;
}

.pop-feedback-box .form-control::input-placeholder {
  color: red;
}

.pop-feedback-box .form-control::-webkit-input-placeholder {
  /* white-space: pre-wrap;
    transform: translate(0, -8px); */
  color: #dcdcdc;
}

.pop-feedback-box .form-control:-moz-placeholder {
  /* white-space: pre-wrap;
    transform: translate(0, -8px); */
  color: #dcdcdc;
}

.pop-feedback-box .form-control::-moz-placeholder {
  /* white-space: pre-wrap;
    transform: translate(0, -8px); */
  color: #dcdcdc;
}

.pop-feedback-box .form-control:-ms-input-placeholder {
  /* white-space: pre-wrap;
    transform: translate(0, -8px); */
  color: #dcdcdc;
}

@media (max-width: 767px) {
  .pop-feedback-box {
    width: 90%;
    font-size: 12px;
  }

  .pop-feedback-box .form-control {
    font-size: 12px;
  }
}

/* 反馈入口 end*/