/*
 * 网络大型招聘会
 */
/* DIN */
@font-face {
  font-family: DINAlternate;
  src: url(https://wwwstatic.vivo.com.cn/vivoportal/web/dist/css/brand/fonts/DIN-Med-Alt_2546660.eot);
  src: url(https://wwwstatic.vivo.com.cn/vivoportal/web/dist/css/brand/fonts/DIN-Med-Alt_2546660.eot?#font-spider)
      format('embedded-opentype'),
    url(https://wwwstatic.vivo.com.cn/vivoportal/web/dist/css/brand/fonts/DIN-Med-Alt_dc670cd.woff)
      format('woff'),
    url(https://wwwstatic.vivo.com.cn/vivoportal/web/dist/css/brand/fonts/DIN-Med-Alt_4851aa1.ttf)
      format('truetype'),
    url(https://wwwstatic.vivo.com.cn/vivoportal/web/dist/css/brand/fonts/DIN-Med-Alt_b6a4630.svg)
      format('svg');
  font-style: normal;
  font-weight: 200;
}
/* 思源极细 */
@font-face {
  font-family: 'SY1';
  font-display: swap;
  src: url('//at.alicdn.com/t/webfont_a0snk9k8g2s.eot'); /* IE9*/
  src: url('//at.alicdn.com/t/webfont_a0snk9k8g2s.eot?#iefix')
      format('embedded-opentype'),
    /* IE6-IE8 */ url('//at.alicdn.com/t/webfont_a0snk9k8g2s.woff2')
      format('woff2'),
    url('//at.alicdn.com/t/webfont_a0snk9k8g2s.woff') format('woff'),
    /* chrome、firefox */ url('//at.alicdn.com/t/webfont_a0snk9k8g2s.ttf')
      format('truetype'),
    /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
      url('//at.alicdn.com/t/webfont_a0snk9k8g2s.svg#思源黑体-极细')
      format('svg'); /* iOS 4.1- */
}
/* 思源加粗 */
@font-face {
  font-family: 'SY2';
  font-display: swap;
  src: url('//at.alicdn.com/t/webfont_bx9qczxhawb.eot'); /* IE9*/
  src: url('//at.alicdn.com/t/webfont_bx9qczxhawb.eot?#iefix')
      format('embedded-opentype'),
    /* IE6-IE8 */ url('//at.alicdn.com/t/webfont_bx9qczxhawb.woff2')
      format('woff2'),
    url('//at.alicdn.com/t/webfont_bx9qczxhawb.woff') format('woff'),
    /* chrome、firefox */ url('//at.alicdn.com/t/webfont_bx9qczxhawb.ttf')
      format('truetype'),
    /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
      url('//at.alicdn.com/t/webfont_bx9qczxhawb.svg#思源黑体-粗') format('svg'); /* iOS 4.1- */
}
/* 思源超粗 */
@font-face {
  font-family: 'SY3';
  font-display: swap;
  src: url('//at.alicdn.com/t/webfont_jgcbar2vtcl.eot'); /* IE9*/
  src: url('//at.alicdn.com/t/webfont_jgcbar2vtcl.eot?#iefix')
      format('embedded-opentype'),
    /* IE6-IE8 */ url('//at.alicdn.com/t/webfont_jgcbar2vtcl.woff2')
      format('woff2'),
    url('//at.alicdn.com/t/webfont_jgcbar2vtcl.woff') format('woff'),
    /* chrome、firefox */ url('//at.alicdn.com/t/webfont_jgcbar2vtcl.ttf')
      format('truetype'),
    /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
      url('//at.alicdn.com/t/webfont_jgcbar2vtcl.svg#NotoSansHans-Black')
      format('svg'); /* iOS 4.1- */
}

/**/
#m-net-recruit {
  height: 350px !important;
  overflow: hidden;
}

#m-net-recruit > h1 {
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center center;
}

/* ID独立构成页面 */
#m-mn-WLRD__container {
  width: 1440px;
  margin: 0 auto;
}

/* 面包屑 */
.m-WLRD__breadcrumb {
  background: #e9ecef;
  padding: 0.75rem 1rem;
  border-radius: 3px;
  margin: 20px 0;
  color: #6c757d;
  font-size: 14px;
}

.m-WLRD__breadcrumb > a {
  color: #007bff;
}

/* BODY 主体内容 */
.m-bd-WLRD__container {
}

/* 主标题 */
.m-tt__large_recruit {
  font-size: 60px;
  font-weight: bold;
  text-align: center;
  color: #3a445d;
}

/* 折叠搜索框 */
.m-search-toggle-container {
  width: 100%;
  height: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  margin-bottom: 5px;
}

.m-search-toggle-container span:last-child {
  display: flex;

  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100%;
  background-color: red;
  color: #fff;
}

/* 头部检索 */

.m-searchForm-wrapper {
  /*display: flex;*/
  border: 1px solid #e8e8e8;
  border-radius: 3px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding: 10px;
  margin-bottom: 20px;
}

.m-searchForm-wrapper > form {
}

.m-select-container {
  width: 100%;
}

.f-nature-select {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  border-bottom: 1px dashed #e8e8e8;
  padding-bottom: 5px;
  margin: 5px 0 !important;
}

/* Select2 Label */
.f-nature-select label {
  font-size: 14px;
  flex: 0 0 100px;
  display: block;
  /*background-color: purple;*/
  text-align: left;
  color: #999;
}

.f-nature-select .select2-container {
  width: 90% !important;
}

.f-nature-select .select2-container--default .selection {
  /*flex: 0 0 80%;*/
  background-color: red;
}

.select2-selection--multiple {
  /*background-color: #0C35BF !important;*/
  border: none !important;
}

/* Select2 选择项样式 */
.select2-selection__choice {
  font-size: 14px;
  color: #00c2cf !important;
  border-radius: 5px !important;
  background-color: #e3fdff !important;
  border: none !important;
  padding: 5px !important;
}

/* Select2 删除小图标 */
.select2-selection__choice__remove {
  display: inline-block !important;
  color: #fff !important;
  padding: 0px 6px !important;
  border-radius: 50% !important;
  background-color: #ffd973 !important;
  transform: scale(0.65);
}

/* 输入框及按钮的包裹框 */

.m-input-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
}

.m-input-container > label {
  font-size: 14px;
  flex: 0 0 1;
  color: #999;
  text-align: left;
}

/* 自定义输入框样式 */
.s-custom-form-control {
  border: 1px solid #e8e8e8;
  border-radius: 3px;
  padding: 10px;
  font-size: 14px;
}

.s-custom-form-control::-webkit-input-placeholder {
  color: #dcdcdc;
}
.s-custom-form-control::-moz-input-placeholder {
  color: #dcdcdc;
}
.s-custom-form-control::-ms-input-placeholder {
  color: #dcdcdc;
}

.select2-search__field::-webkit-input-placeholder {
  color: #dcdcdc;
}
.select2-search__field::-moz-input-placeholder {
  color: #dcdcdc;
}
.select2-search__field::-ms-input-placeholder {
  color: #dcdcdc;
}

/* 自定义按钮样式 */
.s-custom-btn-primary {
  background-color: #5473e9;
  border: none;
  padding: 10px;
  border-radius: 3px;
  color: #fff;
}

.s-custom-btn-light {
  background-color: #f5f7fb;
  border: none;
  padding: 10px;
  border-radius: 3px;
  color: #485661;
}

/* flexbox */

.m-input-flexbox {
  flex: 0 0 90%;
  display: flex;
}

/* Hack */
#searchForm {
  border-bottom-width: 0;
  padding-bottom: 0;
}
#searchForm label {
  width: auto;
}

