@charset "UTF-8";

[v-cloak] { display: none; }
body { background: #F8FAFC; }
.header-mobile-item { display: none; }

#wrapper { overflow: visible; }
.wrap-shadow { box-shadow: 0px 0px 8px rgba(201, 219, 255, 0.5); }
.ellip { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.multi-line-eliip { display: -webkit-box }
.flex-layout-wrap { display: -webkit-flex; display: flex; }

.bread-nav .current-position { display: -webkit-flex; -webkit-align-items: center; display: flex; align-items: center; }
.bread-nav .current-position img { width: 20px; height: 18px; margin-right: 5px; }
.bread-nav .current-position, .bread-nav .current-position a, .bread-nav .current-position span { color: #808080; }

.article-list-wrap { flex: 1; }
.article-list-wrap .article-list-type { font-size: 16px; letter-spacing: 2px; margin-bottom: 20px; }
.article-list-wrap .article-list-type span, .article-list-wrap .article-list-type a { display: inline-block; margin-left: 16px; padding: 7px 9px; border-radius: 4px; box-sizing: border-box; transition: all 0.14s linear; color: #9199A1; cursor: pointer; }
.article-list-wrap .article-list-type a:hover { color: #fe6a00; }
.article-list-wrap .article-list-type .current-type { background: #FEE8D8; color: #FE6A00; }
.article-list-wrap .article-list-package { display: -webkit-flex; display: flex; flex-direction: column; margin-right: 8px; background: #fff; border-radius: 8px; padding: 0 25px; }
.article-list-wrap .article-list-package .article-list-option { padding: 24px 14px 0; }
.article-list-wrap .article-list-package .article-list-option .list-option-main { display: -webkit-flex; -webkit-justify-content: space-between; -webkit-align-items: center; display: flex; justify-content: space-between; align-items: center; }
.article-list-wrap .article-list-package .article-list-option .list-option-main .article-list-content { margin-right: 4px; }
.article-list-wrap .article-list-package .article-list-option .article-list-title { font-size: 18px; font-weight: bold; color: #333333; word-break: break-all; }
.article-list-wrap .article-list-package .article-list-option .article-list-title .activity-mark { background: #FF0015; border-radius: 8px; color: #fff; padding: 2px 22px; margin-right: 8px; }
.article-list-wrap .article-list-package .article-list-option .article-list-text { display: -webkit-box; font-size: 14px; color: #666666; margin-top: 14px; height: 42px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 20px; }
.article-list-wrap .article-list-package .article-list-option .article-list-date { font-size: 14px; color: #c1c1c1; margin-right: 7px; }
.article-list-wrap .article-list-package .article-list-option .article-list-cover { position: relative; -webkit-flex-shrink: 0; flex-shrink: 0; width: 128px; height: 85px; margin-left: 4px; text-align: center; }
.article-list-wrap .article-list-package .article-list-option .article-list-cover img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border-radius: 8px; max-width: 100%; max-height: 100%; }
.article-list-wrap .article-list-package .article-list-option .article-list-browse { background: #ECF2FC; border-radius: 12px; font-size: 14px; color: #A6BEEF; padding: 4px 6px; }
.article-list-wrap .article-list-package .article-list-option .article-list-label { background: #FFB27A; border-radius: 8px; color: #fff; font-size: 14px; letter-spacing: 2px; padding: 0 6px; margin: 5px 8px 0 0; cursor: pointer; }
.article-list-wrap .article-list-package .article-list-option .list-option-bottom { display: -webkit-flex; -webkit-justify-content: space-between; -webkit-align-items: center; display: flex; justify-content: space-between; align-items: center; margin-top: 12px; }
.article-list-wrap .article-list-package .article-list-option .list-option-label { display: flex; flex-wrap: wrap; display: -webkit-flex; -webkit-flex-wrap: wrap; border-bottom: 1px solid rgba(112, 112, 112, 0.1); padding: 10px 0 15px 0; }
.article-list-wrap .article-list-package .article-list-page { display: -webkit-flex; -webkit-justify-content: space-between; -webkit-align-items: center; display: flex; justify-content: space-between; align-items: center; margin: 24px 137px; border-radius: 8px; padding: 20px 42px; font-size: 14px; color: #999999; }
.article-list-wrap .article-list-package .article-list-page .page-prev, .article-list-wrap .article-list-package .article-list-page .next-page { cursor: pointer; }
.article-list-wrap .article-list-package .article-list-page .page-number span { display: inline-block; width: 30px; height: 30px; border-radius: 8px; margin-right: 5px; text-align: center; line-height: 30px; transition: all 0.14s linear; cursor: pointer; }
.article-list-wrap .article-list-package .article-list-page .current-page { background: #FE6A00; color: #fff; }

.sidebar-wrap { max-width: 320px; padding-top: 58px; }
.aside-hotManual-group, .aside-newCourse-wrap { margin-top: 24px; width: 100%; }
.aside-head { display: -webkit-flex; -webkit-justify-content: space-between; -webkit-align-items: baseline; display: flex; justify-content: space-between; align-items: baseline; font-size: 20px; color: #333333; }
.relevant-head-more { font-size: 12px; color: #707070; cursor: pointer; transition: all 0.14s linear; }
.selected-title { color: #FE6A00; }
.wrap-fixed { position: fixed; top: 5px; width: 320px; }
.wrap-absolute { position: absolute; bottom: 0; }

.sidebar-wrap .aside-article-group .aside-head .aside-article-chapter { display: -webkit-flex; -webkit-align-items: center; display: flex; align-items: center; }
.sidebar-wrap .aside-article-group .aside-head .aside-article-chapter h2 { margin-right: 16px; font-size: 20px; font-weight: 400; }
.sidebar-wrap .aside-article-group .aside-article-main { background: #fff; padding: 10px 18px; border-radius: 8px; border: 1px solid transparent; overflow: hidden; margin-top: 16px; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content { position: relative; display: inline-block; color: #999999; margin-bottom: 10px; width: 100%; cursor: pointer; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content:last-child { margin-bottom: 0; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content span { width: 100%; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content:before { position: absolute; top: 50%; left: -9px; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 50%; background: #DBE8FC; content: ''; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content:nth-of-type(1):before { background: #FE0000; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content:nth-of-type(2):before { background: #FE6A00; }
.sidebar-wrap .aside-article-group .aside-article-main .aside-article-content:nth-of-type(3):before { background: #FEE8D8; }
.sidebar-wrap .aside-hotManual-group .aside-hotCourse-main { display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; margin-left: -5px; margin-right: -5px; margin-top: 11px; }
.sidebar-wrap .aside-hotManual-group .aside-hotCourse-main .hotCourse-option-wrap { width: 33.333333%; padding: 5px 5px; cursor: pointer; }
.sidebar-wrap .aside-hotManual-group .aside-hotCourse-main .hotCourse-option-wrap .hotCourse-option { background: transparent; border-radius: 8px; font-size: 12px; color: #707070; text-align: center; box-shadow: inset 0px 0px 8px rgba(201, 219, 255, 0.5); padding: 8px 5px;}
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main { margin-top: 16px; padding: 27px 20px; background: #fff; border-radius: 8px; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap { display: -webkit-flex; -webkit-align-items: center;display: flex; align-items: center; margin-bottom: 14px; cursor: pointer; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap:last-child { margin-bottom: 0; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap .newCourse-main-cover { flex-shrink: 0; -webkit-flex-shrink: 0; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap .newCourse-main-cover img { border-radius: 4px; max-width: 100%; max-height: 100%; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap .newCourse-main-content { margin-left: 11px; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap .newCourse-main-content h3 { color: #666666; font-size: 14px; }
.sidebar-wrap .aside-newCourse-wrap .aside-newCourse-main .newCourse-main-wrap .newCourse-main-content span { color: #999999; font-size: 12px; }

.inner-power { font-size: 14px!important; padding: 2px 5px!important; background: #fe6a00; border-radius: 4px; color: #fff!important; margin-left: 10px; cursor: pointer; }
.inner-power:hover { color: #fff; }
.article-list-type .inner-power { position: relative; left: 55%; }

@media (max-width: 1200px) {
    #wrapper { width: 96.4%; }
    .sidebar-wrap { display: none; }
    .article-list-wrap .article-list-package { margin-right: 0; }
}

@media (max-width: 1024px) {
    #wrapper { width: 100%; margin: 10px auto 45px; }
    .header-mobile-item { display: block; }
    .bread-nav, #header_index, #footer_item { display: none; }
    .wrap-shadow { box-shadow: none; }
    .article-list-wrap .article-list-package { border-radius: 0; }
}

@media (max-width: 768px) {
    .article-list-wrap .article-list-type { margin-bottom: 15px; }
    .article-list-wrap .article-list-package { padding: 0 15px; }
    .article-list-wrap .article-list-package .article-list-option .list-option-main .article-list-content { width: 62%; }
    .article-list-wrap .article-list-package .article-list-option .article-list-cover { width: 38% }
    .article-list-wrap .article-list-package .article-list-option .list-option-main { align-items: flex-start; -webkit-align-items: flex-start; }
    .article-list-wrap .article-list-package .article-list-option .article-list-title { font-size: 16px; }
    .pagination em, .pagination strong, .pagination a { min-width: 20px; height: unset; line-height: 20px; }
    .pagination a:nth-of-type(7), .pagination a:nth-of-type(8), .pagination a:nth-of-type(9) { display: none; }
    .article-list-wrap .article-list-package .article-list-option .article-list-title .activity-mark { font-size: 12px; padding: 2px 12px; }
}