.notice-card-imgs {
  background: var(--jj-card-bg, #fff);
  border-radius: 14px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
  padding: 0;
  margin-bottom: 0;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* 暗黑模式下的公告区域样式 */
[data-theme="dark"] .notice-card-imgs {
  background: var(--jj-card-bg, #2a2a2a);
  box-shadow: 0 2px 12px rgba(0,0,0,0.3);
}

.notice-imgs-vertical {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  justify-content: stretch;
  padding: 12px 0;
}
.notice-img-link-vertical {
  display: block;
  width: 100%;
  flex: 1 1 0;
  aspect-ratio: 16/9;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 6px rgba(0,0,0,0.06);
  transition: box-shadow 0.18s, transform 0.18s;
}
.notice-img-link-vertical:hover {
  box-shadow: 0 4px 16px rgba(255,71,87,0.13);
  transform: translateY(-2px) scale(1.03);
}
.notice-img-vertical {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}
@media (max-width: 1000px) {
  .notice-card-imgs { border-radius: 8px; }
  .notice-img-link-vertical, .notice-img-vertical { border-radius: 8px; }
  .notice-imgs-vertical { gap: 8px; padding: 6px 0; }
}
@media (max-width: 600px) {
  .notice-img-link-vertical { width: 100%; }
  .notice-imgs-vertical { gap: 6px; padding: 2px 0; }
}