/* ==========================================
ショップガイド 共通設定
========================================== */
  .shop-guide {
    position: relative;
    width: 100vw;
    min-height: 0vw;
    padding: clamp(25px, 7vw, 70px) 0 clamp(45px, 8.5vw, 85px);
  }

  .shop-guide * {
    min-height: 0vw;
  }


  .shop-guide-container {
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 20px;
  }

  /* ---- 見出し（1F / 2F ラベル） ---- */
  .shop-guide__title {
    position: relative;
    color: #fff;
    font-weight: bold;
    font-size: clamp(16px, 2vw, 20px);
    padding: clamp(8px, 1.5vw, 12px) clamp(12px, 2vw, 20px);
    margin: clamp(24px, 7vw, 70px) 0 clamp(16px, 2.5vw, 24px);
    border-radius: 4px;
  }

  .shop-guide__title--pink {
    background-color: #ff77aa;
    /* ピンク */
  }

  .shop-guide__title--orange {
    background-color: #ff6932;
    /* オレンジ */
  }

  .shop-guide__title:first-child {
    margin-top: 0;
  }

  /* ---- グリッドレイアウト ---- */
  .shop-guide__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(16px, 3vw, 30px) clamp(16px, 3vw, 40px);
  }

  /* ---- ショップカード ---- */
  .shop-card {
    display: flex;
    align-items: center;
    min-height: clamp(120px, calc(170vw / 10), 170px);
    gap: clamp(12px, 2vw, 20px);
    padding: clamp(10px, 1.8vw, 16px) clamp(4px, .9vw, 8px) clamp(10px, 1.8vw, 16px) clamp(10px, 1.8vw, 16px);
    border: 1px solid #afafaf;
    border-radius: 6px;
    text-decoration: none;
    color: inherit;
    background-color: #fff;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }

  .shop-card:hover {
    box-shadow: 4px 4px 0 #afafaf;
    transform: translateY(-2px);
  }

  /* ---- 画像エリア（後日画像差し替え用の外枠） ---- */
  .shop-card__image {
    flex: 0 0 auto;
    width: clamp(100px, calc(170vw / 10), 170px);
    aspect-ratio: 17 / 10;
    height: auto;
    background-color: #ddd;
  }

  .shop-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  /* ---- テキストエリア ---- */
  .shop-card__body {
    flex: 1 1 auto;
    min-width: 0;
    /* テキスト折り返し対策 */
  }

  .shop-card__category {
    font-size: clamp(12px, 1.4vw, 16px);
    color: #828282;
    margin: 0 0 4px;
  }

  .shop-card__name {
    font-size: clamp(14px, 1.8vw, 20px);
    font-weight: bold;
    margin: 0 0 6px;
    line-height: 1.3;
  }

  .shop-card__time {
    font-size: clamp(12px, 1.4vw, 16px);
    line-height: 1.375;
    margin: 0;
    color: #333;
  }

  /* ---- OPENバッジ ---- */
  .shop-card__badge {
    display: inline-block;
    background-color: #00c8f0;
    color: #fff;
    font-size: clamp(12px, 1.4vw, 15px);
    font-weight: bold;
    padding: 3px 10px;
    border-radius: 3px;
    line-height: 1.5;
    text-align: center;
    min-width: clamp(min(calc(140vw / 3.75), 140px), calc(190vw / 10), 190px);
  }

  .shop-deco {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    z-index: -1;
    width: clamp(min(calc(160vw / 3.75), 160px), calc(932.7619vw / 25), 932.7619px);
    height: auto;
    aspect-ratio: 466.381 / 394.6337;
  }

  .shop-deco--1 {
    top: 0;
    left: 0;
  }

  .shop-deco--2 {
    top: 0;
    right: 0;
    transform: scale(-1, 1);
  }

  .shop-deco--3 {
    bottom: 0;
    left: 0;
    transform: scale(1, -1);
  }

  .shop-deco--4 {
    bottom: 0;
    right: 0;
    transform: scale(-1, -1);
  }

  .shop-deco--2f {
    z-index: 1;
    bottom: 5px;
    right: 5px;
  }

  .shop-deco img {
    width: 100%;
    display: block;
    object-fit: contain;
  }

  /* ==========================================
スマホ版（768px以下）
========================================== */
  @media (max-width: 768px) {
    .shop-guide__grid {
      grid-template-columns: 1fr;
      /* 1列表示 */
    }

    .shop-guide__title--2f {
      margin-top: clamp(120px, calc(190vw / 7.68), 190px);
    }
  }