h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal
}

.title {
    font-size: 30px;
    text-align: center;
    line-height: 6
}

.wrap-box {
    width: 100%;
    overflow: hidden
}

.gray-box {
    background-color: #f9f9f9;
    max-width: 1200px;
    margin: 0 auto
}

.box {
    max-width: 1200px;
    margin: 0 auto
}

.aboutus-banner {
    width: 100%;
    height: 568px;
    padding-top: 68px;
    background: url(../images/c98_1.jpg) no-repeat center center/cover;
    display: flex;
    align-items: center;
    justify-content: center
}

.aboutus-banner h2 {
    color: #fff;
    font-weight: 300;
    font-size: 40px;
    line-height: 1
}

.about-header-wrap {
    max-width: 800px;
    height: 90px;
    margin: -50px auto 50px;
    border-radius: 8px 8px 0 0;
    background-color: #fff;
    box-shadow: 0px 16px 50px rgba(51, 51, 51, .1)
}

.about-header-wrap .about-header {
    width: 100%;
    display: flex;
    justify-content: space-evenly
}

.about-header-wrap .about-header a {
    margin: 0;
    width: 120px;
    height: 90px;
    text-align: center;
    font-size: 20px;
    color: #2f4858;
    line-height: 90px;
    cursor: pointer;
    transition: all .3s ease-in-out
}

.about-header-wrap .about-header a:hover {
    line-height: 90px;
    font-size: 24px;
    height: 90px;
    font-weight: bold;
    color: #e83820
}

.about-header-wrap .about-header a.active {
    line-height: 90px;
    font-size: 24px;
    color: #e83820;
    height: 90px;
    font-weight: bold;
    border-bottom: 4px solid #e83820
}

.com-title {
    width: 100%;
    text-align: center;
    font-size: 30px;
    line-height: 5;
    margin: 0;
    color: #2f4858
}

.about-com-wrap .com-wrap {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 50px
}

.about-com-wrap .com-wrap h2 {
    width: 100%;
    text-align: center;
    font-size: 30px;
    line-height: 4;
    color: #2f4858
}

.about-com-wrap .com-wrap .sec-title {
    width: 80%;
    margin: 0 auto;
    color: #666;
    text-align: center;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.8
}

.about-com-wrap .com-wrap .intro-back {
    width: 100%;
    height: 72px;
    line-height: 72px;
    text-align: center;
    color: #fff;
    margin-top: 38px;
    background: url(../images/c99_1.png) center center no-repeat
}

.about-com-wrap .com-wrap .intro-back span {
    color: #f6dd6a;
    font-size: 20px;
    font-weight: 600
}

