.particles-js-canvas-el {
	width: auto !important;
	height: 100% !important;
	background-position: center;
	background-repeat: repeat;
	background-size: contain;
	object-fit: contain
}

.video-play-wrap {
	position: fixed;
	z-index: 10
}

.video-play-wrap .shadows {
	position: fixed
}

.video-play-wrap .videos {
	position: fixed
}

@media only all and (max-width: 768px) {
	.content {
		margin-top: 60px
	}
}

.content .banner {
	position: relative
}

.content .banner .banner-img {
	width: 100%
}

.content .banner .banner-con {
	position: absolute;
	left: 8.3%;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%)
}

@media only all and (max-width: 768px) {
	.content .banner .banner-con {
		left: 10px
	}
}

.content .banner .banner-con .text {
	font-size: 50px;
	line-height: 1.1;
	position: relative;
	color: #fff;
	font-weight: bold;
	padding-top: 40px;
	padding-bottom: 55px
}

@media only all and (max-width: 1600px) {
	.content .banner .banner-con .text {
		font-size: 30px;
		padding-bottom: 40px
	}
}

@media only all and (max-width: 768px) {
	.content .banner .banner-con .text {
		padding-top: 20px;
		padding-bottom: 20px
	}
}

@media only all and (max-width: 414px) {
	.content .banner .banner-con .text {
		padding-top: 0;
		padding-bottom: 0;
		font-size: 20px
	}
}

.content .banner .banner-con .text::before {
	position: absolute;
	content: "";
	width: 56px;
	height: 7px;
	background-color: #fff;
	top: 0px;
	left: 0px;
	-webkit-transform: skew(-30deg);
	-moz-transform: skew(-30deg);
	-o-transform: skew(-30deg);
	-ms-transform: skew(-30deg);
	transform: skew(-30deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s
}

@media only all and (max-width: 414px) {
	.content .banner .banner-con .text::before {
		display: none
	}
}

.content .banner .banner-con .arrow-down {
	width: 70px;
	display: inline-block;
	-webkit-animation-name: tds-keyframe-bounce;
	animation-name: tds-keyframe-bounce;
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	cursor: pointer
}

@media only all and (max-width: 1600px) {
	.content .banner .banner-con .arrow-down {
		width: 50px
	}
}


.content .job {
    padding-left: 8%;
    padding-right: 8%;
    margin-top: 75px;
    padding-bottom: 120px;
}
.content .job .job-item .job-tit {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -moz-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid #e0e0e0;
    cursor: pointer;
}
.content .job .job-item .job-tit .location {
    font-size: 16px;
    line-height: 30px;
}
.content .job .job-item .job-tit .tit-con .iconfont {
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #0c1244;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
    transition: all 0.3s;
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.content .job .job-item .job-tit .tit-con .text {
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
    line-height: 30px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
    transition: all 0.3s;
}
.content .job .job-item .job-con {
    display: none;
    padding-bottom: 30px;
}
.content .job .job-item .job-con .con-top {
    border-bottom: 1px solid #d9d9d9;
    padding: 54px 100px 30px 60px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    -moz-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: #fff;
}
.content .job .job-item.active .job-con .con-top{
     border-bottom: none
}
.content .job .job-item .job-con .duty {
    width: 39%;
}
.content .job .job-item .job-con .tit {
    font-size: 18px;
    line-height: 30px;
}
.content .job .job-item .job-con .ul {
    font-size: 16px;
    line-height: 30px;
    color: #666;
}
.content .job .job-item .job-con .ul li {
    position: relative;
    padding-left: 22px;
}
@media only all and (max-width: 1600px){
	.content .job .job-item .job-con .tit {
	    font-size: 16px;
	}
}

@media only all and (max-width: 768px){
	.content .job {
	    padding-left: 10px;
	    padding-right: 10px;
	    margin-top: 50px;
	    padding-bottom: 50px;
	}
}
@media only all and (max-width: 414px) {
	.content .banner .banner-con .arrow-down {
		display: none
	}
	.content .job .job-item .job-con .con-top {
	    padding: 20px 10px;
	}
	.content .job .job-item .job-con .duty {
	    width: 100%;
	    padding-top: 10px;
	    padding-bottom: 10px;
	}
	.flex{padding: 23px 8px!important}
	.flex .one{width: 30%!important;}
	.flex .tree,.flex .two,.flex .four{width: 50%!important;}
	.flex .four a {
	    background: #122f73;
	    padding: 8px 10px!important;
	    color: #fff;
	    border-radius: 10px;
	    font-size: 12px;
	    display: block;
        width: 80px;
        margin-bottom: 5px;
        text-align: center;
	}
}


.flex{display: flex;width: 100%;background: #f9f9f9;height: 100%;padding: 23px;font-weight: bold;}
.flex .one{width: 70%;}
.flex .two{width: 30%;}
.flex .tree{width: 30%;}
.flex .four{width: 20%;}
.flex .four a{background: #122f73;padding: 5px 10px;color: #fff;border-radius: 5px;}