/*** 自定义新闻页面样式 ***/
.home-list {
    position: relative;
    margin-left: 10px;
    margin-right: 10px;
}

.home-list .list-tabs {
    padding: 16px 0px;
}

.home-list .list-tabs .tab {
    font-size: 14px;
    line-height: 1.07;
    color: #666666;
    margin-right: 30px;
    cursor: pointer;
}

.home-list .list-tabs .tab:hover {
    color: #222;
}

.home-list .list-tabs .tab.active {
    font-size: 18px;
    line-height: 1.06;
    color: #222222;
}

.home-list .more-link {
    display: block;
    margin-bottom: 107px;
    height: 48px;
    line-height: 46px;
    font-size: 14px;
    text-align: center;
    color: #222;
    border: 1px solid #666;
    transition: .15s;
}

.home-list .more-link:hover {
    color: #1677d9;
    border: 1px solid #1677d9;
}

.home-list .more-link .more-icon {
    position: relative;
    top: -2px;
    padding-left: 2px;
}

.home-list .content {
    background: #fff;
    padding: 20px;
}

.article-header {
    margin-top: 20px;
    margin-bottom: 45px;
}

.article-header .title {
    margin: 0 0 10px;
    font-size: 30px;
    font-weight: normal;
    line-height: 45px;
    color: #222;
    text-align: center;
}

.article-header .info {
    font-size: 14px;
    color: #999;
    line-height: 45px;
    text-align: center;
}

.article-header .meta-item + .meta-item {
    position: relative;
    margin-left: 20px;
}

.article-header .meta-item + .meta-item::after {
    content: "";
    position: absolute;
    top: 0;
    left: -10px;
    display: block;
    height: 100%;
    border-left: 1px solid #ccc;
    pointer-events: none;
}

.article-header .meta-item + .count-item {
    margin-left: auto;
}

.article-header .count-item + .count-item {
    margin-left: 20px;
}

.article-header .blk {
    color: #222;
}

.article .container {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-left: 16px;
}

.article .title {
    display: block;
    line-height: 25px;
    font-size: 18px;
    font-weight: bold;
    color: #222;
    display: block;
    display: -webkit-box;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow-wrap: break-word;
    overflow: hidden;
}

.article .title:hover {
    color: #0e4d8c;
}

.article .icon-vip {
    height: 22px;
    vertical-align: text-bottom;
}

.article .content {
    display: block;
    height: 42px;
    margin-top: 10px;
    line-height: 21px;
    font-size: 13px;
    color: #666;
    display: block;
    display: -webkit-box;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow-wrap: break-word;
    overflow: hidden;
}

.article .content.omit {
    height: 21px;
    display: block;
    display: -webkit-box;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow-wrap: break-word;
    overflow: hidden;
}

.article .content:hover {
    color: #222;
}

.article .meta {
    display: flex;
    align-items: center;
    margin-top: auto;
    font-size: 13px;
}

.article .meta .author {
    color: #222;
}

.article .meta .time {
    color: #999;
}

.article .meta > :not(:first-child) {
    position: relative;
    margin-left: 20px;
}

.article .meta > :not(:first-child)::before {
    content: "";
    position: absolute;
    top: 0;
    left: -10px;
    height: 100%;
    border-left: 1px solid #ccc;
}

.article .meta .theme-link {
    display: inline-block;
    padding: 0 6px;
    line-height: 20px;
    font-size: 12px;
    color: #1677d9;
    border: 1px solid #1677d9;
    border-radius: 2px;
}

.article .meta .premium-link {
    display: flex;
    line-height: 20px;
    font-size: 12px;
    border: 1px solid #292e33;
}

.article .meta .premium-link .premium-icon {
    padding: 0 4px;
    color: #fff;
    background: #292e33;
}

.article .meta .premium-link .premium-text {
    padding: 0 4px;
    color: #333940;
}

.article .meta .premium-link .premium-text:hover {
    color: #1677d9;
}

.rich-text {
    position: relative;
    margin: 36px 0 30px;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.2px;
    color: #222;
    transition: .5s ease-out;
    overflow: hidden;
    padding: 0 30px;
}

.rich-text.mask::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 150px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8));
}

