body {
  background-color: rgba(247, 248, 250, 1);
}

.container {
  position: relative;
  margin: 1.57rem 1.3rem;
}

.crumb {
    /*padding-left: 1.3rem;*/
    display: flex;
    align-items: center;
    color: #666;
    margin: 1.3rem 0 .7rem 0;
}

 .crumb .crumb-home {
  display: block;
  width: .2rem;
  height: .2rem;
  margin-right: .1rem;
}

 .crumb a {
  color: #666;
  font-weight: 400;
}

 .crumb a:last-child {
  color: #333;
}

 .crumb span {
  margin-left: .05rem;
  margin-right: .05rem;
}

.container .title span {
  display: block;
}

.container .title span:first-child {
  font-size: .56rem;
  font-weight: 700;
  color: rgba(51, 51, 51, 1);
  font-family: 'HarmonyOS Sans SC';
  margin-bottom: .2rem;
}

.container .title span:last-child {
  font-size: .2rem;
  line-height: .36rem;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
  font-family: 'HarmonyOS Sans SC';
}

.container .banner {
  margin: .5rem 0 .7rem 0;
}

.container .banner img {
  width: 16.6rem;
  height: 3.6rem;
}

.container .search_box {
  margin-bottom: .5rem;
  display: flex;
  justify-content: center;
}

.container .search_box .search {
  width: 8rem;
  height: .55rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid rgba(223, 223, 223, 1);
  padding: 0 .2rem;
}

.container .search_box .search input {
  flex: 1;
  height: 100%;
  padding: .18rem;
  box-sizing: border-box;
  background: transparent;
}

.container .search_box .search img {
  width: .18rem;
  height: .18rem;
}


.container .main .info {
  display: flex;
  gap: 1.3rem;
}

.container .main .info .left {
  width: 3rem;
}

.container .main .info .left hr {
  border: 0.01rem solid rgba(223, 223, 223, 1);
  margin: .16rem 0 .4rem 0;
  width: 100%;
}

.container .main .info .left .label {
  display: flex;
  justify-content: space-between;
  font-size: .16rem;
  font-weight: 400;
  font-family: 'HarmonyOS Sans SC';
  color: rgba(51, 51, 51, 1);
}

.container .main .info .left .label span:last-child {
  color: rgba(153, 153, 153, 1);
  cursor: pointer;
  transition: color 0.3s ease;
}

.container .main .info .left .label span:last-child.active {
  color: rgba(0, 89, 255, 1);
}

.container .main .info .left .item {
  margin-bottom: .6rem;
}

.container .main .info .left .item .item_label {
  display: flex;
  justify-content: space-between;
  font-size: .26rem;
  font-weight: 500;
  margin-bottom: .3rem;
  color: rgba(51, 51, 51, 1);
  font-family: 'HarmonyOS Sans SC';
}

.container .main .info .left .item .item_value .checkbox-group {
  display: flex;
  flex-direction: column;
  gap: .22rem;
}

/* 筛选面板样式 */
.container .main .info .left .filter-group {
  margin-bottom: .6rem;
}

/* 分组标题样式 */
.container .main .info .left .group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .26rem;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  margin-bottom: .3rem;
  cursor: pointer;
  padding: .04rem 0;
  font-family: 'HarmonyOS Sans SC';
}

.container .main .info .left .group-icon {
  color: rgba(153, 153, 153, 1);
  transition: transform 0.2s ease;
  font-size: .18rem;
}

.container .main .info .left .group-expanded .group-icon {
  transform: rotate(180deg);
}

