.join_banners {
    position: relative;
    width: 100%;
    height: 100%;
    background: url("../images/banner_join.png") center center no-repeat;
    background-size: 100% 100%;
}

.page_title_join {
    font-weight: bold;
    color: #ffffff;
    line-height: 2.875rem;
    height: 2.875rem;
    margin-top: 9.875rem;
}

.page_title_joinspan1 {
    font-size: 1.5rem;
    letter-spacing: 0.125rem;
}

.page_title_joinspan2 {
    font-size: 2.25rem;
    letter-spacing: 0px;
}

.page_title_joinspan3 {
    font-size: 3rem;
    letter-spacing: 0px;
}

.page_space_join {
    margin-top: 1.1875rem;
    width: 43rem;
    height: 1px;
    background-color: #ffffff;
    opacity: 0.32;
}

.page_text_join {
    margin-top: 1.3125rem;
    height: 3.8125rem;
    color: #ffffff;
}

.page_text_join_linktext {
    font-size: 0.875rem;
    line-height: 0.875rem;
    height: 0.875rem;
    color: #c1d3ec;
}

.page_text_join_linkway {
    margin-top: 0.3215rem;
    font-size: 0.875rem;
    line-height: 1.15rem;
}

    .page_text_join_linkway > span {
        font-size: 1.125rem;
        color: #ffea00;
        font-weight: bold;
    }

.join_platform {
    width: 100%;
    height: 30.5rem;
    margin: 5rem 0 0 0;
}

.join_platform_side {
    float: left;
    width: 26.5%;
    height: 100%;
    background-color: #f2f2f2;
}

.join_platform_side_img {
    width: 100%;
    height: 16rem;
    background-color: #000;
}

.join_platform_side_content {
    width: 100%;
    height: 14.5rem;
    overflow: hidden;
    position: relative;
}

.join_platform_side_content_title {
    width: 100%;
    height: 1.5rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    margin-top: 4.375rem;
}

.join_platform_side_content_space {
    width: 6.125rem;
    height: 1px;
    background-color: #dcdcdc;
    margin: 0 auto;
    margin-top: 0.5625rem;
}

.join_platform_side_content_text1 {
    margin: 0.875rem auto;
    width: 16.125rem;
    height: 5rem;
    line-height: 1.5rem;
    color: #666666;
    font-size: 0.875rem;
}

.join_platform_side_content_text2 {
    margin: 0.875rem auto;
    width: 20.125rem;
    height: 5rem;
    line-height: 1.5rem;
    color: #666666;
    font-size: 0.875rem;
}

.join_platform_side_content_arrow {
    width: 0.75rem;
    position: absolute;
    left: 49%;
}

.top20 {
    top: 1.25rem;
}

.bottom20 {
    bottom: 1.25rem;
}

.totop {
    border-bottom: 1px solid;
    border-left: 1px solid;
    width: 0.53125rem;
    height: 0.53125rem;
    border-color: #999999;
    transform: rotate(135deg);
}

.totop_link {
    margin-top: -0.3125rem;
}

.tobottom {
    border-bottom: 1px solid;
    border-left: 1px solid;
    width: 0.53125rem;
    height: 0.53125rem;
    border-color: #999999;
    transform: rotate(-45deg);
}

.join_platform_center {
    float: left;
    width: 47%;
    height: 100%;
    border-radius: 0.125rem;
    position: relative;
}

.join_platform_center_content {
    width: 100%;
    height: 10.375rem;
    background-color: #0076ef;
    opacity: 0.5;
    position: absolute;
    left: 0;
    bottom: 0;
}

.join_platform_center_content_title {
    height: 1.5rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    color: #ffffff;
    margin: 1.875rem 0 0 4.375rem;
    /*box-shadow: 0 0 0.625rem 0 rgba(0, 153, 255, 0.6);*/
}

.join_platform_center_content_space {
    width: 6.125rem;
    height: 1px;
    background-color: #f2f2f2;
    opacity: 0.5;
    margin: 0.625rem 0 0 4.4375rem;
}

.join_platform_center_content_text {
    width: 33.25rem;
    height: 4.5rem;
    line-height: 1.5rem;
    font-size: 0.875rem;
    color: #d1d1d1;
    margin: 1.5rem 0 0 4.125rem;
}

