.section1 {}
.section1 .section1-wrap {
    position: relative;
    height: 676px;
}
.section1 .section1-wrap .text-wrap {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.section1 .section1-wrap .text-wrap > h1 {
    font-size: 50px;
    font-weight: 700;
    color: #fff;

}
.section1 .section1-wrap .text-wrap > p {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    padding-top: 20px;
}
.section1 .section1-wrap .section1-background-image {
    background-image: url('../../image/career/recruit/section1-bg.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
}
.section1 .section1-wrap .section1-opacity {
    background-color: #073557;
    opacity: 0.3;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Section2 */
.section2 {}
.section2 .section2-wrap {padding-top: 120px;}
.section2 .section2-wrap .text-wrap {text-align: center;}
.section2 .section2-wrap .text-wrap > h1 {font-size: 30px;font-weight: 700;color: #000;}
.section2 .section2-wrap .text-wrap > p {font-size: 16px;font-weight: 400;color: #666;padding-top: 45px;}
.section2 .section2-wrap .content {display: flex;max-width: 1400px;margin: 0 auto;justify-content: space-between;align-items: center; padding-top: 60px;}
.section2 .section2-wrap .content > .item {width: 316px;height: 316px;display: flex;align-items: center;justify-content: center;text-align: center;border: 1px solid #cdcdcd;color: #000;font-weight: 700;font-size: 22px;}
.section2 .section2-wrap .content > img {margin-left: 6px;margin-right: 8px;}
.section2 .section2-wrap .content > .item:last-child {background-color: #222;color: #fff;}

/* Section3 */
.section3 {}
.section3 .section3-wrap {padding-top: 120px;padding-bottom: 190px;}
.section3 .section3-wrap > h1 {font-size: 30px;color: #000;font-weight: 700;text-align: center;}
.section3 .section3-wrap > .tab {
    padding-top: 60px;
    max-width: 1400px;
    margin: 0 auto;
}
.section3 .section3-wrap > .tab ul {
    display: flex;
    align-items: center;
    justify-content: center;
    
}
.section3 .section3-wrap > .tab ul li {
    width: 25%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dedede;
    border-bottom: 1px solid #222;
    cursor: pointer;
}

.section3 .section3-wrap > .tab ul li:nth-child(2) {border-left: 0;}
.section3 .section3-wrap > .tab ul li:nth-child(3) {border-left: 0;}
.section3 .section3-wrap > .tab ul li:nth-child(4) {border-left: 0;}
.section3 .section3-wrap > .tab ul li > h1 {color: #888;font-size: 16px;font-weight: 600;}

.section3 .section3-wrap > .tab ul li.on {border: 1px solid #000;border-bottom: 0;}
.section3 .section3-wrap > .tab ul li.on > h1 {color: #222;}



.section3 .section3-wrap > .content {
    padding-top: 100px;
    max-width: 1400px;
    margin: 0 auto;
}
.section3 .section3-wrap > .content ul {width: 100%;}
.section3 .section3-wrap > .content ul li {padding: 30px 40px;border-bottom: 1px solid #dedede; cursor: pointer;}
.section3 .section3-wrap > .content ul li:first-child {border-top: 1px solid #dedede;}
.section3 .section3-wrap > .content ul li:hover {background-color: #F8F8F8;}
.section3 .section3-wrap > .content ul li > h1 {color: #222;font-size: 16px;font-weight: 600;}
.section3 .section3-wrap > .content ul li > p {color: #222;font-size: 16px;font-weight: 400; padding-top: 10px;}
.bsp-desc {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.bsp-desc > a {height: 60px;width: 350px;background-color: #222;font-size: 16px;font-weight: 700;color: #fff;display: flex;align-items: center;justify-content: center;}

.section3 .section3-wrap > .content .desc {
    
}
.section3 .section3-wrap > .content .desc > h1 {
    padding-top: 100px;
    font-size: 16px;
}
.section3 .section3-wrap > .content .desc > h1,
.section3 .section3-wrap > .content .desc > strong {
    font-size: 16px;
    font-weight: 700;
    color: #000;
}

.section3 .section3-wrap > .content .desc > p {
    font-weight: 400;
    padding-bottom: 60px;
    border-bottom: 1px solid #dedede;
    font-size: 16px;
}

.section3 .section3-wrap > .content .desc > .back-button-wrap {
    padding-top: 40px;
}
.section3 .section3-wrap > .content .desc > .back-button-wrap > button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 360px;
    height: 60px;
    border: 1px solid #999;
    margin: 0 auto;
    cursor: pointer;
    font-size: 15px;
}



/* Mobile */
@media all and (max-width: 1024px) { 

    .section1 .section1-wrap {height: 300px;}
    .section1 .section1-wrap .section1-background-image {background-image: url('../../image/career/recruit/m-recruit-top-img.jpg');}
    .section1 .section1-wrap .text-wrap {left: 0;transform: translate(0, -50%);padding-left: 24px;}
    .section1 .section1-wrap .text-wrap > h1 {font-size: 30px;}
    .section1 .section1-wrap .text-wrap > p {display: none;}


    .section2 .section2-wrap {padding: 70px 24px;padding-bottom: 0;}
    .section2 .section2-wrap .text-wrap {text-align: left;}
    .section2 .section2-wrap .text-wrap > h1 {font-size: 24px;}
    .section2 .section2-wrap .text-wrap > p {font-size: 15px;padding-top: 20px;}
    .section2 .section2-wrap .content {padding-top: 50px;flex-direction: column;}
    .section2 .section2-wrap .content > .item {width: 100%;height: 100px;font-size: 18px;}
    .section2 .section2-wrap .content > img {margin: 0; margin-top: 6px;margin-bottom: 6px;transform: rotate(90deg)}


    .section3 .section3-wrap {padding-top: 100px;padding-bottom: 80px;}
    .section3 .section3-wrap > h1 {font-size: 24px;text-align: left;padding: 0 24px;}
    .section3 .section3-wrap > .tab {padding-left: 24px;overflow-x: auto;margin: 0;width: 100%;padding-top: 20px;}
    .section3 .section3-wrap > .tab ul {justify-content: start;}
    .section3 .section3-wrap > .tab ul li {flex: 0 0 auto;width: auto;border: 1px solid #dedede;}
    .section3 .section3-wrap > .tab ul li {flex: 0 0 auto;width: auto;border: 1px solid #dedede;}
    .section3 .section3-wrap > .tab ul li.on {border: 1px solid #222;}
    .section3 .section3-wrap > .tab ul li > h1 {padding: 0 28px;font-size: 15px;font-weight: 400;}
    .section3 .section3-wrap > .content {padding: 0 24px;padding-top: 50px;}
    .section3 .section3-wrap > .content ul li {padding: 24px 0;}
    .section3 .section3-wrap > .content ul li > p {padding: 0;padding-top: 5px;}
    .bsp-desc {
        flex-direction: column;
        align-items: flex-start;
    }
    .bsp-desc > a {height: 60px;width: 350px;background-color: #222;font-size: 16px;font-weight: 700;color: #fff;margin-top: 20px;width: 100%;}
}