/* **********************************
core/group
*********************************** */
/* アラート用背景 */
.wp-block-group.is-style-alert-bg {
  background-color: color-mix(in srgb, currentColor, white 90%);
  padding: var(--wp--preset--spacing--fib-3) var(--wp--preset--spacing--fib-4);
  border-radius: 4px;
}

/* 吹き出しバルーン */
.is-style-balloon {
  position: relative;
  display: inline-block;
  border: 1px solid currentColor;
  border-radius: 4px;
  background-color: var(--wp--preset--color--neutral-white);
  min-width: 5.2rem !important;
}
.is-style-balloon::before {
  content: "";
  position: absolute;
  top: 0;
  left: 2.5rem;
  border-style: solid;
  border-width: 0 9.5px 12px 9.5px;
  border-color: transparent transparent currentColor;
  translate: -50% -100%;
}
.is-style-balloon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 2.5rem;
  border-style: solid;
  border-width: 0 8.2px 10.4px 8.2px;
  border-color: transparent transparent var(--wp--preset--color--neutral-white);
  translate: -50% -100%;
}

/* ***********************************
core/heading
************************************ */
.is-style-subtitle {
  /* 見出しブロックのデフォルト設定を上書き */
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 600;
  letter-spacing: 0.05em;

  /* 装飾 */
  color: currentColor;
  border-left: 3px solid currentColor;
  padding-left: var(--wp--preset--spacing--fib-3);
  margin-top: var(--wp--preset--spacing--fib-5);
  margin-bottom: var(--wp--preset--spacing--fib-3);
}

.is-style-h-deco-line,
.is-style-p-deco-line {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  letter-spacing: 0.1rem;
}
.is-style-h-deco-line::before,
.is-style-h-deco-line::after,
.is-style-p-deco-line::before,
.is-style-p-deco-line::after {
  content: "";
  flex-basis: 6rem;
  height: 1px;
  background-color: currentColor;
}
.is-style-h-deco-line::before,
.is-style-p-deco-line::before {
  margin-right: 1rem;
}
.is-style-h-deco-line::after,
.is-style-p-deco-line::after {
  margin-left: 0.7rem;
}

/* ***********************************
core/paragraph
************************************ */
.is-style-note-line {
  background-color: transparent; /* 背景色 */
  background-image: linear-gradient(180deg, color-mix(in srgb, currentColor 30%, #ffffff 20%) 1px, transparent 1px); /* 罫線の色と太さ  */
  background-size: 100% 2.4rem; /* 行の高さ */
  line-height: 2.4rem; /* 文字の高さ */
  padding-bottom: 1px; /* 最終行の下にも罫線を引く */
}

/* ***********************************
core/list
************************************ */
.is-style-list-style-none {
  list-style-type: "";
  padding-inline-start: 0;
}
.is-style-j-style {
  padding-left: var(--wp--preset--spacing--fib-4);
}

/* ***********************************
core/button
************************************ */

.is-style-with-arrow .wp-block-button__link,
.is-style-outline-arrow .wp-block-button__link {
  position: relative;
  padding-right: 2.6rem;
}
.is-style-with-arrow .wp-block-button__link::after,
.is-style-outline-arrow .wp-block-button__link::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  border: 0;
  border-top: solid 2px currentColor;
  border-right: solid 2px currentColor;
  transform: rotate(45deg);
  top: 0;
  right: 1.6rem;
  bottom: 0;
  margin: auto;
  transition: right 0.3s ease;
}
.is-style-with-arrow .wp-block-button__link:hover::after,
.is-style-outline-arrow .wp-block-button__link:hover::after {
  right: 1.2rem;
}
.is-style-outline-arrow .wp-block-button__link {
  background: transparent none;
  border-color: currentColor;
  border-style: solid;
  border-width: 2px;
  color: currentColor;
}

/* ボタンhover時の背景色 */
.is-style-with-arrow .wp-block-button__link:hover {
  background-color: transparent;
  box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.2);
  transition: 0.3s ease;
}
.is-style-outline .wp-block-button__link:hover,
.is-style-outline-arrow .wp-block-button__link:hover {
  box-shadow: none;
  background-color: color-mix(in srgb, currentColor 8%, transparent);
  transition: 0.3s ease;
}

/* ***********************************
core/image
************************************ */
/* ギャラリーの最初の写真を大きくする */
.is-style-full-width {
  width: 100% !important;
}
