@media screen and (min-width: 768px) {
    .mobile-header {
        display: none
    }

    .foot {
        display: block
    }

    .mobile-footer {
        display: none
    }

    .tool3 img.tool3-moblie {
        display: none
    }

    .tool3 img.tool3-pc {
        display: inline-block
    }

    .tool4 img.tool4-moblie {
        display: none
    }

    .tool4 img.tool4-pc {
        display: inline-block
    }

    .tool6 .tool6-content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .tool6 .tool6-mobile-tip {
        display: none
    }
}

@media screen and (max-width: 767px) {
    .container {
        width: 100%;
        padding: 0 15px;
        margin: 45px 0;
    }

    .indexPage {
        padding-top: 30px
    }

    .indexColl>div.container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .indexColl>div.container .indexPage-left {
        width: 100%
    }

    .indexColl>div.container .indexPage-right {
        padding-left: 0
    }

    .foot {
        display: none
    }

    .mobile-footer {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        background-color: #16C040;
        color: #FFF;
        padding: 30px;
        text-align: center
    }

    .mobile-footer>div {
        margin-bottom: 10px
    }

    .mobile-footer .mobile-footer-tel {
        font-size: 18px
    }

    .mobile-footer .mobile-footer-time {
        font-size: 12px;
        line-height: 1.5
    }

    .mobile-footer .mobile-footer-copyright span,
    .mobile-footer .mobile-footer-copyright a {
        font-size: 12px;
        line-height: 1.5
    }

    .header {
        display: none
    }

    .mobile-header {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        z-index: 10000;
        background-color: #16C040;
        height: 50px;
        color: #FFF
    }

    .mobile-nav-btn {
        width: 50px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        cursor: pointer
    }

    .mobile-nav-btn .icon {
        font-size: 22px
    }

    .mobile-nav-logo {
        margin: 0 auto
    }

    .mobile-nav-logo a {
        display: block;
        width: 79px;
        height: 22px
    }

    .mobile-nav-logo a img {
        width: 79px;
        height: 22px
    }

    .mobile-nav-search {
        width: 50px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .moblie-nav {
        position: fixed;
        top: 44px;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: auto;
        display: none
    }

    .moblie-nav .mobile-nav-wrapper {
        position: relative;
        padding: 0 20px;
        background-color: #333;
        -webkit-transition: height .2s ease-in-out;
        -o-transition: height .2s ease-in-out;
        transition: height .2s ease-in-out
    }

    .moblie-nav .mobile-nav-mask {
        position: absolute;
        height: 100%;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.3)
    }

    .moblie-nav .mobile-nav-item {
        display: block;
        border-bottom: 1px solid #3d3d3d;
        text-align: left;
        line-height: 50px
    }

    .moblie-nav .mobile-nav-item .mobile-nav-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        font-weight: bold
    }

    .moblie-nav .mobile-nav-item .mobile-nav-head span {
        font-size: 20px
    }

    .moblie-nav .mobile-nav-item .mobile-subNav {
        background-color: #404040;
        padding-left: 20px;
        display: none
    }

    .moblie-nav .mobile-nav-item .mobile-subNav a {
        display: block;
        font-weight: normal;
        border-bottom: 1px solid #515050
    }

    .moblie-nav .mobile-nav-item .mobile-subNav a:last-child {
        border-bottom: none
    }

    .moblie-nav .mobile-nav-item.active {
        color: #286efa;
        font-weight: bold
    }

    .moblie-nav.active {
        display: block
    }

    .pageBanner {
        height: auto
    }

    .pageBanner-container {
        margin-top: 50px
    }

    .banner .swiper-slide {
        height: auto;
        padding-top: 0
    }

    .banner .slide-img {
        width: 100%;
        height: auto
    }

    .articelBanner .swiper-slide {
        height: 200px
    }

    .articelBanner .slide-img {
        width: 100%;
        height: 100%
    }

    .indexUser {
        display: none
    }

    .index-article {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .index-article .index-article-item {
        width: 100%;
        margin-bottom: 15px
    }

    .list-item {
        width: 48%;
        margin-right: 4%;
        padding-right: 0;
        margin-bottom: 15px
    }

    .list-item:nth-child(2n) {
        padding-left: 0;
        padding-right: 0;
        margin-right: 0
    }

    .list-thumb {
        width: 100%;
        height: auto
    }

    .list-thumb a,
    .list-thumb img {
        width: 100%;
        height: auto
    }

    .videoList .list-thumb {
        width: 100%;
        height: auto
    }

    .videoList .list-thumb a,
    .videoList .list-thumb img {
        width: 100%;
        height: auto
    }

    .list-desc {
        padding: 0 5px
    }

    .list-item-author {
        max-width: 60px;
        margin-right: 5px
    }

    .list-item-renzheng {
        margin-right: 5px
    }

    .index-topic {
        overflow-y: hidden;
        overflow-x: auto
    }

    .creator-container .creator-button-prev,
    .creator-container .creator-button-next {
        display: none
    }

    .indexAdvertise {
        display: none
    }

    .indexPage60 .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .indexPage60 .indexPage-right {
        padding-left: 0
    }

    .indexPage60 .indexPage-left {
        width: 100%;
        height: auto;
        padding-top: 30px;
        padding-right: 0;
        border-right: none;
        margin-bottom: 30px
    }

    .index-talk-list .index-talk-item {
        width: 100%
    }

    .post-list .post-list-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .post-list .post-list-img {
        width: 100%;
        margin-bottom: 20px
    }

    .post-list .post-list-img .post-list-thumb {
        width: 100%;
        height: auto
    }

    .post-list .post-list-info {
        margin-left: 0
    }

    .post-list .post-list-remark {
        margin-bottom: 15px
    }

    .post-list .post-list-author {
        position: static;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .post-list .post-list-author .post-list-user i.icon {
        display: none
    }

    .post-list .post-list-author .post-list-view>div {
        margin-left: 10px
    }

    .post-list .post-list-author .post-list-view>div:first-child {
        margin-left: 0
    }

    .post-list .post-list-title .post-list-time {
        display: none
    }

    .searchBox {
        width: 100%;
        padding-top: 50px;
        padding-left: 15px;
        padding-right: 15px
    }

    .searchTab {
        margin-bottom: 15px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .searchTab .searchTab-item {
        margin-right: 25px
    }

    .searchTab .searchTab-item.active {
        margin-right: 25px
    }

    .searchHistory {
        margin-top: 50px
    }

    .searchForm .searchButton {
        width: 80px
    }

    .searchPage,
    .searchResult {
        padding-top: 50px
    }

    .searchResult .filterBar-filtrate {
        display: none
    }

    .searchResult .filterBar-nav {
        width: 100%
    }

    .searchResult .filterBar-nav .filterBar-nav-item {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin-right: 0
    }

    .searchResult-form {
        padding-right: 15px;
        padding-left: 15px
    }

    .searchResult-form .searchResult-input {
        width: auto;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

    .searchResult .resultContainer {
        min-height: auto
    }

    .layui-laypage .layui-laypage-skip {
        display: none
    }

    .layui-laypage-QJ {
        padding: 30px 0
    }

    .searchResult-keywords .searchResult-keywords-item {
        width: 80px;
        height: 26px
    }

    .index-creator {
        height: auto
    }

    .index-creator .index-creator-item {
        padding: 15px
    }

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

    .index-creator .creator-avatar img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

    .index-creator .creator-info {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 0%;
        flex: 1 1 0%;
        width: auto
    }

    .index-creator .creator-info .creator-i3 {
        width: 100%
    }

    .creatorList .index-creator-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto;
        padding: 15px
    }

    .creatorList .index-creator-item .left-content {
        width: 100%;
        margin-bottom: 15px
    }

    .creatorList .creator-info {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

    .creatorList .creator-info .creator-i3 {
        display: none
    }

    .creatorList .creator-avatar {
        width: 50px;
        height: 50px
    }

    .creatorList .creator-avatar img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

    .creatorList .creatorProduct {
        width: 100%;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .creatorList .creatorProduct .creatorProduct-item {
        width: 32%;
        height: auto;
        margin-left: 2%
    }

    .creatorList .creatorProduct .creatorProduct-item:first-child {
        margin-left: 0
    }

    .filterBar-filtrate {
        margin-right: -15px
    }

    .filterBar-filtrate .filterBar-filtrate-item {
        display: none
    }

    .filterBar-filtrate .filterBar-filtrate-item:last-child {
        display: block
    }

    .channelSelect {
        width: 100vw
    }

    .product-container {
        height: 50px
    }

    .pageBox {
        padding-top: 50px;
        overflow-x: hidden
    }

    .videoShow {
        height: 320px;
        min-width: auto
    }

    .videoShow .video-box {
        height: 320px
    }

    .videoShow .video-box-inner {
        width: 100%
    }

    .videoShow .videoShow-bg {
        display: none
    }

    .videoContent {
        width: 100%
    }

    .videoContent>div {
        padding: 0 15px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .videoContent .videoRecommend {
        display: none
    }

    .videoContent .videoContent-right {
        width: 100%;
        margin-left: 0
    }

    .videoContent .videoContent-left {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin-bottom: 30px
    }

    .videoContent .videoContent-title {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .videoContent .videoContent-title .videoContent-title-tit {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        width: 100%
    }

    .videoContent .videoContent-title .videoContent-title-tit h1 {
        font-size: 24px;
        max-width: none;
        line-height: 1.5;
        width: 80%
    }

    .videoContent .videoContent-title .play-share,
    .videoContent .videoContent-title .play-report {
        display: none
    }

    .videoContent .videoContent-title .videoContent-like {
        margin-left: -35px
    }

    .VW-tabcontent .VW-tabcontent-item>div.block-flow-layout {
        padding-left: 0 !important
    }

    .VW-tabcontent .picture-list {
        width: 50%;
        margin-right: 0;
        padding: 0 5px
    }

    .VW-tabcontent .picture-list .picture-list-thumb {
        width: 100%;
        height: auto
    }

    .articleTag .articleTag-item {
        height: 29px;
        padding: 5px 10px;
        margin-top: 10px;
        margin-right: 20px;
        margin-bottom: 10px;
        border-radius: 100px;
        border: 1px solid #d8d8d8;
        line-height: 17px;
        color: #767676;
        font-size: 12px;
        text-align: center
    }

    .postDetail {
        padding-bottom: 40px
    }

    .postDetail .layui-breadcrumb {
        height: auto
    }

    .postContent {
        padding: 10px;
        border: none
    }

    .postLike {
        padding-top: 30px
    }

    .otherPost {
        padding: 10px;
        border: none
    }

    .otherPost .otherPost-list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .otherPost .otherPost-list .otherPost-item {
        margin-right: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%
    }

    .otherPost .otherPost-list .otherPost-item a {
        display: block;
        width: 100%
    }

    .otherPost .otherPost-list .otherPost-item p {
        width: 100%
    }

    .otherPost .otherPost-list .otherPost-item img {
        width: 100%;
        height: auto
    }

    .comment {
        padding: 10px;
        border: none
    }

    .addComment {
        display: none
    }

    .commentItem .commentItem-head .commentItem-info .commentOption .del,
    .commentItem .commentItem-head .commentItem-info .commentOption .replayBtn {
        display: none
    }

    .commentItem .commentItem-head .commentItem-info .commentOption .likeCount {
        border-right: none
    }

    .live1 {
        height: 300px
    }

    .live1 p {
        font-size: 13px
    }

    .live1 h1 {
        font-size: 30px;
        line-height: 150%;
        text-align: center;
        padding-bottom: 10px;
        padding-left: 30px;
        padding-right: 30px
    }

    .live1 .block-horizontal-layout {
        display: none
    }

    .live2 {
        display: none
    }

    .live3 {
        padding: 60px 0;
        overflow: hidden
    }

    .live3 .live3-title h2 {
        font-size: 24px;
        padding-bottom: 10px
    }

    .live3 .live3-title p {
        font-size: 13px;
        line-height: 180%;
        padding: 0 20px 40px
    }

    .live3 .live3-list {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .live3 .live3-list .live3-item .live-icon {
        width: 70px;
        height: 70px
    }

    .liveItem {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        margin-top: 40px;
        padding: 0 20px
    }

    .liveItem .live-content {
        width: 100%;
        margin-right: 0
    }

    .liveItem .live-content h2 {
        font-size: 24px;
        text-align: center
    }

    .liveItem .live-img {
        width: 100%;
        margin: 30px 0 60px
    }

    .liveItem .live-img img {
        width: 100%;
        height: auto
    }

    .live5 .live-img,
    .live7 .live-img {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    .live5 .live-content,
    .live7 .live-content {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }

    .live8 {
        padding: 40px 0
    }

    .live8 h2 {
        font-size: 24px;
        padding-bottom: 20px
    }

    .live8 .live8-list {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 0 20px
    }

    .live8 .live8-list .live8-item {
        width: 100%
    }

    .live8 .live8-list .live8-item .live8-thumb {
        width: 100%;
        height: auto
    }

    .live8 .live8-list .live8-item .live8-thumb img {
        width: 100%;
        height: auto
    }

    .live8 .live8-list .live8-item .live8-thumb a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        line-height: 1;
        width: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .liveDetail-header {
        padding-bottom: 0;
        padding-top: 0
    }

    .liveDetail-header .title {
        display: none;
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0 20px
    }

    .liveDetail-header .title h2 {
        margin-bottom: 15px
    }

    .liveDetail-player {
        width: 100%;
        height: 300px;
        margin-top: 0
    }

    .liveDetail-article {
        width: calc(100% - 40px);
        margin: 20px
    }

    .liveDetail-article .liveDetail-article-body {
        padding: 40px 20px;
        line-height: 1.5
    }

    .liveDetail-article .liveDetail-article-body img {
        max-width: 100%;
        margin: 0 auto
    }

    .liveDetail-footer {
        line-height: 1.5
    }

    .guide {
        overflow-x: hidden
    }

    .guide-banner {
        height: 300px;
        margin-top: 50px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .guide-banner .guide-banner-text {
        width: 100%;
        height: 100%
    }

    .guide-banner .guide-banner-text h2 {
        font-size: 30px;
        line-height: 150%;
        text-align: center;
        padding-bottom: 10px;
        padding-left: 30px;
        padding-right: 30px;
        margin-bottom: 0
    }

    .guide-banner .guide-banner-text p {
        font-size: 13px;
        margin-top: 10px
    }

    .guide-banner .guide-banner-text .live-btn {
        display: none
    }

    .guide-banner .guide-banner-img {
        position: static;
        width: 100%;
        bottom: 0;
        left: 0;
        margin-left: auto;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    .guide-intro {
        padding-top: 60px
    }

    .guide-list .guide-list-item .texts h2 {
        font-size: 16px
    }

    .guide-list .guide-list-item .texts p {
        font-size: 14px;
        -webkit-line-clamp: 5;
        height: auto
    }

    .steps {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: auto
    }

    .steps .steps-item {
        width: 100%;
        padding: 0;
        margin-bottom: 10px
    }

    .steps .steps-item .steps-item-inner {
        overflow: hidden
    }

    .steps .steps-item .steps-item-inner img {
        width: 100px;
        max-width: none;
        float: left
    }

    .steps .steps-item .steps-item-inner .texts {
        padding: 10px;
        float: right;
        width: calc(100% - 100px)
    }

    .tool-btn {
        display: none
    }

    .tool1 {
        height: 300px
    }

    .vr-tool-editor {
        display: none
    }

    .tool1 .tool1-bg {
        height: 300px
    }

    .tool1 .tool1-content .tool1-content-1 h2 {
        font-size: 30px;
        line-height: 150%;
        text-align: center;
        padding-bottom: 10px;
        padding-left: 30px;
        padding-right: 30px
    }

    .tool1 .tool1-content .tool1-content-1 p {
        font-size: 13px;
        margin-top: 10px
    }

    .tool1 .tool1-content .tool1-content-1 .tool-btn-box {
        display: none
    }

    .tool2-advance {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .tool2-adv-item {
        -webkit-box-flex: 1;
        -ms-flex: auto;
        flex: auto;
        width: 50%;
        padding: 20px
    }

    .tool1 .tool1-bg-1 {
        height: 248px;
        padding-top: 0
    }

    .tool1 .tool1-bg-2 {
        height: 100%;
        width: 100%;
        padding-left: 5%;
        padding-right: 5%;
        padding-top: 0;
        background-size: contain;
        background: none
    }

    .tool1 .tool1-video {
        width: 100%;
        height: auto;
        padding: 10px;
        border-radius: 10px;
        -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
        background: url(../image/tool1-3.png) no-repeat center top
    }

    .tool2 {
        width: 100%;
        padding: 50px 15px
    }

    .tool2-video {
        width: 90%;
        height: 203px;
        left: 50%;
        padding: 10px;
        background-color: #000;
        border-radius: 10px;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .tool2-content {
        padding: 0 20px
    }

    .tool2-tabnav .tool2-tabnav-item {
        font-size: 14px;
        margin: 0;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        text-align: center
    }

    .tool2-tabcontent .tool2-btn {
        margin-bottom: 10px
    }

    .tool3 {
        padding-top: 50px;
        padding-left: 15px;
        padding-right: 15px
    }

    .tool3 img {
        width: 100%
    }

    .tool3 img.tool3-moblie {
        display: inline-block
    }

    .tool3 img.tool3-pc {
        display: none
    }

    .tool3 .tool3-content {
        padding: 20px 0
    }

    .tool-title {
        font-size: 30px;
        margin-bottom: 30px
    }

    .tool-sub-tilte {
        font-size: 20px
    }

    .tool-vrEditor .item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .tool-vrEditor .item .thumb {
        width: 100%;
        height: auto
    }

    .tool-vrEditor .item .thumb img {
        height: auto
    }

    .tool-vrEditor .item .content {
        padding-left: 0;
        width: 100%
    }

    .tool4 img {
        width: 100%
    }

    .tool4 img.tool4-moblie {
        display: inline-block
    }

    .tool4 img.tool4-pc {
        display: none
    }

    .tool5 {
        display: none
    }

    .tool6 {
        background: -o-radial-gradient(300px 100px at 49% 0, #4e566c 20%, #222 96%);
        background: radial-gradient(300px 100px at 49% 0, #4e566c 20%, #222 96%)
    }

    .tool6 .tool6-content {
        display: none
    }

    .tool6 .tool6-mobile-tip {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100%;
        height: 152px
    }

    .tool6 .tool6-mobile-tip span {
        background-color: #286efa;
        border-color: #286efa;
        height: 44px;
        line-height: 44px;
        padding: 0 15px;
        text-align: center;
        color: #fff;
        font-weight: bolder;
        display: inline-block;
        border-radius: 3px
    }

    .pageCover {
        height: 0;
        padding-top: 50px
    }

    .author-right-btn-2 {
        display: none
    }

    .pc-filterBar {
        display: none
    }

    .m-filterBar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .personal-filterbar {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

    .personal-filterbar .filterBar-nav-item {
        margin-right: 15px
    }

    .author-right-btn {
        margin-left: 0
    }

    .author {
        padding-top: 50px
    }

    .authorBanner {
        background-position: center
    }

    .authorBanner .authorBanner-title {
        height: 300px
    }

    .authorBanner .authorBanner-title span {
        font-size: 30px
    }

    .authorBlock-item {
        padding-top: 40px
    }

    .authorBlock-item dd {
        line-height: 1.5;
        padding-top: 15px
    }

    .authorButton {
        text-align: center
    }

    .authorButton a {
        width: 90%;
        margin: 0 auto
    }

    .platformSidebar {
        right: 10px
    }

    .vipTop {
        height: 300px
    }

    .vipPage .vip1 .vip1-solgan h2 {
        font-size: 30px;
        line-height: 150%;
        text-align: center;
        padding-bottom: 10px;
        padding-left: 30px;
        padding-right: 30px
    }

    .vipPage .vip1 .pano-button {
        display: none
    }

    .vipPage .vip1 .vip1-solgan p {
        font-size: 13px
    }

    .vipPage .vipContainer {
        margin-top: 0;
        width: 100%;
        padding-left: 20px;
        padding-right: 20px
    }

    .vipPage .vip2 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .vip2-column {
        width: 100%
    }

    .vip2-column .detail {
        display: block;
        width: 100%;
        height: 80%;
        position: fixed;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 99999;
        overflow-x: hidden;
        overflow-y: scroll;
        -webkit-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out
    }

    .vip2-column .detail.active {
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .vip2-column .vip2-board {
        margin-bottom: 20px
    }

    .vip2-column .vip2-board .board-btn {
        display: none
    }

    .vip2-column .checkDetail {
        display: block
    }

    .vip2-column .detailTitle {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .vipPage .vip3 {
        display: none
    }

    .vip4 .vip4-item .vip4-item-title span {
        line-height: 1.7;
        padding-right: 10px
    }

    .vip4 .vip4-item .vip4-item-title {
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px
    }

    .vip4 .vip4-item .vip4-item-content {
        line-height: 1.7
    }
}

body.vipActive {
    overflow: hidden
}

.mobile .uPersonal .uPersonal-info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0;
    height: auto
}

.mobile .uPersonal .uPersonal-scroll {
    height: 210px
}

.mobile .uPersonal .uPersonal-code,
.uPersonal .uPersonal-info-right h2 {
    display: none
}

.mobile .uPersonal .uPersonal-info-left {
    background-color: #f8f8f8;
    text-align: center;
    padding-top: 22px;
    padding-bottom: 22px;
    height: auto
}

.mobile .uPersonal .uPersonal-info-right {
    width: 100%;
    color: #7a7a7a;
    padding: 20px;
    line-height: 180%
}

.mobile .uPersonal .uPersonal-info-right .uPersonal-info-item {
    border-bottom: none;
    padding: 0;
    line-height: 1.5
}

.mobile .uPersonal .uPersonal-vip,
.uPersonal .uPersonal-nickname {
    display: inline-block
}