.rich-text {
    /* HTML5 媒体文件跟 img 保持一致 */
    /* 去掉各Table  cell 的边距并让其边重合 */
    /* IE bug fixed: th 不继承 text-align*/
    /* 去除默认边框 */
    /* 解决 IE6-7 图片缩放锯齿问题 */
    /* ie6 7 8(q) bug 显示为行内表现 */
    /* 块/段落引用 */
    /* Firefox 以外，元素没有下划线，需添加 */
    /* 添加鼠标问号，进一步确保应用的语义是正确的（要知道，交互他们也有洁癖，如果你不去掉，那得多花点口舌） */
    /* 一致的 del 样式 */
    /* 对齐是排版最重要的因素, 别让什么都居中 */
    /* 统一上标和下标 */
    /* 让链接在 hover 状态下显示下划线 */
    /* 默认不显示下划线，保持页面简洁 */
    /* 标记，类似于手写的荧光笔的作用 */
    /* 代码片断 */
    /* 底部印刷体、版本等标记 */
    /* 保证块/段落之间的空白隔行 */
    /* 标题应该更贴紧内容，并与其他块区分，margin 值要相应做优化 */
    /* 在文章中，应该还原 ul 和 ol 的样式 */
    /* 同 ul/ol，在文章中应用 table 基本格式 */

}

.rich-text html,
.rich-text body,
.rich-text p,
.rich-text ol,
.rich-text ul,
.rich-text li,
.rich-text dl,
.rich-text dt,
.rich-text dd,
.rich-text blockquote,
.rich-text figure,
.rich-text fieldset,
.rich-text legend,
.rich-text textarea,
.rich-text pre,
.rich-text iframe,
.rich-text hr,
.rich-text h1,
.rich-text h2,
.rich-text h3,
.rich-text h4,
.rich-text h5,
.rich-text h6 {
    margin: 0;
    padding: 0;
}

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

.rich-text ul {
    list-style: none;
}

.rich-text button,
.rich-text input,
.rich-text select,
.rich-text textarea {
    margin: 0;
}

.rich-text html {
    box-sizing: border-box;
}

.rich-text * {
    box-sizing: inherit;
}

.rich-text *:before, .rich-text *:after {
    box-sizing: inherit;
}

.rich-text img,
.rich-text embed,
.rich-text object,
.rich-text audio,
.rich-text video {
    height: auto;
    max-width: 100%;
}

.rich-text iframe {
    border: 0;
}

.rich-text table {
    border-collapse: collapse;
    border-spacing: 0;
}

.rich-text td,
.rich-text th {
    padding: 0;
    text-align: left;
}

.rich-text > :first-child {
    margin-top: 0 !important;
}

.rich-text > :last-child {
    margin-bottom: 0 !important;
}

.rich-text img {
    display: block;
    margin: 0 auto;
    width: auto;
    max-width: 100%;
}

.rich-text table {
    width: 100% !important;
}

.rich-text embed {
    max-width: 100%;
    margin-bottom: 1em;
}

.rich-text p {
    margin-bottom: 32px;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0.2px;
    text-align: justify;
}

.rich-text ul {
    margin-bottom: 30px;
}

.rich-text li {
    list-style: circle;
    margin-left: 20px;
    margin-bottom: 30px;
}

.rich-text a {
    color: #1677D9;
    border-bottom: 1px solid #1677D9;
    padding-bottom: 4px;
}

.rich-text a:hover {
    text-decoration: none !important;
}

.rich-text hr {
    margin: 1em auto;
    padding: 0;
    width: 100%;
    height: 1px;
    background: #DCDCDC;
    border: none;
}

.rich-text blockquote p {
    font-size: 15px;
    letter-spacing: 0.2px;
    line-height: 30px;
    color: #222;
}

.rich-text blockquote :first-child {
    margin-top: 0;
}

.rich-text blockquote :last-child {
    margin-bottom: 0;
}

.rich-text audio,
.rich-text canvas,
.rich-text video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

.rich-text table {
    border-collapse: collapse;
    border-spacing: 0;
}

.rich-text th {
    text-align: inherit;
}

.rich-text fieldset,
.rich-text img {
    border: 0;
}

.rich-text img {
    -ms-interpolation-mode: bicubic;
}

.rich-text iframe {
    display: block;
    margin: 0 auto;
    width: 640px;
    height: 360px;
}

.rich-text blockquote {
    border-left: 1px solid #222;
    position: relative;
    font-size: 15px;
    letter-spacing: 0.2px;
    line-height: 30px;
    margin-bottom: 40px;
    padding: 20px;
    background: #F2F3F4;
}

.rich-text blockquote blockquote {
    padding: 20px;
    margin-left: 2em;
    background: #d1d7e1;
}

.rich-text acronym,
.rich-text abbr {
    border-bottom: 1px dotted;
    font-variant: normal;
}

.rich-text abbr {
    cursor: help;
}

