#news {
  max-width: 820px;
  margin: 100px auto;
  padding: 32px 28px;
  border: 4.5px solid #9e6767cb;
  border-radius: 4px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06),0 0 0 1px rgba(158,103,103,0.35),0 0 16px rgba(158,103,103,0.18);
  background: transparent;
}

#news h2 {
  font-size: 24px;
  margin-bottom: 24px;
  letter-spacing: 0.06em;
}

#news-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.news-card {
  background: rgba(255,255,255,0.035);
  border-radius: 10px;
  transition: background 0.35s ease,transform 0.35s ease,box-shadow 0.35s ease;
}

.news-card:hover {
  background: rgba(158,103,103,0.08);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(158,103,103,0.18),inset 0 0 0 1px rgba(158,103,103,0.15);
}

.news-link {
  display: block;
  padding: 18px 20px;
}

.news-link h3 {
  font-size: 1.2em;
  margin-bottom: 6px;
  transition: color 0.3s ease;
}

.news-card:hover h3 {
  color: #9e6767;
}

.news-desc {
  font-size: 0.8em;
  opacity: 0.75;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.news-more {
  display: inline-block;
  margin-top: 6px;
  font-size: 0.8em;
  color: rgba(158,103,103,0.6);
  transition: opacity 0.3s ease;
}

.news-card:hover .news-more {
  opacity: 1;
}

#news a[href="news.html"] {
  display: inline-block;
  margin-top: 28px;
  font-size: 14px;
  color: #9e6767;
  opacity: 0.7;
}

#news a[href="news.html"]:hover {
  opacity: 1;
}

.news-page {
  margin-top: 120px;
}

.news-archive {
  max-width: 820px;
  margin: 0 auto 120px;
  padding: 32px 28px;
  border: 2px solid rgba(158,103,103,0.35);
  box-shadow: 0 0 0 1px rgba(158,103,103,0.08),0 12px 30px rgba(0,0,0,0.35);
}

.page-title {
  font-size: 28px;
  margin-bottom: 32px;
  letter-spacing: 0.08em;
  position: relative;
}

.page-title::after {
  content: "";
  display: block;
  width: 48px;
  height: 2.5px;
  background: #9e6767;
  margin-top: 12px;
  opacity: 0.6;
}

.news-detail-page {
  max-width: 820px;
  margin: 100px auto;
  padding: 32px 28px;
  border: 4.5px solid #9e6767cb;
  border-radius: 4px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06),0 0 0 1px rgba(158,103,103,0.35),0 0 16px rgba(158,103,103,0.18);
  background: transparent;
}

.news-detail-page .back {
  display: inline-block;
  margin-bottom: 32px;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(158,103,103,0.85);
  transition: opacity 0.25s ease;
}

.news-detail-page .back:hover {
  opacity: 1;
}

#news-title {
  font-size: 26px;
  letter-spacing: 0.08em;
  margin-bottom: 24px;
  position: relative;
}

#news-title::after {
  content: "";
  display: block;
  width: 48px;
  height: 2.5px;
  background: #9e6767;
  margin-top: 12px;
  opacity: 0.6;
}

.news-images img {
  width: 100%;
  display: block;
  border: 2px solid rgba(158,103,103,0.35);
  border-radius: 6px;
  box-shadow: 0 0 0 1px rgba(158,103,103,0.08),0 10px 24px rgba(0,0,0,0.4);
}

#news-description {
  font-size: 15px;
  line-height: 2;
  opacity: 0.85;
}

@media (max-width: 900px) {
  #news,.news-archive,.news-detail-page {
    margin: 100px 20px;
    padding: 26px 22px;
  }
}

.back-home {
  display: inline-block;
  margin-bottom: 32px;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(158,103,103,0.85);
  transition: opacity 0.25s ease;
}

.news-detail-page {
  position: relative;
}

.news-date {
  position: absolute;
  top: 16px;
  right: 16px;
  font-size: 14px;
  color: rgba(158,103,103,0.5);
  font-weight: 500;
  z-index: 10;
  pointer-events: none;
}

.news-slider {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: 32px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.news-slider .news-images {
  display: flex;
  transition: transform 0.45s ease;
}

.news-slider .news-images img {
  flex-shrink: 0;
  display: block;
  object-fit: contain;
  object-position: center;
  border: 3.5px solid rgba(158,103,103,0.4);
  border-radius: 6px;
}

.news-slider .nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  background: rgba(0,0,0,0.45);
  border: 2px solid rgba(158,103,103,0.6);
  color: #9e6767;
  font-size: 22px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.news-slider .prev {
  left: 12px;
}

.news-slider .next {
  right: 12px;
}

.news-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
}

.news-dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(158,103,103,0.3);
  cursor: pointer;
  transition: background 0.3s ease;
}

.news-dots .active {
  background: #9e6767;
}

.news-label {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 6px;
  font-size: 0.7em;
  color: #fff;
  background-color: #9e6767;
  border-radius: 3px;
  vertical-align: middle;
}

/* ニュース詳細ページのリンク */
#news-description a,
.news-desc a,
.news-link h3 a {
  color: #9e6767;        /* ニュースカラーに合わせる */
  text-decoration: underline;
  transition: color 0.3s ease;
}

#news-description a:hover,
.news-desc a:hover,
.news-link h3 a:hover {
  color: #7a4d4d;        /* ホバー時の色変化 */
  text-decoration: none;  /* ホバーで下線を消す */
}

/* Home：News / Videos 見出し下ライン（ニュース詳細と完全一致） */
/* Home：News / Videos 見出し 完全統一 */
#news > h2,
#videos > h2 {
  font-size: 26px !important;
  letter-spacing: 0.08em;
  margin-bottom: 24px !important;
  line-height: 1.3;
  padding: 0;
  position: relative;
}

#news > h2::after,
#videos > h2::after {
  content: "";
  display: block;
  width: 48px;              /* 長さ：完全一致 */
  height: 2.5px;            /* 太さ：完全一致 */
  background: #9e6767;      /* 色：完全一致 */
  margin-top: 12px;         /* 間隔：完全一致 */
  opacity: 0.6;             /* 完全一致 */
}