@media screen and (max-width: 1280px) {
    .recruitment .banner {
        height: 435px;
    }
}
@media screen and (max-width: 768px) {
    .icon-refund,
    .text {
        float: none;
    }
    .recruitment .banner .desc{
        letter-spacing: 0;
    }
    .recruitment .content .desc {
        width: 700px;
    }
    .recruitment .content .image {
        top: -255px;
    }
    .recruitment .content .desc {
        top: -180px;
    }
    .recruitment .features {
        height: 1080px;
        background: #fff;
    }
    .recruitment .features .title {
        width: 100%;
        font-size: 26px;
        line-height: 35px;
    }
    .recruitment .features .wrapper {
        width: 100%;
        /*left: 30px;*/
    }
    .recruitment .features .wrapper .feature0 {
        width: 40%;
        top: 0;
        left: 55px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature1 {
        width: 40%;
        top: 25px;
        left: 55px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature2 {
        width: 40%;
        top: 50px;
        left: 55px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature3 {
        width: 40%;
        top: 75px;
        left: 55px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature4 {
        width: 40%;
        top: 100px;
        left: 55px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature5 {
        width: 40%;
        top: 0;
        left: 85px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature6 {
        width: 40%;
        top: 25px;
        left: 85px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature7 {
        width: 40%;
        top: 50px;
        left: 85px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature8 {
        width: 40%;
        top: 75px;
        left: 85px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature9 {
        width: 40%;
        top: 100px;
        left: 85px;
        -webkit-animation-name: stop;
    }
    .recruitment .partner {
        height: 1535px;
    }
    .recruitment .partner .title {
        font-size: 46px;
        top: 45px;
    }
    .recruitment .partner .partnerTypes {
        width: 100%;
        height: 450px;
        display: flex;
        justify-content: center;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .recruitment .partner .partnerType {
        width: 80%;
        height: 185px;
    }
    .recruitment .partner .desc {
        width: 90%;
        line-height: 1.5;
    }
     .recruitment .partner .partnerFunctions {
         width: 80%;
         height: 750px;
         flex-wrap: wrap;
         flex-direction: row;
    }
    .recruitment .partner .partnerFunction {
        width: 220px;
    }
    .recruitment .partner .partnerFunction .avatar0,
    .recruitment .partner .partnerFunction .avatar1,
    .recruitment .partner .partnerFunction .avatar2,
    .recruitment .partner .partnerFunction .avatar3 {
        width: 100px;
        height: 100px;
    }
}

@media screen and (max-width: 414px) {
    .icon-refund,
    .text {
        float: none;
    }
    .recruitment .banner {
        color: #fff;
        width: 100%;
        height: 290px;
    }
    .recruitment .banner .title {
        width: 100%;
        top: 80px;
        font-size: 24px;
    }
    .recruitment .banner .desc{
        letter-spacing: 0;
        top: 60px;
        font-size: 16px;
    }
    .recruitment .banner .joinLink {
        width: 115px;
        height: 35px;
        margin: 0 auto;
        position: relative;
        top: 80px;
    }
    .recruitment .banner .joinButton {
        width: 115px;
        height: 35px;
        background-color: #1f8eeb;
        margin: 0 auto;
        color: #fff;
        font-size: 14px;
        cursor: pointer;
        border: none;
    }
    .recruitment .content .title {
        font-size: 26px;
        top: 45px;
    }
    .recruitment .content {
        height: 880px;
    }
    .recruitment .content .summary {
        width: 100%;
        top: 80px;
    }
    .recruitment .content .desc {
        width: 700px;
    }
    .recruitment .content .image {
        width: 90%;
        top: -335px;
        background-size: contain;
    }
    .recruitment .content .desc {
        top: -480px;
        width: 90%;
    }
    .recruitment .features {
        height: 730px;
        background: #fff;
    }
    .recruitment .features .title {
        width: 100%;
        font-size: 26px;
        top: 45px;
    }
    .recruitment .features .wrapper {
        width: 100%;
        top: 90px;
        left: 0;
    }
     .recruitment .features .wrapper .feature0 {
        width: 40%;
        top: 0;
        left: 35px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature1 {
        width: 40%;
        top: -25px;
        left: 35px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature2 {
        width: 40%;
        top: -50px;
        left: 35px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature3 {
        width: 40%;
        top: -75px;
        left: 35px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature4 {
        width: 40%;
        top: -100px;
        left: 35px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature5 {
        width: 40%;
        top: 0;
        left: 45px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature6 {
        width: 40%;
        top: -25px;
        left: 45px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature7 {
        width: 40%;
        top: -50px;
        left: 45px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature8 {
        width: 40%;
        top: -75px;
        left: 45px;
        -webkit-animation-name: stop;
    }
    .recruitment .features .wrapper .feature9 {
        width: 40%;
        top: -100px;
        left: 45px;
        -webkit-animation-name: stop;
    }
    .recruitment .partner {
        height: 1605px;
    }
    .recruitment .partner .title {
        font-size: 26px;
    }
    .recruitment .partner .summary {
        font-size: 24px;
        top: 30px;
    }
    .recruitment .partner .name {
        font-size: 22px;
    }
    .recruitment .partner .desc {
        width: 94%;
        line-height: 1.5;
    }
    .recruitment .partner .partnerTypes {
        width: 100%;
        height: 600px;
        display: flex;
        justify-content: center;
        flex-direction: row;
        flex-wrap: wrap;
        top: 80px;
    }
    .recruitment .partner .partnerType {
        width: 80%;
        height: 260px;
    }
     .recruitment .partner .partnerFunctions {
         width: 80%;
         height: 730px;
         flex-wrap: wrap;
         flex-direction: row;
         top: 100px;
    }
    .recruitment .partner .partnerFunction {
        width: 40%;
    }
    .recruitment .partner .partnerFunction .desc {
        width: 100%;
        font-size: 15px;
    }
    .recruitment .partner .joinLink {
        width: 115px;
        height: 35px;
        margin: 0 auto;
        position: relative;
        top: 125px;
    }
    .recruitment .partner .joinButton {
        width: 115px;
        height: 35px;
        background-color: #1f8eeb;
        margin: 0 auto;
        color: #fff;
        font-size: 14px;
        cursor: pointer;
        border: none;
    }
}

@media screen and (max-width: 375px) {
    .recruitment .partner .partnerFunction .desc {
        font-size: 14px;
    }
}
@media screen and (max-width: 320px) {
    .recruitment .features .title {
        font-size: 22px;
    }
    .recruitment .features .wrapper {
        top: 60px;
    }
    .recruitment .features {
        height: 680px;
    }
    .recruitment .partner .title {
        width: 100%;
        font-size: 32px;
    }
    .recruitment .partner .summary {
        width: 90%;
        font-size: 23px;
    }
    .recruitment .partner .partnerFunction .avatar0,
    .recruitment .partner .partnerFunction .avatar1,
    .recruitment .partner .partnerFunction .avatar2,
    .recruitment .partner .partnerFunction .avatar3 {
        width: 100px;
        height: 100px;
    }
    .recruitment .partner .partnerFunction .name {
        width: 110px;
        top: 70px;
        font-size: 20px;
    }
    .recruitment .partner .partnerFunction .desc {
        top: 80px;
        font-size: 15px;
    }
    .recruitment .content .desc {
        top: -508px;
    }
}