@charset "UTF-8";
/*! normalize.scss v0.1.0 | MIT License | based on git.io/normalize */
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block
}

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline
}

[hidden], template {
    display: none
}

a {
    background-color: transparent
}

a:active, a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b, strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button, select {
    text-transform: none
}

button, html input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled], html input[disabled] {
    cursor: default
}

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: 700
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td, th {
    padding: 0
}

body {
    background-color: #f5f7fd;
    color: rgba(0, 0, 0, .84);
    line-height: 1.8;
    font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei, STHeiti, WenQuanYi Micro Hei, Helvetica, Arial, sans-serif;
    text-rendering: optimizeLegibility
}

a {
    text-decoration: none;
    color: inherit
}

button, input, textarea {
    -webkit-appearance: none;
    outline: none
}

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

button, label {
    cursor: pointer
}

@font-face {
    font-family: iconfont;
    src: url(iconfont.eot?t=1592307648133);
    src: url(iconfont.eot?t=1592307648133#iefix) format("embedded-opentype"), url("data:application/x-font-woff2;charset=utf-8;base64,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") format("woff2")
}

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

.iconremenwenzhang:before {
    content: "\e687"
}

.icontuijianshiping:before {
    content: "\e688"
}

.iconzhishitixi1:before {
    content: "\e689"
}

.iconremenhuida1:before {
    content: "\e68a"
}

.iconwodedingyue1:before {
    content: "\e68b"
}

.iconPMkuaibao1:before {
    content: "\e68c"
}

.icontuijianzuojia1:before {
    content: "\e68d"
}

.icontiantianwen1:before {
    content: "\e68e"
}

.iconLOGO:before {
    content: "\e68f"
}

.icondajiaduzaikan:before {
    content: "\e684"
}

.iconruanjiankecheng1:before {
    content: "\e685"
}

.iconremendaohang:before {
    content: "\e686"
}

.iconAxurejiaoliuqun:before {
    content: "\e67f"
}

.iconchanpinjingliqun:before {
    content: "\e680"
}

.iconwenanjiaoliuqun:before {
    content: "\e681"
}

.iconyunyingjiaoliuqun:before {
    content: "\e682"
}

.iconyingxiaozengchangqun:before {
    content: "\e683"
}

.iconliulanliang:before {
    content: "\e64e"
}

.icongerenxinxi--bianji:before {
    content: "\e64f"
}

.iconpinglun--paixu:before {
    content: "\e650"
}

.iconlaiziAPP:before {
    content: "\e651"
}

.iconliulanjilu:before {
    content: "\e652"
}

.iconkechengdingdan:before {
    content: "\e653"
}

.iconquanzi:before {
    content: "\e654"
}

.iconruanjiankecheng:before {
    content: "\e655"
}

.iconshoucang:before {
    content: "\e656"
}

.iconremenhuida:before {
    content: "\e657"
}

.iconshijian:before {
    content: "\e658"
}

.iconwenzhangyinpin--bofang:before {
    content: "\e659"
}

.iconsousuo:before {
    content: "\e65a"
}

.icontongzhizhongxin:before {
    content: "\e65b"
}

.iconwenzhangyinpin--zanting:before {
    content: "\e65c"
}

.iconwodedingyue:before {
    content: "\e65d"
}

.iconwodezanshang:before {
    content: "\e65e"
}

.icontuijianshipin:before {
    content: "\e65f"
}

.iconshanchu:before {
    content: "\e660"
}

.iconwodehuodong:before {
    content: "\e661"
}

.icontuijianzuojia:before {
    content: "\e662"
}

.iconzhuanti--laji:before {
    content: "\e663"
}

.iconxiala:before {
    content: "\e664"
}

.iconzanshang:before {
    content: "\e665"
}

.iconzuofan:before {
    content: "\e666"
}

.iconwodekecheng:before {
    content: "\e667"
}

.iconbiaoqianwenzhang:before {
    content: "\e668"
}

.iconwodepinglun:before {
    content: "\e669"
}

.icontiantianwen:before {
    content: "\e66a"
}

.iconyoufan:before {
    content: "\e66b"
}

.iconfenxiang--weixin:before {
    content: "\e66c"
}

.icondianzan:before {
    content: "\e66d"
}

.iconwenzhangyinpin--shengyin:before {
    content: "\e66e"
}

.iconzhuanti--dianzan:before {
    content: "\e66f"
}

.iconfenxiang--weibo:before {
    content: "\e670"
}

.iconxiaoxi:before {
    content: "\e671"
}

.iconzanshangzuozhe:before {
    content: "\e672"
}

.iconyonghuzhuye--huida:before {
    content: "\e673"
}

.iconwodewenzhang:before {
    content: "\e674"
}

.icontougao:before {
    content: "\e675"
}

.iconzhishitixi:before {
    content: "\e676"
}

.iconAPP:before {
    content: "\e677"
}

.iconwodewenda:before {
    content: "\e678"
}

.iconziliaoshezhi:before {
    content: "\e679"
}

.iconerweima:before {
    content: "\e67a"
}

.iconbiaoqing:before {
    content: "\e67b"
}

.icondizhi:before {
    content: "\e67c"
}

.iconPMkuaibao:before {
    content: "\e67d"
}

.iconwodeshoucang:before {
    content: "\e67e"
}

.u-flex {
    display: flex;
    align-items: center
}

.u-block {
    display: block !important
}

.u-relative {
    position: relative
}

.u-hide {
    display: none
}

.u-width335 {
    width: 335px
}

.u-width850 {
    width: 885px
}

.u-centered {
    margin-left: auto;
    margin-right: auto
}

.u-width880 {
    width: 880px
}

.u-backgroundColorWhite {
    background-color: #fff
}

.u-floatRight {
    float: right
}

.u-floatLeft {
    float: left
}

.u-width780 {
    width: 780px;
    margin-left: auto;
    margin-right: auto
}

.u-textAlignCenter {
    text-align: center
}

.u-rounded {
    border-radius: 4px
}

.u-marginTop30 {
    margin-top: 30px
}

.u-flex0 {
    flex: 0 0 auto
}

.u-flex1 {
    flex: 1 1 auto
}

.u-paddingLeft15 {
    padding-left: 15px
}

.u-shadowed {
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .05)
}

.u-width315 {
    width: 315px
}

.u-clearfix {
    *zoom: 1
}

.u-clearfix:after, .u-clearfix:before {
    display: table;
    content: " "
}

.u-clearfix:after {
    clear: both
}

.u-cursorPointer {
    cursor: pointer
}

.u-paddingBottom30 {
    padding-bottom: 30px !important
}

.u-marginBottom30 {
    margin-bottom: 30px
}

.pm-adTitle {
    font-size: 20px;
    padding: 20px 0;
    border-top: 1px solid #ddd;
    font-weight: 700;
    text-align: center
}

.u-marginRight0 {
    margin-right: 0 !important
}

.u-paddingLeft20 {
    padding-left: 20px !important
}

.y-paddingTop30 {
    padding-top: 30px
}

.el-form {
    position: relative
}

.avatar-uploader {
    position: absolute;
    right: 0;
    top: 30px
}

.avatar-uploader .el-upload {
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden
}

.avatar-uploader .avatar {
    width: 80px;
    height: 80px;
    display: block
}

.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center
}

.footer--links {
    list-style: none;
    display: flex;
    flex-wrap: wrap
}

.footer--links li {
    margin-right: 10px
}

.u-paddingTop30 {
    padding-top: 30px
}

.screen-reader-text {
    position: absolute;
    top: -9999px;
    left: -9999px
}

.demo--radioText {
    display: inline-block;
    border: 1px solid #5079b7;
    color: #5079b7;
    border-radius: 3px;
    box-sizing: border-box;
    padding: 10px;
    width: 106px;
    text-align: center
}

.demo--radio:checked + .demo--radioText {
    background-color: #f2f5fd
}

.demo--label {
    display: flex;
    box-sizing: content-box;
    cursor: pointer;
    align-items: center
}

.demo--label:nth-child(3n) {
    margin-right: 0
}

.demo--radio {
    display: none
}

.demo--radioInput {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 100%;
    display: inline-block;
    height: 16px;
    margin-right: 10px;
    margin-top: -1px;
    vertical-align: middle;
    width: 16px;
    line-height: 1;
    box-sizing: content-box
}

.demo--radio:checked + .demo--radioInput:after {
    background-color: #5079b7;
    border-radius: 100%;
    content: "";
    display: inline-block;
    height: 12px;
    margin: 2px;
    width: 12px
}

.demo--checkbox.demo--radioInput, .demo--radio:checked + .demo--checkbox.demo--radioInput:after {
    border-radius: 0
}

.butterBar {
    left: 50%;
    margin-left: -320px;
    max-width: 640px;
    position: fixed;
    text-align: center;
    top: 0;
    width: 58%;
    z-index: 11;
    line-height: 1.8
}

.butterBar a {
    text-decoration: underline
}

.butterBar-message {
    margin-top: 0;
    background: #888;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .35);
    display: inline-block;
    font-size: 14px;
    margin-bottom: 0;
    padding: 12px 25px;
    color: #eee
}

.butterBar--error .butterBar-message {
    background-color: #cc5454;
    color: #fff
}

@media screen and (max-width: 640px) {
    .butterBar {
        margin-left: 5%;
        width: 90%;
        left: 0
    }
}

.button {
    border: 1px solid #4370f5;
    background-color: #4370f5;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    padding: 4px 12px
}

.button--toggle .default {
    display: inline
}

.button--toggle .active, .button--toggle.active .default {
    display: none
}

.button--toggle.active .active {
    display: inline
}

.ui-captionStrong {
    color: rgba(0, 0, 0, .84)
}

.container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto
}

.main-content {
    padding-top: 30px
}

.home-block {
    display: flex;
    align-items: flex-start
}

.dot:before {
    content: "·";
    margin-left: .5em;
    margin-right: .5em
}

.el-popover {
    min-width: 0 !important
}

.u-flexCenter {
    display: flex;
    align-items: center
}

.u-marginRight10 {
    margin-right: 10px
}

.u-marginLeft10 {
    margin-left: 10px
}

.popover {
    background-color: #fff
}

.is-fixedHeader .pm--metabar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9
}

.is-fixedHeader .surface--content {
    padding-top: 60px
}

.pm--metabar {
    background-color: #fff;
    height: 60px;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    font-size: 14px;
    box-sizing: border-box
}

.pm--metabar .logo {
    width: 162px;
    height: 60px
}

.pm--metabar__right {
    margin-left: auto;
    height: 60px
}

.pm--metabar__right .avatar {
    border-radius: 100%;
    padding: 1px;
    border: 1px solid #4370f5;
    cursor: pointer;
    width: 30px;
    height: 30px
}

.pm--metabarItem {
    margin-right: 20px;
    cursor: pointer;
    height: 60px
}

.pm--metabarItem.active, .pm--metabarItem:hover {
    color: #4370f5
}

.pm--metabarItem.active svg, .pm--metabarItem:hover svg {
    fill: #4370f5
}

.pm--metabarItem svg {
    margin-right: 6px
}

.subnav-ul {
    display: flex;
    list-style: none;
    height: 60px;
    margin: 0
}

.menu-item {
    padding: 0 15px;
    display: flex;
    align-items: center;
    color: rgba(0, 0, 0, .7)
}

.menu-item a:hover {
    color: #4370f5
}

.menu-item svg {
    margin-left: 4px;
    transition: .5s
}

.menu-item:hover svg {
    transform: rotateX(180deg)
}

.menu-item:hover .sub--menuWidth {
    display: block;
    -webkit-animation: a .5s;
    animation: a .5s
}

.sub--menuWidth {
    display: none;
    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
    background-color: #fff;
    box-shadow: 0 20px 35px rgba(0, 0, 0, .1);
    padding: 30px 0 40px;
    background-image: url(../images/bglogo.png);
    background-repeat: no-repeat;
    background-position: right -15px bottom -15px;
    background-size: 150px;
    z-index: 9
}

.dropCard--item {
    width: 194px;
    margin-right: 40px
}

.dropCard--item img {
    display: block;
    transition: .5s
}

.dropCard--item:hover img {
    transform: scale(1.05)
}

.dropCard--item .title {
    font-weight: 700;
    text-align: center;
    font-size: 16px;
    padding: 15px 0 12px;
    line-height: 1
}

.dropCard--item .des {
    color: rgba(0, 0, 0, .5);
    line-height: 1.4;
    text-align: justify;
    font-size: 14px
}

.dropCard--list {
    display: flex;
    align-items: flex-start
}

.pm--category {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%
}

.pm--categoryItem {
    border: 1px solid #eee;
    padding: 20px 0;
    width: 14.6666667%;
    box-sizing: border-box;
    margin-bottom: 20px;
    line-height: 1;
    border-radius: 5px
}

.pm--categoryItem a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 0
}

.pm--categoryItem:hover {
    border-color: #4370f5;
    background-color: #4370f5;
    color: #fff !important
}

.pm--categoryItem:hover a {
    color: #fff !important
}

.pm--categoryItem .name {
    font-weight: 400;
    margin: 4px 0 10px;
    font-size: 14px
}

.pm--categoryItem .count {
    margin: 0;
    font-weight: 200
}

.pm--metabar__dropdown {
    height: 60px
}

.pm--metabar__dropdown:hover .pm--userCard__dropdown {
    display: block;
    -webkit-animation: a .5s;
    animation: a .5s
}

.pm--metabar__dropdown:hover .pm--qrcodeCard__dropdown {
    display: flex;
    -webkit-animation: a .5s;
    animation: a .5s
}

.pm--qrcodeCard__dropdown {
    width: 130px;
    justify-content: center;
    padding: 10px 0;
    box-sizing: border-box
}

.pm--qrcodeCard__dropdown, .pm--userCard__dropdown {
    position: absolute;
    background-color: #fff;
    right: 0;
    top: 60px;
    border-radius: 0 0 4px 4px;
    border: 1px solid rgba(0, 0, 0, .05);
    border-top: 0;
    display: none
}

.pm--userCard__dropdown {
    width: 300px
}

.userCard--info {
    text-align: center;
    padding-top: 15px;
    background-color: #fafafa;
    padding-bottom: 15px
}

.userCard--avatar {
    border-radius: 100%;
    width: 48px
}

.userCard--name {
    font-size: 16px;
    margin: 0
}

