@charset "UTF-8";

@import url("_common.css");
@import url("_utility.css");

body.p-caution{
  & .l-contents.--01{
    & .l-contents__inner{
      & article{
        padding-block: clamp(1.5rem, 1.075rem + 1.81vw, 3rem); /* 24px 48px */
        &:not(:last-of-type){
          border-bottom: 1px solid color-mix(in srgb, var(--color-black-primary) 50%, transparent);
        }
        & > h3{
          margin-block-end: 1em;
          padding-inline-start: 2em;
          text-indent: -2em;
          font-size: clamp(1.125rem, 1.019rem + 0.45vw, 1.5rem); /* 18px 24px */
          font-weight: 700;
          line-height: 1.4;
        }
        & > h4{
          font-size: clamp(1rem, 0.965rem + 0.15vw, 1.125rem); /* 16px 18px */
          font-weight: 700;
          line-height: 1.4;
        }
        & > ol{
          counter-reset: number;
          & > li{
            padding-inline-start: 1.25em;
            line-height: 1.6;
            position: relative;
            &::before{
              content: counter(number);
              counter-increment: number;
              position: absolute;
              position: absolute;
              top: 0;
              left: 0;
              translate: 35% 2%;
              scale: 0.75;
              transform-origin: center;
            }
            &::after{
              display: block;
              content: "";
              width: 1em;
              height: 1em;
              border: 1px solid #000;
              border-radius: 50%;
              position: absolute;
              top: 0;
              left: 0;
              translate: 0 35%;
            }
          }
          & + p{
            margin-block-start: 1em;
          }
        }
        & p.note{
          margin-block-start: 0;
          padding-inline-start: 1em;
          text-indent: -1em;
          & + h4{
            margin-block-start: 2em;
          }
        }
      }
    }
  } /* 01 */
}