.join_benefits_center {
    float: left;
    width: 47%;
    height: 100%;
    border-radius: 0.125rem;
    background-color: #ffffff;
    position: relative;
    background: url("../images/join_work_env.png") center center no-repeat;
    background-size: 100% 100%;
}

.join_benefits_side {
    float: left;
    width: 26.5%;
    height: 100%;
    overflow: hidden;
}

.join_benefits_cell {
    width: 100%;
    height: 50%;
    background-color: #ffffff;
    position: relative;
    overflow: hidden;
}

.join_benefits_cell_title {
    margin-top: 5.875rem;
    width: 100%;
    height: 1.5rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
}

.join_benefits_cell_space {
    margin: 0 auto;
    margin-top: 0.625rem;
    width: 6.125rem;
    height: 1px;
    background-color: #dcdcdc;
}

.join_benefits_cell_text {
    margin-top: 0.9375rem;
    width: 100%;
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: 0.875rem;
    color: #666666;
    text-align: center;
}

.join_benefits_cellother {
    width: 100%;
    height: 50%;
    background-color: #0084ff;
    overflow: hidden;
}

.join_benefits_cellother_title {
    height: 1.5rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    color: #fffefe;
    margin: 5rem 0 0 3rem;
}

.join_benefits_cellother_space {
    width: 6.125rem;
    height: 1px;
    background-color: #e6f3ff;
    opacity: 0.5;
    margin: 0.625rem 0 0 3rem;
}

.join_benefits_cellother_text {
    width: 15rem;
    height: 8.25rem;
    line-height: 1.5rem;
    color: #c2e2ff;
    margin: 1rem 0 0 3rem;
    font-size: 0.875rem;
}

.join_benefits_title {
    height: 1.25rem;
    font-size: 1.25rem;
    font-weight: bold;
    line-height: 1.25rem;
    color: #ffffff;
    position: absolute;
    left: 2.3125rem;
    top: 0.625rem;
}

.join_benefits_tipimg {
    width: 9.6875rem;
    height: 2.625rem;
    opacity: 0.68;
    position: absolute;
    left: 0;
    top: 0;
}

.join_benefits_skewtop {
    width: 0.46875rem;
    height: 1.3125rem;
    transform: skew(15deg);
    position: absolute;
    left: 10.3125rem;
    top: 0;
    opacity: 0.68;
}

.join_benefits_skewbottom {
    width: 0.46875rem;
    height: 1.3125rem;
    transform: skew(-15deg);
    position: absolute;
    left: 10.3125rem;
    top: 1.3125rem;
    opacity: 0.68;
}

.join_benefits_rightarrow {
    width: 0;
    height: 0;
    border-top: 1.3125rem solid transparent;
    border-left: 0.3125rem solid;
    border-bottom: 1.3125rem solid transparent;
    opacity: 0.68;
    position: absolute;
    left: 9.6875rem;
    top: 0;
}

.join_allowanceside_img {
    width: 100%;
    height: 24rem;
}

.join_allowanceside_title {
    width: 100%;
    height: 6.625rem;
    overflow: hidden;
    position: relative;
}

.join_allowanceside_title_text {
    margin-top: 2.5625rem;
    width: 100%;
    height: 1.5rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
}

.top14 {
    top: 0.875rem;
}

.bottom14 {
    bottom: 0.875rem;
}

.join_allowancecenter_content {
    width: 100%;
    height: 14.625rem;
    background-color: #0492ff;
    opacity: 0.8;
    position: absolute;
    left: 0px;
    top: 8.625rem;
}

.join_allowancecenter_content_title {
    height: 1.25rem;
    line-height: 1.25rem;
    font-size: 1.25rem;
    color: #ffffff;
    box-shadow: 0px 0px 0.625rem 0px rgba(0, 153, 255, 0.6);
    margin: 5.75rem 0 0 7.875rem;
}

.join_allowancecenter_content_text {
    width: 25.1875rem;
    height: 3rem;
    line-height: 1.5rem;
    font-size: 0.875rem;
    color: #ffffff;
    box-shadow: 0px 0px 0.625rem 0px rgba(0, 153, 255, 0.6);
    margin: 0.75rem 7.9375rem 0 7.9375rem;
}

.quotation_marks_topleft {
    width: 1rem;
    height: 2rem;
    position: absolute;
    left: 2.5rem;
    top: 3.125rem;
}

