.topNavBar .logo {
    background-image: url("../images/icon_logo_white.png");
    width           : 194px;
    height          : 54px;
}

.topNavBar.sticky .logo {
    background-image: url("../images/icon_logo_blue.png");
}

/* 鍏徃绠€浠 鍏徃绠€浠 */
.company-intruduction {
    padding-bottom: 54px;
}

.company-intruduction .content p {
    text-indent: 2em;
    text-align : left;
    line-height: 30px;
    font-size  : 14px;
    color      : #555;
}

.company-intruduction .companyImg {
    padding-top: 72px;
}

.company-intruduction .companyImg .shadow {
    width     : 100%;
    height    : 152px;
    transform : translateY(-50%);
    box-shadow: 0px 11px 13px 0px rgba(140, 140, 140, 0.17);
}

/* 鍏徃绠€浠 浼佷笟鏂囧寲 */
.company-culture {
    background    : #f8f8f8;
    padding-bottom: 146px;
}

.company-culture .wrap {
    margin-top: 60px;
}

.company-culture .culture {
    border-radius: 30px;
    height       : 320px;
    background   : #fff;
    width        : 21%;
    max-width    : 260px;
    position     : relative;
}

@media screen and (max-width:400px) {
    .company-culture .culture {
        width     : 80%;
        margin    : 0 auto 85px;
        box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    }
}

.company-culture .culture:hover {
    top       : -10px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
}

.company-culture .culture:hover::after {
    bottom: -55px;
}

.company-culture .culture .img {
    height                 : 163px;
    width                  : 100%;
    border-top-left-radius : 30px;
    border-top-right-radius: 30px;
}

.company-culture .spirit .img {
    background-image: url("../images/img_about_company_culture_1.jpg");
}

.company-culture .style .img {
    background-image: url("../images/img_about_company_culture_2.jpg");
}

.company-culture .employment .img {
    background-image: url("../images/img_about_company_culture_3.jpg");
}

.company-culture .management .img {
    background-image: url("../images/img_about_company_culture_4.jpg");
}

