/* ＝＝＝＝＝＝＝＝＝＝＝

 既存タイトル非表示

＝＝＝＝＝＝＝＝＝＝＝ */
.shop-list-0001 h2 {display:none !important;}
/* ＝＝＝＝＝＝＝＝＝＝＝

 他エリアから探す

＝＝＝＝＝＝＝＝＝＝＝ */

/* リスト全体のレイアウト */
.otherarea_li {
  margin-top: 50px;
  display: flex;
  flex-wrap: wrap;
  /* 4つ並んだら自動で改行する */
  gap: 25px;
  /* ボックス同士の間隔 */
  list-style: none;
}

/* 親のliは余白や並びの制御だけに使う */
.otherarea_search .more_btn {
  list-style: none; /* 点を消す */
  max-width: 320px;
  width: 100%;
  margin-bottom: 10px; /* ボタン同士の隙間 */
}

/* aタグをボタン本体にする */
.otherarea_search .more_btn a {
  background: #880025;
  color: #fff;
  text-align: center;
  padding: 20px 0;
  display: block; /* 全体に広げる重要設定 */
  font-size: 20px;
  font-weight: 500;
  text-decoration: none; /* 下線を消す */
  position: relative;
  transition: 0.3s;
}

/* 矢印は aタグに対してつける */
.otherarea_search .more_btn a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  margin: auto;
  background: url(more_arrow.svg) no-repeat center/contain;
  width: 15px;
  height: 20px;
  transition: 0.3s;
}

/* ホバー処理も aタグに対して行う */
.otherarea_search .more_btn a:hover {
  opacity: 0.8;
}

.otherarea_search .more_btn a:hover::before {
  right: 25px; /* 動きを出すなら少し位置を変える */
}


@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .otherarea_li {   
    margin-top: 50px;
  }
}

/* タブレットサイズ (1024px以下) */
@media screen and (max-width: 1024px) {
  .otherarea_li {  
    justify-content: center;
    /* 中央寄せにシフト */
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .otherarea_li {   
    margin-top: 50px;
    justify-content: flex-start;
    gap: 15px;
  }
}

@media screen and (max-width: 767px) {
  .otherarea_search .more_btn {
    font-size: 17px;
  }
  .otherarea_li {   
    margin-top: 30px;
    /* 余白をリセット */
    padding: 0 20px;
    /* 左右に最低限の空きを作る */
    gap: 10px 20px;
    justify-content: center;
    /* 2列でバランスよく配置 */
  }  
}

/* スマホ縦 (480px以下) */
@media screen and (max-width: 480px) {
  .otherarea_li {
    gap: 10px;
    /* 間隔を狭くする */
  }
}

/* ＝＝＝＝＝＝＝＝＝＝＝

 他エリアから探す（左スペース）

＝＝＝＝＝＝＝＝＝＝＝ */
@media print, screen and (min-width: 1280px) {
#u20260520163511,
#u20260520163426,
#u20260521174452,
#u20260521174523,
#u20260520145756,
#u20260520145659,
#u20260520163203,
#u20260520162715,
#u20260520163630,
#u20260520163651,
#u20260520163946,
#u20260520164006 {
padding-left: 314px;
}

}
