@charset "utf-8";

.title001 h2{
    display: flex;
    align-items: center;
    font-size: .35rem;
    line-height: .4rem;
    color: #333333;
    text-align: center;
    font-family: 'SourceHanSansCN-Bold', sans-serif;
}
.title001 h2 img{
    display: block;
    width: .35rem;
    margin-right: .13rem;
}

.title001 .more a{
    display: flex;
    align-items: center;
    font-size: .16rem;
    line-height: .24rem;
    color: #9c0000;
    transition: .5s;
}
.title001 .more a:hover{
    color: #ebb51a;
}

.title001{
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.index-s1 .left{
    width: 58.625%;
}
.list1w a{
    display: block;
}
.list1w a .pic{
    padding-top: 5.86rem;
}

.list_box1{
    position: relative;
    z-index: 2;
    margin: -1.04rem .62rem 0 0;
    background: #9c0000;
}
.list_box1 li a{
    display: block;
    padding: .32rem 2.2rem .25rem .5rem;
}
.list_box1 li h3{
    font-size: .2rem;
    line-height: .3rem;
    color: #fff;
    font-family: 'SourceHanSansCN-Bold', sans-serif;
    transition: .5s;
    opacity: 0;
}

.list_box1 li p{
    font-size: .16rem;
    line-height: .24rem;
    color: #fff;
    margin-top: .1rem;
    opacity: 0;
}
.list_box1 li{
    display: none;
}
.list_box1 li:hover h3{
    color: #ebb51a;
}
.list_box1 li.active{
    display: block;
}
.list_box1 li.active h3,
.list_box1 li.active p{
    animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.list_box1 li.active p{
    animation-delay: .2s;
}

.list_box1 .swidot{
    position: absolute;
    right: .3rem;
    bottom: .52rem;
    font-size: 0;
    display: flex;
    z-index: 5;
}
.list_box1 .swidot span{
    display: block;
    width: .27rem;
    height: .05rem;
    background: #fff;
    border-radius: .05rem;
    margin: 0 .02rem;
    opacity: .4;
    transition: .5s;
}
.list_box1 .swidot span.active{
    background: #ebb51a;
    opacity: 1;
}

.index-s1 .right{
    width: 37.375%;
}

.list_box2 li a{
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: .5s;
}
.list_box2 li h3{
    font-size: .2rem;
    line-height: .28rem;
    color: #333333;
    transition: .5s;
}
.list_box2 li time{
    margin-top: .15rem;
    display: block;
    font-size: .16rem;
    line-height: .24rem;
    color: rgba(51, 51, 51, 0.6);
    transition: .5s;
}
.list_box2 li{
    flex: 1;
    position: relative;
    transition: .5s;
}
.list_box2 li:before{
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: url("../images/s1-img-2.jpg") no-repeat 50%/cover;
    opacity: 0;
    visibility: hidden;
    transition: .5s;
    z-index: 1;
}
.list_box2 li:after{
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 1px dashed #a09fa0;
}
.list_box2 li.active{
    flex: 1.32;
}
.list_box2 li.active a{
    padding: 0 .46rem;
}
.list_box2 li.active a h3{
    color: #fff;
    font-family: 'SourceHanSansCN-Bold', sans-serif;
}
.list_box2 li.active a time{
    color: #fff;
    margin-top: .24rem;
}

.list_box2 li.active:before{
    opacity: 1;
    visibility: visible;
}

.list_box2{
    height: 6.03rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.index-s1 .content{
    margin-top: .72rem;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
}

.index-s2 .left{
    width: 48.9375%;
}

.list_box3 li{
    position: relative;
    line-height: .79rem;
    border-bottom: 1px dashed #a09fa0;
}
.list_box3 li a{
    font-size: .2rem;
    color: #333333;
    padding: 0 1.2rem 0 0;
    transition: .5s;
}
.list_box3 li time{
    position: absolute;
    right: 0;
    top: 0;
    font-size: .16rem;
    color: #333333;
    opacity: .6;
}
.list_box3 li:hover a{
    color: #9c0000;
    font-family: 'SourceHanSansCN-Bold', sans-serif;
}
.list_box3{
    margin-top: .44rem;
}

.index-s2 .right{
    width: 48.9375%;
}

.index-s2 .wp{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
}
.index-s2 {
    margin-top: .99rem;
}

.index-s3 .content .top a{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    justify-content: space-between;
}
.index-s3 .content .top a .pic{
    width: 49.875%;
    height: 4.44rem;
}
.index-s3 .content .top a .txt{
    width: 50.125%;
    padding: .92rem .5rem .4rem .7rem;
}
.index-s3 .content .top a h3{
    font-size: .2rem;
    line-height: .28rem;
    color: #9c0000;
    transition: .5s;
}
.index-s3 .content .top a p{
    font-size: .16rem;
    line-height: .28rem;
    color: #333333;
    -webkit-line-clamp: 4;
    height: 1.12rem;
    margin-top: .36rem;
}
.index-s3 .content .top a time{
    display: block;
    font-size: .16rem;
    line-height: .28rem;
    color: #333333;
    margin-top: .44rem;
}

.index-s3 .content .top{
    background: url("../images/s3-img-2.jpg") no-repeat 50%/cover;
}
.index-s3 .content .top a:hover h3{
    color: #ebb51a;
}
.list_box4{
    display: flex;
    flex-wrap: wrap;
}
.list_box4 li{
    position: relative;
    width: 32.1875%;
    margin: 0 0 0 1.71875%;
    background: #fff;
}
.list_box4 li:nth-child(3n+1){
    margin-left: 0;
}
.list_box4 li a{
    display: block;
    position: relative;
    padding: .57rem .34rem.25rem;
    z-index: 2;
}
.list_box4 li h3{
    font-size: .2rem;
    line-height: .28rem;
    color: #333333;
    height: .56rem;
    transition: .5s;
}
.list_box4 li time{
    margin-top: .25rem;
    display: block;
    font-size: .16rem;
    line-height: .28rem;
    color: rgba(51, 51, 51, 0.6);
    text-align: right;
    transition: .5s;
}
.list_box4 li:before{
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    bottom: 0;
    height: .05rem;
    background: #9c0000;
    transition: .5s;
}
.list_box4 li:after{
    position: absolute;
    content: '';
    left: 50%;
    right: 50%;
    bottom: 0;
    height: .05rem;
    background: #ebb51a;
    transition: .5s;
}
.list_box4 li:hover:before{
    height: 100%;
    box-shadow: 0 .18rem .27rem rgba(112, 47, 47, 0.31);
}
.list_box4 li:hover:after{
    left: 0;
    right: 0;
    transition: .5s .2s;
}
.list_box4 li:hover h3{
    color: #fff;
}
.list_box4 li:hover time{
    color: #fff;
}

.index-s3 .content .bot{
    margin-top: .35rem;
}
.index-s3 .content{
    margin-top: .74rem;
}

.index-s3{
    margin-top: .97rem;
}

.index_page{
    padding: .82rem 0 1.97rem;
    background: url("../images/index_page.jpg") no-repeat bottom center/100% auto;
}

@media (max-width: 1025px) {
    .title001 h2{
        font-size: .26rem;
        line-height: .3rem;
    }
    .title001 h2 img{
        width: .24rem;
        margin-right: .1rem;
    }
    .index-s1 .left{
        width: 100%;
    }
    .list1w a .pic{
        padding-top: 62.47%;
    }
    .list_box1 li p{
        margin-top: .05rem;
    }
    .list_box1 li a{
        padding: .25rem 2rem .25rem .2rem;
    }
    .index-s1 .right{
        width: 100%;
        margin-top: .3rem;
    }
    .list_box2 li time{
        margin-top: .05rem;
    }
    .list_box2 li.active a time{
        margin-top: .1rem;
    }
    .list_box2 li.active a{
        padding: 0 .2rem;
    }
    .list_box2 {
        height: 5rem;
    }
    .list_box2 li.active{
        flex: 1.2;
    }
    .index-s1 .content{
        margin-top: .26rem;
    }
    .index-s2 .left{
        width: 100%;
    }
    .list_box3 li{
        line-height: .61rem;
    }
    .list_box3 li a{
        font-size: .18rem;
        padding-right: 1rem;
    }
    .list_box3 {
        margin-top: 0.1rem;
    }
    .index-s2 .right{
        width: 100%;
        margin-top: .3rem;
    }
    .index-s2{
        margin-top: .3rem;
    }
    .index-s3 .content .top a .pic{
        width: 100%;
        height: auto;
        padding-top: 55.64%;
    }
    .index-s3 .content .top a .txt{
        padding: .2rem;
        width: 100%;
    }
    .index-s3 .content .top a p{
        margin-top: .05rem;
    }
    .index-s3 .content .top a time{
        margin-top: .1rem;
    }
    .index-s3 .content .top{
        background: url("../images/s3-img-3.jpg") no-repeat bottom center/100% auto;
    }
    .list_box4 li a{
        padding: .2rem;
    }
    .list_box4 li h3{
        font-size: .18rem;
    }
    .list_box4 li time{
        margin-top: .1rem;
    }
    .list_box4 li{
        margin: 0;
    }
    .list_box4{
        gap: .2rem 1.71875%;
    }
    .index-s3 .content .bot{
        margin-top: .2rem;
    }
    .index-s3 .content{
        margin-top: .2rem;
    }
    .index-s3{
        margin-top: .4rem;
    }
    .index_page{
        padding: .4rem 0;
    }
}

@media (max-width: 769px){
    .list_box1{
        margin: 0;
        padding-bottom: .2rem;
    }
    .list_box1 li a{
        padding: .2rem .2rem 0;
    }
    .list_box1 .swidot{
        position: static;
        margin-top: .2rem;
        justify-content: center;
    }
    .list_box4 li{
        width: 100%;
    }
}