/* =====================
   全体
===================== */

body{
  background-color:#e0cde0;
  margin:0;
  padding:0;
  font-family:sans-serif;
}


/* =====================
   コンテンツ本体
===================== */

.main-wrapper{
  max-width:950px;
  margin:0 auto;
  background-color:#FFE3FE;
  padding:20px;
  box-shadow:0 0 15px rgba(0,0,0,0.15);
}


/* =====================
   タイトル
===================== */

h1{
  border:2px solid #d8b8d8;
  background:#fff6ff;
  padding:12px 22px;
  display:inline-block;
  border-radius:10px;
}

h3{
  margin-bottom:0;
  margin-top:60px;
}


/* =====================
   非表示テキスト
===================== */

.hidden-text{
  color:#FFE3FE;
}


/* =====================
   ブロック構造
===================== */

.block-title{
  max-width:900px;
  margin:0 auto 40px;
  text-align:center;
}

.block-info{
  max-width:900px;
  margin:0 auto;
}

.block-shop{
  max-width:900px;
  margin:40px auto 0;
  text-align:center;
  border-top:0.5px solid #ccc;
  padding-top:20px;
}

.block-end{
  text-align:center;
  margin-top:40px;
  padding-top:15px;
  border-top:3px solid #ccc;
  font-size:0.85em;
}


/* =====================
   店舗リスト
===================== */

.shop-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:20px;
}


/* 店舗カード */

.shop{
  flex:1 1 220px;
  max-width:220px;
  text-align:left;
  padding:15px;
  border:1px solid #ccc;
  border-radius:8px;
  background:#fff;
  position:relative;
}


/* =====================
   バッジ
===================== */

.badge{
  position:absolute;
  top:10px;
  right:10px;
  font-size:12px;
  padding:2px 6px;
  border-radius:4px;
  background:#444;
  color:#fff;
}


/* =====================
   ボタン
===================== */

.shop a{
  display:block;
  text-align:center;
  margin:6px 0;
  padding:8px;
  border-radius:6px;
  text-decoration:none;
  font-weight:bold;
}


/* 通常版 */

.btn-normal{
  background:#ffdede;
  color:#000;
}
.btn-normal:hover {
  color: #ffffff;
}


/* フレッシュ版 */

.btn-fresh{
  background:#deecff;
  color:#000;
}
.btn-fresh:hover {
  color: #ffffff;
}

/* =====================
   状態制御
===================== */

/* 販売中 */

.shop.selling .badge{
  background:#ff4d4d;
}


/* 準備中 */

.shop.preparing{
  background:#eee;
}

.shop.preparing .badge{
  background:#888;
}

.shop.preparing a{
  background:#ccc;
  color:#666;
  pointer-events:auto;
}