.userCard--description {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.userCard--menu {
    background-color: #fff
}

.userCard--menu .menuItem {
    display: flex;
    padding: 5px 10px;
    border-bottom: 1px solid #eee
}

.userCard--menu .menuItem:first-child .item {
    color: rgba(0, 0, 0, .6);
    width: 33%;
    text-align: center;
    line-height: 1.2;
    padding: 10px 0
}

.userCard--menu .menuItem:first-child .item svg {
    width: 18px;
    fill: rgba(0, 0, 0, .5)
}

.userCard--menu .menuItem:first-child .item:hover {
    background-color: #4370f5;
    color: #fff
}

.userCard--menu .menuItem:first-child .item:hover svg {
    fill: #fff
}

.userCard--menu .menuItem:last-child {
    padding: 10px 0;
    border-bottom: 0
}

.userCard--menu .menuItem:last-child .item {
    width: 50%;
    text-align: center;
    color: rgba(0, 0, 0, .6)
}

.userCard--menu .menuItem:last-child .item:hover {
    color: #4370f5
}

.message--link {
    position: relative
}

.message--link .message-count {
    background-color: #c00;
    border-radius: 999em;
    color: #fff;
    font-size: 10px;
    height: 12px;
    left: 10px;
    line-height: 12px;
    opacity: .8;
    padding: 0 5px;
    position: absolute;
    text-align: center;
    top: -1px
}

@-webkit-keyframes a {
    0% {
        transform: translate3d(0, 10px, 0);
        opacity: .1
    }
    to {
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes a {
    0% {
        transform: translate3d(0, 10px, 0);
        opacity: .1
    }
    to {
        transform: translateZ(0);
        opacity: 1
    }
}

.topCard--list {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.topCard--item {
    border: 1px solid #f2f2f2;
    padding: 12px 15px 0;
    box-sizing: border-box;
    margin-bottom: 15px;
    background: #fff;
    width: 288px;
    height: 130px
}

.topCard--tags {
    display: flex;
    flex-wrap: wrap;
    padding-top: 15px
}

.topCard--tags a {
    color: #4370f5;
    background-color: rgba(67, 112, 245, .1);
    font-size: 12px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 2px;
    line-height: 1.4;
    padding: 2px 6px;
    transition: background-color .5s;
    will-change: background-color
}

.topCard--tags a.hot {
    color: #fff
}

.topCard--tags a.hot, .topCard--tags a.hot:hover {
    background-color: #4370f5
}

.topCard--tags a:hover {
    background-color: rgba(67, 112, 245, .2)
}

.topCard--title {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 1px;
    border-bottom: 1px solid #f2f2f2;
    padding: 0 0 8px;
    margin: 0;
    display: flex;
    align-items: center
}

.topCard--title svg {
    width: 24px;
    height: 24px;
    margin-right: 5px
}

.topCard--title span {
    font-size: 12px;
    color: rgba(0, 0, 0, .5);
    margin-left: 5px;
    align-self: flex-end;
    transform: translate3d(0, -4px, 0)
}

.stream-video--title {
    font-size: 20px;
    padding-bottom: 15px;
    font-weight: 700;
    line-height: 1
}

.stream-video--title, .stream-videoNav--list {
    display: flex;
    align-items: center
}

.stream-videoNav--item {
    background: #f8f8f8;
    cursor: pointer;
    line-height: 1.4;
    font-size: 12px;
    padding: 6px 12px;
    border: 0;
    border-radius: 999rem;
    margin-left: 15px;
    color: #111;
    font-weight: 400
}

.stream-videoNav--item.is-active {
    background: linear-gradient(90deg, #ffb821, #ff5c38 45%, #ff1459);
    color: #fff
}

.stream-videos {
    display: flex;
    justify-content: space-between
}

.stream-videoItem {
    display: flex;
    position: relative;
    overflow: hidden;
    cursor: pointer
}

.stream-videoItem img {
    transition: .5s;
    will-change: transform;
    position: relative
}

.stream-videoItem:hover img {
    transform: scale(1.05)
}

.stream-videoItem .title {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    color: #fff;
    line-height: 1.4;
    z-index: 2
}

.stream-videoItem .icon {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    border-radius: 100%;
    background-color: rgba(0, 0, 0, .3);
    padding: 10px;
    transform: translate3d(-50%, -50%, 0)
}

.stream-video__large {
    width: 450px;
    height: 290px
}

.stream-video__large .stream-videoItem {
    height: 290px
}

.stream-video__large .stream-videoItem:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .05) 5%, rgba(0, 0, 0, .25));
    z-index: 1
}

.stream-video__large .stream-videoItem .title {
    font-size: 16px;
    font-weight: 700;
    left: 15px;
    right: 15px;
    bottom: 15px
}

.stream-video__small {
    width: 393px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.stream-video__small .stream-videoItem {
    height: 140px;
    width: 190px;
    margin-bottom: 10px
}

.stream-video__small .stream-videoItem:nth-child(n+2) {
    margin-bottom: 0
}

.stream-video__small .stream-videoItem img {
    height: 100px;
    width: 100%
}

.stream-video__small .stream-videoItem .icon {
    padding: 5px;
    top: 50px
}

.stream-video__small .stream-videoItem .title {
    font-size: 14px;
    color: #333;
    bottom: -4px;
    left: 0
}

.home-video-list {
    padding-bottom: 20px;
    background-color: #fff;
    padding: 15px;
    margin-bottom: 15px
}

.home--navCards {
    padding-bottom: 50px
}

.relate-text {
    margin-top: 30px;
    background-color: #fff;
    padding: 20px
}

.relate-text__title {
    font-size: 18px
}

.relate-text__list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    counter-reset: a;
    padding-top: 10px
}

.relate-text__item {
    counter-increment: a;
    display: flex;
    margin-bottom: 15px;
    width: 48%
}

.relate-text__item .title {
    line-height: 1.4
}

.relate-text__item .title:hover {
    color: #4370f5
}

.relate-text__item .content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    position: relative;
    padding-left: 25px
}

.relate-text__item .content:before {
    content: counter(a);
    position: absolute;
    border: 1px solid #777;
    color: rgba(0, 0, 0, .6);
    font-size: 12px;
    left: 0;
    top: 2px;
    line-height: 1;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 700
}

.relate-text__item .meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    margin-top: auto
}

.relate-text__item .img-link {
    margin-left: 15px;
    border-radius: 4px;
    overflow: hidden;
    width: 120px;
    flex: 0 0 auto;
    display: flex
}

.relate-text__item .img-link img {
    transition: .5s
}

.relate-text__item .img-link:hover img {
    transform: scale(1.05)
}

.index--banner {
    padding-top: 40px
}

.slider {
    width: 623px;
    display: flex
}

.slider .main-slider {
    position: relative;
    height: 336px;
    overflow: hidden
}

.slider .main-slider .next, .slider .main-slider .prev {
    background-color: rgba(0, 0, 0, .45);
    width: 50px;
    height: 100px;
    top: 50%;
    margin-top: -25px;
    position: absolute;
    z-index: 6;
    display: none
}

.slider .main-slider .prev {
    left: 0
}

.slider .main-slider .next {
    right: 0
}

.slider .supernice {
    position: absolute;
    right: 15px;
    bottom: 15px;
    z-index: 7
}

.slider .supernice ul {
    display: flex
}

.slider .supernice li {
    height: 12px;
    right: 12px;
    background-color: hsla(0, 0%, 100%, .3);
    border-radius: 100%;
    display: flex;
    margin: 10px 5px;
    cursor: pointer
}

.slider .supernice li svg {
    height: 12px;
    width: 12px;
    z-index: 3;
    transform: rotate(-90deg) translateZ(0);
    opacity: 0
}

.slider .supernice li svg circle {
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 37 37;
    stroke-dashoffset: 37;
    stroke: #fff
}

.slider .supernice li.on {
    background-color: hsla(0, 0%, 100%, .6)
}

.slider .supernice li.on svg {
    opacity: 1
}

.slider .supernice li.on svg circle {
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 3.7s linear
}

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

.slider:hover .supernice li.on svg {
    opacity: 1
}

.slider:hover .supernice li.on svg circle {
    stroke-dashoffset: 37;
    transition: stroke-dashoffset .5s linear
}

.slider .bd, .slider .bd li {
    position: relative
}

.slider .bd li img {
    display: block;
    transition: transform .5s;
    transform-origin: bottom center
}

.slider .bd li:hover img {
    transform: scale(1.1)
}

.slider .bd li .mask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .05) 5%, rgba(0, 0, 0, .65));
    transition: .5s
}

.slider .bd li .title {
    position: absolute;
    bottom: 15px;
    left: 25px;
    right: 30px;
    font-weight: 700;
    color: #fff;
    font-size: 20px;
    line-height: 1.6;
    text-align: left;
}

.small-slider {
    width: 245px;
    margin-left: 16px
}

.small-slider-item {
    height: 160px;
    margin-bottom: 16px;
    position: relative;
    overflow: hidden
}

.small-slider-item a {
    display: flex;
    position: relative
}

.small-slider-item a img {
    transition: .5s
}

.small-slider-item a .mask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .05) 5%, rgba(0, 0, 0, .65));
    transition: .5s
}

.small-slider-item a:hover img {
    transform: scale(1.1)
}

.small-slider-item a:hover .mask {
    background: linear-gradient(180deg, rgba(0, 0, 0, .45) 5%, rgba(0, 0, 0, .85))
}

.small-slider-item:last-child {
    margin-bottom: 0
}

.small-slider-item .title {
    position: absolute;
    bottom: 10px;
    color: #fff;
    line-height: 1.4;
    left: 10px;
    right: 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.top-activity {
    width: 335px;
    height: 336px;
    margin-left: auto;
    background-color: #333;
    color: #fff;
    overflow: hidden;
    background-image: url(../images/logo-a.png);
    background-repeat: no-repeat;
    background-position: 100% 100%
}

.top-activity a {
    display: block;
    overflow: hidden;
    position: relative
}

.top-activity a .status {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #4370f5;
    color: #fff;
    font-size: 12px;
    padding: 2px 8px;
    z-index: 7
}

.top-activity a img {
    transition: .5s;
    display: block
}

.top-activity a:hover img {
    transform: scale(1.1)
}

.top-activity .content {
    padding: 15px
}

.top-activity .meta {
    font-size: 14px;
    line-height: 1.8
}

.top-activity .meta svg {
    fill: #fff;
    width: 22px;
    height: 22px;
    margin-right: 4px
}

.top-activity .meta .address, .top-activity .meta .date {
    display: flex;
    align-items: center
}

.activity-title {
    line-height: 1.6;
    margin-bottom: 5px;
    max-height: 3.2em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.postlist-item {
    display: flex;
    margin-bottom: 15px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .05)
}

.postlist-item:last-child {
    margin-bottom: 0
}

.postlist-item--ad .action {
    width: 150px;
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 20px
}

.postlist-item--ad .content {
    justify-content: center
}

.postlist-item:hover {
    box-shadow: 0 3px 5px rgba(0, 0, 0, .05)
}

.postlist-item .post-img {
    width: 236px;
    height: 143px;
    flex: 0 0 auto;
    padding: 15px;
    position: relative
}

.postlist-item .post-img a {
    display: block;
    overflow: hidden
}

.postlist-item .post-img a img {
    transition: .5s;
    display: block
}

.postlist-item .post-img a img:hover {
    transform: scale(1.1)
}

.postlist-item .post-img .post-cat {
    position: absolute;
    background-color: #303842;
    color: #fff;
    border-radius: 3px;
    padding: 1px 10px;
    top: 25px;
    left: 25px;
    font-size: 12px;
    z-index: 6
}

.postlist-item .post-img .post-cat.operate {
    background-color: #6e2fd8
}

.postlist-item .post-img .post-cat.it {
    background-color: #dda23c
}

.postlist-item .post-img .post-cat.pmd {
    background-color: #34415d
}

.postlist-item .post-img .post-cat.active {
    background-color: #29bbc0
}

.postlist-item .post-img .post-cat.rp {
    background-color: #43ad32
}

.postlist-item .post-img .post-cat.pd {
    background-color: #b145b8
}

.postlist-item .post-img .post-cat.ucd {
    background-color: #ee5757
}

.postlist-item .content {
    flex: 1 1 auto;
    padding: 15px 15px 15px 0;
    display: flex;
    flex-direction: column
}

.postlist-item .post-title {
    font-size: 20px;
    line-height: 1.4;
    margin: 0 0 5px;
    transition: .5s
}

.postlist-item .post-title a:visited {
    color: #999
}

.postlist-item .post-title a:hover {
    color: #4370f5
}

.postlist-item .des {
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    text-align: justify;
    margin: 0
}

.meta--sup {
    display: flex
}

.meta--sup__right {
    margin-left: auto;
    display: flex
}

.stream-list-meta {
    margin-top: auto;
    display: flex;
    font-size: 12px;
    color: rgba(0, 0, 0, .5);
    align-items: center;
    line-height: 1.6
}

.article--title + .stream-list-meta {
    margin-top: 8px
}

.stream-list-meta .avatar .svgIcon {
    margin: 0 3px
}

.stream-list-meta a:hover {
    text-decoration: underline
}

.stream-list-meta .icon {
    margin-left: 4px
}

.stream-list-meta .avatar {
    border-radius: 100%;
    margin-right: 12px
}

.home--nav {
    border-bottom: 1px solid hsla(120, 1%, 56%, .3);
    overflow: hidden;
    margin-bottom: 20px;
    font-size: 18px;
    display: flex
}

.home--nav .current {
    padding-bottom: 5px;
    border-bottom: 3px solid #4370f5;
    color: #4370f5;
    font-weight: 700
}

.home--questionCards, .stream-topics {
    background-color: #fff;
    padding: 20px;
    margin-bottom: 20px
}

.stream-list-topic {
    display: flex;
    justify-content: space-between
}

.stream-img-pad {
    display: flex;
    flex-direction: column;
    width: 272px;
    background-color: #fff
}

.stream-img-pad .image {
    position: relative;
    display: flex;
    height: 161px;
    width: 272px;
}

.stream-img-pad .image:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: "";
    background-color: rgba(0, 0, 0, .3)
}

.stream-img-pad .image .meta {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px 18px;
    font-size: 12px;
    color: #fff
}

.stream-img-pad .info {
    padding: 10px 0 0;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto
}