.quotation_marks_curve_topleft {
    position: absolute;
    border-style: solid;
    border-color: transparent;
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    border: 0.46875rem solid transparent;
    border-left-color: #ffffff;
    transform: rotate(45deg);
    left: 0;
    top: 0px;
}

.quotation_marks_square_topleft {
    width: 1rem;
    height: 1rem;
    background-color: #ffffff;
    position: absolute;
    left: 0;
    top: 1rem;
}

.quotation_marks_topright {
    width: 1rem;
    height: 2rem;
    position: absolute;
    left: 3.875rem;
    top: 3.125rem;
}

.quotation_marks_curve_topright {
    position: absolute;
    border-style: solid;
    border-color: transparent;
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    border: 0.5rem solid transparent;
    border-left-color: #ffffff;
    transform: rotate(45deg);
    left: 0;
    top: 0px;
    opacity: 0.5;
}

.quotation_marks_square_topright {
    width: 1rem;
    height: 1rem;
    background-color: #ffffff;
    position: absolute;
    left: 0;
    top: 1rem;
    opacity: 0.5;
}

.quotation_marks_bottomleft {
    width: 1rem;
    height: 2rem;
    position: absolute;
    right: 3.875rem;
    bottom: 3.125rem;
}

.quotation_marks_square_bottomleft {
    width: 1rem;
    height: 1rem;
    background-color: #ffffff;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0.5;
}

.quotation_marks_curve_bottomleft {
    position: absolute;
    border-style: solid;
    border-color: transparent;
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    border: 0.5rem solid transparent;
    border-left-color: #ffffff;
    transform: rotate(225deg);
    left: -1rem;
    top: 0px;
    opacity: 0.5;
}

.quotation_marks_bottomright {
    width: 1rem;
    height: 2rem;
    position: absolute;
    right: 2.5rem;
    bottom: 3.125rem;
}

.quotation_marks_square_bottomright {
    width: 1rem;
    height: 1rem;
    background-color: #ffffff;
    position: absolute;
    left: 0;
    top: 0;
}

.quotation_marks_curve_bottomright {
    position: absolute;
    border-style: solid;
    border-color: transparent;
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    border: 0.5rem solid transparent;
    border-left-color: #ffffff;
    transform: rotate(225deg);
    left: -1rem;
    top: 0px;
}

.join_tab {
    height: 2.8125rem;
    margin: 0 33%;
}

.join_tab_button {
    float: left;
    width: 50%;
    height: 2.8125rem;
    text-align: center;
    font-size: 2rem;
    font-weight: bold;
    line-height: 2.75rem;
    letter-spacing: 1px;
    color: #666666;
    cursor: pointer;
}

.join_tab_button_text {
    width: 100%;
    height: 2rem;
    font-size: 2rem;
    font-weight: bold;
    line-height: 2rem;
    letter-spacing: 1px;
    color: #666666;
    text-align: center;
}

.join_tab_button_bottom {
    width: 6.25rem;
    height: 1px;
    background-color: #d2d2d2;
    position: relative;
    display: none;
    margin: 0.6875rem 4.3125rem 0 4.3125rem;
}

.join_tab_button_bottomcenter {
    width: 1.875rem;
    height: 1px;
    background-color: #047cff;
    position: absolute;
    left: 2.1875rem;
    display: none;
}

.join_tab_button:hover .join_tab_button_text, .join_tab_button_isactive .join_tab_button_text {
    color: #047cff;
}

.join_tab_button:hover .join_tab_button_bottom, .join_tab_button:hover .join_tab_button_bottomcenter, .join_tab_button_isactive .join_tab_button_bottom, .join_tab_button_isactive .join_tab_button_bottomcenter {
    display: block;
}

