.day {
  font-family: Arial;
  font-weight: 400;
  font-size: 50px;
  color: #c13432;
  position: relative;
  /* top: -10px; */
}
.day::after {
  content: "";
  position: absolute;
  bottom: 10px;
  left: 0;
  width: 100%;
  height: 1px;
  background: #c13432;
}

.listTitle {
  font-size: 16px;
  color: #333333;
}
.listDesc {
  font-size: 14px;
  color: #8c8c8c;
}

.listItem:hover {
  background: #f7fbff;
}
.listItem:hover.listItem::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: #c13432;
}
.dateArea {
  align-items: center;
  margin-left: 52px;
  margin-right: 64px;
}
a:hover {
  color: #c13432;
  text-decoration: underline;
  cursor: pointer;
}

/* 大于768 pc*/
@media screen and (min-width: 768px) {
  main {
    margin-bottom: 60px !important;
  }
  .date {
    font-family: Arial;
    font-weight: 400;
    font-size: 16px;
    color: #333333;
    position: relative;
    top: 6.5px;
  }
  .listTextArea {
    align-items: flex-start;
  }
  .listDesc {
    margin-right: 20px;
    margin-top: 20px;
  }
  .datePd {
    margin-left: 52px;
    margin-right: 64px;
  }
  .listItem {
    height: 141px;
    background: #ffffff;
    box-shadow: 0px 0px 5px 0px rgba(96, 96, 96, 0.15);
    /* align-items: flex-start; */
    justify-content: center;
    position: relative;
    align-items: center;
  }
  .listItem ~ .listItem {
    margin-top: 21px;
  }

  .listContent,
  .dateArea {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 68px;
  }
  .listContent {
    margin-left: 46px;
    padding-top: 10px;
  }
  /* 设置 PC 字体大小 */
  .breadcrumbArea {
    font-size: 14px;
  }
}

/* 列表项基础样式 */
.listAreaNew {
  padding: 0;
}

.listItemRegular {
  padding: 0 20px;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  height: 83px; /* 设置固定高度为83px */
  padding-left: 25px; /* 为伪元素留出空间 */
  text-decoration: none; /* 移除下划线 */
  color: inherit; /* 继承颜色 */
  /* 覆盖common.css中的通用a标签样式 */
  color: #333333 !important;
}

.listItemRegular::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background-color: #c13432;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.listItemRegular .listTitle {
  font-weight: 400;
  font-size: 16px;
  color: #333333;
  flex: 1;
  margin-right: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: none;
}

.listItemRegular .listDate {
  font-family: Arial;
  font-weight: 400;
  font-size: 16px;
  color: #8c8c8c;
  white-space: nowrap;
}

/* 第一个元素的样式 */

.listItemRegular:hover {
  background-color: #c13432;
  color: #fff;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
}

.listItemRegular:hover .listTitle,
.listItemRegular:hover .listDate {
  color: #fff;
}


/* 移除之前的高亮样式 */
.listItemHighlighted {
  display: none;
}

/* 调整分页样式 */
.pageArea {
  display: flex;
  justify-content: center;
}

.pageArea .pagination {
  padding-left: 0;
  list-style: none;
  border-radius: 0;
}

.pageArea .page-item {
  margin: 0 3px;
}

.pageArea .page-item .page-link {
  position: relative;
  display: block;
  padding: 0.4rem 0.75rem;
  line-height: 1.25;
  color: #666; /* 默认颜色 */
  background-color: #fff;
  border: 1px solid #dee2e6;
}

.pageArea .page-item .page-link:hover {
  z-index: 2;
  color: #c13432; /* 悬停颜色改为绿色 */
  text-decoration: none;
  background-color: #e9ecef;
  border-color: #dee2e6;
}

.pageArea .page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: #c13432; /* 激活背景色 */
  border-color: #c13432; /* 激活边框色 */
}

.pageArea .page-item.disabled .page-link {
  color: #6c757d;
  pointer-events: none;
  cursor: auto;
  background-color: #fff;
  border-color: #dee2e6;
}

/* 消除 .mainBox 可能的多余样式*/
.mainBox {
  background: transparent;
  box-shadow: none;
  padding: 0;
  margin-bottom: 30px;
}

