.main {

    width: 1320px;

    margin: 0 auto;

}

.main {

    padding: 100px 0;

}

.main>.tit  {

    width: 607px;

    height: 87px;

    margin: 0 auto;

}

.main>.tit h2 {

    text-align: center;

    margin: 0;

}

.main>.tit .en h2 strong {

    font-size: 46px;

    color: #f5f5f5;

    text-transform: uppercase;

}

.main>.tit .zh {

    transform: translateY(-38px);

    -moz-transform: translateY(-38px);

    -o-transform: translateY(-38px);

    -ms-transform: translateY(-38px);

    -webkit-transform: translateY(-38px);

}

.main>.tit .zh h2 span {

    font-size: 24px;

    color: #333;

}





.join .main .map img {

    margin: 0 auto;

    display: block;

}





.swiper-container {

    margin-top: 30px;

}

.swiper-slide {

    text-align: center;

    font-size: 18px;

    background: #fff;



    /* Center slide text vertically */

    display: -webkit-box;

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;

    flex-direction: column;

    -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;

    transition: 300ms;

    transform: scale(0.8);



    /* width: 33%!important; */

    /* height: 260px!important; */

    /* flex: 1 50%; */

}

.swiper-slide-active,.swiper-slide-duplicate-active{

    transform: scale(1);

}



.swiper-slide .pic {

    width: 312px;

    height: 312px;

    border-radius: 50%;

    overflow: hidden;

}

.swiper-slide .pic img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}

.swiper-slide>p {

    font-size: 18px;

    margin-top: 36px;

    margin-bottom: 0;

}











@media screen and (max-width:1320px) {

    .join .main {

        width: 100%;

    }

    .swiper-container {

        width: 86%;

    }

    .swiper-slide .pic {

        width: 22vw;

        height: 22vw;

    }

}

@media screen and (max-width:1024px) {

    .join .main {

        padding-bottom: 60px;

    }

}

@media screen and (max-width:992px) {

    .join .main {

        padding: 50px 0;

    }

    .join .main .map {

        width: 85%;

        margin: 0 auto;

    }

    .join .main .map img {

        width: 100%;

    }

}

@media screen and (max-width:767px) {

    .join .main {

        padding: 50px 0;

    }

    .join .main>.tit {

        width: 100%;

        height: auto;

        margin-bottom: 5vw;

    }

    .join .main>.tit .zh {

        transform: translateY(0);

        -moz-transform: translateY(0);

        -o-transform: translateY(0);

        -ms-transform: translateY(0);

        -webkit-transform: translateY(0);

    }

    .swiper-slide {

        width: 100%!important;

    }

    .swiper-slide .pic {

        width: 50vw;

        height: 50vw;

    }

    .swiper-slide>p {

        font-size: 16px;

        margin-top: 16px;

    }

}

@media screen and (max-width:480px) {

    .join .main>.tit .en h2 strong {

        font-size: 9.375vw;

    }

    .join .main>.tit .zh h2 {

        line-height: 6.25vw;

    }

    .join .main>.tit .zh h2 span {

        font-size: 6.25vw;

    }

}