/* 排序条 */
.m-sort-btn-container {
  display: flex;
  height: 50px;
  line-height: 50px;
  background-color: #fcfcfc;
  border: solid 1px #e8e8e8;
  margin: 10px 0 30px 0;
}

.m-sort-btn-container > span {
  font-size: 14px;
  padding: 0 20px;
  background-color: #ffba00;
  color: #fff;
}

.m-sort-btn-container a {
  padding: 0 20px;
  border-right: 1px solid #e5e5e5;
  background-color: #fcfcfc;
  font-size: 14px;
  color: #6d6d6d;
}

.m-sort-btn-container a:hover {
  text-decoration: none;
  background-color: #fff;
  color: #5473e9;
}

.m-sort-btn-container > a.asc,
.m-sort-btn-container > a.desc {
  position: relative;
  background-color: #fff;
  color: #5473e9;
  padding-right: 26px;
}

.m-sort-btn-container > a.asc:after {
  position: absolute;
  width: 0;
  height: 0;
  content: '';
  border: 4px solid #01c700;
  top: 50%;
  right: 14px;
  transform: translateY(-70%);
  border-top-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
}

.m-sort-btn-container > a.desc:after {
  position: absolute;
  width: 0;
  height: 0;
  content: '';
  border: 4px solid #01c700;
  top: 50%;
  right: 14px;
  transform: translateY(-30%);
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
}

