/**
 * ポイントカードページ - WordPressブロック用CSSアダプタ
 *
 * ネイティブブロック（wp:group, wp:image, wp:paragraph 等）の
 * デフォルトスタイルをリセットし、既存CSSとの互換性を確保する。
 */

#pg_pointcard .wp-block-group {
  margin: 0;
}

#pg_pointcard .wp-block-image {
  margin: 0;
}

#pg_pointcard span.red,
#pg_pointcard span.power {
  display: inline;
}

#pg_pointcard .pr_lead {
  font-size: 1.8rem;
}

#pg_pointcard .wp-block-image img {
  display: block;
}

/**
 * Flex レイアウト
 *
 * WordPress が wp-block-group の中に __inner-container ラッパーを
 * 挿入するため、flex は外側の .fx ではなく内部コンテナに適用する。
 *
 * 実際のレンダリング構造:
 *   .wp-block-group.fx
 *     └─ .wp-block-group__inner-container  ← ここに flex
 *          ├─ .wp-block-group.toku_box.low
 *          ├─ .wp-block-group.toku_box.low
 *          └─ ...
 */
@media screen and (min-width: 580px) {
  #pg_pointcard .fx > .wp-block-group__inner-container {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }

  #pg_pointcard .wp-block-group.toku_box.low {
    width: 50%;
    box-sizing: border-box;
  }

  #pg_pointcard #com_2 .fx > .wp-block-group__inner-container {
    justify-content: space-between;
  }

  #pg_pointcard #com_2 .wp-block-group.sinia_box {
    width: calc(100% / 3);
    max-width: 340px;
    border-left: 1px solid #eee;
    padding: 0 10px;
    margin-bottom: 0;
    box-sizing: border-box;
  }

  #pg_pointcard #com_2 .wp-block-group.sinia_box:first-child {
    border: none;
  }
}

@media screen and (min-width: 980px) {
  #pg_pointcard .wp-block-group.toku_box.low {
    width: 25%;
    padding: 20px;
  }

  #pg_pointcard #com_2 .wp-block-group.sinia_box {
    padding: 0 20px;
  }
}

/* .even クラスによる背景色（nth-child に依存しない確実な指定） */
#pg_pointcard .toku_box.even {
  background-color: #ebebeb;
}

/* .head 内の段落マージンリセット */
#pg_pointcard .head p {
  margin: 0;
}

/* キャプション内の段落マージンリセット */
#pg_pointcard .caption_box_a p,
#pg_pointcard .caption_box_b p {
  margin: 0;
}

/* wp:image を使った特典バッジのfigureマージンリセット */
#pg_pointcard figure.toku_num {
  margin: 0;
}

/* wp:image を使ったシニア特典ボックスのfigure対応 */
#pg_pointcard #com_2 figure.bottom {
  display: flex;
  align-items: center;
  background-color: #ffe537;
  min-height: 160px;
  box-shadow: 3.441px 4.915px 0.81px 0.19px rgba(151, 151, 151, 0.14);
  padding: 20px;
}

#pg_pointcard #com_2 figure.bottom img {
  margin: 0 auto;
}