:root{
    --color-primary: #bf0008;
    --color-secondary: #c3a87d;
    --color-text-regular: #464646;
    --color-text-secondary: #5a5a5a;
    --color-text-third: #969696;

    --color-bg: rgb(240, 249, 254);
}

@font-face {
    font-family: 'Helvetica Neue';
    src: url('fonts/HelveticaNeue-Medium.ttf');
    src: url('fonts/HelveticaNeue-Medium.ttf') format('opentype');
	font-style: normal;
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}
body {
    font: .28rem/1.5 'Helvetica Neue','Times New Roman',"Arial",'思源黑体',"microsoft yahei";
    color: var(--color-text-regular);
    height: 100%;
}
.layui-icon{
    font-size: inherit;
}


img {
    display: block;
    max-width: 100%;
}
a{
    color: var(--color-text-regular);
    text-decoration: none;
    outline: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-select: none;
    -moz-user-focus: none;
    -moz-user-select: none;
}
a,a:hover,a:active,a:visited,a:link,a:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    outline:none;
    /*background: none;*/
    text-decoration: none;
    color: inherit;
}
/* a:hover{
    color: var(--color-secondary);
} */
.page-wrapper{
    width: 100vw;
    max-width: 640px;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
}
.page-wrapper img{
    max-width: 100%;
}

.content-wrapper{
    background-color: var(--color-bg);
    padding: .2rem;
}

/*加载进度样式*/
.load {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    display: -webkit-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
    background: #fff;
    background-size: cover;
}

.con-load {
    position: relative;
    width: 80%;
    text-align: center;
}
.con-load .progress{
    width: 100%;
    height: 4px;
    background: rgba(0,0,0,.1);
    border-radius: 2px;
    position: relative;
    display: none;
}
.progressbar{
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background-color: var(--color-primary);
    border-radius: 2px;
    -webkit-transition:width ease-in 200ms;
}
.load img {
    width: 80px;
    margin: 0 auto;
    /* margin-bottom: 30px; */
}

.load p {
    height: 40px;
    font-size: 14px;
    font-weight: bold;
    color: var(--color-primary);
    /*opacity: .85;*/
    line-height: 40px;
    z-index: 14;
    text-align: center;
    display: none;
}

/*横竖屏代码*/
/* 样式放在结尾，防止 base64 图片造成拥塞 */
@-webkit-keyframes rotation {
    10% {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg)
    }
    50%, 60% {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg)
    }
    90% {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg)
    }
    100% {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg)
    }
}

@keyframes rotation {
    10% {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg)
    }
    50%, 60% {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg)
    }
    90% {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg)
    }
    100% {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg)
    }
}


/* arrmove */
@-webkit-keyframes arrmove {
    0% {
        -webkit-transform: translateY(.1rem);
        opacity: .3;
    }
    50% {
        -webkit-transform: translateY(-.1rem);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(.1rem);
        opacity: .3;
    }
}
@-o-keyframes arrmove {
    0% {
        -o-transform: translateY(.1rem);
        opacity: .3;
    }
    50% {
        -o-transform: translateY(-.1rem);
        opacity: 1;
    }
    100% {
        -o-transform: translateY(.1rem);
        opacity: .3;
    }
}
@keyframes arrmove {
    0% {
        transform: translateY(.1rem);
        opacity: .3;
    }
    50% {
        transform: translateY(-.1rem);
        opacity: 1;
    }
    100% {
        transform: translateY(.1rem);
        opacity: .3;
    }
}
.b12-arrmove {
    -webkit-animation: arrmove 1s infinite;
    -o-animation: arrmove 1s infinite;
    animation: arrmove 1s infinite;
    position: 0;
}

/*arrmove END*/

.ala-flex{
    display: -webkit-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-align-items: center;
    align-items: center;
}

.ala-flex.reverse{
    -webkit-flex-direction: row-reverse;
    -moz-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    -o-flex-direction: row-reverse;
    flex-direction: row-reverse;
    /*flex-direction: column-reverse;*/
}
.ala-flex.is-center{
    justify-content: center;
}
.ala-flex.is-between{
    justify-content: space-between;
}

.container{
    padding: 0 .35rem;
}
.section{
    position: relative;
}
.section+.section{
    margin-top: .3rem;
}
.section>*{
    position: relative;
}
.text-center{
    text-align: center;
}


.list-section .list-title{
    padding: .4rem 0;
}


