.wp-block-heading {
}

h2.wp-block-heading {
  display: flex;
  padding: var(--wp--preset--spacing--20) 0px;
  border-bottom: 4px solid var(--wp--preset--color--custom-red);
  align-items: center;
  gap: var(--wp--preset--spacing--16);
  font-size: var(--wp--preset--font-size--extra-large);
  line-height: 1.4;
  &::before {
    content: "";
    width: 32px;
    height: 32px;
    background: url(../img/block/heading/heading-sun.png) no-repeat center
      center / contain;
    flex-shrink: 0;
  }
}

h3.wp-block-heading {
  background: var(--wp--preset--color--custom-gray-more-light);
  padding: var(--wp--preset--spacing--20);
  border-bottom: 4px solid var(--wp--preset--color--custom-red);
  font-size: var(--wp--preset--font-size--large);
}

h4.wp-block-heading {
  background: var(--wp--preset--color--custom-orange-light);
  padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--16);
  font-size: var(--wp--preset--font-size--semi-large);
}

.wp-block-list {
}


ul.wp-block-list {
  padding: var(--wp--preset--spacing--24);
  border: 4px solid var(--wp--preset--color--custom-gray-more-light);
  list-style: none;

  > li {
    list-style: none;
    padding-left: 18px;
    position: relative;

    &::before {
      content: "";
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--wp--preset--color--custom-red);
      position: absolute;
      top: 9px;
      left: 0;
    }
  }
}

ol.wp-block-list {
  padding: var(--wp--preset--spacing--24) var(--wp--preset--spacing--24) var(--wp--preset--spacing--24) var(--wp--preset--spacing--40);
  border: 4px solid var(--wp--preset--color--custom-gray-more-light);
}

 .wp-block-quote {
  position: relative;
  margin-inline: 0;
 padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--60);
 border-left: 5px solid var(--wp--preset--color--custom-gray);
 background: var(--wp--preset--color--custom-gray-more-light);
 color: var(--wp--preset--color--custom-gray-dark);
 align-items: flex-start;
 gap: var(--1-PC, 10px);
 align-self: stretch;

 &::before, &::after {
  content: '';
  position: absolute;
  line-height: 1.4;
  color: var(--wp--preset--color--custom-gray);
  font-size: var(--wp--preset--font-size--extra-large);
  top: var(--wp--preset--spacing--20);
 }

 &::before {
content: '“';
left: var(--wp--preset--spacing--20);
 }
 &::after {
content: '”';
right: var(--wp--preset--spacing--20);
 }
}