.stream-img-pad .title {
    font-size: 16px;
    margin: 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.stream-img-pad .title:hover {
    color: #4370f5
}

.stream-img-pad .desc {
    font-size: 14px;
    color: rgba(0, 0, 0, .5);
    padding: 5px 0 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.stream-img-pad .action {
    text-align: center;
    padding: 10px 0;
    margin-top: auto
}

.stream-img-pad .action .button {
    border: 1px solid #4370f5;
    color: #4370f5;
    padding: 5px 22px;
    border-radius: 5px;
    background-color: #fff;
    font-size: 12px
}

.stream-img-pad .action .button:hover {
    background-color: #4370f5;
    color: #fff
}

.navCard--list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.navCard--item {
    background-color: #fff;
    width: 49%;
    margin-bottom: 2%;
    padding: 25px;
    box-sizing: border-box;
    display: flex;
    align-items: center
}

.navCard--itemImage {
    width: 54px;
    margin-right: 15px;
    display: flex
}

.navCard--item .des {
    font-size: 14px;
    color: rgba(0, 0, 0, .5)
}

.pagination {
    padding: 30px 0 50px
}

.pagination .page-numbers {
    background-color: rgba(0, 0, 0, .05);
    font-size: 14px;
    padding: 6px 14px;
    color: rgba(0, 0, 0, .5);
    border-radius: 4px
}

.pagination .page-numbers.current {
    background-color: #4370f5;
    color: #fff
}

.loadmore {
    background-color: #fff;
    color: #4370f5;
    padding: 10px 0;
    text-align: center;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .05);
    cursor: pointer
}

.block--action {
    padding: 30px 0
}

.tagCard--item {
    width: 300px;
    background-color: #fff
}

.tagCard--header {
    padding: 10px;
    background-color: #fafafa
}

.tagCard--content {
    padding: 10px
}

.tagCard--post {
    border-bottom: 1px solid #eee;
    padding: 5px 0;
    font-size: 14px;
    color: rgba(0, 0, 0, .65)
}

.tagCard--post:last-child {
    border-bottom: 0
}

.tagCard--list {
    display: flex;
    justify-content: space-between;
    padding-bottom: 50px
}

.questionCard {
    counter-reset: b
}

.questionCard--item {
    background-color: #fff;
    position: relative;
    width: 49%;
    display: flex;
    flex-direction: column;
    counter-increment: b
}

.questionCard--item:nth-child(n+5) .content {
    border-bottom: 0;
    padding-bottom: 0
}

.questionCard--item:nth-child(-n+2) .content {
    padding-top: 0
}

.questionCard--item .content {
    padding: 20px 10px;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    border-bottom: 1px dotted #ddd
}

.questionCard--item .content .title:hover {
    color: #4370f5
}

.questionCard--item .content .title:before {
    content: counter(b);
    background-color: #4370f5;
    color: #fff;
    font-size: 12px;
    padding: 3px 6px 2px;
    line-height: 1;
    border-radius: 4px;
    margin-right: 4px;
    display: inline-block;
    vertical-align: 1px
}

.questionCard--item .content .des {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.questionCard--item .content .action {
    display: flex;
    align-items: center;
    padding-top: 10px;
    font-size: 12px;
    color: rgba(0, 0, 0, .6);
    margin-top: auto
}

.questionCard--item .content .action .rachel--box__list {
    display: flex;
    margin-right: 5px
}

.questionCard--item .content .action .avatar {
    border-radius: 100%;
    width: 24px;
    height: 24px;
    margin-left: -8px;
    border: 2px solid #fff
}

.questionCard--item .content .action .avatar:first-child {
    margin-left: 0
}

.questionCard--item .content .action .reward {
    color: #f50;
    display: flex;
    align-items: center;
    margin-left: auto;
    font-size: 16px;
    font-weight: 700
}

.questionCard--item .content .action .reward img {
    margin-right: 4px;
    width: 20px
}

.questionCard--list {
    padding-bottom: 30px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.questionCard--prefix {
    background-color: #4370f5;
    color: #fff;
    font-size: 12px;
    position: absolute;
    top: 0;
    left: 0;
    padding: 2px 8px;
    line-height: 1.6
}

.post-navigation {
    background-color: #fff;
    padding: 25px;
    margin-top: 30px
}

.button--toggle .is-default {
    display: inline
}

.button--toggle .is-active {
    display: none
}

.homeTab {
    margin-top: 10px;
    background-color: #fff;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    display: flex;
    margin-bottom: 10px
}

.homeTab__top {
    margin-top: 0
}

.homeTab span {
    position: relative;
    padding-right: 20px;
    padding-left: 20px;
    height: 50px;
    box-sizing: border-box;
    cursor: pointer;
    overflow: hidden
}

.homeTab span.is-active:before, .homeTab span.loading:before {
    background-color: #5079b7;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    top: 0
}

.homeTab span.is-active:before {
    right: 0
}

.post-navigationItem {
    width: 50%;
    box-sizing: border-box;
    padding: 0 10px;
    display: flex;
    align-items: flex-start
}

.post-navigationItem img {
    flex: 0 0 auto;
    margin-right: 10px
}

.post-navigationItem .content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column
}

.post-navigationItem .content .meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .5);
    margin-top: auto
}

.post-navigationItem:last-child {
    border-left: 1px solid #eee
}

.post-navigation {
    display: flex
}

img[data-action=zoom] {
    cursor: pointer;
    cursor: -moz-zoom-in
}

.zoom-img, .zoom-img-wrap {
    position: relative;
    z-index: 11;
    transition: all .3s
}

img.zoom-img {
    cursor: pointer;
    cursor: -moz-zoom-out
}

.zoom-overlay {
    z-index: 10;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .3s
}

.zoom-overlay-open .zoom-overlay {
    opacity: 1
}

.zoom-overlay-open, .zoom-overlay-transitioning {
    cursor: default
}

.form--content {
    width: 500px;
    padding-top: 15px
}

.form--content .el-form-item__label {
    line-height: 22px !important
}

.news-date {
    position: absolute;
    top: 46px;
    right: 50px;
    height: 85px;
    line-height: 36px;
    width: 85px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.news-date--header {
    padding: 30px;
    height: 50px
}

.news-date:after {
    background-color: #0f2540;
    content: "";
    display: block;
    height: 118px;
    position: absolute;
    right: 42px;
    top: -16px;
    transform: rotate(45deg);
    width: 1px
}

.news-date time {
    color: #333;
    font-size: 40px;
    font-weight: 700;
    line-height: 36px
}

.news-date .month {
    left: 0;
    position: absolute;
    top: 0
}

.news-date .day {
    bottom: -4px;
    position: absolute;
    right: 0
}

.news-list-item {
    padding: 30px 30px 0
}

.news-list-item:last-child .news-list-content {
    border-bottom: 0
}

.news-list-content {
    padding-bottom: 30px;
    border-bottom: 1px solid #eee
}

.news-list-title {
    line-height: 1.4;
    font-size: 20px;
    position: relative;
    padding-left: 8px
}

.news-list-title:before {
    height: 9px;
    width: 9px;
    border-radius: 100%;
    content: "";
    background-color: #4370f5;
    position: absolute;
    left: -5px;
    top: 9px
}

.news-banner .hero--standalone {
    background-image: url(https://image.woshipm.com/wp-files/2020/06/7wiIpZlZbfWcX7Zv4OTP.png)
}

.home-ad-link {
    overflow: hidden
}

.home-ad-link img {
    transition: .5s;
    display: block
}

.home-ad-link:hover img {
    transform: scale(1.05)
}

.stickyIcon {
    fill: red;
    margin-right: 4px;
    transform: translate3d(0, 1px, 0);
    display: inline-block
}

.widget-post-item--withImage {
    list-style: none;
    padding: 0;
    display: flex;
    counter-increment: c;
    padding: 5px 0
}

.widget-post-item--withImage .img {
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    overflow: hidden;
    border-radius: 3px
}

.widget-post-item--withImage .img__large {
    width: 100%;
    margin-bottom: 10px
}

.widget-post-item--withImage .img a {
    display: block
}

.widget-post-item--withImage .img a img {
    border-radius: 3px;
    display: block;
    transition: .5s
}

.widget-post-item--withImage .img a:hover img {
    transform: scale(1.05)
}

.widget-post-item--withImage .img:before {
    content: counter(c);
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
    font-size: 12px;
    background-color: #ff5c00;
    line-height: 1;
    padding: 2px 6px;
    border-radius: 0 0 3px 0;
    z-index: 6
}

.widget-post-item--withImage .content {
    flex: 1 1 auto
}

.widget-post-list--withImage {
    counter-reset: c;
    list-style: none;
    padding: 10px 0 0;
    margin: 0
}

.widget-post-list--withImage .content {
    display: flex;
    justify-content: space-between;
    flex-direction: column
}

.widget-post-list--withImage .title {
    line-height: 1.3;
    font-size: 14px;
    font-weight: 700;
    transition: .5s;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.widget-post-list--withImage .title:hover {
    color: #4370f5
}

.widget-post-list--withImage .meta {
    font-size: 12px;
    color: rgba(0, 0, 0, .65)
}

.inner {
    padding: 15px
}

.widget-content {
    padding-top: 15px
}

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

.code-ul li {
    margin-bottom: 15px;
    font-size: 16px;
    color: rgba(0, 0, 0, .7);
    display: flex;
    align-items: center
}

.code-ul li img {
    width: 32px;
    margin-right: 8px;
    background-color: #f2f2f2;
    border-radius: 100%
}

.code-ul li:last-child {
    margin-bottom: 0
}

.code-ul li a {
    margin-left: auto;
    border: 1px solid #4370f5;
    color: #4370f5;
    font-size: 12px;
    padding: 3px 10px;
    line-height: 1.2;
    border-radius: 3px
}

.code-ul li a:hover {
    color: #fff;
    background-color: #4370f5
}

.widget-title {
    border-bottom: 3px solid #eee;
    align-items: center;
    font-size: 18px;
    display: flex;
    line-height: 1
}

.widget-title .tab {
    margin-left: auto;
    font-size: 12px;
    color: rgba(0, 0, 0, .55)
}

.widget-title .tabItem {
    cursor: pointer
}

.widget-title .tabItem.is-active {
    color: #4370f5
}

.widget-title .btn {
    margin-left: auto;
    font-size: 14px;
    color: rgba(0, 0, 0, .55);
    padding-bottom: 2px
}

.widget-title span {
    border-bottom: 3px solid #4370f5;
    padding-bottom: 8px;
    transform: translate3d(0, 3px, 0)
}

.component-fade-enter-active, .component-fade-leave-active {
    transition: opacity .3s ease
}

.component-fade-enter, .component-fade-leave-to {
    opacity: 0
}

.widget-author-list-item {
    display: flex;
    padding: 15px 0;
    align-items: flex-start;
    border-bottom: 1px dotted #ddd
}

.widget-author-list-item:last-child {
    border-bottom: 0
}

.widget-author-list-item h4 {
    margin: 0;
    line-height: 1;
    font-size: 16px;
    margin-bottom: 10px
}

.widget-author-list-item p {
    margin: 0;
    font-size: 14px;
    color: rgba(0, 0, 0, .65)
}

.widget-author-list-item .image-link {
    flex: 0 0 auto;
    margin-right: 10px;
    width: 44px;
    display: flex;
    height: 44px
}

.widget-author-list-item .avatar {
    border-radius: 100%
}

.widget-author-list {
    padding-top: 5px
}

.widgetQuestion--list {
    padding-top: 0
}

.widgetQuestion--item {
    font-size: 14px;
    padding: 12px 0;
    border-bottom: 1px dashed #eee
}

.widgetQuestion--item:first-child {
    padding-top: 0
}

.widgetQuestion--item .meta {
    color: rgba(0, 0, 0, .55);
    line-height: 1
}

.widgetQuestion--item .title {
    line-height: 1.4;
    margin-bottom: 6px
}

.widgetQuestion--item .title:hover {
    color: #4370f5
}

.widgetQuestion--item:last-child {
    border-bottom: 0
}

.widget-book-item {
    display: flex;
    padding: 10px 0
}

.widget-book-item .img {
    margin-right: 10px;
    width: 116px;
    flex: 0 0 auto
}

.widget-book-item .content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column
}

.widget-book-item .content .author, .widget-book-item .content .des {
    font-size: 14px;
    color: rgba(0, 0, 0, .65)
}

.widget-book-item .content .author {
    margin-top: auto
}

.widget-book-item .content .t:hover {
    color: #4370f5
}

.bookmore {
    border: 1px solid #ccc;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 5px
}

.widget-action {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    justify-content: center
}

.widget-ad a {
    display: flex;
    overflow: hidden;
    margin-bottom: 10px;
    align-items: center
}

.widget-ad a img {
    transition: .5s
}

.widget-ad a img:hover {
    transform: scale(1.05)
}

.widget {
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .05)
}

.widget-wechat {
    display: flex;
    align-items: center;
    padding-top: 15px;
    padding-bottom: 25px
}

.widget-wechat .img {
    margin-right: 10px;
    width: 120px;
    line-height: 1.2
}

.widget-wechat .img .des {
    font-size: 12px;
    color: rgba(0, 0, 0, .55)
}

.widget-wechat .content {
    font-size: 14px;
    padding-bottom: 20px
}

.widget-wechat .content p {
    margin: 0
}

.widget-wechat .content .title {
    font-size: 16px;
    color: #4370f5;
    margin-bottom: 5px
}

.widget--toc {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: rgba(0, 0, 0, .65)
}

.widget--toc li {
    padding: 3px 0;
    padding-left: 14px;
    position: relative
}

.widget--toc li.current:before {
    content: "";
    display: block;
    position: absolute;
    left: -16px;
    top: 50%;
    width: 12px;
    height: 5px;
    background: #4370f5;
    margin-top: -2px
}

.widget--tocTitle {
    font-size: 16px;
    margin-bottom: 10px
}

.widget-discuss .discuss-meta {
    position: relative;
    text-align: right
}

.widget-discuss .avatar {
    border-radius: 100%;
    margin-left: -12px;
    border: 2px solid #fff;
    height: 28px;
    width: 28px
}

.widget-discuss .avatars {
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap
}

.discuss-prefix {
    font-size: 12px;
    font-weight: 700;
    color: #c00
}

.js-sidebar.is-fixed {
    position: fixed;
    bottom: 0;
    width: 335px
}

.discuss-image {
    display: block;
    border-radius: 3px 3px 0 0
}

.discuss-content {
    padding: 15px;
    position: relative
}

.discuss-title {
    margin: 5px 0 10px
}

.discuss-meta .avatar-wrapper {
    position: absolute;
    top: 0;
    font-size: 12px;
    margin: 10px 0;
    text-align: left;
    padding-left: 12px
}

.discuss-meta .avatar-wrapper .num {
    display: inline-block;
    vertical-align: middle;
    padding-left: 10px
}

.discuss-qrcode {
    width: 80px
}

.join {
    position: absolute;
    bottom: 0;
    font-size: 12px;
    margin: 2px;
    color: rgba(0, 0, 0, .44)
}

.widget--question--hero {
    display: flex;
    position: relative;
    border-radius: 4px 4px 0 0;
    overflow: hidden;
    height: 196px
}

.widget--question--hero .img {
    transition: .5s
}

.widget--question--hero:hover .img {
    transform: scale(1.05)
}

.widget--question--hero:before {
    background: linear-gradient(269deg, rgba(105, 179, 171, .3), rgba(105, 179, 171, .7) 50%, #69b3ab);
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    content: "";
    position: absolute;
    z-index: 6
}

.widget--question--hero .content {
    color: #fff;
    position: absolute;
    z-index: 7;
    left: 15px;
    right: 15px;
    bottom: 15px
}

.widget--question--hero .content .title {
    font-weight: 700;
    line-height: 1.6
}

.widget--question--hero .content .des {
    font-size: 14px;
    line-height: 1.6;
    padding: 10px 0
}

.widget--question--hero .content .meta {
    display: flex;
    align-items: center;
    font-size: 12px
}

.widget--question--hero .content .meta .avatar-list {
    display: flex;
    align-items: center;
    padding-left: 6px
}

.widget--question--hero .content .meta .avatar-list .avatar {
    border: 1px solid #eee;
    margin-left: -6px;
    border-radius: 100%
}

.widget--question--hero .content .meta .c {
    padding-left: 5px
}

.widget--question--hero .content .meta .btn {
    color: #6cb4a7;
    background-color: #fff;
    font-size: 12px;
    margin-left: auto;
    padding: 2px 10px;
    border-radius: 4px
}

.author--meta .button--follow {
    padding: 8px 14px;
    font-size: 12px;
    background-color: transparent
}

.sidebar {
    margin-left: auto
}

.widget {
    border-radius: 4px;
    margin-bottom: 20px
}

.miniCourseIndexPlugin {
    width: 117px;
    height: 86px;
    position: fixed;
    bottom: 260px;
    right: 6px;
    z-index: 12;
    display: block
}

.site-footer {
    background-color: #222c3c;
    color: #818394
}

.site-footer .copyright {
    background-color: #1d2431;
    font-size: 12px;
    padding: 20px 0
}

.site-footer .copyright .inforight {
    margin-left: auto;
    text-align: right
}

.site-footer .footer-title {
    font-size: 16px;
    color: #fff;
    margin-bottom: 15px;
    font-weight: 700
}

.site-footer ul {
    list-style: none;
    padding: 0
}

.info-section {
    width: 440px;
    text-align: justify
}

.link-section {
    width: 150px;
    padding-right: 20px
}

.partner-section {
    width: 300px
}

.qr-section {
    display: flex
}

.qr-section--item {
    display: flex;
    flex-direction: column
}

.qr-section--item p {
    margin: 0;
    text-align: center
}

.qr-section img {
    width: 80px;
    border: 5px solid #fff;
    border-radius: 5px;
    margin: 10px 10px 5px
}

.blue-pic-ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-right: 40px !important
}

.blue-pic-ul li {
    width: 80px;
    justify-content: center;
    padding: 0 0 10px
}

.blue-pic-ul li, .blue-pic-ul li a {
    display: flex;
    align-items: center
}

.blue-ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-right: 40px !important
}