/* slide-door */
.slide-door{
    background-color: #fff;
    border-radius: .12rem;
}
.slide-door .accordion-title{
    display: flex;
    padding: .24rem .3rem;
    cursor: pointer;
    color: var(--color-text-regular);
    position: relative;
}
.slide-door .accordion-title:before{
    content: "\e625";
    position: absolute;
    right: .3rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: .32rem;
    color: #ccc;
    font-family: "iconfont";
    font-weight: bold;
}
.slide-door .accordion-title .title{
    -webkit-flex: 1;
    flex: 1;
    font-weight: bold;
    font-weight: 700;
    font-size: .32rem;
    padding-right: .48rem;
}
.slide-door .accordion-title em{
    color: var(--color-secondary);
    font-weight: bold;
    width: 1.5em;
}
.slide-door .accordion-title img{
    width: .18rem;
    height: .1rem;
    object-fit: contain;
    margin-top: .24rem;
}
.slide-door .accordion-content{
    padding: .4rem .3rem;
    display: none;
    border-top: .01rem solid #e6e6e6;
}
.slide-door.open .accordion-content{
    display: block;
}
.slide-door+.slide-door{
    margin-top: .4rem;
}
/* slide-door END */

.slide{
    display: block;
    color: var(--color-text-regular);
}
.slide .title{
    font-weight: bold;
}
.slide .img-box{
    margin: .2rem 0;
}
.slide .desc{
    color: var(--color-text-secondary);
}
.slide a{
    color: var(--color-secondary);
}
.slide a .iconfont{
    font-size: .24rem;
}

/* list */
.list .list-item+.list-item{
    margin-top: .4rem;
}
.list .category-title{
    background-color: var(--color-primary);
    border-radius: .08rem;
    padding: .1rem .24rem;
    color: #fff;
    line-height: 1;
    display: inline-block;
    position: relative;
    margin-bottom: .28rem;
}
.list .category-title:after{
    content: "";
    position: absolute;
    left: .12rem;
    top: 100%;
    border: .12rem solid transparent;
    border-top: .12rem solid var(--color-primary);
}
/* list END */

/* ala-cell */
.ala-cell{
    display: flex;
    align-items: center;
}
.slide+.slide,
.ala-cell+.slide,
.slide+.ala-cell,
.ala-cell+.ala-cell{
    margin-top: .4rem;
}
.ala-cell .ala-cell_hd img{
    width: 1.64rem;
    height: 1.64rem;
    object-fit: cover;
}
.ala-cell .ala-cell_bd{
    flex: 1;
}
.ala-cell .ala-cell_hd+.ala-cell_bd{
    margin-left: .27rem;
}
.ala-cell .ala-cell_ft{
    margin-left: .5rem;
}
.ala-cell .ala-cell_ft .article-icon{
    width: .35rem;
    height: .35rem;
    object-fit: contain;
}
.ala-cell .ala-cell_bd .title{
    font-weight: bold;
}
.ala-cell .ala-cell_bd .desc{
    color: var(--color-text-third);
    margin-top: .06rem;
}
/* ala-cell END */

/* button-to-top */
#button-to-top{
    position: fixed;
    bottom: 1.50rem;
    right: .1rem;
    width: 1.16rem;
    height: 1.16rem;
    line-height: 1.16rem;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-box-shadow: 0 .07rem .13rem .03rem rgba(142, 142, 142, .3);
    box-shadow: 0 .07rem .13rem .03rem rgba(142, 142, 142, .3);
    z-index: 999;
    opacity: 0;
    transform: all .3s ease-in-out;
}
#button-to-top img{
    width: .36rem;
    display: inline-block;
    margin: 0 auto;

}
/* button-to-top END */

/* article-content */
.article-content{
    padding: .5rem .3rem;
    font-size: .32rem;
}
.article-head{
    margin-bottom: .3rem;
}
.article-head .title{
    font-size: .42rem;
    font-weight: 700;
    color: #000;
}
.article-head .time{
    color: var(--color-text-third);
    font-size: .3rem;
    margin-top: .24rem;
}
/* article-content END */


/* page-content */
.page-content{
    color: #333;
    line-height: 2;
}
.page-content p,li{
    margin-bottom: .12rem;
}
/* page-content END */


/* magazine-list */
.page-wrapper.bg-grey{
    background-color: #f6f6f6;
    min-height: 100vh;
}
.ala-section{
    padding: .3rem 0;
}
.ala-container{
    padding: 0 .3rem;
}
.magazine-list{
    display: flex;
    flex-wrap: wrap;
    margin: -.2rem;
}
.magazine-list .magazine-item{
    padding: .2rem;
    width: 50%;
}
.magazine-list .magazine-item .img-box{
    width: 100%;
    height: 0;
    padding-bottom: 131%;
    position: relative;
}
.magazine-list .magazine-item .img-box .img{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
.magazine-list .magazine-item .img-box img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.magazine-list .magazine-item .text-box{
    text-align: center;
    padding-top: .2rem;
}
.magazine-list .magazine-item:hover .text-box{
    color: var(--color-primary);
    text-decoration: underline;
}

@media screen and (min-width: 768px) {
    .magazine-list{
        margin: -.15rem;
    }
    .magazine-list .magazine-item{
        width: 33.33333%;
        padding: .15rem;
    }
    .magazine-list .magazine-item .text-box{
        padding-top: .1rem;
    }
}
/* magazine-list END */