.category-list a.filter-btn {
  display: inline-block;
  text-decoration: none; /* 下線を消す */
}

.gourmet-item.is-hidden {
  display: none !important;
}

/* タブ全体のスタイル */
.filter-tab-container {
  display: flex;
  flex-wrap: wrap; /* スマホで折り返せるように */
  gap: 8px;
  margin-bottom: 24px;
}

/* タブボタンの基本スタイル */
.filter-btn {
  padding: 8px 16px;
  font-size: 14px;
  border: 1px solid #ddd;
  border-radius: 20px; /* 丸みのある可愛いボタンに */
  background-color: #fff;
  color: #62442d; /* しいたけブラウンに変更 */
  cursor: pointer;
  transition: all 0.2s ease;
}

/* 選択されている（アクティブな）タブのスタイル */
.filter-btn.active {
  background-color: #82a736; /* かぼすグリーンに変更 */
  color: #fff;
  border-color: #82a736;
}

/* グルメ項目全体の配置 */
.gourmet-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); /* タイル状に並べる */
  gap: 16px;
}

/* 各項目のスタイル */
.gourmet-item {
  padding: 16px;
  border-radius: 2px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.item-tag {
  font-size: 12px;
  color: #8b7365; /* 馴染みやすい薄めのしいたけブラウンに変更 */
  margin-bottom: 8px;
}

/* 【重要】このクラスがついた項目は画面から消える */
.gourmet-item.is-hidden {
  display: none !important;
}

/* タブ全体の横並びと余白の調整 */
.category-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px 0 30px 0;
  padding: 0;
}

/* タブ（aタグ）の基本スタイル：下線を消してボタン風にする */
.category-list a.filter-btn {
  display: inline-block;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: bold;
  color: #82a736 !important; /* かぼすグリーンに変更 */
  text-decoration: none !important; /* 下線を完全に消す */
  background-color: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 20px; /* 角を丸くして可愛いボタンに */
  text-align: center;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* マウスを乗せたときの動き */
.category-list a.filter-btn:hover {
  background-color: #eee;
}

/* 【重要】選択されている（アクティブな）タブのスタイル */
.category-list a.filter-btn.active {
  background-color: #82a736 !important; /* かぼすグリーンに変更 */
  color: #ffffff !important;
  border-color: #82a736 !important;
}

/* 【最重要】非表示用のルール */
.gourmet-item.is-hidden {
  display: none !important;
}

.gourmet-list h3{
  font-size: 1.8rem;
  padding: 0;
  margin: 0;
}

.gourmet-item{
  background:#fff;
}

.gourmet-item .button{
  padding: 8px 16px;
  font-size: 14px;
  border: 1px solid #82a736; /* 枠線もかぼすグリーンに統一 */
  border-radius: 20px; /* 丸みのある可愛いボタンに */
  background-color: #82a736; /* かぼすグリーンに変更 */
  color: #FFFFFF;
  cursor: pointer;
  transition: all 0.2s ease;
}

.gourmet-item p.price{
  text-align: right;
  color: #82a736; /* かぼすグリーンに変更 */
  padding: 0;
  margin: 0;
}

.gourmet-item .number{
  font-size: 24px;
  font-weight: bold;
  color: #62442d; /* 数字のカラーもしいたけブラウンに合わせました */
}

.gourmet-item .logo {
  margin: 10px 0;
  text-align: center;
}

.gourmet-item .logo img{
  text-align: center;
  max-height: 50px;
}

.snsbg{
  padding: 50px 0;
  background-color:#f4f6e5; /* 淡いかぼす背景に変更 */
}

.snsbox{
  background-color: #FFFFFF;
  border-radius: 20px;
  padding: 20px 0;
}

.shopmanubg{
  padding-top: 100px;
  background: url("../img/lp-bg.png") center top no-repeat #f4f6e5; /* 淡いかぼす背景に変更 */
}