/*
 * --------------------------------------------
 *
 * --------------------------------------------
 */

.m-company-list__container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.m-company-list__container span {
  font-family: SY1;
  font-size: 14px;
  color: #787a89;
}

.m-company-list__container h3 {
  font-family: SY2;
  font-size: 18px;
  font-weight: bold;
  color: #485661;
  /*    */
  margin-bottom: 0;
  text-indent: 0;
}

.m-company-single {
  flex: 0 0 30%;
  background-color: #fff;
  box-shadow: 0 15px 30px 4px rgba(204, 204, 204, 0.29);
  border-radius: 5px;
  box-sizing: border-box;
  padding: 20px;
  margin-bottom: 60px;
  background-image: url('../img/svg-white-bg.svg');
  background-repeat: no-repeat;
  background-position: 100% 100%;
  background-size: 100%;
  border: 1px solid #eaeefd;
  transition: all 0.5s ease;
}

.m-company-single:hover {
  border: 1px solid #5d7cea;
  box-shadow: 0 15px 30px 4px rgba(204, 204, 204, 0.49);
  transition: all 0.5s ease;
}

.m-company-single > h1 {
  display: flex;
  align-items: baseline;
  /*background-color: red;*/
  font-family: SY3;
  font-size: 34px;
  font-weight: 900;
  color: #485661;
  line-height: 40px;
  height: 80px;
  margin-bottom: 0;
  overflow: hidden;
}

/* 基本信息 */
.m-base-info {
  width: 100%;
  /*background-color: red;*/
  display: flex;
  margin-top: 24px;
  padding: 0 5px;
}

.m-base-info > div:first-child {
  position: relative;
  padding-right: 40px;
  margin-right: 40px;
}

.m-base-info > div:after {
  content: '';
  position: absolute;
  width: 1px;
  top: 5px;
  bottom: 5px;
  right: 0;
  background-color: #d9d9d9;
}

.m-base-info > div h3 {
  margin-top: 10px;
}

/* 数字展示 */
.m-recruit-num {
  position: relative;
  width: 100%;
  height: 200px;
  background: url('../img/svg-blue-bg2.svg') no-repeat;
  background-size: cover;
  border-radius: 5px;
  margin-top: 30px;
  overflow: hidden;
}

.m-recruit-num h3 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 6px;
  color: #fff;
  font-weight: normal;
  text-align: center;
}

.m-recruit-num ul {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}

.m-recruit-num ul li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex: 0 0 20%;
  transition: all 1s ease;
  /*background-color: purple;*/
}

.m-recruit-num ul li > span {
  color: #fff;
  font-size: 12px;
  transform: translateY(10px);
}

.m-recruit-num ul li > h5 {
  font-family: DINAlternate-Bold;
  color: transparent;
  font-size: 90px;
  text-shadow: 0 2px 4px rgba(34, 65, 183, 0.1);
  background-image: linear-gradient(
    to bottom,
    #fff 30%,
    rgba(216, 216, 216, 0) 80%
  );
  -webkit-background-clip: text;
  margin-bottom: 0;
}