.company-culture h4 {
    background : linear-gradient(90deg, transparent, #fff, #fff, #fff, transparent);
    height     : 48px;
    line-height: 48px;
    transform  : translateY(-24px);
    margin     : 0 10px;
    font-size  : 24px;
    color      : #222;
    position   : relative;
}

.company-culture h4::after {
    display   : block;
    content   : '';
    position  : absolute;
    width     : 100%;
    height    : 6px;
    background: linear-gradient(90deg, transparent, #dedede, #dedede, #dedede, transparent);
    ;
    border-radius: 50%;
}

.company-culture .culture .content {
    font-size  : 14px;
    color      : #666;
    line-height: 30px;
    padding    : 0 10px;
}

.company-culture .culture::after {
    display      : block;
    content      : "";
    position     : absolute;
    width        : 170px;
    height       : 15px;
    background   : #eee;
    border-radius: 50%;
    bottom       : -45px;
    left         : calc(50% - 85px);
    filter       : blur(3px);
}

/* 鍏徃绠€浠 缁勭粐鏋舵瀯 */
.organizational-structure {
    padding-bottom: 86px;
}

.organizational-structure-inner {
    margin-top: 60px;
}

.organizational-structure-inner-content {
    width          : 100%;
    display        : flex;
    flex-direction : column;
    justify-content: flex-start;
    align-items    : center;
}

.leader-modal {
    width          : 237px;
    background     : #f3ab32;
    border-radius  : 24px;
    color          : #fff;
    font-size      : 18px;
    padding        : 0 55px;
    margin         : 18px 0;
    display        : flex;
    flex-direction : row;
    justify-content: flex-start;
    align-items    : center;
    letter-spacing : 4px;
    position       : relative;
    opacity        : 0;
    height         : 0px;
    transition     : all 0.2s ease-in-out;
}

.leader-modal.leaderest {
    background    : #f58634;
    padding       : 0 40px;
    font-size     : 24px;
    letter-spacing: 3px;
}

.leader-modal::before {
    content   : "";
    width     : 3px;
    height    : 100px;
    background: #f58634;
    position  : absolute;
    top       : 51px;
    left      : 50%;
    transform : translateX(-50%);
    transition: all 0.2s ease-in-out;
}

.leader-modal:nth-child(1)::before {
    height: 0px;
}

.leader-modal:nth-child(3)::before {
    height: 0px;
}

.leader-modal:nth-child(4)::before {
    height: 0px;
}

.leader-modal:nth-child(5)::before {
    height: 0px;
}

.icon-leader {
    width     : 30px;
    height    : 30px;
    background: url(../images/img_about_company_organizational_1.png);
    display   : block;
    margin    : 0 15px 0 0;
}

.supervisors-board {
    width          : 795px;
    display        : flex;
    flex-direction : row;
    justify-content: flex-end;
    align-items    : center;
}

.supervisors-board-modal {
    width          : 250px;
    height         : 0px;
    font-size      : 16px;
    color          : #f58634;
    border         : solid 2px #f58634;
    border-radius  : 17px;
    padding        : 0 30px;
    letter-spacing : 2px;
    display        : flex;
    flex-direction : row;
    justify-content: flex-start;
    align-items    : center;
    position       : relative;
    opacity        : 0;
    transition     : all 0.3s ease-in-out;
}

.supervisors-board-modal::after {
    content   : "";
    width     : 0px;
    height    : 1px;
    border-top: dashed #f58634 1px;
    margin    : 0 0 0 28px;
    position  : absolute;
    left      : -170px;
    top       : 50%;
    transform : translateY(-50%);
    transition: width 0.3s ease-in-out;
}

.icon-supervise {
    width     : 24px;
    height    : 24px;
    background: url(../images/img_about_company_organizational_2.png);
    display   : block;
    margin    : 0 10px 0 0;
}

.groups-wrap {
    width         : 100%;
    padding-bottom: 15px;
    position      : relative;
}

.groups-wrap::before {
    content   : "";
    width     : 0px;
    height    : 3px;
    background: #f58634;
    position  : absolute;
    bottom    : 0px;
    left      : 50%;
    transform : translateX(-50%);
    transition: width 0.6s ease-in-out;
}

.groups-wrap::after,
.groups-wrap .wei {
    content   : '';
    width     : 29px;
    height    : 4px;
    position  : absolute;
    left      : 0px;
    bottom    : 0px;
    background: #fff;
}

.groups-wrap .wei {
    left : auto;
    right: 0px;
}

.groups {
    width          : 800px;
    margin         : 0 auto;
    display        : flex;
    flex-direction : row;
    justify-content: space-between;
    align-items    : center;
    position       : relative;
}

.groups-left {
    display        : flex;
    flex-direction : column;
    justify-content: space-between;
    justify-items  : flex-start;
}

.groups-right {
    display        : flex;
    flex-direction : column;
    justify-content: space-between;
    justify-items  : flex-end;
}

.groups-modal {
    width          : 250px;
    height         : 0px;
    font-size      : 14px;
    color          : #f58634;
    border         : solid 2px #f58634;
    border-radius  : 17px;
    padding        : 0 30px;
    margin         : 11px 0;
    letter-spacing : 2px;
    display        : flex;
    flex-direction : row;
    justify-content: flex-start;
    align-items    : center;
    position       : relative;
    opacity        : 0;
    transition     : all 0.3s ease-in-out;
}

.groups-left .groups-modal::after {
    content   : "";
    width     : 0px;
    height    : 1px;
    border-top: dashed 1px #f58634;
    position  : absolute;
    right     : -80px;
    top       : 50%;
    transform : translateY(-50%);
    transition: width 0.3s ease-in-out;
}

.groups-left .groups-modal:nth-child(1)::before {
    content     : "";
    width       : 1px;
    height      : 0px;
    border-right: dashed 1px #f58634;
    position    : absolute;
    right       : -80px;
    top         : calc(50% + 55px);
    transform   : translateY(-50%);
}

.groups-left .groups-modal:nth-child(2)::before {
    content   : "";
    width     : 0px;
    height    : 1px;
    border-top: dashed 1px #f58634;
    position  : absolute;
    right     : -145px;
    top       : calc(50% - 27px);
    transform : translateY(-50%);
    transition: width 0.3s ease-in-out;
}

.groups-left .groups-modal:nth-child(3)::before {
    content   : "";
    width     : 0px;
    height    : 1px;
    border-top: dashed 1px #f58634;
    position  : absolute;
    right     : -145px;
    top       : calc(50% - 27px);
    transform : translateY(-50%);
    transition: width 0.3s ease-in-out;
}

.groups-right .groups-modal::after {
    content   : "";
    width     : 0px;
    height    : 1px;
    border-top: dashed 1px #f58634;
    position  : absolute;
    left      : -80px;
    top       : 50%;
    transform : translateY(-50%);
    transition: width 0.3s ease-in-out;
}

.groups-right .groups-modal:nth-child(1)::before {
    content     : "";
    width       : 1px;
    height      : 0px;
    border-right: dashed 1px #f58634;
    position    : absolute;
    left        : -80px;
    top         : calc(50% + 27px);
    transform   : translateY(-50%);
    transition  : height 0.1s ease-in-out;
}

.groups-right .groups-modal:nth-child(2)::before {
    content   : "";
    width     : 0px;
    height    : 1px;
    border-top: dashed 1px #f58634;
    position  : absolute;
    left      : -145px;
    top       : calc(50% - 27px);
    transform : translateY(-50%);
    transition: width 0.3s ease-in-out;
}

.groups-modal.long {
    letter-spacing: 0;
    padding-right : 0px;
}

.staffs {
    width          : 100%;
    display        : flex;
    flex-direction : row;
    justify-content: space-between;
    align-items    : center;
    margin-top     : 49px;
}

.staffs-modal {
    width          : 58px;
    height         : 0px;
    background     : #ffcc29;
    border-radius  : 5px;
    padding        : 4px 0 0 0;
    display        : flex;
    flex-direction : column;
    justify-content: flex-start;
    align-items    : center;
    position       : relative;
    opacity        : 0;
    transition     : all 0.3s ease-in-out;
}

.staffs-modal::before {
    content   : "";
    width     : 2px;
    height    : 0px;
    background: #f58634;
    position  : absolute;
    top       : -52px;
    left      : 50%;
    transform : translateX(-50%);
    transition: height 0.3s ease-in-out;
}

.icon-staff {
    width        : 50px;
    height       : 34px;
    background   : #fff url(../images/img_about_company_organizational_3.png) no-repeat center center;
    border-radius: 5px;
    margin       : 0 0 10px 0;
}

.staffs-modal-text {
    width      : 14px;
    text-align : center;
    line-height: 20px;
    color      : #fff;
}

.organizational-structure-inner-content.add-transition .leader-modal:nth-child(1)::before {
    height          : 64px;
    transition-delay: 2s;
}

.organizational-structure-inner-content.add-transition .leader-modal:nth-child(3)::before {
    height          : 196px;
    transition-delay: 2.3s;
}

.organizational-structure-inner-content.add-transition .leader-modal {
    opacity: 1;
    height : 48px;
}

.organizational-structure-inner-content.add-transition .leader-modal:nth-child(3) {
    transition-delay: 0.3s;
}

.organizational-structure-inner-content.add-transition .leader-modal:nth-child(4) {
    transition-delay: 0.6s;
}

.organizational-structure-inner-content.add-transition .leader-modal:nth-child(5) {
    transition-delay: 0.9s;
}

.organizational-structure-inner-content.add-transition .leader-modal.leaderest {
    opacity: 1;
}

.organizational-structure-inner-content.add-transition .groups-wrap::before {
    width           : 100%;
    transition-delay: 3.2s;
}

.organizational-structure-inner-content.add-transition .staffs-modal::before {
    height          : 50px;
    transition-delay: 3.3s;
}

.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(1):before,
.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(8):before {
    transition-delay: 3.9s;
}

.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(2):before,
.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(7):before {
    transition-delay: 3.7s;
}

.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(3):before,
.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(6):before {
    transition-delay: 3.5s;
}

.organizational-structure-inner-content.add-transition .staffs-modal {
    height          : 180px;
    opacity         : 1;
    transition-delay: 1.1s;
}

.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(1),
.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(7) {
    transition-delay: 1.8s;
}

.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(2),
.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(6) {
    transition-delay: 1.6s;
}

.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(3),
.organizational-structure-inner-content.add-transition .staffs-modal:nth-child(5) {
    transition-delay: 1.4s;
}

.organizational-structure-inner-content.add-transition .supervisors-board-modal {
    height          : 34px;
    opacity         : 1;
    transition-delay: 0.2s;
}

.organizational-structure-inner-content.add-transition .supervisors-board-modal::after {
    width           : 130px;
    transition-delay: 1.9s;
}

.organizational-structure-inner-content.add-transition .groups-modal {
    height          : 34px;
    opacity         : 1;
    transition-delay: 0.6s;
}

.organizational-structure-inner-content.add-transition .groups-modal::after {
    width           : 65px;
    transition-delay: 2.4s;
}

.organizational-structure-inner-content.add-transition .groups-modal:nth-child(2)::before {
    width           : 65px;
    transition-delay: 3s;
}

.organizational-structure-inner-content.add-transition .groups-modal:nth-child(3)::before {
    width           : 65px;
    transition-delay: 3s;
}

.organizational-structure-inner-content.add-transition .groups-modal:nth-child(1)::before {
    height          : 52px;
    transition-delay: 3.3s;
}

.organizational-structure-inner-content.add-transition .more-group .groups-modal:nth-child(1)::before {
    height: 112px;
}


.organizational-structure-bg {
    display   : none;
    width     : 100%;
    margin-top: 40px;
}

.organizational-structure-bg img {
    width: 100%;
}

/* 璇氳仒鑻辨墠 鍔犲叆鎴戜滑 */
.joinUs .wrap {
    align-items: flex-start;
}

.joinUs .left-menu {
    width      : 200px;
    padding-top: 100px;
    text-align : center;
    color      : #222;
    font-size  : 18px;
}

.joinUs .left-menu ul li {
    border-bottom: 1px solid #d2d3d9;
    padding      : 18px;
    cursor       : pointer;
    position     : relative;
}

.joinUs .left-menu ul li.active {
    color: #e58f01;
}

.joinUs .left-menu ul li.active::before {
    position  : absolute;
    width     : 2px;
    height    : 15px;
    display   : block;
    content   : "";
    background: #f3ab32;
    top       : calc(50% - 6px);
    left      : 50px;
}

.joinUs .right-section {
    flex   : 1;
    padding: 0 78px;
}

/* 鍔犲叆鎴戜滑 鍔犲叆鎴戜滑 */
.joinUs .join-us .content .item {
    margin-top: 72px;
}

.joinUs .content .item ul {
    text-align: left;
}

.joinUs .content .item ul li {
    list-style-type: disc;
    color          : #666;
    font-size      : 14px;
    line-height    : 30px;
}

.joinUs .img {
    margin-top   : 60px;
    margin-bottom: 25px;
}

/* 鎷涜仒 */
.social-recruitment .content .item,
.school-recruitment .content .item,
.talent-reserve .content .item {
    font-size  : 14px;
    text-align : left;
    color      : #666;
    line-height: 32px;
    margin-top : 60px;
}

.social-recruitment .content .item p,
.school-recruitment .content .item p,
.talent-reserve .content .item p {
    text-indent: 2em;
}

.recruit-wrap {
    margin-top: 60px;
}

.recruit-title {
    font-size    : 24px;
    color        : #222;
    margin-bottom: 42px;
}

.recruit-title span {
    position: relative;
}

.recruit-title span::after {
    content    : "";
    width      : 30px;
    height     : 30px;
    border-top : solid 4px #faddb0;
    border-left: solid 4px #faddb0;
    position   : absolute;
    left       : -14px;
    top        : -10px;
}

.recruit-title span::before {
    content      : "";
    width        : 30px;
    height       : 30px;
    border-right : solid 4px #faddb0;
    border-bottom: solid 4px #faddb0;
    position     : absolute;
    bottom       : -10px;
    right        : -14px;
}

.recruit-list {
    margin-top: 30px;
}

.recruit-list>li {
    margin-bottom: 24px;
}

.recruit-list .recruit-item {
    padding   : 45px;
    background: #fff;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
    position  : relative;
    text-align: left;
}

.recruit-list .recruit-item:after {
    content   : "";
    width     : 10px;
    height    : 10px;
    background: #f3ab33;
    position  : absolute;
    left      : 20px;
    top       : 0px;
}

.recruit-list .recruit-item p {
    font-size    : 18px;
    color        : #222;
    margin-bottom: 20px;
}

.recruit-list .recruit-item:hover p,
.recruit-list li.active .recruit-item p {
    color: #e58f01;
}

.recruit-list .recruit-item .recruit-item-info {
    display        : flex;
    flex-direction : row;
    justify-content: space-between;
    align-items    : center;
    font-size      : 14px;
    color          : #666;
}

.recruit-list .recruit-detail {
    padding    : 45px;
    font-size  : 14px;
    color      : #666;
    background : #f8f8f8;
    text-align : left;
    line-height: 28px;
    display    : none;
}

.recruit-list .recruit-detail ol,
.recruit-list .recruit-detail ul {
    list-style: none;
}

/* 鑱旂郴鎴戜滑 */
.contactUs .wrap .item {
    width        : 48%;
    height       : 120px;
    background   : #fff;
    margin-bottom: 60px;
    display      : flex;
    align-items  : center;
    padding-left : 60px;
    box-shadow   : 0px 2px 13px 0px rgba(191, 191, 191, 0.3);
    font-size    : 16px;
    color        : #222;
    padding-right: 60px;
}

.contactUs .wrap .item:hover {
    background: #f3ab32;
}

.contactUs .wrap .item img {
    margin-right: 23px;
}


@media screen and (max-width:800px) {
    .contactUs .wrap .item {
        width : 80%;
        margin: 30px auto;
    }
}

/* 鍏徃绠€浠 璧勮川璇佷功 */
.qualification-certificate {
    padding-top   : 110px;
    padding-bottom: 86px;
    background    : #f8f8f8;
    position      : relative;
}

.qualification-certificate .arrow-wrap {
    position : absolute;
    top      : 262px;
    height   : 400px;
    right    : 0;
    left     : 0;
    width    : 100%;
    max-width: 1300px;
    left     : 50%;
    transform: translateX(-50%);
    z-index  : 0;
}

#qualification {
    width    : 100%;
    max-width: 1200px;
    margin   : 60px auto 0;
    height   : 400px;
    position : relative;
}

.swiper-slide {
    display        : flex;
    flex-direction : row;
    justify-content: space-around;
    align-items    : center;
    cursor         : pointer;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    outline: none;
}

.pinch-zoom-container {
    position  : fixed !important;
    top       : 0 !important;
    left      : 0 !important;
    width     : 100% !important;
    height    : 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index   : 10000;
}

.big-img {
    width          : 100%;
    text-align     : center;
    height         : 100%;
    display        : flex;
    left           : 0px;
    top            : 0px;
    align-items    : center;
    justify-content: center;
}

.pinch-zoom-container.hidden {
    display: none;
}

.big-img img {
    width: 52%;
}

.swiper-pagination-bullet {
    width       : 15px;
    height      : 15px;
    margin-right: 30px;
    background  : #e58f01;
}

@media screen and (max-width:1015px) {
    .company-culture .wrap {
        padding: 0 15px;
    }

    .recruit-title {
        font-size: 20px;
    }

    .contactUs .wrap .item {
        width: 100%;
    }
}

@media screen and (max-width:840px) {
    .organizational-structure-inner {
        display: none;
    }

    .organizational-structure-bg {
        display: block;
    }
}

@media screen and (max-width:800px) {
    .company-culture div.culture {
        width: 45%;
    }

    .company-culture div.culture:nth-child(1),
    .company-culture div.culture:nth-child(2) {
        margin-bottom: 100px;
    }

    .swiper-container .swiper-wrapper .swiper-slide img {
        width: 100%;
    }

    .joinUs .left-menu {
        width: 100%;
    }

    .joinUs .img img {
        width: 100%;
    }
}

@media screen and (max-width:620px) {
    .company-intruduction .companyImg {
        padding: 12px 0 0 0;
    }

    .company-intruduction .companyImg .img {
        margin: 0;
    }

    .joinUs .right-section {
        padding: 0;
    }

    .controls .swiper-pagination-bullet {
        margin-right: 20px;
    }

    .big-img img {
        width: 100%;
    }
}

@media screen and (max-width:400px) {
    .swiper-container .swiper-wrapper .swiper-slide img {
        width: 100%;
    }

}