@charset "UTF-8";

/* =========================================================
   Sidebar（カテゴリ / アーカイブ）
   使用：NEWS 一覧 / 記事ページ
   WordPress では sidebar.php（wp_list_categories / wp_get_archives）

   --sidebar-pt : PC 時の上余白（親レイアウト側で指定）
   ========================================================= */
.sidebar {
  padding-top: var(--sidebar-pt, 0);
}

.sidebar__block + .sidebar__block {
  margin-top: 120px;
}

.sidebar__title {
  margin-left: -13px;
  font-family: var(--f-en-sans);
  font-weight: 400;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: 0.05em;
  color: var(--c-blue);
}

.sidebar__list {
  margin-top: 4px;
}

.sidebar__list a {
  display: block;
  padding: 14px 0 11px 1px;
  /* 点線（2px 描画 / 4px 間隔） */
  background: linear-gradient(to right, var(--c-brown) 2px, transparent 2px) left bottom / 6px 1px repeat-x;
  font-family: var(--f-maru);
  font-size: 13px;
  line-height: 19px;
  letter-spacing: 0.1em;
  color: var(--c-brown-dark);
  transition: color 0.3s, padding-left 0.3s;
}

.sidebar__list a:hover {
  padding-left: 6px;
  color: var(--c-blue);
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1100px) {
  .sidebar__title {
    margin-left: 0;
  }
}

/* SP：本文の下に CATEGORY / ARCHIVE を 2 カラムで */
@media (max-width: 768px) {
  .sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 64px;
    padding-top: 40px;
    border-top: 1px solid var(--c-blue-line);
  }

  .sidebar__block + .sidebar__block {
    margin-top: 0;
  }

  .sidebar__title {
    font-size: 18px;
  }

  .sidebar__list a {
    padding: 12px 0 8px 1px;
    font-size: 12px;
  }
}