.blue-ul li {
    width: 60px;
    justify-content: center;
    padding: 0 0 10px
}

.blue-ul li, .blue-ul li a {
    display: flex;
    align-items: center
}

.footer-sections {
    padding: 50px 0 30px;
    align-items: flex-start;
    font-size: 14px;
    justify-content: space-between
}

.footer-nav ul {
    display: flex;
    justify-content: space-between
}

.site--footer {
    background-color: #1d2431;
    color: #91969e
}

.comments-area {
    margin-top: 30px;
    padding: 20px;
    margin-bottom: 30px
}

.comment-textarea, .textarea--unlogin {
    border: 1px solid #ccc;
    height: 100px;
    width: 100%;
    border-radius: 5px;
    resize: none;
    padding: 10px;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 1.6
}

.textarea--unlogin {
    margin-bottom: 10px;
    background-color: #fafafa;
    cursor: pointer;
    color: rgba(0, 0, 0, .6)
}

.comment-submit {
    background-color: #4370f5;
    color: #fff;
    border: 0;
    font-size: 12px;
    padding: 6px 22px;
    border-radius: 4px
}

.comment-list {
    list-style: none;
    margin: 0;
    padding: 20px 0
}

.children {
    list-style: none;
    margin-left: 58px;
    background-color: #f2f4f6;
    padding: 0 20px;
    border-radius: 4px;
    font-size: 14px;
    margin-bottom: 25px
}

.children .comment-avatar {
    width: 36px
}

.children .comment:last-child .comment-block {
    border-bottom: 0
}

.children .comment-bottom {
    font-size: 12px
}

.children .comment-block {
    border-top: 0;
    border-bottom: 1px solid #eee
}

.comment-author {
    display: flex;
    align-items: center;
    font-size: 12px
}

.comment-author a {
    color: #4370f5
}

.post-c-a {
    background-color: #4370f5;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    padding: 0 6px;
    line-height: 1.5;
    margin: 0 6px
}

.comment-body {
    padding: 15px 0;
    border-bottom: 1px solid #eee
}

.comment-info {
    margin-bottom: 5px
}

.comment-avatar {
    width: 48px;
    flex: 0 0 auto;
    margin-right: 10px;
    padding-top: 5px
}

.comment-section {
    flex: 1 1 auto
}

.comment-bottom {
    font-size: 12px;
    color: rgba(0, 0, 0, .6);
    display: flex;
    align-items: center
}

.comment-bottom .icon {
    margin-left: 5px;
    fill: #777
}

.comment-bottom .comment-reply {
    transition: color .5s
}

.comment-bottom .comment-reply:hover {
    color: #4370f5
}

.comment-content {
    color: rgba(0, 0, 0, .65);
    line-height: 1.6;
    padding-bottom: 5px;
    word-break: break-all
}

.comment-content p {
    margin: 0
}

.comment-block {
    padding: 20px 0;
    border-top: 1px solid #ddd;
    display: flex;
    align-items: flex-start;
    font-size: 14px
}

.comment .avatar {
    border-radius: 100%
}

.no-comment {
    text-align: center;
    padding: 30px 0;
    font-size: 18px;
    color: rgba(0, 0, 0, .6)
}

.comment-list-header {
    padding-bottom: 10px
}

.comment-list-header .title {
    font-size: 18px;
    font-weight: 700
}

.commentnav {
    display: flex;
    justify-content: center;
    padding-bottom: 20px
}

.commentnav .page-numbers {
    border: 1px solid #4370f5;
    color: #4370f5;
    padding: 4px 10px;
    border-radius: 4px;
    line-height: 1.4;
    font-size: 14px;
    margin: 0 5px
}

.commentnav .page-numbers.current {
    background-color: #4370f5;
    color: #fff
}

.user-leve {
    color: #4370f5
}

.comment-reply {
    cursor: pointer;
    margin-left: 5px
}

.respond {
    padding-bottom: 10px
}

.comment-list .respond {
    padding-left: 58px
}

.comment-list .children .respond {
    padding-left: 46px
}

#cancel-comment-reply-link {
    color: rgba(0, 0, 0, .6);
    font-size: 12px
}

#cancel-comment-reply-link:hover {
    color: #4370f5
}

.author--header {
    height: 220px;
    background-image: url(//image.woshipm.com/kan/img/banner.png);
    background-size: cover
}

.author--meta {
    margin-top: -60px
}

.author--meta .avatar {
    border-radius: 100%;
    border: 3px solid #fff
}

.author--meta .name {
    font-size: 26px
}

.author--meta .description {
    color: rgba(0, 0, 0, .5)
}

.author--meta .action {
    position: absolute;
    right: 0;
    top: 150px
}

.author-page-meta {
    padding-top: 15px;
    padding-bottom: 20px;
    display: flex
}

.author-page-meta span {
    text-align: center;
    display: flex;
    flex-direction: column;
    margin-right: 10px;
    font-size: 12px;
    color: rgba(0, 0, 0, .5)
}

.author-page-meta span i {
    font-style: normal;
    color: rgba(0, 0, 0, .8);
    font-weight: 600
}

.author--nav {
    padding-top: 15px;
    border-bottom: 1px solid #eee
}

.author--navList {
    display: flex;
    color: rgba(0, 0, 0, .6);
    margin-bottom: -1px
}

.author--nav span {
    padding-bottom: 5px;
    margin-right: 20px;
    border-bottom: 1px solid transparent;
    font-size: 14px
}

.author--nav span.current {
    color: #4370f5;
    border-color: #4370f5
}

.post--card {
    width: 280px;
    background-color: #fff;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 2px;
    overflow: hidden
}

.post--card__placehold {
    visibility: hidden
}

.post--card__img {
    position: relative
}

.post--card__img .post-cat {
    position: absolute;
    background-color: rgba(0, 0, 0, .6);
    color: #fff;
    border-radius: 3px;
    padding: 1px 10px;
    top: 10px;
    left: 10px;
    font-size: 12px;
    z-index: 6
}

.post--card__img a {
    display: flex;
    overflow: hidden
}

.post--card__img a img {
    transition: .5s
}

.post--card__img a img:hover {
    transform: scale(1.1)
}

.post--card .content {
    padding: 10px 15px 15px;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column
}

.post--card .content .stream-list-meta {
    margin-top: auto
}

.post--card__list {
    display: flex;
    justify-content: space-between;
    padding: 25px 0 20px;
    flex-wrap: wrap
}

.post--card__title {
    font-size: 16px;
    margin: 0 0 8px;
    line-height: 1.4;
    transition: .5s
}

.post--card__title:hover {
    color: #4370f5
}

.topic--banner {
    background-image: url(http://image.woshipm.com/kan/img/topics-banner.jpg);
    background-size: cover;
    text-align: center;
    color: #fff;
    padding: 50px
}

.hero-title {
    margin: 0
}

.hero-description {
    font-size: 16px
}

.topic-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 20px
}

.topic-list-item {
    background-color: #fff;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .06);
    border-radius: 5px;
    overflow: hidden;
    width: 49%;
    transition: .5s
}

.topic-list-item:hover {
    transform: translate3d(0, -10px, 0)
}

.topic-list-item .content {
    padding: 20px;
    position: relative
}

.topic-list-item .meta {
    color: rgba(0, 0, 0, .6);
    font-size: 14px;
    padding-top: 15px
}

.topic-list-item .title {
    font-size: 22px
}

.topic-list-item .title:hover {
    color: #4370f5
}

.topic-list-item .des {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.topic-list-item .list {
    border-top: 1px solid #eee;
    padding-top: 15px;
    padding-left: 15px;
    margin-top: 20px
}

.topic-list-item .list-item {
    font-size: 14px;
    padding: 3px 0
}

.topic-list-item .list-item:hover {
    color: #4370f5
}

.topic-list-item .btn {
    color: #4370f5;
    background-color: rgba(67, 112, 245, .2);
    font-size: 12px;
    padding: 4px 16px;
    border-radius: 4px;
    position: absolute;
    right: 20px;
    top: 30px
}

.topic-item-image {
    display: flex
}

.pmFeature--list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.pmFeature--item {
    box-sizing: border-box;
    width: 49%;
    margin-bottom: 25px;
    background-color: #fff;
    border-radius: 6px;
    transition: .5s;
    padding: 40px;
    display: flex;
    align-items: flex-start
}

.pmFeature--item:hover {
    transform: translate3d(0, -10px, 0)
}

.pmFeature--item h4 {
    font-size: 12px;
    line-height: 24px;
    font-weight: 400;
    color: #bdbdbd;
    overflow: hidden;
    margin: 5px 0 10px
}

.pmFeature--image {
    width: 180px;
    margin-right: 40px;
    display: flex;
    flex: 0 0 auto
}

.pmFeature--content {
    flex: 1 1 auto
}

.pmFeature--content h2 {
    font-size: 16px;
    line-height: 1.4;
    margin-top: 0;
    overflow: hidden;
    margin-bottom: 5px;
    font-weight: 400;
    color: #2c3e50
}

.pmFeature--content ul {
    list-style: none;
    padding: 5px 15px;
    background: hsla(0, 0%, 85%, .16)
}

.pmFeature--content ul li {
    padding: 5px 0;
    font-size: 14px;
    margin: 0;
    list-style: none
}

.pmFeature--content ul li:hover {
    color: #4370f5
}

.pm-tools-list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 40px;
    padding-bottom: 50px
}

.pm-tools-item {
    width: 300px;
    margin-bottom: 18px;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05)
}