/* 小于768 ipad和手机*/
@media screen and (max-width: 768px) {
  .listAreaNew {
    margin: 0 13px;
  }
  
  .listArea {
    margin-top: 15px;
  }
  main {
  }
  .listContent {
    padding: 0;
  }
  /* 移除冲突的通用listTitle样式，使用更具体的选择器 */
  /* .listTitle {
    font-size: 14px;
  } */
  .time {
    font-family: Arial;
    font-weight: 400;
    font-size: 12px;
    color: #b3b3b3;
  }
  .phoneTime {
    width: 10px;
    margin-right: 5px;
  }

  .listItem {
    height: 98px;
    justify-content: center;
    position: relative;
    border-bottom: 1px solid #edeff1;
    align-items: center;
  }

  .day {
    font-family: Arial;
    font-weight: 400;
    font-size: 30px;
    color: #c13432;
    /* margin-top: -10px; */
  }
  .day::after {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 2px;
    width: 100%;
    height: 1px;
    background: #c13432;
  }
  .date {
    font-family: Arial;
    font-weight: 400;
    font-size: 12px;
    color: #333333;
    position: relative;
    top: 8px;
  }
  /* 移除冲突的通用listTitle样式，使用更具体的选择器 */
  /* .listTitle {
    font-size: 15px;
    color: #333333;
    margin-left: 30px;
    line-height: 25px;
  } */
  .listTextArea {
    align-items: flex-start;
    flex: 1;
  }
  /* 修改移动端listPageTitle 样式 */
  /* .listPageTitle {
    font-weight: 400;
    font-size: 17px;
    color: #c13432;
    position: relative;
    padding-top: 0;
    padding-bottom: 0;
  } */
  /* 添加移动端listPageTitle 下划线*/
  /* .listPageTitle::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -10px;
    height: 1px;
    background: #c13432;
  } */

  /* 修改移动端breadcrumb 样式 */
  /* .breadcrumbArea {
     font-size: 12px;
  }
  .breadcrumbArea span,
  .breadcrumbArea .breadcrumb-item a,
  .breadcrumbArea .breadcrumb-item.active {
     color: #A6A6A6;
  } */
  /* 修改移动端面包屑分隔符颜色*/
  /* .breadcrumb-item + .breadcrumb-item::before {
    color: #A6A6A6;
  } */

  /* 设置移动端titleRow 高度 */
  /* .titleRow {
    height: 40px;
    margin-bottom: 0;
    margin-top: 10px;
  } */

  /* 隐藏移动端面包屑中的"当前位置"文本 */
  /* .breadcrumbArea > .breadcrumb > span {
    display: none;
  } */

  /* 移动端列表项样式调整 */
  .listItemRegular {
    flex-direction: column; /* 改为垂直排列 */
    align-items: flex-start; /* 左对齐*/
    height: auto; /* 高度自适应 */
    padding: 15px 0; /* 调整上下内边距，移除左右内边距*/
    position: relative; /* 确保 ::before 相对于此定位 */
    text-decoration: none; /* 移除下划线 */
    color: inherit; /* 继承颜色 */
    /* 覆盖common.css中的通用a标签样式 */
    color: #333333 !important;
  }

  .listItemRegular::before {
    display: none !important; /* 再次确认隐藏小圆点*/
  }

  .listItemRegular .listTitle {
    font-size: 15px; /* 调整字体大小 */
    color: #333333; /* 设置颜色 */
    margin-bottom: 8px; /* 与日期间*/
    white-space: normal; /* 允许换行 */
    margin-right: 0; /* 移除右边距*/
    flex: none; /* 取消 flex: 1 */
    /* overflow: visible; */ /* 移除或注释掉，以overflow:hidden 生效 */
    /* text-overflow: clip; */ /* 移除或注释掉 */
    /* 添加两行省略号样式*/
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis; /* 明确添加 ellipsis */
    line-height: 1.4; /* 调整行高以优化显示*/
  }

  .listItemRegular .listDate {
    font-family: Arial; /* 设置字体 */
    font-weight: 400; /* 设置字重 */
    font-size: 12px; /* 调整日期字体大小 */
    color: #c13432; /* 设置颜色 */
  }

  .listItemRegular:hover {
     padding-left: 0; /* 移除 hover 时的左内边距 */
     text-decoration: none; /* 确保hover时也没有下划线 */
  }
}