#keywords {
  margin-bottom: 60px;
  display: flex;
  flex: 1;
  flex-direction: column;
}

.skyDom {
  position: sticky;
  left: 1.5vw;
  width: 0;
  z-index: 0;
}

#keywords .t {
  width: 96vw;
}


.cateListTemo {
  position: sticky;
  left: 1.5vw;
  width: 0;
}

.cateList {
  width: 96vw;
  background-color: var(--colorW);
  margin: 20px 0px;
  padding: 20px;
}

.cateList h2 {
  padding: 10px 0;
  font-size: 18px;
}

.cateList_div {
  display: flex;
  flex-wrap: wrap;
}

.cateList .cateList_div a,
.cateList .cateList_div p {
  margin-bottom: 20px;
  margin-right: 30px;
  color: var(--color6);
}

.cateList .cateList_div p {
  margin-bottom: 20px;
  margin-right: 30px;
  font-size: 14px;
}

/* 数字显示 */
.cateList .cateList_div p:after,
.cateList .cateList_div a:after {
  color: var(--main-color);
  content: attr(attrData);
  margin-left: 3px;
}



/* 侧栏属性选择 */
#keywords .side {
  box-shadow: 0 0 15px -7px #ccc;
  left: -240px;
  position: fixed;
  top: 0;
  transition: all .2s ease-in;
  z-index: 1000;

  background: #fff;
  margin-right: 10px;
  width: 240px;
}

/* 激活时 */
#keywords .side.active {
  left: 0;
}

/* 隐藏时提示 */
#keywords .side .hide {
  align-items: center;
  background-color: #fff;
  border-radius: 0 8px 8px 0;
  box-shadow: 3px 0 7px -4px #666;
  cursor: pointer;
  display: flex;
  justify-content: center;
  letter-spacing: .2px;
  padding: 10px 0;
  position: absolute;
  right: -30px;
  top: 50%;
  transform: translateY(-50%);
  transition: all .2s;
  width: 30px;
  writing-mode: vertical-rl;
  z-index: 1000;
}

#keywords .side .hide .iconfont-ut {
  font-size: 14px;
  font-weight: 700;
  margin-top: 6px;
}

#keywords .attrModule {
  height: 100vh;
  overflow-y: auto;
  padding: 30px 0 60px;
  position: sticky;
  top: 0;
}

.attrModule .filter {
  background: #fff;
  padding: 0 10px;
  position: relative;
}

/* 过滤标题区域 */
.attrModule .filter .add {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.attrModule .filter .add b {
  color: #333;
  font-size: 18px;
  font-weight: 400;
}


/* 应用和重置 */
.attrModule .filter .btnBox {
  display: flex;
}

/* 每项按钮 */
.attrModule .filter .btnBox .s-btn {
  font-size: 13px;
  letter-spacing: .5px;
  margin: 0 2px 10px;
  padding: 10px 15px;
  width: 100%;
  border-radius: 4px;
}


/* 属性列表 */
.attrModule>ul {
  border-bottom: 1px solid #d4d4d4;
}

/* 属性标题 */
.attrModule>ul>li .titleBox .title {
  align-items: center;
  border-top: 1px solid #d4d4d4;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  padding: 12px 10px;
}

.attrModule>ul>li .titleBox .title b {
  color: #333;
  font-size: 13px;
  font-weight: 400;
}

/* 属性图标 */
.attrModule>ul>li .titleBox .title .iconfont-ut {
  color: #999;
  font-size: 12px;
  transform: rotate(0);
  transition: all .2s;
}

/* 当前属性展开时 */
.attrModule>ul>li .titleBox .title .iconfont-ut.active {
  transform: rotate(180deg);
}

/* 每项列表 */
.attrModule>ul>li .list {
  border-top: 1px solid #d4d4d4;
  max-height: 300px;
  overflow-y: auto;
  padding-left: 10px;
}

/* 已选择的列表属性 */
.attrModule>ul>li .titleBox .selected {
  display: flex;
  flex-wrap: wrap;
  padding: 0 10px;
}

.attrModule>ul>li .titleBox .selected li {
  align-items: center;
  background-color: #cccccc4d;
  display: flex;
  font-size: 12px;
  margin: 0 5px 5px 0;
  padding: 5px 8px;
}

.attrModule>ul>li .titleBox .selected li .iconfont-ut {
  cursor: pointer;
  font-size: 10px;
  margin-left: 6px;
}


.attrModule>ul>li .titleBox .selected li .iconfont-ut {
  cursor: pointer;
  font-size: 10px;
  margin-left: 6px;
}


/* 清空当前筛选 */
.attrModule>ul>li .reset {
  color: var(--main-color);
  cursor: pointer;
  display: inline-block;
  font-size: 13px;
  margin: 10px;
}

.attrModule>ul>li .reset:hover {
  text-decoration: underline;
}


/* checkbox */
.attrModule>ul>li .list .checkbox {
  margin: 16px 0;
}

/* 禁止下方子节点点击 */
.attrModule>ul>li .list .checkbox>.checkbox-frame,
.attrModule>ul>li .list .checkbox>.checkbox-txt {
  pointer-events: none;
}




@media screen and (max-width: 1024px) {

  #keywords .side {
    display: none;
  }
}