.joinPage .join-banner {
    width: 100%;
    margin: 0 auto;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.joinPage .join-banner .img-banner-link {
    display: block;
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.joinPage .join-banner .join-banner_text {
    position: absolute;
    text-align: center;
    color: #fff;
    line-height: normal;
}
.joinPage .join-banner .join-banner_text .join-banner_h3 {
    font-weight: 400;
    font-size: 48px;
    margin-bottom: 15px
}
.joinPage .join-banner .join-banner_text .join-banner_p {
    font-weight: 400;
    font-size: 20px;
    margin-bottom: 30px;
}
.joinPage .join-banner .join-banner_text .banner-btn{
    display: block;
    margin : 68px auto 0 auto;
    width: 144px;
    height: 48px;
    line-height: 48px;
    font-size: 16px;
    text-align: center;
    color: #fff;
    border-radius: 2px;
    background: -webkit-linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    background: -o-linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    background: -moz-linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    background: -ms-linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    background: linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
}
.joinPage .join-banner .join-banner_text .banner-btn:hover {
    background: -webkit-linear-gradient(86.68deg, #73B2D5 0%,#3F7BAB 100%);
    background: -o-linear-gradient(86.68deg, #73B2D5 0%,#3F7BAB 100%);
    background: -moz-linear-gradient(86.68deg, #73B2D5 0%,#3F7BAB 100%);
    background: -ms-linear-gradient(86.68deg, #73B2D5 0%,#3F7BAB 100%);
    background: linear-gradient(86.68deg, #73B2D5 0%,#3F7BAB 100%);
}

.joinPage .join-middle {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 9.1%;
    margin-top: -100px;
    position: relative;
    background: transparent;
}
.joinPage .join-middle .join-middle-intro {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto;
}
.joinPage .join-middle .join-middle-intro > li {
    width: calc((100% - 36px)/2);
    height: 360px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #F7F7F8;
    color: #777777;
    margin-bottom: 36px;
}
.joinPage .join-middle .join-middle-intro li:nth-child(2n+1){
    margin-right: 36px;
}

.joinPage .join-middle .join-middle-intro > li:hover {
    background: linear-gradient(180deg, #3F7BAB 0%, #003350 100%);
    color: #FFFFFF;
}
.joinPage .join-middle .join-middle-intro > li:nth-child(3), .joinPage .join-middle .join-middle-intro > li:nth-child(4) {
    margin-bottom: 0;
}
.joinPage .join-middle .join-middle-intro > li img {
    width: 80px;
    height: 80px;
    margin-bottom: 28px;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center {
    text-align: center;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .icon-center {
    width: 80px;
    height: 80px;
    margin: auto auto 28px;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .icon-center svg {
    width: 80px;
    height: 80px;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .icon-center div {
    font-size: 80px;
    height: 80px;
    width: 80px;
    line-height: 80px;
}
.joinPage .join-middle .join-middle-intro > li:hover .middle-box_center .icon-center svg {
    display: none;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .icon-center div {
    display: none;
}
.joinPage .join-middle .join-middle-intro > li:hover .middle-box_center .icon-center div {
    display: inline-block;
}
.joinPage .join-middle .join-middle-intro > li:hover .middle-box_center .middle-text_weight {
    color: #FFFFFF;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .middle-text_weight {
    color: #424243;
    font-weight: 600;
    font-size: 20px;
    letter-spacing: 0.25px;
    margin-bottom: 24px;
}
.joinPage .join-middle .join-middle-intro > li:hover .middle-box_center .middle-text_short {
    color: #FFFFFF;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .middle-text_short {
    max-width: 240px;
    color: #777777;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.5px;
    text-align: center;
}
.joinPage .join-middle .join-middle-intro > li:hover .middle-box_center .middle-text_long {
    color: #FFFFFF;
}
.joinPage .join-middle .join-middle-intro > li .middle-box_center .middle-text_long {
    max-width: 480px;
    color: #777777;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.5px;
    text-align: center;
}

.join-middle .proxyProcessContainer{
    background: #F7F7F8;
    width: 100%;
    text-align: center;
    padding: 80px 0;
    margin-top: 80px;
}

.join-middle .proxyProcessContainer .proxyProcessTitle{
    color: #333;
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 56px;
}

.joinPage .join-middle .join-middle-proxy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-top: 80px;
    margin-bottom: 80px;
}
.joinPage .join-middle .join-middle-proxy > li {
    border: 1px solid #E6E3E1;
    width: calc((100% - 100px)/3);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: 50px;
    padding: 28px;
}
.joinPage .join-middle .join-middle-proxy > li:last-child {
    margin-right: 0;
}
.joinPage .join-middle .join-middle-proxy > li > img {
    width: 100%;
}
.joinPage .join-middle .join-middle-proxy > li .middle-box_center {
    padding: 35px 16px 23px 16px;
}
.joinPage .join-middle .join-middle-proxy > li .middle-box_center .middle-proxy_weight {
    color: #222222;
    font-size: 24px;
}
.joinPage .join-middle .join-middle-proxy > li .middle-box_center .middle-proxy_short {
    color: #777777;
    font-size: 16px;
    margin: 26px 0 69px 0;
}
.joinPage .join-middle .join-middle-proxy > li .middle-box_center .middle-proxy_btn {
    display: block;
    color: #3F7BAB;
    font-size: 16px;
    width: 100%;
    height: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 16px;
    border-radius: 2px;
    border: 1px solid #3F7BAB;
}
.joinPage .join-middle .join-middle-proxy > li .middle-box_center .middle-proxy_btn:hover {
    color: #FFFFFF;
    background: -webkit-linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    background: -o-linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    background: linear-gradient(86.68deg, #3F7BAB 0%, #73B2D5 100%);
    border: none;
}

.join-middle .proxyProcessContainer .proxyProcessImage {
    width: 896px;
    margin: auto;
    text-align: center;
}
.join-middle .proxyProcessContainer .proxyProcessImage img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media screen and (max-width:1024px) {
    .join-middle{
        margin-top: 0 !important;
        padding: 0 !important;
    }

    .join-middle-intro{
        display: block !important;
    }

    .join-middle-intro li{
        margin: 0 !important;
        width: 100% !important;
        margin-bottom: 5px !important;
    }

    .join-middle-proxy{
        margin-top: 40px !important;
        margin-bottom: 20px !important;
        display: block !important;
    }

    .join-middle-proxy li{
        margin: 0 !important;
        width: 100% !important;
        margin-bottom: 5px !important;
        border: none !important;
        border-bottom: 1px solid #E6E3E1 !important;
    }
}

@media screen and (max-width:820px) {
    .joinPage .join-banner .join-banner_text .join-banner_h3 {
        font-size: 36px !important;
        margin-bottom: 20px !important;
    }

    .joinPage .join-banner .join-banner_text .join-banner_p {
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }

    .joinPage .join-banner .join-banner_text .banner-btn {
        width: 120px !important;
        height: 40px !important;
        line-height: 40px !important;
        margin: 0 auto !important;
    }
}

@media screen and (max-width:568px) {
    .joinPage .join-banner .join-banner_text .join-banner_h3 {
        font-size: 16px !important;
        margin-bottom: 10px !important;
    }

    .joinPage .join-banner .join-banner_text .join-banner_p {
        font-size: 12px !important;
        margin-bottom: 10px !important;
    }

    .joinPage .join-banner .join-banner_text .banner-btn {
        width: 100px !important;
        height: 30px !important;
        line-height: 30px !important;
        margin: 0 auto !important;
        font-size: 14px !important;
    }

    .join-middle .proxyProcessContainer{
        padding: 24px 0;
        margin-top: 5px;
    }

    .join-middle .proxyProcessContainer .proxyProcessTitle {
        font-size: 20px;
        margin-bottom: 24px;
    }

    .join-middle .proxyProcessContainer .proxyProcessImage {
        width: 80%;
        margin: auto;
        text-align: center;
    }
    .join-middle .proxyProcessContainer .proxyProcessImage img{
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .join-middle-proxy{
        margin-top: 0 !important;
        margin-bottom: 16px !important;
    }
}