karamay_wx/pages/index/news/news.wxss

/* pages/index/news/news.wxss */
.news-container {
  position: relative;
  min-height: 100vh;
  padding: 40rpx 40rpx 0 40rpx;
  background: url('https://klmybwg.4dage.com/mini/wxImg/bg.png');
  background-size: cover;
}

.back-button {
  position: absolute;
  top: 20rpx;
  left: 20rpx;
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  z-index: 10;
}

.back-button image {
  width: 80rpx;
  height: 80rpx;
}

.section-title {
  font-size: 40rpx;
  font-weight: bold;
  color: #584735;
  margin: 36rpx 0 40rpx 0;
  position: relative;
  padding-bottom: 20rpx;
}

.section-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4rpx;
  background: linear-gradient(90deg, rgba(91, 71, 46, 0.5) 0%, rgba(91, 71, 46, 0) 100%);
}

/* 加载状态样式 */
.loading-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 400rpx;
}

.loading-text {
  font-size: 36rpx;
  color: #584735;
  opacity: 0.8;
}

/* 空状态样式 */
.empty-state {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 400rpx;
  margin-top: 100rpx;
}

.empty-text {
  font-size: 36rpx;
  color: #584735;
  opacity: 0.6;
}

/* 滚动容器 */
.scroll-container {
  overflow-x: auto;
}

.scroll-wrapper {
  display: flex;
  padding-bottom: 10rpx;
}

.all-item {
  position: relative;
  flex: 0 0 auto;
  width: 654rpx;
  height: 1200rpx;
  margin-right: 20rpx;
}

.exhibition-item {
  position: relative;
  flex: 0 0 auto;
  width: 654rpx;
  height: 918rpx;
  border-radius: 10rpx;
  overflow: hidden;
}

.exhibition-item:last-child {
  margin-right: 0;
}

.exhibition-img {
  width: 100%;
  height: 100%;
}

.bg-img {
  position: absolute;
  width: 602rpx;
  height: 862rpx;
  top: 28rpx;
  left: 28rpx;
}

.exhibition-info {
  width: 690rpx;
  height: 60rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0.8;
  position: absolute;
  bottom: 94rpx;
}

.exhibition-title {
  font-size: 48rpx;
  margin: 0;
  color: #fff;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.view-details-button {
  position: absolute;
  bottom: 80rpx;
  left: 50%;
  transform: translateX(-50%);
  width: 430rpx;
  height: 116rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(90deg, #B1967B 0%, #9F6F3F 100%);
  border-radius: 100rpx;
  font-size: 40rpx;
  color: #fff;
}

.view-details-button text {
  margin-right: 32rpx;
}

.arrow {
  font-size: 32rpx;
}