/* 选项列表样式 */
.container .main .info .left .options-list {
  margin-left: .04rem;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.container .main .info .left .option-item {
  display: flex;
  align-items: center;
  padding: .06rem 0;
  cursor: pointer;
  /*font-size: .20rem;*/
  color: rgba(51, 51, 51, 1);
  font-family: 'HarmonyOS Sans SC';
  font-weight: 400;
}

/* 复选框样式 */
.container .main .info .left .custom-checkbox {
  width: .17rem;
  height: .17rem;
  border: 1px solid rgba(220, 223, 230, 1);
  border-radius: .03rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: .08rem;
  flex-shrink: 0;
}

.container .main .info .left .custom-checkbox.checked {
  background-color: rgba(0, 89, 255, 1);
  border-color: rgba(0, 89, 255, 1);
}

.container .main .info .left .check-icon {
  color: white;
  font-size: .12rem;
  display: none;
}

.container .main .info .left .checked .check-icon {
  display: inline;
}

/* 树形结构缩进 */
.container .main .info .left .tree-level-1 {
  margin-left: .16rem;
}

.container .main .info .left .tree-level-2 {
  margin-left: .32rem;
}

/* 展开/折叠图标 */
.container .main .info .left .tree-toggle {
  display: inline-block;
  width: .16rem;
  height: .16rem;
  margin-right: .02rem;
  text-align: center;
  color: rgba(153, 153, 153, 1);
  font-size: .16rem;
}

.container .main .info .left .tree-toggle.expanded {
  transform: rotate(90deg);
  color: rgba(0, 89, 255, 1)
}

.container .main .info .left .item .item_value .checkbox-item {
  display: flex;
  align-items: center;
  font-size: .18rem;
  cursor: pointer;
  color: rgba(51, 51, 51, 1);
  font-weight: 400;
  font-family: 'HarmonyOS Sans SC';
}

.container .main .info .left .item .item_value .checkbox-item input[type="checkbox"] {
  width: .14rem;
  height: .14rem;
  margin-right: .16rem;
  accent-color: rgba(0, 89, 255, 1);
  border: .01rem solid rgba(217, 217, 217, 1);
}

.container .main .info .left .item .item_value .checkbox-item input[type="checkbox"]:checked+.checkbox-text {
  color: rgba(0, 89, 255, 1);
}

.container .main .info .right {
  width: 10.7rem;
  /* flex: 1; */
  padding-top: .3rem;
}

.container .main .info .right .job-list {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}

.container .main .info .right .job-item {
  width: 10.7rem;
  /* height: 5.975rem; */
  background: transparent;
  padding: .34rem .36rem .32rem .36rem;
  display: flex;
  justify-content: space-between;
}

.container .main .info .right .job-item:hover {
  box-shadow: 0 .04rem .261rem 0 rgba(0, 0, 0, 0.07);

}

.container .main .info .right .job-item .job-item-info {}

.container .main .info .right .job-item .job-item-info .job-header {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: .4rem;
  margin-bottom: .18rem;
}

.container .main .info .right .job-item .job-item-info .job-header .job-title {
  /*font-size: .24rem;*/
  font-weight: 500;
  font-family: 'HarmonyOS Sans SC';
  color: rgba(51, 51, 51, 1);
  margin: 0;
}

.container .main .info .right .job-item .job-item-info .job-info {
  display: flex;
  align-items: center;
  gap: .14rem;
  /*font-size: .18rem;*/
  font-weight: 400;
  color: rgba(51, 51, 51, 1);
  margin-bottom: .32rem;
}

.container .main .info .right .job-item .job-item-info .separate {
  width: 0;
  height: .12rem;
  border: .01rem solid rgba(51, 51, 51, 1);
}

.container .main .info .right .job-item .job-item-info .job-description {
  /*font-size: .16rem;*/
  font-weight: 400;
  color: rgba(153, 153, 153, 1);
}

.container .main .info .right .job-item .job-item-info .job-description span {
  display: block;
  line-height: .28rem;
  margin-bottom: .14rem;
}

.container .main .info .right .job-item .job-footer {
  display: flex;
  justify-content: space-between;
  align-items: start;
  text-decoration: none;
}

.container .main .info .right .job-item .job-footer .apply-btn {
  font-size: .4rem;
  font-weight: 400;
  font-family: 'HarmonyOS Sans SC';
  color: rgba(51, 51, 51, 1);
  cursor: pointer;
  transition: color 0.3s ease;
}

.container .main .info .right .job-item .job-footer img {
  width: .4rem;
  height: .4rem;
  margin-top: .05rem;
  margin-right: .15rem;
}

.container .main .info .right .job-item .job-footer .normal {
  display: none;
}

.container .main .info .right .job-item:hover .job-footer .normal {
  display: block;
}

.container .main .info .right .job-item .job-footer .active {
  display: block;
}

.container .main .info .right .job-item:hover .job-footer .active {
  display: none;
}

.container .main .info .right .job-item:hover .job-footer .apply-btn {
  color: rgba(0, 89, 255, 1);
}

/* 分页组件样式 */
.container .pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  list-style: none;
  margin-top: .7rem;
}

.container .pagination li {
  display: inline-block;
}

.container .pagination a {
  display: inline-block;
  padding: 8px 12px;
  text-decoration: none;
  color: #333;
  font-size: 16px;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.container .pagination a:hover {
  background-color: #f0f0f0;
}

.container .pagination .active a {
  color: #1890ff;
  font-weight: bold;
  text-decoration: none;
}

.container .pagination .ellipsis {
  padding: 8px 0;
  color: #999;
}

.container .pagination .prev a,
.container .pagination .next a {
  color: #666;
}

.container .pagination .prev a img,
.container .pagination .next a img {
  width: .4557rem;
  height: .4457rem;
}

.container .pagination .prev a img.normal,
.container .pagination .next a img.normal {
  display: block;
}

.container .pagination .prev a img.active,
.container .pagination .next a img.active {
  display: none;
}

.container .pagination .prev a:hover img.normal,
.container .pagination .next a:hover img.normal {
  display: none;
}

.container .pagination .prev a:hover img.active,
.container .pagination .next a:hover img.active {
  display: block;
}

.container .pagination .prev a:hover,
.container .pagination .next a:hover {
  color: #1890ff;
  background-color: transparent;
}

@media (max-width: 767px) {
    .container {
        margin: 1.57rem .4rem;
    }
    .container .banner img {
        width: 100%;
        height: auto;
    }
    .container .title span:first-child {
        font-size: .4rem;
    }
    .container .main .info {
        gap: .2rem;
    }
    .container .main .info .left {
        flex-shrink: 0;
        width: 2.3rem;
    }
    .container .main .info .right .job-item {
        width: 100%;
    }
    .container .main .info .left .group-icon {
        width: .2rem;
    }
    .container .main .info .left .option-item {
        font-size: .22rem;
    }
    
    .container .main .info .right .job-item .job-item-info .job-description {
        font-size: .223rem;
    }
    .container .main .info .right .job-item .job-item-info .job-info {
        font-size: .22rem;
    }
    .container .main .info .right .job-item .job-item-info .job-header .job-title {
        font-size: .3rem;
    }
    .container .main .info .left .label {
        font-size: .24rem;
    }
    
    
    
    
    
    
}







