/* ==============================================================
   Search & Filter – カード風フォーム（列の縦線付き）
   ============================================================== */

/* ---------- カード枠 ---------- */
form.searchandfilter{
  background:#fff;
  border:1px solid #e3e3e3;
  border-radius:8px;
  padding:1.5rem 1.75rem;
  box-shadow:0 4px 12px rgba(0,0,0,.05);
  font-family:"Noto Sans JP",sans-serif;
}

/*―― 外側 <ul> を 3 列固定 ＋ 列間 48px ――*/
form.searchandfilter > div > ul{
  display:grid;
  grid-template-columns:repeat(3,1fr);   /* ← 必要なら 4 に変更 */
  column-gap:48px;                       /* ← 縦線の間隔＝48px */
  margin:0;padding:0;list-style:none;
}

/*―― 各 li ――*/
form.searchandfilter > div > ul > li{
  position:relative;
  margin:0;padding-left:24px;            /* ← 左余白は列間の半分 */
}
form.searchandfilter > div > ul > li:first-child{padding-left:0;}

/*―― 縦線：li の ::before を列間中央に――*/
form.searchandfilter > div > ul > li:not(:first-child)::before{
  content:"";
  position:absolute;
  top:0;bottom:0;left:-24px;             /* ← 半分突き出す */
  width:1px;background:#e3e3e3;
}

/*―― Submit 行 ――*/
form.searchandfilter > div > ul > li:last-child{
  grid-column:1/-1;text-align:right;margin-top:16px;padding:0;
}
form.searchandfilter > div > ul > li:last-child::before{content:none;}

/* ---------- ラベル見出し ---------- */
form.searchandfilter h4{
  margin:0 0 .6rem;
  font-size:1rem; font-weight:600; color:#333;
}

/* ---------- チェック群は横並び ---------- */
form.searchandfilter ul ul{
  display:flex; flex-wrap:wrap;
  gap:.25rem 1rem; margin:0; padding:0;
  list-style:none;
}

/* ---------- チェックボックス ---------- */
form.searchandfilter input[type=checkbox]{
  appearance:none; -webkit-appearance:none;
  width:20px; height:20px; margin:0 .4rem 0 0;
  border:2px solid #07a2a2; border-radius:4px;
  position:relative; cursor:pointer; vertical-align:middle;
}
form.searchandfilter input[type=checkbox]:checked{background:#07a2a2;}
form.searchandfilter input[type=checkbox]:checked::after{
  content:""; position:absolute; left:4px; top:1px;
  width:6px; height:11px; border:solid #fff;
  border-width:0 2px 2px 0; transform:rotate(45deg);
}

/* ---------- ラベル文字 ---------- */
form.searchandfilter label:not([class]){
  cursor:pointer; font-size:.95rem; color:#555;
}
form.searchandfilter input[type=checkbox]:hover + label{color:#07a2a2;}

/* ---------- モバイル ---------- */
@media(max-width:480px){
  form.searchandfilter{padding:1rem 1.25rem;}
  form.searchandfilter > div > ul{grid-template-columns:1fr;}  /* 1列 */
  form.searchandfilter > div > ul > li{padding-left:0;}
  form.searchandfilter > div > ul > li::before{content:none;}  /* 縦線OFF */
  .richmenu-tabs{
    grid-template-columns:repeat(1,minmax(0,1fr)) !important;
  }
}


/* PC 幅だけ 4 列に固定する  */
@media (min-width: 1024px){
  .c-entries--panel{          /* <ul> のクラス */
    --entries--item-width: 25%;           /* 列／行の間隔　好みで */
  }
}

.l-header{
  display: none;
}

.c-section{
  padding: 0;
}

/* ── Search & Filter の送信ボタン ───────── */
form.searchandfilter input[type="submit"]{
  background:#07a2a2;          /* 基本色 */
  color:#fff;                  
  border:none;
  padding:.6rem 1.8rem;
  font-size:1rem; font-weight:600;
  border-radius:4px;
  cursor:pointer;
  transition:.25s;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}
form.searchandfilter input[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 10px rgba(0,0,0,.15);
}
form.searchandfilter input[type="submit"]:active{
  transform:translateY(0);
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}

code, kbd{
  background-color: transparent ;
}

.c-entries{
  margin-left: 0;
  margin-right: 0;
}

.c-entry__body{
    max-width: 1150px;
}

.richmenu-tabs{
  list-style: none;      /* ← ここで “マーカー無し” にする */
  margin: 0;             /* ブラウザ既定の余白も消す */
  padding: 0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.4rem;
}

.richmenu-tabs li{
  text-align:center;
  list-style: none; 
}

.richmenu-tabs li::marker{
  display: none;
}

.richmenu-tabs img{
  width:100%;
  height:auto;
  box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.rm-download a{
  display: inline-block;
  margin-top: 1.8rem;
  padding: .4rem 1.2rem;
  background: #07a2a2;
  color: #fff;
  font-size: .9rem;
  text-decoration: none;
  border-radius: 50px;
}

.rm-download a:hover{ background:#045d5d; }

.c-entry-summary__figure{
  position: relative;
  aspect-ratio: 2500 / 1686;
  overflow: hidden;
  background-color: #e5e5e5;
  margin-bottom: 0;
}

.c-entry-summary__figure>img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.c-entries__item>a .c-entry-summary__body{
  padding: 10px 20px;
  font-size: 14px;
}