﻿
img { max-width: 100%; }
.banner { width: 100%; margin: 0px auto; }
    .banner > img { width: 100%; height: 100%; min-height: 420px; object-fit: cover; }


nav.breadbig { width: 100%; background-color: #f7f7f7; font-size: 14px; color: #999; margin: 0px auto; }
    nav.breadbig > .conn { display: flex; width: 100%; flex-wrap: wrap; max-width: 1920px; padding: 20px 6%; margin: 0px auto; }
        nav.breadbig > .conn > .l { flex: 1; }
            nav.breadbig > .conn > .l > a { font-size: 14px; color: #999; }

@media only screen and (max-width:1280px) {
    nav.breadbig > .conn { padding: 20px 3%; }
}

@media only screen and (max-width:1024px) {
    nav.breadbig > .conn { padding-left: 1rem; padding-right: 1rem; }
}



.title { width: 100%; }
    .title > b { color: #232323; font-size: 2rem; font-weight: 400; position: relative; }
        .title > b::after { position: absolute; content: ""; border-bottom: solid 2px #f08200; width: 28px; left: 0px; bottom: -1.25rem; }

.titlebai > b { color: #fff; }

@media only screen and (max-width:1400px) {
    .title > b { font-size: 1.85rem; }
}

@media only screen and (max-width:1280px) {
    .title > b { font-size: 1.6rem; }
}

@media only screen and (max-width:1024px) {
    .title > b { font-size: 1.45rem; }
}

@media only screen and (max-width:960px) {
    .title > b { font-size: 1.3rem; }
}

@media only screen and (max-width:768px) {
    .title > b { font-size: 1.15rem; }
}

@media only screen and (max-width:480px) {
    .title > b { font-size: 1rem; }
}




.contentbig { width: 100%; padding: 0px 6%; max-width: 1920px; margin: 0px auto; }
    .contentbig > .conn { width: 100%; padding: 6.25rem 0px; display: flex; }
        .contentbig > .conn > .left { flex: 1; padding-right: 5%; }
            .contentbig > .conn > .left > .text { width: 100%; margin-top: 3.25rem; background-color: #fff; }
                .contentbig > .conn > .left > .text > .qm { text-align: right; }
        .contentbig > .conn > .right { width: 33%; }
            .contentbig > .conn > .right > p { line-height: 1.8; font-size: 1.15rem; color: #000; text-indent: 2em; }
            .contentbig > .conn > .right > img { border-radius: 15px; margin-bottom: 1rem; }


.section { width: 100%; margin-bottom: 2rem; }
    .section > b { color: #f08200; font-size: 1.15rem; display: block; margin-bottom: 1rem; font-weight: 400; }
    .section > p { color: #666666; font-size: 1rem; line-height: 1.8; }



@media only screen and (max-width:1280px) {
    .contentbig { padding: 0px 3%; }
}

@media only screen and (max-width:1024px) {
    .contentbig { padding-left: 1rem; padding-right: 1rem; }
        .contentbig > .conn { padding: 4rem 0px; }
}

@media only screen and (max-width:768px) {
    .contentbig > .conn { padding: 2rem 0px; flex-wrap: wrap; }
        .contentbig > .conn > .left { flex: none; padding-right: 0px; width: 100%; margin-bottom: 1rem; }
        .contentbig > .conn > .right { width: 100%; }
}






.yidlbig { width: 100%; padding: 0px 6%;  background-repeat: no-repeat; background-position:center; background-size: cover; }
    .yidlbig > .conn { width: 100%; padding: 6.25rem 0px; max-width: 1920px; margin: 0px auto; }
        .yidlbig > .conn > .text { width: 50%; margin-top: 3.25rem; margin-bottom: 8rem; }
            .yidlbig > .conn > .text > p { color: #fff; line-height: 1.8; }

@media only screen and (max-width:1280px) {
    .yidlbig { padding: 0px 3%; }
}

@media only screen and (max-width:1024px) {
    .yidlbig { padding-left: 1rem; padding-right: 1rem; }
        .yidlbig > .conn { padding: 4rem 0px; }
            .yidlbig > .conn > .text { width: 70%; margin-top: 3rem; }
}

@media only screen and (max-width:768px) {
    .yidlbig > .conn { padding: 2rem 0px; }
        .yidlbig > .conn > .text { width: 100%; margin-top: 2rem; }
}




.zxlbig { width: 100%; padding: 0px 6%; max-width: 1920px; margin: 0px auto; }
    .zxlbig > .conn { width: 100%; padding: 6.25rem 0px; }
        .zxlbig > .conn > .text { width: 100%; margin-top: 3.25rem; margin-bottom: 8rem; text-align: center; }
            .zxlbig > .conn > .text > p { color: #666; line-height: 1.8; margin-bottom: 1rem; text-align: justify; }
            .zxlbig > .conn > .text > img { margin: 0px auto; margin-bottom: 1rem; }

@media only screen and (max-width:1280px) {
    .zxlbig { padding: 0px 3%; }
}

@media only screen and (max-width:1024px) {
    .zxlbig { padding-left: 1rem; padding-right: 1rem; }
        .zxlbig > .conn { padding: 4rem 0px; }
            .zxlbig > .conn > .text { margin-top: 3rem; }
}

@media only screen and (max-width:768px) {
    .zxlbig > .conn { padding: 2rem 0px; }
        .zxlbig > .conn > .text { margin-top: 2rem; }
}




.gylcbig { width: 100%; padding: 0px 6%; margin: 0px auto; background-color: #f7f7f7 }
    .gylcbig > .conn { width: 100%; max-width: 1920px; padding: 6.25rem 0px; margin: 0px auto; }
        .gylcbig > .conn > .text { width: 100%; margin-top: 3.25rem; text-align: center; }



@media only screen and (max-width:1280px) {
    .gylcbig { padding: 0px 3%; }
}

@media only screen and (max-width:1024px) {
    .gylcbig { padding-left: 1rem; padding-right: 1rem; }
        .gylcbig > .conn { padding: 4rem 0px; }
            .gylcbig > .conn > .text { margin-top: 3rem; }
}

@media only screen and (max-width:768px) {
    .gylcbig > .conn { padding: 2rem 0px; }
        .gylcbig > .conn > .text { margin-top: 2rem; }
}




.item-slide { border: solid 0px #000; cursor: pointer; }
    .item-slide > .box { width: 100%; }
        .item-slide > .box > b { font-size: 1.25rem; color: #999; font-weight: 400; }
        .item-slide > .box > .sps { position: relative; background-image: url('../images/social/sps.jpg'); height: 38px; background-position: top left; background-repeat: repeat-x; }
            .item-slide > .box > .sps:before { content: " "; position: absolute; left: 0px; top: 0px; height: 38px; width: 2px; background-color: #565656; }


.mySwiper { box-sizing: border-box; padding: 10px 0; }
    .mySwiper .swiper-slide { height: 80px; text-align: left; opacity: 0.4; }
    .mySwiper .swiper-slide-thumb-active { opacity: 1; }
        .mySwiper .swiper-slide-thumb-active > .box > b { color: #f08200 }
        .mySwiper .swiper-slide-thumb-active > .box > .sps::before { background-color: #f08200; }



.mySwiper2 { width: 100%; height: 100%; }
    .mySwiper2 .swiper-slide { text-align: center; font-size: 18px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }

.bigitem-slide { border: solid 0px #000; }
    .bigitem-slide > .box { width: 100%; padding-bottom: 3rem; }
        .bigitem-slide > .box > .year { width: 100%; text-align: left; margin-top: 1rem; }
            .bigitem-slide > .box > .year > b { text-align: left; color: #363636; display: block; padding: 10px 0px; font-weight: 400; font-size: 1.25rem; }
            .bigitem-slide > .box > .year > p { text-align: left; color: #666; font-size: 1rem; }