.pm-tools-item .des {
    margin: 0;
    padding: 15px;
    text-align: justify;
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.pm-tools-header {
    padding: 16px
}

.pm-tools-header h2 {
    margin: 0;
    line-height: 1.2;
    font-size: 16px
}

.pm-tool-img {
    display: flex
}

.tool-btn {
    padding: 15px;
    display: none
}

.hero--standalone {
    padding: 60px 0;
    color: #fff;
    text-align: center;
    background-image: url(//image.woshipm.com/build/img/gongjubg.jpeg!/both/1600x600);
    background-size: cover
}

.hero-title {
    font-size: 24px;
    margin-bottom: 5px
}

.recomendUser-banner, .y-bookwrapper {
    margin-bottom: 50px
}

.y-bookwrapper {
    background-color: #fff
}

.y-textAlignCenter {
    text-align: center
}

.blockGroup--posts {
    padding: 40px;
    border-radius: 4px;
    display: flex;
    flex-wrap: wrap
}

.y-book-item {
    width: 150px;
    margin: 20px
}

.y-book-item h3 {
    font-size: 14px;
    margin: 0;
    font-weight: 400
}

.userList {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 0 50px
}

.userItem {
    width: 250px;
    margin-bottom: 20px;
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 4px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.userItem .avatar {
    border-radius: 100%;
    width: 64px
}

.userItem .name {
    font-size: 18px
}

.userItem .des {
    color: rgba(0, 0, 0, .6);
    font-size: 14px;
    margin: 8px 0 12px
}

.userItem .action {
    margin-top: auto
}

.userItem .meta {
    margin: 10px 0;
    position: relative
}

.userItem .meta span {
    position: relative;
    background-color: #fff;
    padding: 0 10px;
    z-index: 6
}

.userItem .meta:after {
    height: 1px;
    position: absolute;
    left: 0;
    right: 0;
    background-color: #eee;
    top: 14px;
    content: ""
}

.recent-update {
    text-align: left
}

.recent-update a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.user-left {
    width: 200px;
    background-color: #fff;
    margin-right: 30px;
    flex: 0 0 auto
}

.user-right {
    flex: 1 1 auto;
    background-color: #fff;
    height: 100%;
    padding: 5px 20px 20px;
    min-height: 503px
}

.follow-nav {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px
}

.user-wrap {
    display: flex;
    align-items: flex-start;
    margin-top: 30px;
    margin-bottom: 30px
}

.tag-list-empety {
    padding: 50px 0
}

.user-menu {
    margin: 0;
    padding: 20px
}

.user-menu li {
    padding: 10px 0
}

.user-menu li .fa {
    margin-right: 6px
}

.user-menu li:hover {
    color: #4370f5
}

.user-bookmark {
    list-style: none;
    padding: 0
}

.bookmark-list-item {
    font-size: 14px;
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    color: rgba(0, 0, 0, .6)
}

.bookmark-list-item:last-child {
    border-bottom: 0
}

.widget--fixed {
    width: 360px;
    box-sizing: border-box
}

.widget--fixed.is-active {
    position: fixed;
    top: 90px
}

.yoonaOnline--widgetBtn {
    display: block;
    background-color: #4370f5;
    color: #fff;
    border-radius: 5px;
    text-align: center;
    padding: 6px;
    font-size: 14px
}

.yoonaOnline--widgetTitle {
    font-size: 20px;
    color: rgba(0, 0, 0, .68);
    font-weight: 200;
    margin: 0
}

.yoonaOnline--buttons {
    display: flex;
    align-items: center
}

.yoonaOnline--description {
    font-size: 14px;
    color: #f99b01;
    margin-bottom: 10px;
    margin-top: -10px
}

.yoonaOnline--linkItem {
    width: 140px;
    background-color: #4370f5;
    border: 1px solid #4370f5;
    color: #fff;
    text-align: center;
    padding: 5px 15px;
    font-size: 14px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.8;
    box-sizing: border-box;
    margin-right: 15px
}

.yoonaOnline--linkItem.chat {
    background-color: #fff;
    color: #4370f5
}

.yoonaOnline--linkItem.chat img {
    width: 22px;
    margin-right: 6px
}

.yoonaOnline--pick {
    display: flex;
    padding: 50px 150px 60px
}

.yoonaOnline--pickDate {
    width: 280px;
    padding: 20px;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 5px;
    box-shadow: 0 5px 10px 0 rgba(46, 61, 73, .05)
}

.yoonaOnline--pickDatePrefix {
    display: flex;
    align-items: center;
    color: #4370f5;
    padding-bottom: 20px;
    font-weight: 500
}

.yoonaOnline--pickDatePrefix svg {
    margin-right: 10px
}

.yoonaOnline--pickDateItem {
    border: 1px solid #343547;
    padding: 5px 10px;
    font-size: 14px;
    color: #343547;
    border-radius: 4px;
    text-align: center;
    margin-bottom: 15px;
    cursor: pointer
}

.yoonaOnline--pickDateItem.is-active {
    border-color: #4370f5;
    color: #4370f5
}

.yoonaOnline--pickDateItem.disabled {
    cursor: not-allowed;
    background-color: #fafafa;
    color: #aaa;
    border-color: #aaa
}

.yoonaOnline--banner {
    height: 300px;
    background-size: cover;
    background-position: 50%
}

.yoonaOnline--tips {
    display: flex;
    padding-bottom: 40px;
    padding-top: 30px
}

.yoonaOnline--tipsItem {
    display: flex;
    margin-right: 16px;
    align-items: center;
    font-size: 14px;
    color: rgba(0, 0, 0, .7)
}

.yoonaOnline--tipsItem svg {
    fill: #4370f5;
    box-shadow: 3px 3px 10px rgba(0, 0, 0, .1);
    margin-right: 6px;
    border-radius: 999rem;
    width: 16px;
    height: 16px
}

.yoonaOnline--price {
    font-size: 28px;
    font-weight: 300;
    margin-bottom: 10px;
    color: #f99b01
}

.yoonaOnline--price .prefix {
    font-size: 16px
}

.yoonaOnline--headerContent {
    padding-left: 80px
}

.yoonaOnline--headerContent h2 {
    font-size: 28px;
    font-weight: 300;
    color: #4370f5;
    padding: 20px 0 0
}

.yoonaOnline--headerList {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 0
}

.yoonaOnline--headerItem {
    border-left: 2px solid #dbe2e8;
    width: 280px;
    padding: 0 25px
}

.yoonaOnline--headerItem .prefix {
    color: #7d97ad;
    font-size: 14px;
    line-height: 1.6;
    display: flex;
    align-items: center
}

.yoonaOnline--headerItem .prefix svg {
    margin-right: 4px
}

.yoonaOnline--headerItem .content {
    color: #2e3d49;
    font-weight: 500;
    font-size: 18px
}

.yoonaOnline--headerItem .des {
    color: #525c65;
    font-size: 14px
}

.main-left {
    width: 50%;
    height: 100%;
    float: left;
    border-right: 1px solid #dbe2e8;
    text-align: left;
    position: relative
}

.time_open {
    padding: 6px;
    width: 300px;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 20px;
    color: #343547;
    border: 1px solid #343547
}

.time_open.is-active {
    color: #4370f5;
    border-color: #4370f5
}

.ptip {
    font-size: 14px;
    color: rgba(0, 0, 0, .44)
}

.apply-main {
    width: 700px;
    margin: 30px auto;
    display: flex
}

.main-right {
    padding-left: 40px
}

.main-right .price span {
    color: #ff8106;
    font-size: 24px
}

.main-right .remain {
    padding: 10px 0 20px;
    color: rgba(0, 0, 0, .6)
}

.cd-button {
    width: 235px;
    display: block;
    font-size: 20px;
    color: #fff;
    text-align: center;
    line-height: 48px;
    background-color: #4370f5;
    border-radius: 3px;
    margin-bottom: 20px
}

.y-marginTop40 {
    margin-top: 40px
}

.yoonaMenu {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 150px
}

.yoonaMenuItem {
    border: 1px solid rgba(0, 0, 0, .05);
    font-size: 20px;
    font-weight: 300;
    width: 300px;
    border-radius: 5px;
    text-align: center;
    padding: 10px;
    margin-bottom: 30px;
    background-color: #fff;
    box-shadow: 0 3px 15px rgba(0, 0, 0, .02)
}

.yoonaMenuItem:not(.disabled):hover {
    color: #4370f5
}

.yoonaMenuItem.disabled {
    background-color: #dedede;
    cursor: not-allowed
}

.price--original {
    color: rgba(0, 0, 0, .44);
    text-decoration: line-through;
    font-size: 16px;
    margin-left: 10px
}

.overlay--content__contact {
    overflow: unset !important
}

.overlay--onlineContent {
    padding: 20px 0 10px;
    width: 360px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.overlay--onlineItem {
    text-align: center;
    position: relative;
    cursor: pointer
}

.overlay--onlineItem .text {
    color: #4370f5
}

.overlay--onlineItem:hover .dropdown {
    display: block
}

.overlay--onlineItem .dropdown {
    padding: 5px;
    position: absolute;
    line-height: 1;
    top: 50px;
    background-color: #fff;
    display: none;
    width: 140px;
    border: 1px solid #eee;
    border-radius: 4px;
    font-size: 14px;
    left: -37px
}

.overlay--onlineItem .dropdown.phone {
    color: rgba(0, 0, 0, .6);
    padding-top: 20px;
    padding-bottom: 20px
}

.overlay--onlineItem .dropdown:before {
    content: "";
    border: 10px solid;
    border-color: transparent transparent #eee;
    position: absolute;
    top: -20px;
    left: 60px
}

.overlay--onlineItem .dropdown:after {
    content: "";
    border: 10px solid;
    border-color: transparent transparent #fff;
    position: absolute;
    top: -19px;
    left: 60px
}

.yoonaEvent--contact {
    position: relative;
    cursor: pointer;
    display: flex;
    background-color: #f2f4f6;
    border-radius: 5px;
    padding-top: 5px;
    overflow: hidden;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .06);
    margin-bottom: 20px
}

.yoonaEvent--contact:last-child {
    margin-bottom: 0
}

.yoonaEvent--contactImg {
    width: 130px;
    height: 130px
}

.yoonaEvent--contactInfo {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 30px 15px 25px 0;
    align-items: flex-start
}

.yoonaEvent--contactInfo .title {
    font-size: 18px;
    color: rgba(0, 0, 0, .6);
    margin-bottom: auto;
    line-height: 1.2
}

.yoonaEvent--contactInfo .btn {
    background: linear-gradient(90deg, #f3091a, #ff8063);
    box-shadow: 0 5px 10px rgba(255, 79, 58, .3);
    color: #fff;
    padding: 6px 22px;
    border-radius: 999rem;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 600
}

.yoonaEvent--banner {
    display: flex;
    height: 300px;
    background-size: cover;
    background-position: 50%
}

.yoonaEvent--userTitle {
    font-weight: 300;
    font-size: 18px
}

.yoonaEvent--userBox {
    border: 1px solid #eee;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .05);
    border-radius: 5px;
    padding: 10px
}

.yoonaEvent--userList {
    display: flex;
    justify-content: center
}

.yoonaEvent--userItem {
    text-align: center;
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    padding: 10px 15px 5px;
    line-height: 1.8
}

.yoonaEvent--userItem .avatar {
    border-radius: 999rem;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .05)
}

.yoonaEvent--nav {
    height: 60px;
    line-height: 60px;
    background: #fff;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1;
    box-shadow: 0 2px 7px -3px hsla(0, 0%, 56%, .65)
}

.yoonaEvent--navButtons {
    margin-left: auto
}

.yoonaEvent--navButtons, .yoonaEvent--navList {
    display: flex;
    align-items: center
}

.yoonaEvent--navList .apply--button {
    margin-left: 20px;
    background: linear-gradient(90deg, #ff9000, #ff795a);
    box-shadow: 0 0 10px rgba(246, 191, 90, .34);
    color: #fff;
    border-radius: 999rem;
    padding: 6px 18px;
    line-height: 1.6;
    letter-spacing: .5px;
    font-size: 12px;
    font-weight: 600
}

.yoonaEvent--navList .apply--button:last-child {
    background: linear-gradient(90deg, #f3091a, #ff795a);
    box-shadow: 0 0 10px rgba(255, 0, 0, .22)
}

.yoonaEvent--navList .apply--button.disabled {
    background: #aaa !important;
    box-shadow: none
}

.yoonaEvent--nav .e_title {
    margin-right: 30px;
    font-weight: 500;
    line-height: 58px;
    border-bottom: 2px solid transparent;
    cursor: pointer
}

.yoonaEvent--nav .e_title.is-active {
    color: #ff9000;
    border-color: #ff9000
}

.v-flex {
    display: flex;
    align-items: center
}

.v-flex img {
    margin-left: 4px;
    cursor: pointer
}

.v-hasNote {
    position: relative
}

.v-hasNote:hover .v-note {
    display: block
}

.v-note {
    display: none;
    border: 1px solid #ff8932;
    border-radius: 5px;
    position: absolute;
    padding: 5px;
    background-color: #fff;
    width: 200px;
    font-size: 12px;
    line-height: 1.5;
    top: 24px;
    left: -10px;
    z-index: 1
}

.v-note:before {
    border: 6px solid;
    border-color: transparent transparent #ff8932;
    top: -12px
}

.v-note:after, .v-note:before {
    content: "";
    position: absolute;
    left: 23px
}

.v-note:after {
    border: 6px solid;
    border-color: transparent transparent #fff;
    top: -11px
}

.v-eventButton {
    display: inline-block;
    border-radius: 999rem;
    border: 1px solid #000;
    padding: 5px 15px;
    line-height: 1.4;
    font-size: 12px;
    margin-right: 15px
}

.v-eventButton:hover {
    background-color: #000;
    color: #fff
}

.chat--button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-size: 12px;
    color: #f99b01
}

.chat--button img {
    width: 20px;
    margin-bottom: 3px
}

.v-table {
    display: flex;
    align-items: center
}

.v-tableItem {
    width: 25%;
    padding: 15px 0;
    font-size: 14px;
    line-height: 1.2
}

.v-tableItem:first-child {
    padding-left: 30px
}

.v-tableItem:nth-child(2) {
    width: 25%
}

.v-tableItem:nth-child(3) {
    width: 35%
}

.v-tableItem:nth-child(4) {
    width: 15%
}

.tour_event {
    display: flex;
    font-size: 14px
}

.tour_event ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex
}

.tour_event li {
    margin-left: 36px;
    position: relative
}

.tour_event li:before {
    content: "";
    width: 20px;
    border-top: 1px dashed #aaaeb3;
    position: absolute;
    left: -29px;
    top: 12px
}

.tour_event li:first-child {
    margin-left: 0
}

.tour_event li:first-child:before {
    width: 0
}

.tour_event li p {
    color: rgba(0, 0, 0, .6);
    margin: 0;
    line-height: 1.8
}

.tour_event a {
    display: inline-block;
    border-radius: 1px;
    line-height: 24px;
    background: #aaaeb3;
    color: #fff;
    font-size: 12px;
    width: 80px;
    text-align: center;
    transition: all .2s linear
}

.tour_event .select a {
    background: #f37
}

.v-eventMetaCard {
    display: flex
}

.v-eventMetaCard--action {
    align-items: center;
    display: flex;
    padding-top: 20px
}

.v-eventMetaCard--actionButtons {
    display: flex;
    align-items: center;
    margin-left: auto
}

.v-eventMetaCard--actionButtons .apply--button {
    background: linear-gradient(90deg, #ff9000, #ff795a);
    box-shadow: 0 0 10px rgba(246, 191, 90, .34);
    color: #fff;
    padding: 4px 18px;
    margin-left: 20px;
    line-height: 1.8;
    border-radius: 999rem;
    letter-spacing: .5px;
    font-size: 12px;
    font-weight: 600;
    display: flex
}

.v-eventMetaCard--actionButtons .apply--button:last-child {
    background: linear-gradient(90deg, #f3091a, #ff795a);
    box-shadow: 0 0 10px rgba(255, 0, 0, .22)
}

.v-eventMetaCard--actionButtons .apply--button.disabled {
    background: #aaa;
    box-shadow: none
}

.v-eventMetaCard--actionStream {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.v-eventMetaCard--actionStream img {
    margin-right: 4px;
    transform: translateY(-1px)
}

.v-eventMetaCard--status {
    display: flex;
    align-items: center;
    color: #03b349
}

.v-eventMetaCard--status img {
    width: 20px;
    margin-right: 4px;
    transform: translateY(-1px)
}

.v-eventMetaCard--status__hot {
    color: #d81e06
}

.v-eventMetaCard--status__end {
    color: rgba(0, 0, 0, .44)
}

.v-eventMetaCard--image {
    width: 320px;
    margin-right: 20px;
    flex: 0 0 auto;
    position: relative;
    display: flex
}

.v-eventMetaCard--image .view {
    position: absolute;
    background-color: rgba(0, 0, 0, .8);
    color: #fff;
    border-radius: 999rem;
    right: 10px;
    bottom: 10px;
    padding: 6px 12px;
    line-height: 1.2;
    font-size: 12px
}

.v-eventMetaCard--metaItem {
    font-size: 14px;
    color: rgba(0, 0, 0, .68);
    line-height: 1.4;
    padding: 5px 0;
    display: flex;
    align-items: flex-start
}

.v-eventMetaCard--metaItem .prefix {
    display: flex;
    align-items: center;
    flex: 0 0 auto
}

.v-eventMetaCard--metaItem .prefix img {
    margin-right: 4px;
    transform: translateY(-1px)
}

.v-eventMetaCard--content {
    flex: 1 1 auto
}

.v-eventMetaCard--title {
    font-weight: 900;
    line-height: 1.4;
    margin-bottom: 4px;
    font-size: 20px;
    letter-spacing: .5px
}

.v-eventMetaCard--ticketBoard {
    margin-top: 20px;
    border: 2px solid #ff9000;
    color: rgba(0, 0, 0, .68);
    border-radius: 4px
}

.v-eventMetaCard--ticketBoard .price {
    color: #f37;
    padding-top: 3px
}

.v-eventMetaCard--ticketBoard .original {
    color: #999;
    text-decoration: line-through;
    font-size: 12px
}

.v-eventMetaCard--ticketBoard__header {
    background-color: #ff9000;
    color: #fff
}

.v-eventMetaCard--ticketBoard__item:last-child {
    border-bottom: 0;
    border-radius: 0 0 4px 4px
}

.v-eventMetaCard--ticketBoard__item:nth-child(2n) {
    background-color: #f6f6f6
}

.txt-share-box {
    display: flex;
    align-items: center
}

.txt-share-box img {
    width: 105px;
    margin-right: 18px
}

.txt-share-content-title {
    font-size: 20px;
    margin-bottom: 10px
}

.anchorBL, .BMap_cpyCtr {
    display: none
}

.overlay--content__contact {
    padding: 30px 80px 40px !important
}

.overlay--contactTitle {
    font-weight: 600;
    font-size: 20px
}

.overlay--contactContent {
    display: flex;
    padding-top: 20px
}

.overlay--contactContent img {
    width: 120px;
    margin-right: 50px;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 5px
}

.overlay--contactContent p {
    margin-bottom: 6px;
    color: rgba(0, 0, 0, .7);
    font-size: 16px
}

.overlay--contactContent div {
    text-align: left;
    line-height: 1.4;
    padding-top: 15px
}

.button--close {
    line-height: 1;
    padding: 10px;
    border: 0;
    position: absolute;
    right: 0;
    top: 0;
    background-color: transparent
}

.withLineHeight {
    line-height: 1.8
}

.y-maxWith1200 {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto
}

.y-maxWidth800 {
    width: 800px;
    float: left
}

.y-maxWidth360 {
    float: right;
    width: 360px
}

.y-widegt {
    background-color: #fff;
    border-radius: 3px;
    padding: 20px;
    margin-bottom: 30px
}

.logo-xmas {
    display: flex;
    align-items: center
}

.y-widget-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 15px;
    padding-bottom: 2px;
    padding-top: 1px;
    position: relative
}

.y-widget-title:before {
    height: 1em;
    width: 5px;
    border-radius: 999em;
    content: "";
    display: inline-block;
    background-color: #4370f5;
    vertical-align: -3px;
    margin-right: 4px
}

.starEvent--item {
    margin-bottom: 15px
}

.starEvent--item:last-child {
    margin-bottom: 0
}

.starEvent--title {
    font-size: 18px;
    line-height: 1.4
}

.starEvent--meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .44)
}

.u-backgroundGrayLightest {
    background-color: #f7f7f7
}

.training-detail {
    margin-left: auto;
    margin-right: auto;
    width: 1100px;
    background: #fff;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .05);
    border-radius: 10px;
    transform: translate3d(0, -50%, 0)
}

.training-main {
    padding: 20px 40px 30px
}

.training-main .top-cen {
    color: #666;
    font-size: 16px;
    line-height: 24px;
    display: flex
}

.training-main .top-cen .money {
    display: inline-block;
    font-size: 36px;
    font-weight: 700;
    padding-right: 5px;
    height: 50px;
    line-height: 50px
}

.training-main .top-cen .money small {
    font-size: 22px;
    margin-right: 4px
}

.training-main .top-cen .time-cen {
    position: relative;
    margin-left: auto;
    display: flex;
    align-items: center
}

.training-red {
    color: #ff3221;
    font-weight: 600
}

.count-name {
    float: left;
    color: #666;
    font-size: 16px;
    margin-right: -8px
}

.wrap-label {
    display: flex;
    align-items: center
}

.training-main .wrap-label .label {
    margin-right: 6px;
    padding: 2px 12px;
    border: 1px solid #999;
    border-radius: 13px;
    color: #333;
    font-size: 12px
}

.btn-cen {
    margin-left: auto;
    display: flex;
    align-items: center
}

.btn-cen .note--last {
    font-size: 14px;
    margin-right: 10px
}

.btn-cen .yoonaOnline--linkItem {
    margin-right: 0
}

.btn-cen .yoonaOnline--linkItem.disabled {
    cursor: not-allowed;
    background-color: #ccc;
    border-color: #ccc
}

.training-main .bot-cen {
    display: flex;
    align-items: flex-end
}

.training-main .bot-cen .label {
    font-size: 12px;
    color: #999;
    line-height: 40px
}

.training-main .bot-cen .label.lh18 {
    line-height: 18px
}

.yoonaOpen--banner {
    height: 360px;
    background-size: auto 300px;
    background-position: top
}

.money2 {
    display: inline-block;
    color: #999;
    text-decoration: line-through;
    font-size: 16px;
    position: relative
}

.money2:before {
    content: "原价"
}

.yoonaOpenSidebar--item {
    margin-bottom: 15px
}

.yoonaOpenSidebar--item a {
    display: block;
    position: relative
}

.yoonaOpenSidebar--item a:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .3)
}

.yoonaOpenSidebar--item a img {
    display: block
}

.yoonaOpenSidebar--item a .title {
    position: absolute;
    background: linear-gradient(-135deg, transparent 8px, #fff 0);
    padding: 8px;
    font-size: 14px;
    bottom: 10px;
    left: 10px;
    right: 30px;
    line-height: 1.4
}

.yoonaOnline--header {
    background-color: #fff
}

.y-marginTop30 {
    margin-top: 30px
}

.userNavTab {
    display: flex;
    border-bottom: 1px solid #ddd
}

.userNavTab--item {
    padding: 10px 0;
    margin-right: 15px;
    cursor: pointer
}

.userNavTab--item.current {
    color: #4370f5
}

.userList--empty {
    text-align: center;
    padding: 30px 0;
    font-size: 18px;
    color: rgba(0, 0, 0, .6)
}

.userPost--item {
    padding: 10px 0;
    border-bottom: 1px solid #eee
}

.userPost--item:last-child {
    border-bottom: 0
}

.userPost--item .title {
    font-size: 16px
}

.userPost--item .title:hover {
    color: #4370f5
}

.userPost--item .meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.userPost--item .meta .action {
    cursor: pointer
}

.userPost--item .meta .action:hover {
    color: #4370f5
}

.userComment--item {
    padding: 10px 0;
    border-bottom: 1px solid #eee
}

.userComment--item:last-child {
    border-bottom: 0
}

.userComment--item .title {
    font-size: 16px
}

.userComment--item .content {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.userAnswer--item {
    padding: 10px 0;
    border-bottom: 1px solid #eee
}

.userAnswer--item:last-child {
    border-bottom: 0
}

.userAnswer--item .title {
    font-size: 16px
}

.userAnswer--item .content {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.userSubCard--action {
    margin-left: auto
}

.userSubCard--item {
    border-bottom: 1px solid #eee;
    padding: 20px;
    display: flex;
    align-items: center
}

.userSubCard--item:last-child {
    border-bottom: 0
}

.userSubCard--item .name {
    font-weight: 700;
    line-height: 1
}

.userSubCard--item .des {
    color: rgba(0, 0, 0, .6);
    font-size: 14px;
    line-height: 1.4;
    margin: 12px 0 0
}

.userSubCard--item .content {
    flex: 1 1 auto
}

.userSubCard--item img {
    width: 52px;
    border-radius: 100%;
    margin-right: 10px
}

.user-page-header {
    padding: 50px 0;
    overflow: hidden;
    background-color: #fafafa;
    position: relative;
    background-position: 50%;
    background-size: cover;
    background-image: url(//image.woshipm.com/kan/img/user-center-banner.png)
}

.user-page-header .avatar {
    border-radius: 100%;
    border: 3px solid #fff;
    float: left;
    margin-right: 20px
}

.user-page-header .author-title {
    font-size: 24px;
    color: #fff;
    margin-bottom: 5px;
    margin-top: 15px
}

.user-page-header p {
    font-size: 14px;
    margin-bottom: 5px;
    color: #fff;
    margin-top: 0
}

.user-page-header .button--dingyue {
    background-color: transparent;
    color: #3284f4;
    border: 1px solid #3284f4;
    display: inline-block;
    padding: 0 10px;
    margin-top: 5px;
    font-size: 12px;
    border-radius: 3px;
    opacity: .8;
    line-height: 24px;
    height: 25px
}

.author-page-info {
    float: left;
    width: 50%
}

.setting-page-user-meta {
    float: right;
    padding: 20px;
    color: #fff;
    line-height: 1.8
}

.setting-page-user-meta span {
    display: inline-block;
    text-align: center;
    padding-top: 25px;
    box-sizing: border-box;
    width: 100px;
    height: 100px;
    margin-right: 20px;
    background: url(//image.woshipm.com/kan/img/blue.png) no-repeat 50%;
    font-size: 16px
}

.setting-page-user-meta span i {
    display: block;
    font-style: normal;
    line-height: 1;
    font-size: 14px;
    color: hsla(0, 0%, 100%, .98)
}

.setting-page-user-meta span:nth-child(odd) {
    background-image: url(//image.woshipm.com/kan/img/red.png)
}

.user-message-item {
    padding: 10px 0;
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    border-bottom: 1px solid #eee
}

.list-item {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.user-qes-item {
    background-color: #fff;
    padding: 15px;
    border-bottom: 1px solid #eee
}

.user-qes-item:last-child {
    border-bottom: 0
}

.user-qes-item h2 {
    font-size: 18px;
    margin: 0 0 8px
}

.user-qes-item h2:hover {
    color: #4370f5
}

.user-qes-meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    display: flex;
    align-items: center;
    padding-bottom: 5px
}

.user-qes-meta .avatar {
    border-radius: 100%;
    width: 28px;
    height: 28px;
    margin-left: -10px;
    border: 2px solid #fff
}

.user-qes-meta .meta-right {
    margin-left: auto
}

.user-qes-meta .user-avatars {
    display: flex;
    align-items: center;
    padding-left: 10px;
    margin-right: 6px
}

.hot-qlist-hero {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px
}

.hot-qlist-hero .widget--question--hero {
    width: 49%;
    border-radius: 4px;
    height: 226px
}

.hot-qlist-hero .widget--question--hero:nth-child(2):before {
    background: linear-gradient(269deg, hsla(36, 33%, 56%, .3), hsla(36, 33%, 56%, .7) 50%, #b39a69)
}

.el-backtop {
    border-radius: 4px !important;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .05) !important
}

.page404 {
    text-align: center;
    padding: 100px 0
}

.page404 .img404 {
    width: 150px;
    margin-bottom: 50px
}

.page404--actions {
    padding-bottom: 30px
}

.page404--actions a {
    background-color: #4370f5;
    color: #fff;
    padding: 8px 18px;
    font-size: 14px;
    border-radius: 4px
}

.paginations {
    padding: 30px 0
}

.paginations .page-numbers {
    margin: 10px
}

.userReward--list {
    padding: 15px 0
}

.vava-niubi {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.vava-niubi .btn {
    color: #4370f5
}

.overlay--search {
    position: fixed;
    background-color: #fff;
    left: 0;
    right: 0;
    top: 60px;
    z-index: 8;
    bottom: 0;
    padding: 50px 0
}

.overlay--search .container {
    width: 800px
}

.overlay--search__title {
    font-size: 32px;
    font-weight: 700
}

.overlay--search__input {
    border: 1px solid #ccc;
    width: 100%;
    padding: 10px 20px;
    font-size: 18px;
    border-radius: 4px;
    margin: 10px 0;
    box-sizing: border-box !important
}

.overlay--search__tags {
    padding-top: 10px;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.overlay--search__tag {
    background-color: #f2f2f2;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 14px;
    color: #777;
    margin: 0 10px 10px 0
}

.overlay--search__tag:hover {
    color: #4370f5
}

.overlay--search__recommand {
    padding-top: 40px
}

.search-features {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.search-feature-item {
    width: 32%
}

.search-feature-item h3 {
    margin: 0;
    font-size: 16px
}

.component-fade-enter-active, .component-fade-leave-active {
    transition: .3s ease
}

.component-fade-enter, .component-fade-leave-to {
    transform: translate3d(0, -20px, 0)
}

.overlay, .userList {
    text-align: center
}

.overlay {
    background-color: hsla(0, 0%, 100%, .97);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 14
}

.overlay--sammi {
    width: 300px;
    display: inline-block;
    margin-top: 150px;
    position: relative
}

.overlay--sammi .close-btn-2 {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 24px;
    height: 24px
}

.overlay iframe {
    margin-top: 80px;
    background: #fff;
    border: 0;
    box-shadow: 0 0 4px rgba(0, 0, 0, .3);
    border-radius: 4px
}

.overlay:before {
    content: "";
    height: 100%;
    margin-right: -.25em
}

.overlay-dialog, .overlay:before {
    display: inline-block;
    vertical-align: middle
}

.overlay-dialog {
    max-width: 580px;
    outline: 0 none;
    overflow: hidden;
    padding: 100px 80px;
    position: relative
}

.overlay-dialog .overlayclose-btn {
    color: #aaa !important;
    padding: 5px 10px !important
}

.overlay-dialog .button--signin {
    border-radius: 2px;
    font-size: 16px;
    height: 58px;
    max-width: 456px;
    padding-left: 18px;
    text-align: left;
    width: 100%
}

.overlay-actions .button--link {
    margin-top: -24px
}

.overlay-content {
    color: rgba(0, 0, 0, .6);
    line-height: 1.4;
    margin-bottom: 30px
}

.overlay-content .phone-form p {
    margin-bottom: 14px
}

.overlay-content p {
    font-size: 14px;
    margin-bottom: 0;
    line-height: 1.8;
    margin-top: 0
}

.overlay-title {
    color: rgba(0, 0, 0, .8);
    font-size: 24px;
    line-height: 1.1;
    margin-bottom: 6px
}

.overlay-footer {
    color: #b3b3b1;
    font-size: 12px;
    margin-bottom: 10px;
    margin-top: 50px
}

.overlay--dark {
    background-color: rgba(0, 0, 0, .6)
}

.overlay--dark .button--close {
    color: #fff
}

.overlay--dark .overlay-dialog {
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .44);
    max-width: 520px;
    padding: 0
}

.overlay--dark .overlay-title {
    background-color: #f0f0f0;
    color: rgba(0, 0, 0, .8);
    font-size: 18px;
    margin-bottom: 0;
    padding: 24px;
    margin-top: 0
}

.overlay--dark .overlay-title.title--phone {
    background-color: #fff;
    margin-top: 20px;
    font-weight: 400;
    padding-bottom: 12px
}

.overlay--dark .overlay-content {
    color: rgba(0, 0, 0, .6);
    font-size: 16px;
    margin: 24px 0;
    padding: 0 32px;
    text-align: left
}

.overlay--dark .overlay-actions {
    margin-bottom: 0;
    padding: 0 32px;
    margin-top: 16px
}

.overlay--dark .overlay-actions .button {
    margin: 0 5px
}

.overlay--dark .overlay-footer {
    margin: 0 0 16px
}

.overlay-dialog--email .overlay-content {
    margin-bottom: 0
}

.button--filled {
    background: #292929;
    color: hsla(0, 0%, 100%, .97);
    border-color: #292929
}

.button--filled:hover {
    background-color: #727171;
    border-color: #727171
}

.overlayclose-btn {
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0;
    padding: 5px 15px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 13;
    color: #333;
    background: transparent;
    border: 0;
    cursor: pointer;
    line-height: 1
}

.phone-form {
    text-align: left
}

.phone-form p {
    margin-bottom: 10px
}

.phone-form .user-info-message {
    font-size: 12px;
    color: #c00
}

.phone-form .button--sendMessage {
    border: 1px solid #eee;
    background-color: #f0f0f0;
    color: #999;
    border-radius: 3px;
    font-size: 12px;
    cursor: pointer;
    padding: 0;
    width: 140px;
    box-sizing: border-box;
    height: 36px
}

.phone-form label {
    display: block;
    font-size: 12px;
    color: rgba(0, 0, 0, .44)
}

.phone-form input[type=text] {
    width: 300px;
    padding: 0 10px;
    border: 1px solid #eee;
    background-color: #fff;
    border-radius: 3px;
    height: 36px;
    font-size: 12px;
    box-sizing: border-box
}

.phone-form input[type=text]:focus {
    border-color: #5079b7
}

.phone-form input[type=text].input--creditNum {
    width: 140px;
    margin-right: 18px
}

.phone-form input[type=submit] {
    box-sizing: border-box;
    width: 300px;
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    height: 36px;
    color: #fff;
    border-radius: 3px;
    border: 0;
    background-color: #4370f5
}

.phone-form {
    padding-bottom: 20px
}

.wpd-lay-title {
    width: 100px;
    display: inline-block;
    font-size: 14px
}

.wpd-dialog {
    background-color: #fff;
    border-radius: 5px;
    padding: 40px;
    max-width: 540px;
    display: inline-block;
    position: relative;
    overflow: hidden;
    margin-top: 40px
}

.wpd-dialog .day {
    height: 30px;
    width: auto;
    display: inline-block;
    vertical-align: middle
}

.wpd-input-text {
    font-size: 32px;
    height: auto;
    line-height: 38px
}

.wpd-input-text, .wpd-input-textarea {
    background-color: transparent;
    border: 0
}

.wpd-input-textarea {
    height: 50px;
    margin: 0;
    padding: 0;
    resize: none;
    width: 100%;
    font-size: 14px
}

.wpd-input-item {
    padding: 15px 20px
}

.wpd-input-item.message {
    border-top: 1px solid #eee
}

.wpd-inputs {
    background-color: #f5f5f5;
    border: 1px solid #eee;
    border-radius: 4px;
    color: #999;
    margin-bottom: 15px;
    width: 360px;
    margin-top: 15px
}

.wpd-inputs label {
    display: inline-block;
    float: none;
    margin: 0 10px 0 0;
    padding: 0;
    vertical-align: middle
}

.wpd-payway {
    margin-bottom: 15px
}

.wpd-payway-title {
    font-size: 14px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
    line-height: 1.8;
    color: rgba(0, 0, 0, .6)
}

.wpd-header {
    text-align: center;
    padding-top: 15px
}

.wpd-avatar {
    border-radius: 100%;
    margin-left: 15px;
    height: 64px;
    width: 64px
}

.wpd-title {
    font-size: 16px;
    margin-bottom: 15px
}

.wpd-title:after, .wpd-title:before {
    content: '"'
}

.wpd-btn-close {
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0;
    padding: 5px 15px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 13;
    color: #aaa;
    background-color: #fff;
    border: 0;
    cursor: pointer
}

.wpd-btn-confirm {
    display: inline-block;
    border-radius: 3px;
    background-color: #388ac3;
    padding: 0 25px;
    height: 40px;
    line-height: 39px;
    cursor: pointer;
    font-size: 18px;
    border: 0;
    color: #fff
}

.wpd-overlay-notice {
    font-size: 12px;
    color: #ccc;
    padding-top: 5px
}

.wpd-overlay-body h4 {
    font-weight: 700
}

.overlay-dialog--animate {
    transform-origin: bottom center;
    -webkit-animation: b .3s cubic-bezier(.8, .02, .45, .91) forwards;
    animation: b .3s cubic-bezier(.8, .02, .45, .91) forwards
}

@-webkit-keyframes b {
    0% {
        opacity: 0;
        transform: scale(.8)
    }
    50% {
        opacity: 1
    }
    70%, to {
        transform: scale(1)
    }
}

@keyframes b {
    0% {
        opacity: 0;
        transform: scale(.8)
    }
    50% {
        opacity: 1
    }
    70%, to {
        transform: scale(1)
    }
}

.category-card__left {
    width: 439px
}

.category-card__right {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    width: 431px
}

.category-cardItem {
    display: flex
}

.category-cardItem__D {
    background-color: #fff;
    height: 159px
}

.category-cardItem__D .img {
    width: 200;
    flex: 0 0 auto;
    position: relative
}

.category-cardItem__D .img:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    content: "";
    background-image: linear-gradient(180deg, rgba(0, 0, 0, .05) 5%, rgba(0, 0, 0, .65))
}

.category-cardItem__D .content {
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.category-cardItem__D .content .title {
    line-height: 1.6;
    font-size: 18px;
    font-weight: 700
}

.category-cardItem__D .img {
    display: flex
}

.category-cardItem__D .meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .5)
}

.category-cardItem__S {
    position: relative
}

.category-cardItem__S .img {
    display: flex;
    position: relative
}

.category-cardItem__S .img:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    content: "";
    background-image: linear-gradient(180deg, rgba(0, 0, 0, .05) 5%, rgba(0, 0, 0, .65))
}

.category-cardItem__S .title {
    line-height: 1.6;
    color: #fff;
    position: absolute;
    bottom: 15px;
    left: 20px;
    right: 20px;
    font-weight: 700;
    font-size: 20px
}

.category-card {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px
}

.category--nav {
    background-color: #fff
}

.category--navList {
    justify-content: space-between;
    box-shadow: 0 0 3px rgba(0, 0, 0, .05)
}

.category--navItem {
    font-size: 14px;
    color: rgba(0, 0, 0, .68);
    padding: 15px 0
}

.category--navItem.current {
    color: #4370f5
}

.active--nav {
    background-color: #fff;
    padding: 15px 20px;
    display: flex;
    margin: 20px 0
}

.active--nav span {
    margin-right: 20px;
    font-size: 14px;
    cursor: pointer
}

.active--nav span.active {
    color: #4370f5
}

.active-item {
    border-radius: 4px;
    overflow: hidden;
    width: 32%;
    margin-bottom: 20px
}

.active-item .active--image {
    display: block;
    overflow: hidden
}

.active-item .active--image img {
    display: block;
    transition: .5s
}

.active-item .active--image:hover img {
    transform: scale(1.05)
}

.active-item .content {
    padding: 15px 20px
}

.active-item .post-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 10px;
    font-weight: 400;
    height: 3.2rem;
    overflow: hidden
}

.active-item .post-title:hover {
    color: #4370f5
}

.active-item .iconss {
    position: absolute;
    right: 0;
    top: 10px;
    fill: #4370f5 !important;
    width: 24px;
    height: 24px
}

.active-item .meta {
    position: relative;
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    padding-bottom: 5px
}

.active-item .meta .address, .active-item .meta .date {
    display: flex;
    align-items: center
}

.active-item .meta .address svg, .active-item .meta .date svg {
    margin-right: 4px;
    fill: #666
}

.active-item .meta .event-status {
    position: absolute;
    right: 0;
    top: 8px;
    background-color: #4370f5;
    color: #fff;
    padding: 4px 12px;
    font-size: 14px;
    border-radius: 4px
}

.active-item__narrow {
    width: 24%
}

.active-item__narrow .content {
    padding: 10px 15px
}

.active-item__narrow .post-title {
    font-size: 16px
}

.active-item__narrow .meta .event-status {
    font-size: 12px
}

.active--cardList {
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 20px;
    padding-bottom: 20px
}

.active--cardNav {
    display: flex;
    justify-content: center;
    padding-bottom: 50px
}

.active--title {
    font-weight: 700;
    color: #4370f5;
    margin: 30px 0 10px;
    font-size: 18px;
    display: flex
}

.active--title span {
    border-bottom: 3px solid #4370f5
}

.active--cardList {
    display: flex
}

.event-banner {
    height: 320px;
    position: relative;
    overflow: hidden
}

.event-banner ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.event-banner ul li {
    background-position: 50%;
    background-size: cover;
    height: 320px
}

.event-banner ul li a {
    display: block;
    height: 100%;
    width: 100%
}

.event-banner .hd {
    position: absolute;
    bottom: 10px;
    text-align: center;
    left: 0;
    right: 0
}

.event-banner .hd li {
    display: inline-block;
    border-radius: 100%;
    height: 16px;
    width: 16px;
    cursor: pointer;
    margin: 5px;
    background-color: #fff
}

.event-banner .hd li.on {
    background-color: #4370f5
}

.postFooterInfo {
    padding: 25px
}

.postFooterInfo .avatar {
    border-radius: 100%
}

.authorCard--content {
    position: relative
}

.authorCard--content .button {
    position: absolute;
    right: 0
}

.authorCard--title {
    font-size: 18px;
    color: #4370f5;
    margin-bottom: 5px
}

.authorCard--title .icon {
    margin-left: 4px
}

.authorCard--title .button--follow {
    padding: 6px 12px;
    top: 10px
}

.authorCard--description {
    padding-bottom: 8px;
    color: rgba(0, 0, 0, .6)
}

.authorCard--meta {
    border-top: 1px dashed #eee;
    padding-top: 10px;
    font-size: 14px;
    color: rgba(0, 0, 0, .6);
    line-height: 1.4
}

.article--actions {
    display: flex;
    align-items: center;
    padding-top: 5px
}

.article--actions__right {
    margin-left: auto;
    display: flex;
    align-items: center
}

.article--actions__right .button {
    margin-left: 10px;
    border: 1px solid #4370f5;
    background-color: #fff;
    color: #4370f5;
    border-radius: 999rem;
    padding: 2px 14px;
    transition: .5s
}

.article--actions__right .button.active, .article--actions__right .button:hover, .button--pay {
    background-color: #4370f5;
    color: #fff
}

.button--pay {
    fill: #fff;
    font-size: 14px;
    border: 1px solid #4370f5;
    padding: 4px 22px;
    border-radius: 999rem
}

.donation-list {
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center
}

.donation-item {
    display: flex;
    margin-left: -12px;
    background-color: #fff;
    padding: 3px
}

.donation-item, .donation-item img {
    border-radius: 100%
}

.pay-num {
    margin-left: auto;
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.button--follow {
    background-color: #fff;
    color: #4370f5;
    font-size: 12px;
    padding: 1px 12px;
    border-radius: 999rem;
    line-height: 1.1
}

.button--follow.active, .button--follow:hover {
    color: #fff;
    background-color: #4370f5
}

.support-author {
    text-align: center;
    padding: 20px;
    margin-bottom: 15px
}

.support-author .support-title {
    font-size: 18px;
    margin-bottom: 12px;
    color: rgba(0, 0, 0, .6)
}

.article-topAd {
    background-color: rgba(221, 162, 60, .1);
    border-radius: 4px;
    color: #dda23c;
    margin-bottom: 10px;
    padding: 8px 15px;
    margin-top: 20px;
    font-size: 14px
}

.grap {
    word-break: break-all
}

.grap pre {
    background-color: #f2f4f6;
    padding: 20px
}

.grap ol, .grap ul {
    padding-left: 50px;
    color: rgba(0, 0, 0, .6)
}

.grap ol li {
    margin-bottom: 5px
}

.grap ul {
    list-style: none;
    padding-left: 40px
}

.grap ul li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 5px
}

.grap ul li:before {
    content: "·";
    color: #4370f5;
    margin-right: 6px;
    margin-bottom: 5px;
    font-size: 32px;
    position: absolute;
    left: 0;
    top: -1px;
    line-height: 1
}

.grap h2 {
    font-size: 20px;
    background-image: url(../images/h1.svg);
    padding-left: 25px;
    background-position: 0 7px
}

.grap h2, .grap h3 {
    font-weight: 700;
    margin-top: 30px;
    margin-bottom: 10px;
    line-height: 1.4;
    background-repeat: no-repeat
}

.grap h3 {
    background-image: url(../images/h2.svg);
    padding-left: 15px;
    background-position: 0 6px;
    font-size: 18px;
    color: rgba(0, 0, 0, .68)
}

.grap blockquote {
    background-image: url(../images/b.svg);
    background-repeat: no-repeat;
    background-position: left 30px top 20px;
    background-color: #f8f8f8;
    color: rgba(0, 0, 0, .68);
    margin: 30px 0;
    padding: 40px 30px 20px
}

.grap blockquote p {
    margin: 0 0 10px
}

.grap p {
    margin-bottom: 18px;
    margin-top: 0
}

.grap a {
    text-decoration: underline
}

.grap a:hover {
    color: #4370f5
}

.taglist {
    display: flex;
    padding: 15px 0
}

.taglist a {
    background-color: #f5f5f5;
    font-size: 12px;
    padding: 4px;
    border-radius: 999rem;
    padding-right: 16px;
    display: flex;
    align-items: center;
    line-height: 1.4;
    margin-right: 15px;
    color: #333
}

.taglist a:before {
    content: "#";
    color: #e62828;
    border-radius: 100%;
    background-color: #fff;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    margin-right: 6px;
    font-weight: 700
}

.relatedPosts {
    padding: 25px;
    margin-bottom: 30px
}

.relatedPosts--list {
    display: flex;
    justify-content: space-between
}

.relatedPosts--half {
    width: 49%
}

.relatedPosts--group {
    counter-reset: relate;
    padding: 0;
    margin: 0
}

.relatedPosts--item .title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    transition: color .5s
}

.relatedPosts--item .title:hover {
    color: #4370f5
}

.relatedPosts--item img {
    border-radius: 4px
}

.relatedPosts--item .meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .55)
}

.relatedPosts--item__small {
    display: flex;
    counter-increment: e;
    margin-bottom: 10px
}

.relatedPosts--item__small .content {
    flex: 1 1 auto
}

.relatedPosts--item__small .title {
    font-weight: 700;
    line-height: 1.4;
    transition: color .5s
}

.relatedPosts--item__small .title:hover {
    color: #4370f5
}

.relatedPosts--item__small .meta {
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.relatedPosts--item__small .img {
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border-radius: 4px;
    overflow: hidden
}

.relatedPosts--item__small .img a {
    display: flex
}

.relatedPosts--item__small .img:before {
    content: counter(e);
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
    font-size: 12px;
    background-color: #ff5c00;
    line-height: 1;
    padding: 2px 6px;
    border-radius: 0 0 3px 0
}

.article--wrapper {
    padding: 25px
}

.article--title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0
}

.article--title__page {
    margin-bottom: 15px
}

.artilce--meta2 .button--follow {
    margin-left: 5px
}

.article--meta {
    padding-top: 10px;
    font-size: 14px;
    display: flex;
    align-items: center;
    color: rgba(0, 0, 0, .6)
}

.article--meta a {
    color: #4370f5;
    display: flex;
    align-items: center
}

.article--meta .reading--time {
    margin-left: auto;
    display: flex;
    align-items: center
}

.article--meta .reading--time svg {
    margin-right: 4px
}

.article--meta .avatar {
    border-radius: 100%;
    margin-right: 10px;
    width: 30px;
    height: 30px
}

.article--heroAd {
    display: block;
    overflow: hidden;
    margin-bottom: 20px;
    cursor: pointer
}

.article--heroAd img {
    transition: .5s;
    display: block
}

.article--heroAd:hover img {
    transform: scale(1.05)
}

.cute {
    color: #4370f5
}

.shareMenu--title {
    display: flex;
    align-items: center;
    margin-bottom: 6px
}

.shareMenu--title svg {
    margin-right: 4px
}

.shareMenu a:hover {
    color: #4370f5
}

.PositiveLabelBar-content {
    height: 42px;
    padding: 0 12px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 20px;
    color: #c2a469;
    background-color: hsla(40, 42%, 59%, .08);
    width: 100%;
    display: flex;
    box-sizing: border-box;
    align-items: center;
    margin-bottom: 15px
}

.PositiveLabelBar-content svg {
    margin-right: 5px
}

.PositiveLabelBar-title {
    font-weight: 600
}

audio:not([controls]) {
    display: none;
    height: 0
}

.js-progressBar {
    height: 1px;
    background-color: #eee;
    position: relative
}

.js-progress {
    padding: 10px 0;
    flex: 1 1 auto
}

.js-play-bar {
    height: 1px;
    left: 0;
    top: 0;
    transition: .5s linear
}

.js-play-bar, .js-play-bar:before {
    position: absolute;
    background-color: #000
}

.js-play-bar:before {
    content: "";
    height: 5px;
    width: 5px;
    border-radius: 100%;
    right: -2px;
    top: -2px
}

.jp-play {
    display: block
}

.jp-state-playing .jp-play, .jp-stop {
    display: none
}

.jp-state-playing .jp-stop {
    display: block
}

.jp-controls {
    margin-right: 15px
}

.jp-controls button {
    border: 1px solid rgba(0, 0, 0, .84);
    border-radius: 3px;
    background-color: #fff;
    height: 42px;
    width: 42px;
    text-align: center;
    line-height: 12px
}

.jp-controls button svg {
    fill: rgba(0, 0, 0, .84)
}

.jp-interface {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 12px;
    color: rgba(0, 0, 0, .6)
}

.jp-type-single {
    padding: 15px 0
}

.js-player-tap {
    font-size: 12px;
    position: absolute;
    left: 0;
    top: -20px
}

.vava-input {
    background: #fff none repeat scroll 0 0;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    width: 600px;
    font-size: 16px;
    color: #b3b3b1;
    padding: 15px;
    margin-bottom: 15px
}

.vava-label {
    padding-top: 50px;
    font-size: 12px;
    color: #b3b3b1
}

.progress-bar {
    margin-top: 30px;
    height: 3px;
    border-radius: 999em;
    background-color: #5079b7
}

.mce-top-part {
    position: fixed !important;
    left: 0;
    right: 0;
    top: 60px;
    background: hsla(0, 0%, 100%, .5) !important;
    display: flex !important;
    justify-content: center;
    z-index: 4
}

.mce-top-part:before {
    display: none
}

div.mce-toolbar-grp {
    border-bottom: 0 !important;
    background-color: transparent !important
}

.fa-editor-form {
    margin-top: 100px;
    padding: 30px;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .05);
    position: relative
}

.fa-editor-form .progress {
    position: absolute;
    left: -30px;
    right: -30px;
    top: -35px;
    height: 3px
}

.fa-editor-form .progress .bar {
    position: absolute;
    background-color: #4370f5;
    left: 0;
    bottom: 0;
    top: 0
}

.fa-new-psot-title {
    border: 0;
    background-color: transparent;
    padding: 10px 0;
    font-size: 20px;
    width: 100%;
    box-sizing: border-box
}

.wp-editor-wrap {
    border-top: 1px solid #eee;
    margin-top: 10px
}

.mce-panel, .wp-editor-container {
    border: 0 !important;
    box-shadow: none !important
}

.writing-column {
    width: 760px
}

.writing-action {
    position: fixed;
    border-top: 1px solid #eee;
    bottom: 0;
    padding: 30px 0;
    background-color: #fff;
    width: 700px;
    display: flex
}

.writing-action .button {
    margin-right: 12px
}

.writing-action .button--preview {
    background-color: #fff;
    color: #4370f5;
    margin-left: auto
}

.writing--copyright {
    padding-bottom: 100px;
    font-size: 14px;
    color: rgba(0, 0, 0, .6)
}

.writing--copyright a {
    color: #4370f5
}

.writing--copyright p {
    margin-bottom: 5px;
    margin-top: 0
}

.card--tags {
    display: flex;
    padding-top: 10px
}

.card--tag {
    border: 1px solid #4370f5;
    color: #4370f5;
    font-size: 12px;
    border-radius: 999rem;
    padding: 1px 12px
}

.card--list {
    padding-top: 50px
}

.card--status {
    border-radius: 5px;
    padding: 30px;
    margin-bottom: 30px;
    border: 1px solid rgba(0, 0, 0, .05);
    background-color: #fff
}

.card--status:last-child {
    margin-bottom: 0
}

.card--status__header {
    display: flex;
    align-items: center;
    color: rgba(0, 0, 0, .5);
    font-size: 12px
}

.card--status__header .avatar {
    border-radius: 999rem;
    margin-right: 10px;
    width: 36px
}

.card--status__header .dark {
    color: rgba(0, 0, 0, .86)
}

.card--status__content {
    font-size: 14px;
    white-space: pre-wrap;
    padding-top: 10px
}

.card--status__footer {
    font-size: 14px;
    color: rgba(0, 0, 0, .5);
    display: flex;
    padding-top: 10px
}

.card--status__footer .action {
    cursor: pointer
}

.card--status__footer a:hover {
    color: #4370f5
}

.card--statusImage--list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 400px;
    padding-top: 10px
}

