/* styles reset */
/* * {
	margin: 0;
	padding: 0;
} */

a:hover {
	text-decoration: none;
}

input {
	outline: none;
}

label {
	margin: 0;
}

ul,
ol {
	margin: 0;
	padding: 0;
}

p {
	margin: 0;
}

html,
body {
	scroll-behavior: smooth;
}
/* styles reset */

/* header */
header {
	height: 4.46rem;
	position: relative;
}

/* banner start */
.banner {
	cursor: pointer;
	min-height: 29.3rem;
}

.banner .tip {
	width: 12rem;
	height: 7.125rem;
	left: 22.5rem;
	top: 11.4375rem;
	z-index: 99;
}

.banner .tip h4 {
	width: 12rem;
	height: 4.125rem;
	font-size: 3rem;
	font-family: 'PingFang SC';
	line-height: 4.125rem;
	color: rgba(0, 0, 0, 0.85);
}

.banner .tip h5 {
	width: 12rem;
	height: 2.75rem;
	font-size: 2rem;
	font-family: 'PingFang SC';
	line-height: 2.75rem;
	color: rgba(0, 0, 0, 0.45);
}
/* banner end */

/* nav start */
.nav {
	width: 120rem;
	height: 7.75rem;
	background: #fff;
	padding-top: 2rem;
	position: relative;
	z-index: 99;
	transition: height 0.5s, opacity 0.5s;
}

.nav ul {
	height: 2rem;
	margin: 0 auto;
}

.nav ul li {
	height: 2rem;
	line-height: 2rem;
}

.nav ul li:first-child {
	margin-right: 7.5rem;
}

.nav ul li {
	font-size: 1.5rem;
	font-family: 'PingFang SC';
	font-weight: bold;
	color: rgba(0, 0, 0, 0.45);
	cursor: pointer;
}

.nav ul li.active {
	color: #00a1e9;
}

/* search-input start */
.nav .search-input {
	height: 3.5rem;
	left: 35.25rem;
	bottom: -1.75rem;
	z-index: 99;
	border: 1px solid transparent;
}

.nav .search-input .form-control {
	width: 39.5rem;
	height: 3.5rem;
}

.nav .search-input .form-control::placeholder {
	color: rgba(0, 0, 0, 0.45);
	font-weight: 500;
	font-size: 1rem;
	font-family: 'PingFang SC';
	font-weight: 500;
}

.nav .search-input .border-left-radius {
	border-top-left-radius: 3.875rem;
	border-bottom-left-radius: 3.875rem;
	box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.05);
	text-indent: 3rem;
}

.search-icon {
	width: 1.25rem;
	height: 1.25rem;
	top: 0.9rem;
	left: 1.625rem;
	z-index: 99;
}

.nav .border-right-radius {
	border-radius: 62px;
	letter-spacing: 0.5rem;
}

.nav .btn {
	width: 10rem;
	height: 3.5rem;
	background: #00a1e9;
	color: #fff;
	font-size: 1.25rem;
	font-weight: 500;
	font-family: 'PingFang SC';
}
/* search-input end */

/* nav end */

/* content start */
.content {
	height: auto;
	overflow: hidden;
	background-color: #f8f8f8;
	padding: 3.75rem 28.875rem 5rem;
}

.content .search-result {
	width: 31.25rem;
	height: 2.0625rem;
	font-size: 1.5rem;
	font-family: 'PingFang SC';
	font-weight: 500;
	margin: 0 auto 2rem;
	text-align: center;
	color: rgba(0, 0, 0, 0.85);
}

.content .job-types-desc {
	display: flex;
}

/* job-types start */
.content .job-types {
	width: 17.125rem;
	height: 30rem;
	background: #fff;
	border-radius: 4px;
	margin-right: 2rem;
	padding: 2rem 1.6875rem 2rem 2rem;
}

@media screen and (max-width: 1700px) {
	.content .job-types ul li:not(:last-child) {
		margin-bottom: 1.5rem;
	}
}
@media screen and (max-width: 1500px) {
	.content .job-types ul li:not(:last-child) {
		margin-bottom: 1rem;
	}
}

.content .job-types ul li {
	user-select: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.125rem;
	font-family: 'PingFang SC';
	font-weight: 500;
	color: rgba(0, 0, 0, 0.65);
}

.content .job-types ul li label {
	flex: 1;
	cursor: pointer;
}

.content .job-types li:not(:last-child) {
	margin-bottom: 1.8rem;
}

.content .job-types ul li.active {
	font-size: 1.125rem;
	font-family: 'PingFang SC';
	font-weight: bold;
	color: rgba(0, 0, 0, 0.85);
}
/* job-types end */

/* job-desc start */
.content .job-desc-outside {
	width: 43.125rem;
	display: none;
}

.content .active-job-list {
	display: block;
}

.content .not-active-job-list {
	display: none;
}

.content .job-desc {
	width: 43.125rem;
	background: #fff;
	border-radius: 4px;
	padding: 1.5rem 1.5rem;
	margin-bottom: 1.5rem;
	cursor: pointer;
	position: relative;
}

/* 鼠标移入上移 */
@keyframes up {
	0% {
		bottom: 0px;
	}

	100% {
		bottom: 8px;
	}
}

/* 鼠标移出下移 */
@keyframes down {
	0% {
		bottom: 8px;
	}

	100% {
		bottom: 0px;
	}
}

.content .animate-up {
	animation: up 500ms;
	animation-fill-mode: forwards;
}

.content .animate-down {
	animation: down 500ms;
	animation-fill-mode: forwards;
}

.job-desc-shadow {
	box-shadow: 0px 1rem 1rem rgba(0, 0, 0, 0.05);
}

.content .job-desc .title {
	font-size: 1.5rem;
	font-family: 'PingFang SC';
	font-weight: 500;
	line-height: 2rem;
	color: rgba(0, 0, 0, 0.85);
}

.content .job-desc .job-desc-title-blue {
	color: #00a1e9;
}

.content .job-desc .sub-title {
	font-size: 1rem;
	font-family: 'PingFang SC';
	font-weight: 500;
	color: rgba(0, 0, 0, 0.85);
	margin-bottom: 1rem;
}

.content .job-desc .sub-title span {
	padding: 0 0.5rem;
	color: rgba(0, 0, 0, 0.15);
}

.content .job-desc .desc {
	font-size: 1rem;
	font-family: 'PingFang SC';
	font-weight: 500;
	line-height: 1.5rem;
	color: rgba(0, 0, 0, 0.45);
	/* 文字显示两行，超出部分用省略号显示 */
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* pagination start */
.pagination-outside {
	float: right;
}

.pagination1 {
	display: block;
}

.pagination2 {
	display: none;
}

.pagination2 ul li,
.pagination2 .previous,
.pagination2 .next {
	pointer-events: none;
	user-select: none;
}

.disabled {
	pointer-events: none;
}

/* .pagination1 .pagination{
	flex: 3;
}

.pagination1 .previous{
	flex: 1;
}

.pagination1 .next{
	flex: 1;
} */

.page-item {
	width: 2rem;
	height: 2rem;
	text-align: center;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	margin: 0 0.25rem;
	cursor: pointer;
}

.pagination .page-item a {
	font-size: 0.875rem;
	font-family: 'PingFang SC';
	color: rgba(0, 0, 0, 0.6);
}

.pagination .page-item.active {
	background: #00a1e9;
}

.pagination .active a {
	color: #fff;
}

.active-job-list .masking{
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	display: flex;
}
.active-job-list .masking img{
	width: 15rem;
}
/* pagination end */

/* job-desc end */

/* content end */
