.header {
    overflow: hidden;
    /* position: relative; */
}

.banner {
    /* overflow: hidden; */
    /* position: absolute; */
    left: 0;
    top: 0;
}

.banner .gp-img-responsive {
    padding-bottom: 37.45%;
}

.mode2 {
    overflow: hidden;
    background-size: contain;
    background: url(/uploads/image/dimages/mode1bg.png);
}

.mode2 .gp-container {
    padding: 88px 0;
    padding-bottom: 61px;
}

.tit {
    position: relative;
    padding: 8px 0;
    padding-bottom: 0;
    margin-bottom: 20px;
    z-index: 150;
}

.tit .gp-f14 {
    color: #817a7a;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 100;
}

.tit::before {
    /* content: ''; */
    display: block;
    width: calc(100% - 160px);
    height: 19px;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 100;
    background:  repeat-x;
}

.tit2 {
    position: relative;
}

.tit2::before {
    content: '';
    display: block;
    width: calc(100% - 670px);
    height: 19px;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 100;
    background:  repeat-x;
}

.titl {
    display: inline-block;
    position: relative;
    padding-bottom: 8px;
}

.tit::before {
    content: '';
    display: block;
    width:calc(100% - 70px);
    height: 1px;
    background: #d6d6d6;
    position: absolute;
    left: 0;
    bottom: 0;
}

.titl span {
    z-index: 100;
    width: 72px;
    height: 56px;
    display: inline-block;
    overflow: hidden;
    position: absolute;
    top: 0px;
}

.title {
    color: #94070a;
    display: inline-block;
    font-family: '宋体-简';
}

.mode1con li {
    display: inline-block;
    margin-bottom: 27px;
}

.mode1con {
    margin: 0 -22px;
    overflow: hidden;
}

.mode1con li p {
    line-height: 24px;
    height: 48px;
    overflow: hidden;
    color: #222;
    margin-bottom: 14px;
}

.mode1con a {
    display: block;
    border: 1px solid #dedede;
    padding: 18px 30px;
    background: #fff;
    margin: 0 22px;
    transition: all 0.3s ease;
}

.date {
    color: #94070a;
    padding-left: 23px;
    position: relative;
}

.date::before {
    content: '';
    display: block;
    width: 14px;
    height: 14px;
    background: url(/uploads/image/dimages/date.png);
    position: absolute;
    left: 0;
    top: 2px;
}

.mode1con li:hover a {
    background: url(/uploads/image/dimages/dh.png) no-repeat right 18px bottom 18px #94070a;
}

.mode1con li:hover p,
.mode1con li:hover .date {
    color: #fff;
}


/* mode2 */

.mode3 {
    background: url(/uploads/image/dimages/mode2bg.png);
    padding: 44px 0;
}

.title2 {
    color: #fff;
}

.mode3 .tit .more {
    color: #fff;
}

.mode3l {
    width: 600px;
}

.mode3img {
    padding-bottom: 67.83%;
}

.mode3lp {
    padding: 20px;
    background: #fff;
}

.mode3lp p {
    color: #222;
    font-weight: bold;
    position: relative;
    padding-bottom: 15px;
    margin-bottom: 19px;
}

.mode3lp p::before {
    content: '';
    display: block;
    width: 16px;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #94070a;
}

.mode3l .slick-arrow {
    display: none;
}

.mode3l .slick-arrow:hover {
    background: none;
}

.mode3r {
    margin-left: 630px;
}

.mode3ul li {
    background: #fff;
    padding: 15px 28px;
    position: relative;
    transition: 1s ease;
    margin-bottom: 14px;
}

.mode3ul li:last-child {
    margin-bottom: 0;
}

.mode3ul li:hover {
    transform: translatex(5px);
    transition: 1s ease;
}

.mode3ul li::before {
    content: '';
    display: block;
    width: 29px;
    height: 29px;
    position: absolute;
    right: 25px;
    bottom: 15px;
    background: url(/uploads/image/dimages/dh2.png);
}

.mode3ul li p {
    line-height: 24px;
    color: #222;
    margin-bottom: 20px;
}

.mode3ul li a {
    overflow: hidden;
    position: relative;
}


/* mode4 */

.mode4 {
    overflow: hidden;
    background: url(/uploads/image/dimages/mode4bg.png);
    background-size: cover;
    padding: 50px 0;
}

.mode4img {
    padding-bottom: 56.32%;
}

.mode4p {
    padding: 16px 19px 39px 18px;
    background: #fff;
    border: 1px solid #dedede;
    border-top: none;
    position: relative;
    transition: 1s ease-in-out;
}