.card--statusImage--thumb {
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 5px
}

.card--comments {
    padding-top: 20px;
    border-top: 1px solid #ddd;
    margin-top: 10px;
    font-size: 14px
}

.card--comments .list {
    padding-top: 10px
}

.card--comments .list .item {
    border-bottom: 1px dotted #ddd;
    position: relative;
    padding: 10px 0
}

.card--comments .list .item .r {
    position: absolute;
    right: 0;
    top: 8px;
    cursor: pointer;
    font-size: 12px;
    color: rgba(0, 0, 0, .6)
}

.card--comments .list .item .r:hover {
    color: #4370f5
}

.card--comments .list .item:last-child {
    border-bottom: 0
}

.card--comments .list .item .avatar {
    width: 24px;
    border-radius: 100%
}

.card--comments .list .item .content {
    padding: 10px 0
}

.card--comments .list .item .header {
    display: flex;
    align-items: center;
    font-size: 12px
}

.card--comments .list .item .header .avatar {
    margin-right: 6px
}

.subreply {
    padding: 10px 0 10px 30px
}

.subreply .subreplyitem {
    padding: 10px 0;
    position: relative
}

.subreply .subreplyitem:last-child {
    border-bottom: 0
}

.card--commentAction {
    text-align: right;
    padding-top: 6px
}