.m-recruit-num ul:hover li {
  transform: translateY(-20px);
  transition: all 1s ease;
}

.m-recruit-num ul li:nth-child(1) {
  transition-duration: 0.9s;
}

.m-recruit-num ul li:nth-child(2) {
  transition-duration: 0.6s;
}

.m-recruit-num ul li:nth-child(3) {
  transition-duration: 0.3s;
}

.m-recruit-num ul:hover li:nth-child(1) {
  transition-duration: 0.3s;
}

.m-recruit-num ul:hover li:nth-child(2) {
  transition-duration: 0.6s;
}

.m-recruit-num ul:hover li:nth-child(3) {
  transition-duration: 0.9s;
}

/* 招聘占比 */
.m-num-progress {
  height: 100px;
  padding: 0 5px;
  margin-top: 20px;
}

.m-num-progress span {
  display: block;
}

.m-num-progress ul {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

.m-num-progress li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 30px;

  /*background-color: red;*/
}

.m-num-progress li h3 {
  font-weight: normal;
  font-size: 18px;
  width: 25%;
}

.m-num-progress li div {
  flex: 0 0 70%;
  height: 10px;
  background-color: #efefef;
  border-radius: 5px;
}

.m-num-progress li div span {
  display: block;
  height: 10px;
  border-radius: 5px;
  background: linear-gradient(to right, #5473e9, #13e940);
}

/* 卡片链接 */

.m-company-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100px;
  border-top: 1px dashed #dedede;
  padding: 0 5px;
  margin-top: 20px;
  /*background: red;*/
}

.m-company-link div {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /*background: #0b2e13;*/
}

.m-company-link div h3 {
  font-family: DINAlternate-Bold;
  text-align: center;
  font-size: 20px;
  margin-top: 10px;
}

.m-company-link section {
  position: relative;
  display: block;
  margin-bottom: 0;
}