.mode4p:hover {
    transform: translatey(5px);
    transition: 1s ease-in-out;
}

.mode4p::before {
    content: '';
    display: block;
    width: 8px;
    height: 39px;
    background: #94070a;
    position: absolute;
    left: 0;
    top: 21px;
}

.mode4con {
    margin: 0 -15px;
}

.mode4con li {
    display: inline-block;
}

.mode4con li a {
    display: block;
    margin: 0 15px;
}

.mode4p1 {
    line-height: 24px;
    height: 48px;
    overflow: hidden;
    color: #222;
    margin-bottom: 10px;
}

.mode4p2 {
    line-height: 22px;
    height: 66px;
    overflow: hidden;
    color: #757575;
    margin-bottom: 54px;
}

.data {
    color: #94070a;
    margin-bottom: 30px;
}

.reading {
    padding: 10px 28px;
    border: 1px solid #dedede;
    display: inline-block;
    color: #757575;
    border-radius: 19px;
    position: relative;
}

.reading:hover {
    background: #94070a;
    color: #fff;
}

.reading::before {
    content: '';
    display: block;
    width: 24px;
    height: 1px;
    background: #e0c67e;
    position: absolute;
    left: -12px;
    top: 50%;
}


/* mode5 */

.mode5 {
    overflow: hidden;
    background: #f1eded;
    padding: 50px 0;
    position: relative;
}

.mode5::before {
    content: '';
    width: 100%;
    height: 67.32%;
    background: #94070a;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
}

.mode5::after {
    content: '';
    width: 41.7%;
    height: 47.32%;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 120;
}

.mode5 .tit .more {
    color: #fff;
}

.mode5con {
    position: relative;
    z-index: 150;
    margin: 0 -15px;
}

.mode5con li {
    display: inline-block;
    overflow: hidden;
    transition: 1s ease;
    margin-bottom: 30px;
}

.mode5con li:hover {
    transform: translatey(5px);
}

.mode5conul a {
    display: block;
    margin: 0 15px;
    position: relative;
    padding: 0 26px 20px 26px;
}

.mode5conul a::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 30px;
}

.mode5pic {
    width: 225px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.mode5img {
    padding-bottom: 56.45%;
}

.mode5p1 {
    line-height: 24px;
    height: 48px;
    overflow: hidden;
    position: relative;
    color: #222;
    margin-top: 26px;
    margin-bottom: 10px;
}

.mode5p2 {
    line-height: 24px;
    height: 72px;
    overflow: hidden;
    color: #757575;
    position: relative;
    margin-bottom: 15px;
}

.datew {
    border: 1px solid #94070a;
    padding: 10px;
    text-align: center;
    display: inline-block;
    color: #94070a;
    position: relative;
    border-radius: 20px;
}


/* mode6 */

.mode6 {
    overflow: hidden;
    background: url(/uploads/image/dimages/mode6bg.png);
    padding: 50px 0;
    padding-bottom: 30px;
}

.mode6con li {
    display: inline-block;
    transition: 1s ease;
    margin-bottom: 20px;
}

.mode6con li:hover {
    transform: translatey(5px);
}

.mode6con {
    margin: 0 -15px;
}

.mode6pic {
    width: 100%;
    /* margin: 0 auto; */
    position: relative;
}

.mode6pic::before {
    content: '';
    display: block;
    width: 20px;
    height: 1px;
    background: #970e0e;
    position: absolute;
    top: 20px;
    right: -10px;
}

.mode6con li a {
    display: block;
    margin: 0 15px;
    padding: 15px;
    background: url(/uploads/image/dimages/moed6border.png);
    background-size: 100% 100%;
    /* position: relative; */
}

.mode6img {
    padding-bottom: 146.89%;
}

.name {
    line-height: 20px;
    color: #333;
    display: inline-block;
    padding: 5px 10px;
    background: #e0c67e;
    /* margin-bottom: 17px; */
    position: absolute;
    left: 0;
    bottom: -15px;
}

.mode6tit {
    line-height: 60px;
    color: #fff;
    margin-top: 32px;
}

.mode7 {
    background: #fff;
    overflow: hidden;
    padding: 30px 0;
}

.mode7pic {
    position: relative;
    overflow: hidden;
}

.mode7pic::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    background: rgba(16, 20, 23, .5);
    top: 0;
}

.mode7img {
    /* padding-bottom: 205.6%; */
}

