/************* banner部分 ******************/
.recreation-banner {
    background: url("../images/scheme/scheme-recreation/numbanner.jpg") no-repeat center top;
}

.recreacont h4 {
    text-align: center;
    color: #656565;
}

/************ 中心能力 ************/
.circlecont {
    width: 750px;
    height: 540px;
    margin: 0 auto;
}

.circlepic {
    margin: -20px auto 20px auto;
    width: 100%;
    height: 100%;
}

.circleposi p {
    font-size: 12px;
}

.circlea p {
    color: #cd5a91;
}

.circleb p {
    color: #f6b738;
}

.circlec p {
    color: #81ad49;
}

.circled p {
    color: #33b9c2;
}

.circlee p {
    color: #829fd2;
}

.circlef p {
    color: #f6b738;
}

.advantage h4, .bshowcon h4, .cshowcon h4 {
    text-align: center;
    margin-bottom: 40px;
    color: #656565;
}

/************ 中心优势 ************/
.antage {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.advantcon {
    width: 28%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 0 auto;
    cursor: pointer;
}

.advantcon:hover {
    -webkit-animation: pulse 1s linear both;
    animation: pulse 1s linear both;
}

.advan {
    width: 65%;
    border: 5px solid #e71f19;
    border-radius: 50%;
    z-index: 10;
    display: block;
    margin: 0 auto;
}

.advan img {
    padding: 10px;
    box-sizing: border-box;
}

.advantxt {
    border: 1px solid #bbbaba;
    padding: 60px 15px 10px;
    margin-top: -52px;
    width: 100%;
    height: auto;
    display: block;
}

.advantxt p {
    font-size: 13px;
    color: #656565;
}

.adtitle {
    text-align: center;
    color: #656565;
}

/************ 中心展示-B端、C端 ************/
.bshowtxt {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin: 10px auto;
}

.bshow {
    width: 48%;
    margin-bottom: 14px;
}

.bshow p {
    padding: 10px 0;
    font-size: 13px;
    color: #656565;
}

.cshowtxt {
    margin: 40px auto;
    width: 100%;
    display: block;
}

.cshowtxt p {
    font-size: 13px;
    color: #656565;
}

/************************************************* 媒体查询 ************************************************/
@media (min-width: 1200px) {

}

@media (min-width: 992px) and (max-width: 1199px) {

}

@media screen and (min-width: 768px) and (max-width: 991px) {

}

@media screen and (min-width: 768px) {
    /************ 中心能力, 大屏下定位 ************/
    .circlepic {
        position: relative;
    }

    .circlepic::after {
        content: "";
        width: 380px;
        height: 380px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 7;
        background: url("../images/scheme/scheme-recreation/hezuo-2.png") center center no-repeat;
        background-size: 98% auto !important;
        border-radius: 50%;
    }

    .circleposi {
        width: 45%;
        position: absolute;
        z-index: 8;
    }

    .circlea {
        top: 56px;
        left: 0;
    }

    .circlea p {
        width: 100%;
    }

    .circleb {
        top: 190px;
        left: 0;
    }

    .circleb p {
        width: 60%;
    }

    .circlec {
        top: 400px;
        left: 0;
    }

    .circlec p {
        width: 78%;
    }

    .circled {
        top: 56px;
        right: 0;
    }

    .circled p {
        position: absolute;
        right: 0;
        width: 74%;
    }

    .circlee {
        top: 200px;
        right: 0;
    }

    .circlee p {
        position: absolute;
        right: 0;
        width: 56%;
    }

    .circlef {
        top: 400px;
        right: 0;
    }

    .circlef p {
        position: absolute;
        right: 0;
        width: 74%;
    }
}

@media screen and (max-width: 500px) {
    /************ 中心优势 ************/
    .advantcon {
        width: 80%;
    }

    .advan {
        width: 120px;
    }

    .bshow {
        margin: 0 4%;
        width: 92%;
    }

    .advantage h4, .bshowcon h4, .cshowcon h4 {
        text-align: center;
        color: #656565;
    }
}

@media screen and (max-width: 767px) {

    .circlecont {
        width: 100%;
        height: auto;
        padding-bottom: 20px;
    }

    .circlepic::after {
        display: none;
    }

    .circleposi {
        width: 94%;
        margin: 10px auto;
    }

    .circlepic {
        margin: 10px auto;
    }

    .circlea p {
        background: url("../images/scheme/scheme-recreation/liuliang.png") left center no-repeat;
    }

    .circleb p {
        background: url("../images/scheme/scheme-recreation/APPyonghu.png") left center no-repeat;
    }

    .circlec p {
        background: url("../images/scheme/scheme-recreation/youxiyiye.png") left center no-repeat;
    }

    .circled p {
        background: url("../images/scheme/scheme-recreation/youxizhifu.png") left center no-repeat;
    }

    .circlee p {
        background: url("../images/scheme/scheme-recreation/youxituozhan.png") left center no-repeat;
    }

    .circlef p {
        background: url("../images/scheme/scheme-recreation/youxilianyun.png") left center no-repeat;
    }

    .circleposi p {
        background-size: 40px 40px !important;
        padding-left: 50px;
        width: 100%;
    }
}