.viewNav {
    background-color: #fff;
    position: fixed;
    width: 110px;
    top: 110px;
    padding: 10px;
    box-sizing: border-box;
    margin-left: -130px
}

.viewNav--item {
    display: block;
    text-align: center;
    cursor: pointer;
    font-size: 14px;
    padding: 4px;
    border-radius: 5px;
    margin-bottom: 5px
}

.viewNav--item.current {
    background-color: #4370f5;
    color: #fff
}

.viewNav--item:hover {
    background-color: hsla(0, 0%, 95%, .6);
    color: #4370f5
}

.viewNav--item:last-child {
    margin-bottom: 0
}

.viewContainer {
    position: relative;
    width: 640px;
    margin: 0 auto
}

.card--form {
    background-color: #fff;
    padding: 20px;
    margin-bottom: 30px;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 5px
}

@media (max-width: 600px) {
    .viewNav {
        display: none
    }

    .card--list {
        width: auto;
        margin-left: 0
    }

    .header-nav, .pm--metabar__right, .site-footer {
        display: none
    }
}

.card--formAction {
    display: flex;
    align-items: center;
    padding-top: 10px
}

.card--formAction .el-upload--text, .card--formAction .tag {
    font-size: 14px;
    color: #4370f5
}

.card--formAction .el-upload--text .fa, .card--formAction .tag .fa {
    margin-right: 5px
}

