/* 架构样式，左侧、右侧、点击后展示相应内容*/
.document_center {
  width: 1200px;
  margin: 0 auto;
  /* 滚动条导致在售、停售切换时，页面会抖动，设置最小高度 */
  min-height: 100vh;
}

.document_center .wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 80px 0;
}

.document_center .wrap .left {
  width: 200px;
  height: 330px;
  border-right: 1px solid #00000014;
}

.document_center .wrap .left ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.document_center .wrap .left li {
  width: 100%;
  height: 56px;
  padding: 14px 0;
  color: rgba(0, 0, 46, 0.65);
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.document_center .wrap .left li.active {
  color: #005bac;
  font-weight: bold;
  border-right: 2px solid #005bac;
}

.document_center .wrap .right {
  width: 75%;
  height: 100%;
  padding-left: 40px;
}

.document_center .wrap .right .content-item {
  display: none;
}

.document_center .wrap .right .content-item.active {
  display: block;
}

/* 详细样式--- 在售产品和停售产品的具体内容*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.document-main {
  overflow: hidden;
  padding-bottom: 80px;
}

.document-main .h1_title {
  font-size: 20px;
  line-height: 29px;
  color: #00002ee6;
  margin-bottom: 20px;
}

.flex-space-between {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  width: 100%;
}

.one-item {
  width: 227px;
  /* height: 310px; */
  /* text-align: center; */
  border: 1px solid #f2f2f3e6;
  border-radius: 16px;
  overflow: hidden;
  /* margin-right: 16px; */
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1), 0px 2px 6px rgba(0, 0, 0, 0.05);
}

.one-item:hover p {
  color: rgb(0, 91, 172);
}

.one-item-top {
  position: relative;
  width: 100%;
  height: 170px;
}

.one-item-top-characters {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #ffffffff;
  font-size: 16px;
  line-height: 28px;
  /* 文字在一行显示 */
  white-space: nowrap;
}

.one-item-top-img {
  width: 100%;
  height: auto;
}

.one-item-bottom {
  position: relative;
  width: 227px;
  height: 120px;
  padding: 15px;
}

.one-item-bottom p {
  color: #00002ee6;
  font-size: 15px;
  line-height: 28px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.one-item-bottom-img {
  position: absolute;
  bottom: 16px;
  left: 16px;
  display: flex;
  align-items: center;
}

@media (max-width: 1200px) {
  .document_center .wrap .left {
    height: 230px;
  }

  .document_center {
    width: 100% !important;
    padding-left: 16px;
    padding-right: 16px;
  }

  .document_center .wrap {
    margin: 40px 0;
  }

  .document_center .wrap .right {
    padding-left: 20px;
  }
}
