/* ===== FujiTV Ana DB (SYN/WordPress) ===== */
.anaDB {
  margin: 0 auto;
  padding: 0;
}

.anaDB .wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 16px;
}

.anaDB h1 {
  font-size: 1.6rem;
  line-height: 1.2;
  margin: 0 0 10px;
}

.anaDB .desc {
  margin: 0 0 14px;
  line-height: 1.6;
}

.anaDB .jump {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin: 10px 0 16px;
}

.anaDB .jump a {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 999px;
  text-decoration: none;
  font-size: .92rem;
}

.anaDB .jump a:hover {
  text-decoration: underline;
}

.anaDB .legend {
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 10px;
  padding: 12px;
  margin: 0 0 14px;
  background: rgba(0,0,0,.03);
  font-size: .95rem;
}

.anaDB .tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  margin: 2px 6px 2px 0;
  font-size: .88rem;
  line-height: 1.8;
  background: #fff;
}

.anaDB .tag--single { color: #c00; }
.anaDB .tag--married { color: #06c; }
.anaDB .tag--active { background: #ffcc00; }
.anaDB .tag--other { background: #ffccff; }
.anaDB .tag--og { background: #ccff00; }

.anaDB .controls {
  display: grid;
  grid-template-columns: 1.2fr 0.7fr 0.8fr 0.4fr;
  gap: 10px;
  align-items: end;
  margin: 0 0 10px;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  background: #fff;
}

.anaDB .control label {
  display: block;
  font-size: .9rem;
  margin: 0 0 6px;
  opacity: .9;
}

.anaDB .controls input,
.anaDB .controls select {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  font-size: 1rem;
}

.anaDB .control--btn button {
  width: 100%;
  padding: 10px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.18);
  background: #111;
  color: #fff;
  cursor: pointer;
}

.anaDB .control--btn button:hover {
  opacity: .9;
}

.anaDB .meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
  margin: 8px 0 10px;
  font-size: .95rem;
}

.anaDB .meta .hint {
  opacity: .7;
  font-size: .9rem;
}

.anaDB .tableWrap {
  overflow: auto;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  background: #fff;
}

/*  e [ u   F   ̐F w  (bgcolor  ) ͑  d   ‚A g   Ɨ]             */
.anaDB table.anabase {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px; /*    X N   [   p */
  margin: 0;
}

.anaDB table.anabase td,
.anaDB table.anabase th {
  border: 1px solid rgba(0,0,0,.15);
  padding: 8px 10px;
  vertical-align: middle;
}

/*   HTML   border/cellspacing/cellpadding    g     ڂŁh   肳     */
.anaDB table.anabase[border] { border: none; }

.anaDB .noResults {
  margin: 14px 0 0;
  padding: 12px;
  border: 1px dashed rgba(0,0,0,.25);
  border-radius: 12px;
  background: rgba(0,0,0,.03);
}

/* =====  X } z ́u J [ h v   ۂ  i e [ u     ͎̂c   j ===== */
@media (max-width: 900px) {
  .anaDB .controls {
    grid-template-columns: 1fr 1fr;
  }
  .anaDB .control--btn {
    grid-column: span 2;
  }
}

@media (max-width: 640px) {
  .anaDB .controls {
    grid-template-columns: 1fr;
  }
  .anaDB .control--btn {
    grid-column: auto;
  }

  .anaDB .tableWrap {
    border-radius: 14px;
  }

  /*  e [ u     J [ h   ɁF s   Ƃɋ ؂     ߂  */
  .anaDB table.anabase {
    min-width: 0;
  }
  .anaDB table.anabase tr {
    border-bottom: 10px solid rgba(0,0,0,.03);
  }
  .anaDB table.anabase td {
    padding: 10px 10px;
  }
}

/*  }        тɂ    */
.anaDB .legend > div:nth-child(2),
.anaDB .legend > div:nth-child(3){
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
}

/* legend     <br>  𖳌    i     їD  j */
.anaDB .legend br{
  display: none;
}
/* ===== フィルタUI（名前検索/入社年度/区分/リセット）間隔を詰める ===== */
/* まずは“それっぽい”入力群をまとめて詰める（ページ全体に効きすぎないように範囲を限定） */
.page-id-XXXX .ana-filter,
.page-id-XXXX .filter-area,
.page-id-XXXX .search-area,
.page-id-XXXX form {
  /* もし横並び（flex）なら gap を詰める */
  gap: 8px;
}

/* 入力・セレクト・ボタンの余白を詰める */
.page-id-XXXX #anaSearch,
.page-id-XXXX select,
.page-id-XXXX button,
.page-id-XXXX input[type="search"],
.page-id-XXXX input[type="text"] {
  margin: 0 !important;
}

/* ラベルなどの上下の余白が広い場合を詰める */
.page-id-XXXX label,
.page-id-XXXX .filter-label {
  margin-bottom: 2px !important;
}

/* ===== リセットボタンの見た目 ===== */
.page-id-XXXX #resetBtn,
.page-id-XXXX .resetBtn,
.page-id-XXXX button[type="reset"] {
  background: #1e73be !important; /* 青 */
  color: #fff !important;
  border: none !important;

  /* 文字を中央揃え */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  /* 余白（好みで調整） */
  padding: 8px 12px;
  border-radius: 6px;
  cursor: pointer;
}

/* hover（任意） */
.page-id-XXXX #resetBtn:hover,
.page-id-XXXX .resetBtn:hover,
.page-id-XXXX button[type="reset"]:hover {
  filter: brightness(0.95);
}
/* ===== 追加調整：フィルタ類の間隔をさらに詰める ===== */
.anaDB .controls{
  gap: 6px;              /* 10px → 6px に */
  padding: 10px;         /* 12px → 10px に（少し詰める） */
}

.anaDB .control label{
  margin: 0 0 3px;       /* 6px → 3px に */
}

.anaDB .controls input,
.anaDB .controls select{
  padding: 8px 10px;     /* 10px → 8px に */
}

/* ===== リセットボタン：中央寄せ＋青 ===== */
.anaDB .control--btn button{
  background: #1e73be;   /* 青 */
  border: none;
  color: #fff;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.anaDB .control--btn button:hover{
  filter: brightness(0.95);
}
/* 凡例ブロックの下の余白を詰める（フォームとの距離） */
.anaDB .legend{
  margin-bottom: 6px !important;  /* 好みで 0〜10px */
  padding-bottom: 0 !important;
}

/* 凡例内部の div の上下余白を詰める（inline styleを上書き） */
.anaDB .legend > div{
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

/* フィルタ（controls）の上余白を詰める */
.anaDB .controls{
  margin-top: 0 !important;
  padding-top: 6px !important;
}

/* ===== フィルタUI 最終仕上げ ===== */

/* ラベルと入力欄の距離をさらに詰める */
.anaDB .control label{
  margin-bottom: 2px !important;   /* ← ここが一番効く */
  line-height: 1.1;
  font-size: 0.9rem;
}

/* 入力・セレクトの高さを統一して締める */
.anaDB .controls input,
.anaDB .controls select{
  height: 36px;
  padding: 6px 10px !important;
}

/* リセットボタンの高さ・中央揃えを完全に合わせる */
#resetBtn{
  height: 36px;
  min-width: 88px;
  padding: 0 16px !important;

  background: #1e73be !important;
  color: #fff !important;
  border: none !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

/* 全体の行間を少しだけ締める */
.anaDB .controls{
  gap: 6px !important;
}
/* ===== 強制：フィルタ4点（名前検索/入社年度/区分/リセット）を“詰め切る” ===== */

/* 1) 4ブロックの並びはそのまま（横並び維持） */
@media (min-width: 768px){
  .anaDB .controls{
    display: grid !important;
    grid-template-columns: 2.2fr 1fr 1fr auto !important;
    gap: 6px !important;
    padding: 10px !important;
    align-items: end !important;
  }

  /* 2) 各ブロックを強制的に「縦flex」にして、ラベル⇄入力の距離を gap で固定 */
  .anaDB .control{
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;          /* ← ここが最重要 */
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 3) ラベル側の余白を完全に殺す */
  .anaDB .control label{
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.1 !important;
    font-size: 0.9rem !important;
  }

  /* 4) 入力/セレクト/ボタンの高さを完全統一 */
  #anaSearch,
  #yearFilter,
  #typeFilter,
  #resetBtn{
    height: 36px !important;
  }

  #anaSearch,
  #yearFilter,
  #typeFilter{
    padding: 6px 10px !important;
    margin: 0 !important;
  }

  /* 5) リセット：青＋文字中央＋高さ統一 */
  #resetBtn{
    background: #1e73be !important;
    color: #fff !important;
    border: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;

    padding: 0 16px !important;
    margin: 0 !important;
  }
}
/* controls内の1ブロックを横並びに固定 */
.controls[role="region"] .control{
  display: grid !important;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 8px;
}

/* labelが上に落ちないように */
.controls[role="region"] .control > label{
  display: inline-block !important;
  margin: 0 !important;
  white-space: nowrap;
}

/* 入力欄とselectを横に伸ばす */
.controls[role="region"] .control > input,
.controls[role="region"] .control > select{
  width: 100% !important;
  min-width: 0;
}
/* 3つを横並び＆横の間隔を詰める */
.controls[role="region"]{
  display:flex !important;
  flex-wrap:wrap;
  gap: 4px !important;                  /* 横スペース：0〜6で調整 */
  justify-content:flex-start !important;
  align-items:center;                   /* 縦方向のズレを抑える */
  text-align:left !important;
}

/* 各ブロック：ラベル＋入力を1行にする（縦幅を増やさない） */
.controls[role="region"] .control{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  gap: 6px;                              /* ラベルと入力の間 */
  margin:0 !important;
  padding:0 !important;
  flex: 0 0 auto !important;
}

/* ラベルは短く固定（縦幅を増やさない） */
.controls[role="region"] .control > label{
  margin:0 !important;
  white-space:nowrap;
}

/* 入力欄の高さを揃える（必要なら） */
.controls[role="region"] .control > input,
.controls[role="region"] .control > select{
  height: 34px;                          /* 好みで 30〜36 */
  padding: 4px 8px;                      /* 好みで調整 */
  min-width: 0;
}

/* 横幅：必要最小限にして詰める */
.controls[role="region"] .control:first-child > input{  /* 名前検索 */
  width: 220px;
}
.controls[role="region"] .control:nth-child(2) > select{ /* 入社年度 */
  width: 120px;
}
.controls[role="region"] .control:nth-child(3) > select{ /* 区分 */
  width: 170px;
}
/* 身長（6列目）は折り返し禁止 → 「159cm」が2行にならない */
.anaDB table.anabase th:nth-child(6),
.anaDB table.anabase td:nth-child(6){
  white-space: nowrap;
}
/* controls内の縦ズレを止める */
.controls[role="region"]{
  align-items: center !important;   /* flex-end をやめて中央揃え */
}

/* ラベルのズレ防止（余白・行間を固定） */
.controls[role="region"] .control > label{
  margin: 0 !important;
  line-height: 1.2 !important;
}

/* input/select の高さを揃える（selectの下がり防止） */
.controls[role="region"] .control > input,
.controls[role="region"] .control > select{
  height: 34px !important;          /* 好みで 32〜36 */
  line-height: 34px !important;     /* selectの文字位置を揃える */
  padding: 0 8px !important;        /* 縦paddingでズレないように */
  box-sizing: border-box;
}