.m-company-link section a {
  font-family: SY1;
  display: block;
  color: #fff;
  width: 112px;
  height: 34px;
  line-height: 34px;
  padding: 0 0 0 20px;
  background-image: linear-gradient(138deg, #ffba00 0%, #ff7e00 100%);
  box-shadow: 2px 2px 5px 2px rgba(255, 152, 0, 0.28);
  border-radius: 50px;
  font-size: 12px;
  opacity: 0;
  transition: opacity 0.6s ease;
}

.m-company-link section a:hover {
  color: #fff;
  text-decoration: none;
}

.m-company-link section > div {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 24px;
  height: 24px;
  background-color: #ff9000;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /*transform: scale(0.8);*/
  transition: all 0.6s ease;
}

.m-company-link section p {
  display: block;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  font-family: SY2;
  font-size: 14px;
  opacity: 1;
  transition: all 0.6s ease;
}

.m-company-link section > div span {
  display: block;
  height: 2px;
  width: 8px;
  background-color: #fff;
  border-radius: 5px;
}

.m-company-link section > div span:nth-child(1) {
  transform: translate(4px, 0px) rotate(45deg);
}
.m-company-link section > div span:nth-child(2) {
  width: 13px;
}
.m-company-link section > div span:nth-child(3) {
  transform: translate(4px, 0px) rotate(-45deg);
}

.m-company-link section:hover > a {
  opacity: 1;
  transition: opacity 0.6s ease;
}

.m-company-link section:hover > p {
  transform: translateY(-50px);
  opacity: 0;
  transition: all 0.6s ease;
}

.m-company-link section:hover > div {
  background-color: #fff;
  transform: scale(1) translateX(77px);
  transition: all 0.6s ease;
}

.m-company-link section:hover > div span {
  background-color: #ff9000;
}

/*
 * 分页
 */

.m-pagination-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.m-pagination-container > div:first-child {
  margin-right: 10px;
  font-size: 14px;
}

.m-pagination-container > div:last-child {
  margin-left: 10px;
  font-size: 14px;
}
.m-pagination-container span {
  /*display: inline-block;*/
  /*padding: 3px 10px;*/
  /*background-color: #5473E9;*/
  /*color: #fff;*/
  /*border-radius: 5px;*/
}

/*
 * 排行榜
 */

.m-rank-container {
  position: fixed;
  top: 500px;

  width: 200px;
  height: 300px;
  /*border: 1px solid red;*/
  padding: 50px 20px 10px 20px;
  background-image: url('../img/rank-bg.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center bottom;
}

.m-rank-position__new {
  right: calc((100% - 1440px) / 2 - 200px);
}

.m-rank-position__normal {
  right: calc((100% - 1200px) / 2 - 200px);
}

.m-rank-container > h1 {
  font-family: SY3;
  font-size: 20px;
  font-weight: bolder;
  color: #fff;
  text-align: center;
}

.m-rank-container > li {
  display: block;
  font-family: SY1;
  font-size: 14px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/*
 * --------------------------------------------
 * 普通表格展现形式
 * --------------------------------------------
 */

#m-mn-WLRD__container__table {
  width: 1200px;
  margin: 0 auto;
}

.m-tablelist-mninfo {
  width: 100%;
}

.m-custom-table__list {
}

.m-custom-table__list > thead {
  background-color: #5473e9;
  color: #fff;
}

.m-custom-table__list thead td {
  text-align: center;
}

.m-tablelist-mninfo a {
  position: relative;
  font-family: SY3;
  font-weight: bolder;
  font-size: 22px;
  color: #5473e9;
  transition: color 0.2s ease;
}

.m-tablelist-mninfo a:hover {
  text-decoration: none;
  color: #ff9500;
  transition: color 0.2s ease;
}

.m-tablelist-mninfo a:hover::after {
  content: '';
  width: 100%;
  height: 3px;
  background-color: #ff9500;
  position: absolute;
  left: 0;
  bottom: -5px;
}

.m-tablelist-mninfo ul {
  display: flex;
  margin: 10px 0 0 0;
  padding: 0 0 0 2px;
}

.m-tablelist-mninfo ul li {
  position: relative;
  /*background-color: #b1dfbb;*/
}

.m-tablelist-mninfo ul li:not(:last-child) {
  margin-right: 20px;
  padding-right: 20px;
}

.m-tablelist-mninfo ul li:not(:last-child)::after {
  content: '';
  width: 1px;
  height: 70%;
  background-color: rgba(0, 0, 0, 0.05);
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
}

.m-tablelist-mninfo ul li span {
  font-family: SY1;
  font-size: 12px;
  color: #babcc7;
  font-weight: normal;
}

.m-tablelist-mninfo ul li p {
  margin-bottom: 0;
  font-family: SY2;
  font-size: 14px;
  font-weight: normal;
  color: #485661;
}

.m-custom-table__list tbody tr td strong {
  font-family: DINAlternate-Bold;
  font-size: 30px;
  font-weight: bolder;
  color: #787a89;
}

.m-custom-table__list tbody tr th:first-child {
  text-align: center;
}

.m-custom-table__list thead tr th:not(:nth-child(2)) {
  text-align: center;
}

.m-custom-table__list tbody tr td {
  text-align: center;
  vertical-align: middle;
}

.m-custom-table__list tbody tr th,
.m-custom-table__list tbody tr td,
.m-custom-table__list thead tr th {
  border: 1px solid rgba(0, 0, 0, 0.07);
}

.m-custom-table__list tbody tr {
  transition: background-color 0.3s ease;
}

.m-custom-table__list tbody tr:hover {
  background-color: #eef1fc;
  transition: background-color 0.3s ease;
}

/* 客服 */

/*  pc  */
.m-service {
  width: 95px;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 380px;
  right: calc((100% - 1440px) / 2);
}

.m-service img {
  width: 100%;
}

.m-service > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.m-service > div > h6 {
  font-size: 12px;
}

.m-service > div > span {
  font-size: 14px;
}

.m-service > a {
  margin: 10px 0;
}
