@charset "UTF-8";
.image-container {
  position: relative;
  width: 300px;
}

.image-container img {
  width: 100%;
  display: block;
}

.operator-badge {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background: rgba(0, 0, 0, 0.2);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  color: #ff0000;
  font-weight: 550;
  pointer-events: none;
}

@media screen and (min-width: 768px) {
  /* 親要素のflexを解除して、カテゴリと価格帯を2段に分ける */
  .narrow-wrap.custom-layout {
    display: block !important;
  }

  /* 1段目：商品カテゴリ */
  .narrow-wrap.custom-layout dl:first-of-type {
    display: block !important;
    width: 100% !important;
    margin-bottom: 40px !important;
  }

  /* 2段目：価格帯dl（ここを「検索ボタン」と横並びにする） */
  .narrow-wrap.custom-layout dl.price-range {
    display: inline-block !important;
    /* ボタンと横並び */
    vertical-align: bottom !important;
    margin-right: 15px !important;
    width: auto !important;
    /* 100%幅を解除 */
    margin-bottom: 0 !important;
  }

  /* FROM ～ TO を 1行に固定 */
  .narrow-wrap.custom-layout dl.price-range dd {
    display: flex !important;
    /* Flexboxで横並び */
    flex-wrap: nowrap !important;
    /* 絶対に折り返さない */
    align-items: center !important;
    gap: 8px !important;
    width: auto !important;
  }

  /* inputの幅を制限（ここが広すぎるとボタンが落ちます） */
  .narrow-wrap.custom-layout dl.price-range input.form-control {
    width: 120px !important;
    /* 幅を固定 */
    height: 52px !important;
    flex-shrink: 0 !important;
    /* 縮ませない */
    margin: 0 !important;
  }

  /* 2段目：検索ボタン（完全に「浮き」を解除して横に並べる） */
  .narrow-wrap.custom-layout #execute_search {
    position: static !important;
    /* 浮いているのをリセット。最重要。 */
    display: inline-block !important;
    /* 物理的にTOの右に並べる */
    vertical-align: bottom !important;
    /* 入力欄と下端を揃える */
    /* 共通CSSの右端固定値を無効化 */
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: 160px !important;
    /* ボタンの幅 */
    height: 52px !important;
    line-height: 52px !important;
    margin: 0 !important;
  }
}
@media screen and (max-width: 767px) {
  /* 親のFlexを解除 */
  .narrow-wrap.custom-layout {
    display: block !important;
  }

  /* 価格帯コンテナを全幅に */
  .narrow-wrap.custom-layout dl.price-range {
    display: block !important;
    width: 100% !important;
    margin-bottom: 15px !important;
  }

  /* FROM ～ TO を横並び(50%ずつ)にする */
  .narrow-wrap.custom-layout dl.price-range dd {
    display: flex !important;
    flex-direction: row !important;
    /* 縦並びを阻止 */
    align-items: center !important;
    width: 100% !important;
    gap: 8px !important;
  }

  /* inputを均等に広げる */
  .narrow-wrap.custom-layout dl.price-range input.form-control {
    flex: 1 !important;
    /* 左右で半分ずつ分け合う */
    width: 0 !important;
    /* 既存の固定幅設定をリセット */
    min-width: 0 !important;
    height: 52px !important;
    box-sizing: border-box !important;
  }

  /* 「～」記号の幅を維持 */
  .narrow-wrap.custom-layout dl.price-range .range-txt {
    flex-shrink: 0 !important;
    padding: 0 4px;
  }

  /* 検索ボタンを100%幅で下段へ */
  .narrow-wrap.custom-layout #execute_search {
    position: static !important;
    display: block !important;
    width: 100% !important;
    height: 52px !important;
    margin-top: 10px !important;
  }
}
/*# sourceMappingURL=scene_cate_price.css.map*/