.mode7cb {
    width: 165px;
    height: 340px;
    background: center no-repeat;
    background-size: cover;
}

.mode7ul {}

.mode7ul li {
    display: inline-block;
    width: 169px;
    margin: 28px 0 0;
    position: relative;
}

.mode7ul li.slick-current .mode7cb {
    width: 654px;
    height: 367px;
}

.mode7ul li a {
    display: block;
    margin: 0 2px;
    position: relative;
}

.mode7ul li.slick-current {
    width: 656px;
    margin-top: 0;
}


/* .mode7ul li.narrow{ width: 169px;margin: 28px 0 0;} */

.mode7ul li.slick-current .mode7pic::before {
    display: none;
}

.mode7ul li.slick-current .mode7pic::after {
    display: block;
}

.mode7ul li.slick-current p {
    display: block;
}

.mode7ul li p {
    display: none;
}

.mode7ul li.slick-current .mode7img {
    padding-bottom: 55.9%;
}

.mode7ul .slick-prev {
    left: 19.75%;
    top: 30px;
    width: 10px;
    height: 17px;
    background: url(/uploads/image/dimages/l.png);
}

.mode7ul .slick-prev:hover {
    background: url(/uploads/image/dimages/l2.png);
}

.mode7ul .slick-next {
    right: 19.75%;
    top: 30px;
    width: 10px;
    height: 17px;
    background: url(/uploads/image/dimages/r.png);
}

.mode7ul .slick-next:hover {
    background: url(/uploads/image/dimages/r2.png);
}

.mode7ul li p {
    position: absolute;
    left: 27px;
    bottom: 20px;
    z-index: 2000;
}

.mode8 {
    background: #fff;
    overflow: hidden;
    padding-bottom: 30px;
}

.mode8con {
    overflow: hidden;
    margin: 0 -15px;
}

.mode8con li {
    display: inline-block;
    transition: 1s ease;
}

.mode8con li:hover {
    transform: translatey(5px);
}

.mode8con li a {
    display: block;
    margin: 0 15px;
    margin-bottom: 25px;
    position: relative;
}

.mode8con li a::before {
    content: '';
    display: block;
    width: 6px;
    height: 100%;
    background: #e0c67e;
    position: absolute;
    left: 0;
    top: 0;
}

.mode8pic {
    padding-bottom: 37.63%;
}

.forward {
    width: 49px;
    height: 49px;
    position: absolute;
    left: 20px;
    bottom: -20px;
}

.mode7img img {
    width: 100% !important;
}

.mode7pic::after {
    content: '';
    display: block;
    width: 100%;
    height: 22%;
    z-index: 1000;
    background: rgba(0, 0, 0, .4);
    background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    /* safari 5.1 - 6.0 */
    background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    /* opera 11.1 - 12.0 */
    background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    /* firefox 3.6 - 15 */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    position: absolute;
    left: 0;
    bottom: 0;
    display: none;
}

@media screen and (max-width:1401px) {
    .mode7ul .slick-prev {
        left: 10.75%;
    }
    .mode7ul .slick-next {
        right: 10.75%;
    }
    .mode5pic {
        width: 150px;
    }
}

@media screen and (max-width:996px) {
    .mode7cb {
        margin: 0 -60px;
    }
    .mode3l {
        width: 100%;
    }
    .mode3r {
        width: 100%;
        float: left;
        margin-left: 0;
    }
    .mode4con li {
        margin-bottom: 30px;
    }
    .mode4 {
        padding: 15px 0;
    }
    .mode7ul .slick-prev {
        left: 0;
    }
    .mode7ul .slick-next {
        right: 0;
    }
    .mode7ul li.slick-current {
        width: 335px !important;
    }
    .mode7ul li.slick-current .mode7img {
        padding-bottom: 56.03%;
    }
    .mode7img {
        padding-bottom: 97.6%;
    }
}

@media screen and (max-width:767px) {}

@media screen and (max-width:479px) {
    .mode7cb {
        margin: 0;
    }
    .mode7ul li.slick-current .mode7img {
        padding-bottom: 35.03% !important;
    }
    .mode7img {
        padding-bottom: 56.03% !important;
    }
    .mode2 .gp-container {
        padding: 15px 0;
        padding-bottom: 10px;
    }
    .title {
        font-size: 24px;
    }
    .titl span {
        top: -17px;
    }
    .mode3,
    .mode5,
    .mode6 {
        padding: 30px 0;
    }
    .mode4p2,
    .data {
        margin-bottom: 20px;
    }
    .mode4p {
        padding-bottom: 20px;
    }
}