/* サイドバー */
.search-box { margin: 10px 0; }

/* 見出し帯 */
.sidfont, .sidfontb, .sidfontc {
  font-size: small;
  font-weight: bold;
  padding: 4px 0;
  display: block;
  margin: 8px 0 4px;
  color: #2c3e50;
}
.sidfont   { border-top: 5px solid #90b4d4; border-bottom: 5px solid #90b4d4; }
.sidfontb  { border-bottom: 5px solid #90b4d4; }
.sidfonta  {
  font-size: .85em; font-weight: 600; color:#4d5e6b;
  padding: 4px 0; display:block; margin:4px 0 8px;
  border-top: 2px dashed #a0d2e8;
}

/* サイドバー本体（重複削除＋sticky化） */
.sidebar {
    overflow: visible; 
  box-sizing: border-box;
  width: 240px;
  padding: 1.5em;
  margin: 0;
  background: linear-gradient(180deg, #f5f9fb, #dde6ea 60%, #c3edf0);
  border-radius: 12px;
  border-right: 10px solid #009dff;
  box-shadow: 0 4px 12px rgba(0,0,0,.05); /* ← 1つに統一 */


  position: sticky;  /* ← 追従 */
  top: 0;

  z-index: 10;
}

/* ドロップダウン全体 */
.dropdown {
  margin-bottom: 15px;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  font-family: 'Segoe UI', sans-serif;
  box-shadow: 0 0 10px rgba(0,255,255,.35); /* aquaを少しソフトに */
}

/* ボタン */
.dropdown-button {
  background-image: linear-gradient(90deg, #ffffff, #bccbd1 50%, #b3feff);
  border-radius: 8px;
  border: 1px solid #c3dbe8;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  font-size: 16px;
  color: #333;
  padding: 10px 15px;
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: all .2s ease;
}
.dropdown-button:hover { background: linear-gradient(145deg,#d7eaf8,#fdfdfd); box-shadow:0 4px 12px rgba(0,0,0,.12); }

/* 初期は閉じる */
.dropdown-content{
  max-height:0;
  overflow:hidden;
  transition:max-height .35s ease;
  opacity:0;
  padding-top:0;
  padding-bottom:0;
  pointer-events:none;
}
/* 開いたとき（max-heightはJSがscrollHeightを代入） */
.dropdown-content.open{
  opacity:1;
  padding-top:8px;
  padding-bottom:8px;
  pointer-events:auto;
  overflow-y:auto; /* 中身が長いときだけ、この中でスクロール */
}



/* aria同期（保険） */
.dropdown-content[aria-hidden="true"]  { pointer-events: none; }
.dropdown-content[aria-hidden="false"] { pointer-events: auto; }

/* スクロールバー装飾（webkit系のみ） */
.dropdown-content.open::-webkit-scrollbar { width: 8px; }
.dropdown-content.open::-webkit-scrollbar-track { background:#f0f0f0; border-radius:4px; }
.dropdown-content.open::-webkit-scrollbar-thumb { background:#3a84f1; border-radius:4px; }
.dropdown-content.open::-webkit-scrollbar-thumb:hover { background:#3a84f1; }

/* リンク */
.dropdown-content a {
  display: block;
  background: #b9babe;
  margin: 8px 10px;
  padding: 14px 16px;
  border-radius: 6px;
  color: #333;
  text-decoration: none;
  font-weight: 500;
  transition: background-color .3s, color .3s;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
}
.dropdown-content a:hover { background:#1abc9c; }

/* （任意）ボタンの状態反映 */
.dropdown-button[aria-expanded="true"] { outline: 2px solid #76b6ff; }


/* PC: 横並びを固定 */
@media (min-width: 769px) {
  .container { display: flex; align-items: flex-start; gap: 24px; }
}

/* モバイル: 縦積み（本文→サイドバー） */
@media (max-width: 768px) {
  .container { display: flex; flex-direction: column; }
  main { order: 1; }
  #sidebar, .sidebar {
    order: 2;
    width: 100%;
    max-width: 100%;
    position: static;       /* sticky解除 */
    border-right: none;
    border-bottom: 4px solid #009dff;
    margin-top: 1rem;
  }
}

/* サイドバーの前面化は控えめに（他UIを邪魔しない） */
#sidebar, #sidebar .sidebar {
  position: relative;
  z-index: 150;             /* 9999から下げる */
}
/* クリック死守（!importantは外す） */
#sidebar * { pointer-events: auto; }

/* 本文はページ全体でスクロール（独立スクロールを防ぐ） */
main { overflow-y: visible; }