body.single {
  background-color: #000;
  color: #fff;
}

/* 投稿詳細ページ専用のスタイル */
body.single .site-main {
  padding-top: 160px; /* グローバルナビゲーションとの間隔を確保 */
}

/* 投稿内容エリアの調整 */
body.single .post-content {
  margin-top: 160px;
  padding: 0 1rem;
}

/* ニュース詳細ページの投稿項目 */
body.single .news-item {
  margin-top: 20px;
  padding-bottom: 1rem;
  border-bottom: 1px solid #ccc;
}

/* 画像に関するスタイル調整 */
body.single .news-thumbnail {
  width: 100%;
  max-width: 100%;
  flex-shrink: 0;
}

body.single .news-thumbnail img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

/* 投稿詳細ページの右カラム（バックナビ） */
body.single .news-container {
  display: flex;
  gap: 2rem;
  max-width: 1140px;
  margin: 0 auto;
  padding: 2rem;
}

body.single .news-entries {
  flex: 3;
}

body.single .news-sidebar {
  flex: 1;
  padding: 20px;
  border-radius: 5px;
  margin-top: 140px;
}

body.single .news-sidebar h3 {
  font-size: 1.2em;
  color: #509fed;
  border-bottom: 2px solid #509fed;
  padding-bottom: 0.5em;
  margin-bottom: 1em;
}

body.single .news-sidebar ul {
  list-style: none;
  padding-left: 0;
}

body.single .news-sidebar ul li {
  margin-bottom: 0.5em;
}

body.single .news-sidebar ul li a {
  color: #fff;
  text-decoration: none;
}

body.single .news-sidebar ul li a:hover {
  text-decoration: underline;
}

/* 前のページに戻るリンクのスタイル */
body.single .back-to-previous {
  text-align: center;
  margin-top: 40px;
}

body.single .back-to-previous .back-link {
  display: inline-block;
  padding: 10px 20px;
  background-color: #fff;
  color: #000;
  text-decoration: none;
  border-radius: 4px;
  font-size: 1.1em;
  transition: background-color 0.3s ease;
}

body.single .back-to-previous .back-link:hover {
  background-color: #fff;
  color: #000;
  text-decoration: underline;
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
  body.single .post-content {
    margin-top: 100px;
    padding: 0 10px;
  }

  body.single .news-item {
    margin-top: 10px;
    padding-bottom: 0.5rem;
  }

  body.single .news-thumbnail img {
    width: 100%;
    height: auto;
  }

  body.single .news-sidebar {
    margin-top: 2rem;
  }
}


@media screen and (max-width: 768px) {
  body.single .news-container {
    flex-direction: column; /* ← ★ 横並びを縦並びに */
    padding: 1rem; /* ← オプション：左右余白も少し詰める */
  }

  body.single .news-sidebar {
    margin-top: 2rem;
    padding: 0 1rem;
  }
}