@charset "utf-8";
/* キャンペーンごとのカスタム用css */
/*
--main-text-color：メインで使う特定の色のテキスト色
--normal-text-color：普通のテキスト色(普通は黒を使うところ)
--bg-color：背景色
--nav-text-color：カテゴリ部分のテキスト色
--nav-bg-color：カテゴリ部分の背景色
--price-strong-text：価格部分の強調する時の色
--shoplist-title-border-bottom：SHOP LIST部分の下部の色
*/

:root {
  --main-text-color: #bf281f;
  --normal-text-color: #000;
  --bg-color: #f8f4e1;
  --nav-text-color:#bf281f;
  --nav-bg-color: #fff;
  --price-strong-text:#bf281f;
  --shoplist-title-border-bottom: #9b000e;
}

/* 選択をクリアの前にある丸矢印の画像の色を変えたい時に使う　これを使用する時には画像をディレクトリ内のimg/に配置してください
.clear_btn::before {
  background: url(../img/icon-clear.svg);
}
*/

/* カテゴリのタイトルの前にある画像の色を変えたい時に使う　これを使用する時には画像をディレクトリ内のimg/に配置してください
.search_ttl::before {
  background: url(../img/icon-filter.svg);
}
 */

/* セールのときに使うcss
.item_basic_info {
  font-size: 0.875rem;
}

.item_price {
  font-size: 1rem;
}

.item_price span.main_price {
  font-size: 1.2rem;
}
*/

.red {
  color: red;
  font-weight:bold
}

/* ----------------------------
  notes
------------------------------*/
.footer-notes {
  margin-block-start: 30px;
  width: 94.117647058%;
  margin-inline: auto;
  border: 2px solid #000;
}
.footer-notes .footer-notes--heading {
  font-size: 20px;
  font-weight: bold;
  padding: 10px 25px;
  color: #fff;
  background-color: #000;
}
.footer-notes .footer-notes--note {
  font-size: 14px;
  padding: 15px 0;
  padding-left: 20px;
  line-height: 1.7em;
}

@media screen and (max-width: 767px) {
  .footer-notes {
    width: 91.666666666%;
    margin-inline: auto;
    border: 2px solid #000;
  }
  .footer-notes .footer-notes--heading {
    font-size: 20px;
    font-weight: bold;
    padding: 10px 20px;
    color: #fff;
    background-color: #000;
  }
  .footer-notes .footer-notes--heading p{ 
    line-height: 1;
  }
  .footer-notes .footer-notes--note {
    font-size: 14px;
    padding: 15px;
    line-height: 1.7em;
  }
}