/* Groupブロック - カスタム背景色スタイル */

.wp-block-column[class*="is-vertically-aligned-top"] {
  align-self: stretch !important;
}

/* デフォルトのGroupブロック（ホワイト背景） */
.wp-block-group {
  background-color: var(--custom-background-color-white);
}

.wp-block-group[class*="is-style-blue-"].components-button.block-editor-button-block-appender,
.wp-block-group[class*="is-style-navy-"].components-button.block-editor-button-block-appender,
.wp-block-group[class*="is-style-blue-"]
  .components-button.block-editor-button-block-appender,
.wp-block-group[class*="is-style-navy-"]
  .components-button.block-editor-button-block-appender {
  box-shadow: inset 0 0 0 1px var(--custom-border-white);
  color: var(--custom-border-white) !important;
  width: 100%;
}

.wp-block-group[class*="is-style-"][class*="-small"] {
  padding: 60px 80px;
}

.wp-block-group[class*="is-style-"][class*="-medium"] {
  padding: 80px 100px;
}

.wp-block-group[class*="is-style-"][class*="-large"] {
  padding: 120px 100px;
}

.wp-block-group[class*="is-style-default"] {
  background-color: var(--custom-background-color-white);
}

.wp-block-group[class*="is-style-gray"] {
  background-color: var(--custom-background-color-gray);
}

.wp-block-group[class*="is-style-blue"] {
  background-color: var(--custom-background-color-blue);
}

.wp-block-group[class*="is-style-navy"] {
  background-color: var(--custom-background-color-navy);
}

/* レスポンシブ対応 - パディングスタイル */
@media screen and (max-width: 768px) {
  .wp-block-group[class*="is-style-"][class*="-small"] {
    padding: 64px;
  }

  .wp-block-group[class*="is-style-"][class*="-medium"] {
    padding: 64px;
  }

  .wp-block-group[class*="is-style-"][class*="-large"] {
    padding: 64px;
  }
}

@media screen and (max-width: 420px) {
  .wp-block-group[class*="is-style-"][class*="-small"] {
    padding: 64px 24px;
  }

  .wp-block-group[class*="is-style-"][class*="-medium"] {
    padding: 64px 24px;
  }

  .wp-block-group[class*="is-style-"][class*="-large"] {
    padding: 64px 24px;
  }
}

.wp-block-group[class*="is-style-"][class*="-small"] .custom-heading {
  margin-bottom: 32px;
}

.wp-block-group[class*="is-style-"][class*="-medium"] .custom-heading {
  margin-bottom: 40px;
}

.wp-block-group[class*="is-style-"][class*="-large"] .custom-heading {
  margin-bottom: 48px;
}