/* 管理画面向けにフォントを指定 */
.editor-styles-wrapper {
  font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif !important;
}
.editor-styles-wrapper .block-editor-block-list__layout {
  max-width: 840px;
  margin-inline: auto;
}

/* H1 の装飾 */
.editor-styles-wrapper .block-editor-block-list__layout h1 {
  position: relative;
  padding: 8px 16px;
  background: #03a9f4;
  color: #ffffff;
}
.editor-styles-wrapper h1::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  width: 100%;
  height: 5px;
  background: #03a9f4;
}

/* H2 の装飾 */
.editor-styles-wrapper h2 {
  position: relative;
  padding-bottom: 10px;
}
.editor-styles-wrapper h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(
    to right,
    #03a9f4 0%,
    #03a9f4 40%,
    #f5f7f9 40%,
    #f5f7f9 100%
  );
}

/* H3 の装飾 */
.editor-styles-wrapper h3 {
  border-left: 8px solid #03a9f4;
  padding: 8px 16px;
  background: #f5f7f9;
}
.editor-styles-wrapper h3 {
  counter-reset: h4-number;
}

/* H4 の装飾 */
.editor-styles-wrapper h4 {
  position: relative;
  padding: 8px 16px 8px 60px;
  background: #fff;
  border: 1px solid #03a9f4;
  overflow: hidden;
  counter-increment: h4-number;
}
.editor-styles-wrapper h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 60px;
  background: #03a9f4;
  clip-path: polygon(0 0, 100% 0, 70% 100%, 0% 100%);
}
.editor-styles-wrapper h4::after {
  content: counter(h4-number, decimal-leading-zero);
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: #ffffff;
}

/* H5 の装飾 */
.editor-styles-wrapper h5 {
  position: relative;
  width: 100%;
  background: #03a9f4;
  padding: 16px 8px;
  border-radius: 12px;
  color: #ffffff;
}
.editor-styles-wrapper h5::after {
  content: "";
  position: absolute;
  left: 32px;
  bottom: -8px;
  border-width: 8px 8px 0 8px;
  border-style: solid;
  border-color: #03a9f4 transparent transparent transparent;
}
