.ul {
  ul,
  ol {
    color: #515156;
    font-size: 1.6rem;
    list-style-position: inside;
    padding: var(--content-list-padding, 1.6rem 1.6rem 1.6rem 5.3rem);
    font-weight: 400;
    line-height: 27px;
    li {
      margin: 0 0 1.6rem 0;
      position: relative;
      >p {
        display: inline;
      }

      ul {
        li {
          margin: 1.6rem 0 0 0;
        }
      }
    }
  }

  ul {
    list-style-type: disc;
    ::marker {
      content: '';
    }

    li::before {
      content: ' ';
      margin-right: 2.8rem;
      padding-top: 0.16rem;
      height: 0.8rem;
      width: 0.8rem;
      display: inline-flex;
      position: absolute;
      top: 1rem;
      font-size: 1.4rem;
      font-weight: 500;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      color: #64646D;
      background: #64646D;
      margin-left: -3.8rem;
    }
  }

  ol {
    list-style-type: decimal;
    padding: var(--content-list-padding, 1.6rem 1.6rem 1.6rem 5.2rem);

    li {
      counter-increment: li;
      display: list-item;
      position: relative;
    }

    ::marker {
      content: '';
    }

    li::before {
      content: counter(li);
      margin-right: 1.6rem;
      padding-top: 0.16rem;
      height: 3.2rem;
      width: 3.2rem;
      display: inline-flex;
      position: absolute;
      top: -0.2rem;
      font-size: 1.4rem;
      font-weight: 500;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      color: var(--content-list-number-color);
      background: #ececec;
      margin-left: -4.8rem;
    }
  }

  ul ul,
  ol ul {
    list-style-type: circle;
    list-style-position: inside;
    margin-left: 1.5rem;
  }

  ol ol,
  ul ol {
    list-style-type: lower-latin;
    list-style-position: inside;
    margin-left: 1.5rem;
  }

  p:not(:last-of-type),
  h2,
  h3,
  h4,
  h5,
  h6 {
    + ol,
    + ul {
      padding-top: var(--content-list-last-padding, 0);
    }
  }
}
