@font-face {
    font-family: "ScalaOT Regular";
    src: url("../fonts/ScalaOT-Regular.otf");
}

body,
.article .article_content .article_right, .article .article_content .article_right p{
    font-family: ScalaOT Regular !important;
    overflow-x: hidden;
}
.article_section{
    margin-top: 0;
}
.article_left{
    z-index: 3;
    position: fixed;
}



.article_right img + *{
    width: 600px;
}

@media screen and (min-width: 1600px) {
    .article_right center{
        display: block;
    }
    /* desc img */
    .article_right center +p{
        margin-left: calc((620px - 1600px)/2)!important;
    }
    .article .article_content .article_right, .article .article_content .article_right p{
        font-size: 20px;
    }
    .article_right center>*{
        width: 1600px!important;
        margin-left: calc((600px - 1600px)/2)!important;
        cursor: unset!important;
    }

    .article_right>center:nth-of-type(1){
        /*width: 100vw!important;*/
        margin-left: 0!important;
    }
    .article_right>center:nth-of-type(1)>*{
        width: 100vw!important;
        max-width: 2600px!important;
        margin-left: 0!important;
    }
    .article_right>center:nth-of-type(1) +p{
        margin-left: calc((620px - 100vw)/2)!important;
    }

}

@media screen and (min-width: 900px) {

    .article,
    .article .article_right{
        width: 100%;
        margin: 0 auto;
        line-height: 30px!important;
    }
    /*.article>*:not(.article_content){*/
    /*    width: 1170px;*/
    /*    margin: 0 auto;*/
    /*}*/

    .article_right>center:nth-of-type(1){
        position: absolute;
        top: 0;
        max-height: 100vh;
        overflow: hidden;
        max-width: 2600px!important;
        margin-left: 0;
        left: 0;
        display: flex;
        align-items: center;
    }

    .article .picture{
        position: absolute;
    }


    .article_section,
    #article_header{
        width: 100%;
    }
    .article_right {
        width: 100%;
        /*padding: 0 340px 0;*/
        padding:0 calc((100% - 600px)/2) 0;
    }
    .article_right center>*{
        width: 100vw!important;
        max-width: 1600px!important;
        height: auto;
        /*margin-left: calc(-50vw + 300px);*/
        margin-left: calc((600px - 100vw)/2);

    }
    .article_right center>.shu-img{
        margin-left: 0!important;
        width: 600px!important;
    }
    .article_right p.shu-desc{
        margin-left:  0!important;

    }
    .article_right>center:nth-of-type(1)>*{
        width: 100vw!important;
        max-width: 2600px!important;
        margin-left: 0!important;
    }

    .article_right video{
        margin-left: 0;
        width: 600px!important;
    }
    .article_right .small-video-p{
        margin-left: 0!important;
    }


    #article_header .row{
        width: 1170px;
        margin: 0 auto;
    }
    .article .dsq-brlink,
    .article .article_footer,
    .article .most_view_section,
    .article .related_section {
        display: block;
        width: 600px;
        margin: 0 auto;
    }
    /* MOST VIEWED */
    .article .footer_most_view .most_view_left, .article .footer_most_view .most_view_right {
        flex: 290px 0 0;
    }
    .article .footer_most_view .most_view_left {
        margin-right: 10px;
    }
    .article_top{
        position: absolute;
        z-index: 1;
        width: 750px!important;
        left: 50%!important;
        margin-left: -375px!important;
        color: #fff;
        top: 110px;
    }
    .article_right {
        padding-top: calc(100vh + 20px);
    }


    /* 头部颜色 */
    .article_top .article_column,
    .article_top .cloumm_level_one,
    .article_top a,
    .article_top .article_title,
    .article_top .article_subtitle,
    .article_top .author_share *{
        color: #fff!important;
        font-family: ScalaOT Regular !important;
        -ms-text-size-adjust: 100%;
        -moz-text-size-adjust: 100%;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
        font: inherit;
        -webkit-font-smoothing: antialiased;
    }

    .article_top .article_title{
        font-size: 60px!important;
        line-height: 72px!important;
        margin: 50px auto 50px auto;
        -webkit-font-smoothing: antialiased;
        font-weight: 700!important;
        text-align: center;
    }

    .article_top .article_subtitle{
        font-size: 38px!important;
        line-height: 50px;
        margin: 50px auto 0 auto;
        -webkit-font-smoothing: antialiased;
        color: #fff;
        font-weight: 500;
		display: table;
    }
    .article .article_top .author_share .byline{
        font-weight: initial;
    }
    .article_top .author_share{
        font-size: 16px!important;
        line-height: 1.5em!important;
        padding-top: 30px;
        margin: auto;
        font-weight: 400;
        margin-bottom: auto;
        -webkit-transform: none;
        -ms-transform: none;
        text-align: center;
        transform: none;
        -webkit-font-smoothing: antialiased;
        font-family: ScalaOT Regular !important;
    }

    .article_top .author_share:before {
        width: 120px;
        height: 1px;
        background-color: #BFBFBF;
        display: block;
        margin: -15px auto 15px;
        content: " ";
        top: 0;
        left: 0;
        right: 0;
    }
    .article .article_top .author_share .author_share_left{
        float: inherit;
        text-align: center;
    }
    /* desc img */
    .article_right center +p{
        margin-left:  calc((620px - 100vw)/2);

    }

    /* 作者 */
    .article_right i:last-of-type{
        font-style: italic;
    }

    .article_top .article_top_share{
        position: absolute;
        left: 42px;
        top: 0;
    }

}

@media screen and (max-width: 420px){
    .article_right>center:nth-of-type(1){
        position: absolute;
        top: 0;
        overflow: hidden;
        margin-left: 0;
        left: 0px;
        display: flex;
        align-items: center;
        padding:0 10px 0;
        width: 100%!important;
    }
    .article .picture{
        position: absolute;
    }
    .article .picture +br,
    .article .picture +br +br{
        display: none;
    }
    .article_top .article_title{
        font-size: 32px!important;
        line-height: 46px!important;
    }
    .article_right {
        font-size: 18px;
        line-height: 28px;
    }

}

.container:not(#footer){
    width: 100%;
}