.card--formAction .tag {
    margin-left: 10px
}

.card--formAction .el-button {
    margin-left: auto
}

.card--formTag {
    display: flex;
    align-items: center;
    padding-left: 15px;
    padding-bottom: 15px
}

.card--formTag .item {
    border: 1px solid #4370f5;
    color: #4370f5;
    border-radius: 999rem;
    padding: 2px 14px;
    font-size: 14px;
    line-height: 1.2
}

.card--formEditor {
    margin-top: 10px;
    padding-top: 10px;
    border: 1px solid #ddd;
    border-radius: 5px
}

.card--formEditor .el-textarea__inner {
    border: 0;
    resize: none
}

.card--formEditor.disabled {
    background-color: #f5f7fa
}

.card--formImages {
    padding: 15px 15px 0
}

.card--formImage {
    margin: 0 5px 5px 0;
    border-radius: 5px
}

.textareaPlace {
    background-color: #f5f7fa;
    color: #c0c4cc;
    height: 94px;
    padding: 5px 15px
}

.textareaPlace a {
    color: #4370f5
}

.multiple-img-wrapper {
    padding-top: 10px;
    display: flex;
    flex-wrap: wrap
}

.multiple-img-wrapper img {
    display: block
}

.multiple-img-wrapper.col-3 {
    width: 300px
}

.multiple-img-wrapper.col-3 .multiple-img-container {
    margin-bottom: 2%;
    width: 32%;
    margin-right: 2%
}

.multiple-img-wrapper.col-3 .multiple-img-container:nth-child(3n) {
    margin-right: 0
}

.multiple-img-wrapper.col-4 {
    width: 200px
}

.multiple-img-wrapper.col-4 .multiple-img-container {
    margin-bottom: 2%;
    width: 49%;
    margin-right: 2%
}

.multiple-img-wrapper.col-4 .multiple-img-container:nth-child(2n) {
    margin-right: 0
}

.detail-img-wrapper {
    position: relative
}

.detail-img-wrapper .toggle-zoomout {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    cursor: zoom-out;
    z-index: 5
}

.detail-img-wrapper .next-img {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 30%;
    cursor: url(../images/cursor-right.cur), auto;
    z-index: 6
}

.detail-img-wrapper .prev-img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 30%;
    cursor: url(../images/cursor-left.cur), auto;
    z-index: 6
}

.top-panel {
    background-color: #f4f5f7;
    font-size: 12px;
    padding: 2px 10px;
    display: none
}

.small-img-container {
    width: 45px;
    height: 45px;
    background-size: cover;
    border: 2px solid transparent;
    padding: 1px;
    margin-right: 2px;
    opacity: .7
}

.small-img-container.small-img-active, .small-img-container:hover {
    border-color: #4370f5;
    opacity: 1
}

.small-img-wrapper {
    display: flex
}

.b-thumb {
    cursor: zoom-in
}

.ad-uploader .el-upload {
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    width: 600px;
    border: 1px solid #ddd
}

.wpd-payItem {
    display: flex;
    justify-content: space-between
}

.pay-way {
    display: flex;
    justify-content: center
}

.pay-way .demo--label {
    margin: 5px
}