body {
    background-color: #fafafa;
}

.n-banner::after {
    background-image: url(../images/b1.png);
}

.time-axis {
    width: 4.85rem;
    height: 7.3rem;
    background: #970003 url(../images/bg6.jpg)no-repeat right bottom;
    margin-top: .2rem;
    color: #FFF;
    padding: .4rem .3rem .3rem .4rem;
}

.time-axis .content {
    z-index: 1;
}

.time-axis .content::after {
    content: '';
    position: absolute;
    z-index: -1;
    width: 1px;
    height: 100%;
    background-color: #FFF;
    top: .2rem;
    left: .11rem;
}

.time-axis .item {
    margin-top: .35rem;
    padding-left: .4rem;
    z-index: 2;
}

.time-axis .item::before {
    content: '';
    position: absolute;
    left: 0;
    top: .05rem;
    width: .24rem;
    height: .24rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: rgba(255, 255, 255, .5);
}

.time-axis .item::after {
    content: '';
    position: absolute;
    left: .07rem;
    top: .12rem;
    width: .1rem;
    height: .1rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: #FFF;
    z-index: 2;
}

.time-axis .item .year {
    margin-bottom: .1rem;
}

.time-axis .item .txt {
    opacity: .8;
}

.pic-content {
    margin-top: .2rem;
    width: 8.98rem;
}

.pic-content .pic {
    width: 8.68rem;
    height: 4.46rem;
    overflow: hidden;
    margin-left: .3rem;
}

.pic-content .pic img {
    width: 100%;
}

.pic-content .txt {
    line-height: 1.8;
}

.pic-content .text-content {
    box-shadow: .1rem .1rem .15rem rgba(0, 0, 0, .15);
    padding: .3rem .3rem .3rem .5rem;
    margin-right: .5rem;
    margin-top: -.5rem;
    z-index: 2;
}

.pic-content .text-content .more {
    margin-top: .2rem;
    width: 100%;
}

.pic-content .text-content .more::before {
    content: '';
    position: absolute;
    right: 1.4rem;
    top: 50%;
    height: 1px;
    border-top: 1px dashed #d9b777;
    left: 0;
}

.pic-content .text-content .more a {
    background: url(../images/arrow.png)no-repeat left center;
    padding-left: .35rem;
    background-size: .28rem;
    line-height: .6rem;
    margin-top: .1rem;
}

@media (min-width:1025px) {
    .time-axis .item:hover::after {
        background-color: #ff7a4a;
    }
    .time-axis .item:hover::before {
        background-color: rgba(255, 255, 255, 1);
    }
}

@media (max-width:1199px) {
    .time-axis,
    .pic-content {
        width: 100%;
        float: none;
    }
    .time-axis {
        height: auto;
        padding-bottom: .6rem;
    }
    .pic-content .pic {
        width: 100%;
        height: auto;
        margin-left: 0;
    }
}

.bg {
    background: url(../images/bg8.jpg)no-repeat center bottom;
    overflow: hidden;
    padding-bottom: .8rem;
}

.txt-con {
    margin-top: .7rem;
}

.txt-con .txt {
    background: url(../images/icon7.png)no-repeat left center;
    background-size: .5rem;
    padding-left: .7rem;
    margin-top: .4rem;
    width: 33.33%;
    line-height: .5rem;
}

.txt-con .txt span {
    color: #a20004;
}

@media (max-width:1199px) {
    .txt-con .txt {
        width: 50%;
    }
}

@media (max-width:800px) {
    .txt-con .txt {
        width: 100%;
    }
}

.card-con {
    margin-top: .7rem;
}

.card-con .item {
    width: 33.333%;
    height: 5.4rem;
    background-color: rgba(241, 236, 227, .8);
    background-image: url(../images/bg9.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 2.57rem;
    margin-top: .6rem;
}

.card-con .item::after {
    content: '';
    position: absolute;
    top: 0;
    left: .3rem;
    width: 1px;
    height: 100%;
    border-left: 1px dashed #cfa65a;
}

.about-text {
    line-height: 1.8;
    margin-top: .6rem;
}

.about-text p {
    text-indent: .36rem;
}

.card-con .text-con {
    padding-left: .3rem;
    margin-top: .45rem;
}

.card-con .text-con .txt {
    padding-left: .4rem;
}

.card-con .text-con .txt span {
    color: #a20004;
}

.card-con .text-con .txt span::after {
    content: '';
    position: absolute;
    left: 0;
    width: .3rem;
    height: 1;
    border-top: 1px dashed #cfa65a;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

.card-con.cur .item {
    width: 30%;
}

.card-con.cur .item.on {
    width: 40%;
    height: 6.6rem;
    background: url(../images/bg7.png)no-repeat center;
    background-size: cover;
    margin-top: 0;
}

.card-con.cur .item.on .text-con .txt {
    color: #FFF;
    font-size: .2rem;
}

.card-con.cur .item.on .text-con .txt span {
    color: #FFF;
    font-size: .3rem;
}

@media (max-width:800px) {
    .card-con .item {
        width: 100%;
        height: auto;
        padding-bottom: .4rem;
    }
}