@charset "UTF-8";

/* ====== クーポン ====== */

/*コンテンツ全体の背景*/
#coupon {
  background-image: url(images/bg1.jpg);
  background-size: 20% auto;
  background-repeat: repeat;
  background-position: center;
}

/*見出し*/
.coupon__midashi {
  background: #ff6b6b;
  color: #fff;
  text-shadow: 3px 3px 0 #00000055;
}

/*商品名*/
.coupon_itemnm {
  color: #000;
}

/*商品価格*/
.coulist__kakaku {
  color: #e60012;
}

/*SOLD OUTの文字色*/
.coulist__kakaku.sold {
  color: #999;
}

/*今ならクーポンで」の背景色（商品の枠と同じ色を指定）*/
.coulist__get {
  background: #ff4647;
}

/*今ならクーポンで」の文字色*/
.coulist__get__txt {
  color: #fff;
}

/*クーポン金額*/
.coulist__get .coulist__kakaku {
  color: #ff0;
  text-shadow: 3px 3px 0 #00000055;
}

/*COUPON GETボタン*/
a.coulist__get__btn {
  color: #ff4647;
  background: #fff;
}

/*COUPON GETボタンのホバー*/
a.coulist__get__btn:hover {
  background: #ff0;
}

/*COUPON GETボタンの矢印*/
.coulist__get__btn::after {
  border-left-color: #ff4647;
}

/*「クーポンご利用時の注意」の文字色*/
.couinfo {
  color: #000;
}

/*「クーポンの詳しいご利用方法はコチラ」ボタン*/
a.couinfo__btn {
  background: #ff4647;
  color: #fff;
}

/*クーポン完売ラベル*/
.couponsold::after {
  background: #ff4647;
  color: #fff;
}

/* ====== 週替わり ====== */

/*コンテンツ全体の背景*/
#weekly {
  background: #e1fcff;
}

/*「第１週目」見出し*/
.weekly__midashi {
  background: #00baff;
  color: #ff0;
  text-shadow: 3px 3px 0 #00000055;
}

/*「一覧へ」ボタン*/
a.weekly__btn {
  background: #00baff;
  color: #fff;
  box-shadow: 0 4px 0 #007caa;
}

/* ====== カテゴリー ====== */

/*コンテンツ全体の背景*/
#category {
  background-image: url(images/bg2.jpg);
  background-repeat: repeat;
  position: relative;
  z-index: 0;
  background-size: 100% auto;
  background-position: top;
}

/*カテゴリー切り替えボタンの文字色と背景色*/
.catebtn__con>span {
  background: #fff;
  color: #0060ec;
}

/*カテゴリー切り替えボタンの枠線*/
.catebtn>ul>li::after {
  /* box-shadow: 0 4px 0 #804b05; */
  background: #00efff;
}

/*カテゴリー切り替えボタンのアクティブ時の文字色と背景色*/
.active.catebtn__con>span {
  background: #ffff00;
  color: #0060ec;
}

/*カテゴリーごとの見出し*/
.category__midashi {
  color: #0060ec;
}

/*「もっと見る」ボタン*/
a.category__btn {
  background: #f41683;
  color: #fff;
  box-shadow: 0 4px 0 #d1006a;
}

/* ====== おすすめ特集 ====== */

/*コンテンツ全体の背景*/
#features{
  background-image: url(images/bg3.jpg);
  background-size: 20% auto;
  background-repeat: repeat;
  background-position: center;
}


/* ====== セール終了後表示 ====== */
.finished {
  background-image: url(images/bg1.jpg);
  background-size: 20% auto;
  background-repeat: repeat;
  background-position: center;
}

/*「トップページに戻る」ボタン*/
a.finished__btn {
  background: #f41683;
  color: #fff;
  box-shadow: 0 4px 0 #d1006a;
}

@media (max-width: 767px) {
  #coupon {
    background-size: 30% auto;
  }
  #features{
    background-size: 30% auto;
  }
  .finished {
    background-size: 30% auto;
  }
}