.rich-text del {
    text-decoration: line-through;
}

.rich-text address,
.rich-text caption,
.rich-text cite,
.rich-text code,
.rich-text del,
.rich-text em,
.rich-text th,
.rich-text var {
    font-style: normal;
    font-weight: 500;
}

.rich-text em {
    font-style: italic;
}

.rich-text caption,
.rich-text th {
    text-align: left;
}

.rich-text q:before,
.rich-text q:after {
    content: '';
}

.rich-text sub,
.rich-text sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: text-top;
}

.rich-text :root sub,
.rich-text :root sup {
    vertical-align: baseline;
    /* for ie9 and other mordern browsers */
}

.rich-text sup {
    top: -0.5em;
}

.rich-text sub {
    bottom: -0.25em;
}

.rich-text a:hover {
    text-decoration: underline;
}

.rich-text ins,
.rich-text a {
    text-decoration: none;
}

.rich-text u,
.rich-text .typo-u {
    text-decoration: underline;
}

.rich-text mark {
    background: #fffdd1;
}

.rich-text pre,
.rich-text code {
    font-family: "Courier New", Courier, monospace;
}

.rich-text pre {
    border: 1px solid #ddd;
    border-left-width: 0.4em;
    background: #fbfbfb;
    padding: 10px;
    white-space: normal;
}

.rich-text small {
    font-size: 12px;
    color: #888;
}

.rich-text h1,
.rich-text h2,
.rich-text h3,
.rich-text h4,
.rich-text h5,
.rich-text h6 {
    font-weight: 500;
    font-weight: 800 \9;
    line-height: 1.5em;
    margin-bottom: 0.3em;
    color: #1482f0;
}

.rich-text h2 {
    font-size: 20px;
    font-weight: 700;
    color: #222;
    line-height: 1.4;
    border-left: 5px solid #1677D9;
    padding-left: 10px;
    margin: 44px 0 20px;
}

.rich-text .typo p,
.rich-text .typo pre,
.rich-text .typo ul,
.rich-text .typo ol,
.rich-text .typo dl,
.rich-text .typo form,
.rich-text .typo hr,
.rich-text .typo table,
.rich-text .typo-p,
.rich-text .typo-pre,
.rich-text .typo-ul,
.rich-text .typo-ol,
.rich-text .typo-dl,
.rich-text .typo-form,
.rich-text .typo-hr,
.rich-text .typo-table {
    margin-bottom: 15px;
    line-height: 25px;
}

.rich-text .typo h1,
.rich-text .typo h2,
.rich-text .typo h3,
.rich-text .typo h4,
.rich-text .typo h5,
.rich-text .typo h6,
.rich-text .typo-h1,
.rich-text .typo-h2,
.rich-text .typo-h3,
.rich-text .typo-h4,
.rich-text .typo-h5,
.rich-text .typo-h6 {
    margin-bottom: 0.4em;
    line-height: 1.5;
}

.rich-text .typo h1,
.rich-text .typo-h1 {
    font-size: 1.8em;
}

.rich-text .typo h2,
.rich-text .typo-h2 {
    font-size: 1.6em;
}

.rich-text .typo h3,
.rich-text .typo-h3 {
    font-size: 1.4em;
}

.rich-text .typo h4,
.rich-text .typo-h0 {
    font-size: 1.2em;
}

.rich-text .typo h5,
.rich-text .typo h6,
.rich-text .typo-h5,
.rich-text .typo-h6 {
    font-size: 1em;
}

.rich-text .typo ul,
.rich-text .typo-ul {
    margin-left: 1.3em;
    list-style: disc;
}

.rich-text .typo ol,
.rich-text .typo-ol {
    list-style: decimal;
    margin-left: 1.9em;
}

.rich-text .typo li ul,
.rich-text .typo li ol,
.rich-text .typo-ul ul,
.rich-text .typo-ul ol,
.rich-text .typo-ol ul,
.rich-text .typo-ol ol {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 2em;
}

.rich-text .typo li ul,
.rich-text .typo-ul ul,
.rich-text .typo-ol ul {
    list-style: circle;
}

.rich-text .typo table th,
.rich-text .typo table td,
.rich-text .typo-table th,
.rich-text .typo-table td {
    border: 1px solid #ddd;
    padding: 5px 10px;
}

.rich-text .typo table th,
.rich-text .typo-table th {
    background: #fbfbfb;
}

.rich-text .typo table thead th,
.rich-text .typo-table thead th {
    background: #f1f1f1;
}

.rich-text img[data-wscntype=audio] {
    display: none;
}