.join_search {
    width: 100%;
    height: 3rem;
    background-color: #ffffff;
    border-image-source: linear-gradient(90deg, #009cff 0%, #00ccff 100%);
    border-image-slice: 1;
    margin: 2.8125rem 0 0 0;
}

.join_search_input {
    float: left;
    width: 92%;
    height: 3rem;
    border-style: solid;
    border-width: 2px;
    border-image-source: linear-gradient(90deg, #009cff 0%, #00ccff 100%);
    border-image-slice: 1;
    border-radius: 0.25rem;
    background: #fff;
    font-size: 0.875rem;
    line-height: 1.5rem;
    outline: none;
    color: #999999;
    padding:0.625rem 1.25rem;
}


.join_search_button {
    float:right;
    width:8%;
    height:3rem;
    background-image: linear-gradient(90deg, #23c3ff 0%, #0072ff 100%), linear-gradient(#ffffff, #ffffff);
	background-blend-mode: normal, normal;
	border-radius: 0px 0.25rem 0.25rem 0px;
    position:relative;
    cursor:pointer;

}

    .join_search_button > div {
        margin:1rem 1.75rem;
        width:3.25rem;
        height:1rem;
        font-size: 1rem;
        line-height: 1rem;
        color: #ffffff;
        padding-left:1.25rem;
        /*box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.6);*/
        position: relative;
    }

    .join_search_button > div:before {
        content:"";
        position:absolute;
        top:0;
        left:0;
        width:1rem;
        height:1rem;
        background: url("../images/icon_post_search.png") center center no-repeat;
        background-size: 100% 100%;
    }


.join_posttype {
    width: 100%;
    height: 6rem;
    overflow: hidden;
}

.join_posttype_row {
    width: 100%;
    height: 1.75rem;
    margin: 1.25rem 0 0 0;
    font-size: 0.875rem;
    line-height: 1.75rem;
}

.join_posttype_title {
    float: left;
    color: #666666;
}

.join_posttype_nav {
    width: 100%;
    height: 0.75rem;
}

    .join_posttype_nav > li {
        float: left;
        margin-left: 1.25rem;
        color: #047cff;
        cursor: pointer;
        padding-left: 5px;
        padding-right: 5px;
    }

.join_posttype_nav_active {
    color: #ffffff !important;
    background-color: #047cff;
    border-radius: 4px;
}

.join_post {
    width: 100%;
    height: auto;
    margin: 5rem 0 0 0;
    overflow: hidden;
}

.join_post_list {
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
}

.join_post_cell {
    width: 100%;
    height: auto;
    margin: 1.25rem 0 0 0;
    overflow: hidden;
}

    .join_post_cell:first-child {
        margin: 0;
    }

.join_post_cell_title {
    width: 100%;
    height: 3rem;
    background-color: #eeeeee;
}

.join_post_cell_title_space {
    float: left;
    width: 0.25rem;
    height: 3rem;
    background-color: #047cff;
}

.join_post_cell_title_text {
    float: left;
    margin-left: 1.1875rem;
    height: 3rem;
    line-height: 3rem;
    font-size: 1.25rem;
    font-weight: bold;
    color: #000000;
}

.join_post_cell_showdetail {
    float: right;
    width: 1.25rem;
    height: 1.25rem;
    background: url("../images/join_post_detail.png") center center no-repeat;
    background-size: 100% 100%;
    margin: 14px;
    cursor: pointer;
}

.join_post_cell_context {
    padding: 1rem 0;
    width: 100%;
    height: auto;
    display: none;
}

.is_active .join_post_cell_context {
    display: block;
}

.join_post_cell_context_title {
    width: 100%;
    height: 2.75rem;
}

.join_post_cell_context_title_space {
    float: left;
    width: 0.375rem;
    height: 0.375rem;
    background-color: #047cff;
    margin: 1.125rem 0 0.3125rem 1.5rem;
}

.join_post_cell_context_title_text {
    float: left;
    height: 2.75rem;
    font-size: 1rem;
    line-height: 2.75rem;
    font-weight: bold;
    color: #3a3a3a;
    margin: 0 0 0 0.5625rem;
}

.join_post_cell_context_text {
    font-size: 0.875rem;
    line-height: 1.75rem;
    color: #333333;
    padding: 0 2.5rem;
}

.join_post_cell_context_button {
    width: 7.5rem;
    height: 2.25rem;
    background-image: linear-gradient(90deg, #23c3ff 0%, #0072ff 100%), linear-gradient(#ffffff, #ffffff);
    background-blend-mode: normal, normal;
    border-radius: 0.25rem;
    margin: 1rem 0 2.75rem 2.375rem;
    cursor: pointer;
    padding: 0.625rem 1.5625rem;
}

    .join_post_cell_context_button > div {
        width: 4.125rem;
        height: 1rem;
        font-size: 1rem;
        line-height: 1rem;
        color: #ffffff; 
    }

.join_post_pagination {
    width: 100%;
    margin: 2.5rem 0 0 0;
}