.com-honor-wrap .com-honor {
    max-width: 1180px;
    margin: 0 auto 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.com-honor-wrap .com-honor .honor-item {
    width: 24%;
    margin-right: 14%;
    margin-bottom: 4%;
    text-align: center;
    margin-top: auto
}

.com-honor-wrap .com-honor .honor-item img {
    width: 100%
}

.com-honor-wrap .com-honor .honor-item p {
    font-size: 18px;
    color: #12171a;
    line-height: 3
}

.com-honor-wrap .com-honor .honor-item:nth-child(3n+3) {
    margin-right: 0
}

.com-honor-wrap .com-honor .honor-item:nth-child(n+7) {
    margin-bottom: 0
}

.com-honor-wrap .com-honor .honor-big {
    width: 29%;
    margin-right: 5%
}

.com-honor-wrap .com-honor .honor-big:nth-child(3) {
    margin-right: 0
}

.com-honor-wrap .com-honor .honor-last-item {
    margin-right: auto
}

.com-culture-wrap {
    background-color: #fafafa
}

.com-culture-wrap h2.com-title {
    line-height: 6
}

.com-culture-wrap .com-culture {
    max-width: 1080px;
    display: flex;
    justify-content: space-between;
    padding-bottom: 100px
}

.com-culture-wrap .com-culture .com-culture-item {
    width: 200px;
    height: 200px;
    overflow: hidden !important;
    color: #fff;
    background: url(../images/com_cul1.png) no-repeat center center/cover;
    border-radius: 20px;
    transform: rotate(0deg);
    text-align: center
}

.com-culture-wrap .com-culture .com-culture-item:hover .com-cul {
    opacity: .9;
    transform: translateY(0)
}

.com-culture-wrap .com-culture .com-culture-item:hover .com-cul p {
    opacity: 1;
    transform: translateY(0px)
}

.com-culture-wrap .com-culture .com-culture-item:nth-child(2) {
    background: url(../images/com_cul2.png) no-repeat center center/cover
}

.com-culture-wrap .com-culture .com-culture-item:nth-child(3) {
    background: url(../images/com_cul3.png) no-repeat center center/cover
}

.com-culture-wrap .com-culture .com-culture-item:nth-child(4) {
    background: url(../images/com_cul4.png) no-repeat center center/cover
}

.com-cul {
    display: flex;
    opacity: 0;
    overflow: hidden;
    width: 200px;
    height: 200px;
    border-radius: 20px;
    background: #ff5c5c;
    justify-content: center;
    align-items: center;
    transform: translateY(50%);
    transition: all .3s ease-in-out
}

.com-cul p {
    transform: translateY(50%);
    transition: transform .45s ease-in-out;
    font-size: 18px;
    line-height: 2
}

.about-history-wrap .about-history-box {
    display: flex;
    justify-content: space-between;
    width: 950px;
    margin: 60px auto
}

.about-history-wrap .about-history-left {
    width: 402px;
    padding: 135px 0 0
}

.about-history-wrap .about-history-left .about-his {
    position: relative;
    padding: 25px;
    margin-bottom: 125px;
    background: url("../images/about_his_left.jpg") right center no-repeat;
    border-radius: 10px;
    border: solid 1px #c3d2db;
    text-align: right;
    box-shadow: 0px 0px 16px 0px rgba(47, 72, 88, .11)
}

.about-history-wrap .about-history-left .about-his h3 {
    font-size: 24px;
    margin: 0 0 10px 0;
    line-height: 1.2;
    color: #2f4858
}

.about-history-wrap .about-history-left .about-his p {
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
    color: #677680
}

.about-history-wrap .about-history-left .about-his img {
    height: 86px;
    position: absolute;
    top: -45%;
    left: 50px
}

.about-history-wrap .about-history-left .about-his img.about-telecom {
    height: 125px
}

.about-history-wrap .about-history-left .about-his img.about-telecompany {
    position: absolute;
    top: -55%;
    left: 50px;
    height: 125px
}

.about-history-wrap .about-history-left .about-his:last-child {
    margin-bottom: 0
}

.about-history-wrap .about-history-left .about-his-bus {
    margin-bottom: 142px
}

.about-history-wrap .about-history-left .about-his-bus:last-child {
    margin-bottom: 0
}

.about-history-wrap .about-history-img {
    width: 100px
}

.about-history-wrap .about-history-img img {
    width: 100%
}

.about-history-wrap .about-history-right {
    width: 402px;
    padding: 15px 0 0
}

.about-history-wrap .about-history-right .about-his {
    position: relative;
    padding: 25px;
    margin-bottom: 145px;
    background: url("../images/about_his_right.jpg") left center no-repeat;
    border-radius: 10px;
    border: solid 1px #c3d2db;
    text-align: left;
    box-shadow: 0px 0px 16px 0px rgba(47, 72, 88, .11)
}

.about-history-wrap .about-history-right .about-his h3 {
    font-size: 24px;
    margin: 0 0 10px 0;
    line-height: 1.2;
    color: #2f4858
}

.about-history-wrap .about-history-right .about-his p {
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
    color: #677680
}

.about-history-wrap .about-history-right .about-his img {
    height: 120px;
    position: absolute;
    top: -50%;
    right: 30px
}

.about-history-wrap .about-history-right .about-his img.about-history-webchat {
    height: 155px;
    top: -38%;
    right: 10px
}

.about-history-wrap .about-history-right .about-his-little {
    margin-bottom: 125px
}

.about-history-wrap .about-history-right .about-his-middle {
    margin-bottom: 135px
}

.about-history-wrap .about-history-right .about-his:last-child {
    margin-bottom: 0
}

.about-contact-wrap .about-contact-box {
    width: 940px;
    margin: 80px auto;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.about-contact-wrap .about-contact-box img {
    width: 600px
}

.about-contact-wrap .about-contact-box .about-contact-item {
    width: 260px;
    height: 108px;
    padding: 20px;
    box-shadow: 0px 16px 50px rgba(51, 51, 51, .1);
    border-radius: 5px;
    margin: 40px 0
}

.about-contact-wrap .about-contact-box .about-contact-item h4 {
    font-size: 16px;
    line-height: 2;
    margin: 0;
    color: #748590
}

.about-contact-wrap .about-contact-box .about-contact-item h4 span {
    font-weight: bold;
    color: #2f4858
}

.about-contact-wrap .about-contact-box .about-contact-item p {
    font-size: 24px;
    margin: 0;
    font-weight: bold;
    color: #2f4858
}

.about-contact-wrap .about-tel-wrap {
    background-color: #f7f7f7;
    padding: 70px 0
}

.about-contact-wrap .about-tel-wrap .about-tel-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1200px;
    margin: 0 auto
}

.about-contact-wrap .about-tel-wrap .about-tel-box .about-tel {
    width: 375px;
    height: 180px;
    padding: 10px 20px;
    margin-bottom: 20px;
    background-color: #fff;
}

.about-contact-wrap .about-tel-wrap .about-tel-box .about-tel h4 {
    font-size: 28px;
    margin: 0;
    line-height: 1.8;
    color: #2f4858
}

.about-contact-wrap .about-tel-wrap .about-tel-box .about-tel p {
    font-size: 16px;
    color: #677680;
    margin: 0;
    padding: 0
}

.about-contact-wrap .about-tel-wrap .about-tel-box .about-tel p span {
    color: #9ea4a8;
    line-height: 1.8
}

@media screen and (max-width: 768px) {
    .aboutus-banner {
        width: 100%;
        height: 350px;
        padding-top: 0
    }

    .aboutus-banner h2 {
        width: 90%;
        margin: 0 auto;
        text-align: center;
        color: #fff;
        font-size: 22px;
        line-height: 1.7
    }

    .about-header-wrap {
        max-width: 90%;
        height: 60px;
        margin: -30px auto 0;
        border-radius: 4px 4px 0 0;
        background-color: #fff;
        box-shadow: 0px 16px 50px rgba(51, 51, 51, .1)
    }

    .about-header-wrap .about-header {
        width: 100%;
        display: flex;
        justify-content: space-around
    }

    .about-header-wrap .about-header a {
        margin: 0;
        width: auto;
        height: 60px;
        text-align: center;
        font-size: 16px;
        line-height: 60px
    }

    .about-header-wrap .about-header a:hover {
        line-height: 60px;
        font-size: 18px;
        height: 60px
    }

    .about-header-wrap .about-header a.active {
        line-height: 60px;
        font-size: 18px;
        height: 60px;
        border-bottom: 2px solid #e83820
    }

    .com-title {
        width: 100%;
        text-align: center;
        font-size: 18px;
        line-height: 4;
        margin: 0;
        color: #2f4858
    }

    .about-com-wrap .com-wrap {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 5%
    }

    .about-com-wrap .com-wrap h2 {
        font-size: 22px;
        line-height: 4
    }

    .about-com-wrap .com-wrap .sec-title {
        width: 94%;
        margin: 0 auto;
        color: #666;
        font-size: 14px;
        line-height: 1.6
    }

    .about-com-wrap .com-wrap .intro-back {
        height: 52px;
        line-height: 52px;
        text-align: center;
        color: #fff;
        margin-top: 30px
    }

    .about-com-wrap .com-wrap .intro-back span {
        font-size: 16px
    }

    .com-honor-wrap .com-honor {
        max-width: 96%;
        margin: 0 auto 5%;
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap
    }

    .com-honor-wrap .com-honor .honor-item {
        width: 45%;
        margin-right: 10%;
        margin-bottom: 4%
    }

    .com-honor-wrap .com-honor .honor-item p {
        font-size: 13px
    }

    .com-honor-wrap .com-honor .honor-item:nth-child(2n+2) {
        margin-right: 0
    }

    .com-honor-wrap .com-honor .honor-item:nth-child(n+7) {
        margin-bottom: 0
    }

    .com-honor-wrap .com-honor .honor-big {
        width: 45%;
        margin-right: 10%
    }

    .com-honor-wrap .com-honor .honor-big:nth-child(3) {
        margin-right: 5%
    }

    .com-honor-wrap .com-honor .honor-last-item {
        margin-right: auto
    }

    .com-culture-wrap {
        background-color: #fafafa
    }

    .com-culture-wrap h2.com-title {
        line-height: 6
    }

    .com-culture-wrap .com-culture {
        max-width: 92%;
        margin: 0 auto;
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
        padding-bottom: 5%
    }

    .com-culture-wrap .com-culture .com-culture-item {
        width: 45%;
        height: 45%;
        max-height: 165px;
        margin-bottom: 5%;
        overflow: hidden !important;
        color: #fff;
        background: url(../images/com_cul1.png) no-repeat center center/cover;
        border-radius: 20px;
        transform: rotate(0deg);
        text-align: center
    }

    .com-culture-wrap .com-culture .com-culture-item:hover .com-cul {
        opacity: .9;
        transform: translateY(0)
    }

    .com-culture-wrap .com-culture .com-culture-item:hover .com-cul p {
        opacity: 1;
        transform: translateY(0px)
    }

    .com-culture-wrap .com-culture .com-culture-item:nth-child(2) {
        background: url(../images/com_cul2.png) no-repeat center center/cover
    }

    .com-culture-wrap .com-culture .com-culture-item:nth-child(3) {
        background: url(../images/com_cul3.png) no-repeat center center/cover
    }

    .com-culture-wrap .com-culture .com-culture-item:nth-child(4) {
        background: url(../images/com_cul4.png) no-repeat center center/cover
    }

    .about-history-wrap .about-history-box {
        display: flex;
        justify-content: space-between;
        max-width: 96%;
        margin: 5% auto
    }

    .about-history-wrap .about-history-left {
        width: 45%;
        padding: 15% 0 0
    }

    .about-history-wrap .about-history-left .about-his {
        position: relative;
        padding: 1%;
        margin-bottom: 45px;
        background: url("../images/about_his_left.jpg") right center no-repeat;
        border-radius: 4px;
        border: solid 1px #c3d2db;
        text-align: right;
        box-shadow: 0px 0px 16px 0px rgba(47, 72, 88, .11)
    }

    .about-history-wrap .about-history-left .about-his h3 {
        font-size: 14px;
        margin: 0 0 10px 0;
        line-height: 1.2;
        color: #2f4858
    }

    .about-history-wrap .about-history-left .about-his p {
        font-size: 12px;
        line-height: 1.5;
        margin: 0;
        color: #677680
    }

    .about-history-wrap .about-history-left .about-his img {
        height: 45px;
        position: absolute;
        top: -45%;
        left: 50px
    }

    .about-history-wrap .about-history-left .about-his img.about-telecom {
        height: 55px
    }

    .about-history-wrap .about-history-left .about-his img.about-telecompany {
        position: absolute;
        top: -55%;
        left: 50px;
        height: 55px
    }

    .about-history-wrap .about-history-left .about-his:last-child {
        margin-bottom: 0
    }

    .about-history-wrap .about-history-left .about-his-bus {
        margin-bottom: 45px
    }

    .about-history-wrap .about-history-left .about-his-bus:last-child {
        margin-bottom: 0
    }

    .about-history-wrap .about-history-img {
        width: 50px
    }

    .about-history-wrap .about-history-img img {
        width: 100%
    }

    .about-history-wrap .about-history-right {
        width: 45%;
        padding: 15px 0 0
    }

    .about-history-wrap .about-history-right .about-his {
        position: relative;
        padding: 4%;
        margin-bottom: 35px;
        background: url("../images/about_his_right.jpg") left center no-repeat;
        border-radius: 4px;
        border: solid 1px #c3d2db;
        text-align: left;
        box-shadow: 0px 0px 16px 0px rgba(47, 72, 88, .11)
    }

    .about-history-wrap .about-history-right .about-his h3 {
        font-size: 14px;
        margin: 0 0 10px 0;
        line-height: 1.2;
        color: #2f4858
    }

    .about-history-wrap .about-history-right .about-his p {
        font-size: 12px;
        line-height: 1.5;
        margin: 0;
        color: #677680
    }

    .about-history-wrap .about-history-right .about-his img {
        height: 70px;
        position: absolute;
        top: -50%;
        right: 30px
    }

    .about-history-wrap .about-history-right .about-his img.about-history-webchat {
        height: 85px;
        top: -38%;
        right: 10px
    }

    .about-history-wrap .about-history-right .about-his-little {
        margin-bottom: 35px
    }

    .about-history-wrap .about-history-right .about-his-middle {
        margin-bottom: 35px
    }

    .about-history-wrap .about-history-right .about-his:last-child {
        margin-bottom: 0
    }

    .about-contact-wrap .about-contact-box {
        max-width: 96%;
        margin: 5% auto;
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .about-contact-wrap .about-contact-box img {
        width: 60%
    }

    .about-contact-wrap .about-contact-box .about-contact-item {
        flex: 1;
        height: auto;
        padding: 5%;
        border-radius: 4px;
        margin: 5% 0
    }

    .about-contact-wrap .about-contact-box .about-contact-item h4 {
        font-size: 14px;
        line-height: 2;
        margin: 0;
        color: #748590
    }

    .about-contact-wrap .about-contact-box .about-contact-item h4 span {
        font-weight: bold;
        color: #2f4858
    }

    .about-contact-wrap .about-contact-box .about-contact-item p {
        font-size: 16px;
        margin: 0;
        font-weight: bold;
        color: #2f4858
    }

    .about-contact-wrap .about-tel-wrap {
        background-color: #f7f7f7;
        padding: 5% 0
    }

    .about-contact-wrap .about-tel-wrap .about-tel-box {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: 100%;
        margin: 0 auto
    }

    .about-contact-wrap .about-tel-wrap .about-tel-box .about-tel {
        width: 96%;
        margin: 0 auto;
        height: auto;
        padding: 5%;
        margin-bottom: 20px;
        background-color: #fff
    }

    .about-contact-wrap .about-tel-wrap .about-tel-box .about-tel h4 {
        font-size: 18px;
        margin: 0;
        line-height: 1.8;
        color: #2f4858
    }

    .about-contact-wrap .about-tel-wrap .about-tel-box .about-tel p {
        font-size: 14px;
        color: #677680;
        margin: 0;
        padding: 0
    }

    .about-contact-wrap .about-tel-wrap .about-tel-box .about-tel p span {
        color: #9ea4a8;
        line-height: 1.8
    }
}

/*# sourceMappingURL=about.css.map */