.newui-button {border-top: solid 8px #0783c3; background-color: #fefddd; padding: 53px 1em 44px;
  a {font-weight: bold; text-decoration: none; transition: 0.3s;}
  * {box-sizing: border-box;}
}
.fw-bold {font-weight: bold;}
.d-flex {display: flex;}
.items-center {align-items: center;}
.f-small {font-size: 80%;}
.small-screen {display: none;}
.w-100 {width: 100%;}
.text-right {text-align: right;}
.text-center {text-align: center;}
.d-inline-block {display: inline-block;}
.block-desc {width: 100%; max-width: 360px; margin-bottom: 30px;
  .block-desc__inner {border: solid 1px #f39800; border-radius: 10px; background-color: #fff; padding: 20px 15px;
    .block-desc__inner-tit {font-size: clamp(16px, 2vw, 26px);}
    .block-desc__inner-sub {font-size: clamp(14px, 1.5vw, 20px);}
  }
  p {color: #f39800; line-height: 1.6;}
  a {color: #fff;}
  .block-desc__cont {position: relative; margin-top: 20px;
    .block-desc__cont-left {width: fit-content; margin-left: 9px;}
    p {position: relative; display: flex; gap: 15px; justify-content: center; align-items: center;}
    p:before, p:after {content: ""; width: 2px; height: 27px; border-radius: 999px; background-color: #f39800;}
    p:before {transform: rotate(-20deg);}
    p:after {transform: rotate(20deg);}
    .block-desc__cont-link {
      display: block;
      width: calc(100% - 15px);
      margin: 5px auto 0;
      text-align: center;
      padding: 10px 15px;
      border-radius: 10px;
      border: solid 1px #e60012;
      background-color: #e60012;
      position: relative;
      &:after {
        content: "";
        width: 11px;
        height: 19px;
        mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.79 21.06'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 1.93px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cpolyline class='cls-1' points='.97 20.1 12.29 10.53 .97 .97'/%3E%3C/g%3E%3C/svg%3E");
        mask-repeat: no-repeat no-repeat;
        mask-position: center center;
        mask-size: 100% auto;
        background-color: #fff;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
      }
      &:hover {background-color: #fff; color: #e60012;}
      &:hover:after {background-color: #e60012;}
    }
    .block-desc__cont-right {width: 110px; aspect-ratio: 256/155; position: absolute; right: -24px; top: 80%; transform: translateY(-50%);
      img {width: 100%; height: 100%;}
    }
  }
}
.gap-10 {gap: 10px;}
.gap-16 {gap: 16px;}
.gap-20 {gap: 20px;}
.gap-30 {gap: 30px;}
.gap-40 {gap: 40px;}
.newui-btn {
  text-align: center;
  width: 100%;
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  background-size: 100% 100%;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  *:not(a) {color: #fff;}
  b {font-size: 110%;}
  &.--pink {
    line-height: 1.3;
    aspect-ratio: 639/552;
    background-image: url("../../../../wp-content/themes/hae/assets/images/new/pink.png");
    a {color: #d694be; font-size: 18px; display: block; margin: 20px auto 0; padding: 5px 30px; background-color: #fff; border-radius: 8px; width: fit-content; line-height: 1; position: relative;
      &:after {
        content: "";
        width: 11px;
        height: 19px;
        mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.46 15.97'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 2.13px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cpolyline class='cls-1' points='1.06 14.91 11.53 7.99 1.06 1.06'/%3E%3C/g%3E%3C/svg%3E");
        mask-repeat: no-repeat no-repeat;
        mask-position: center center;
        mask-size: 100% auto;
        background-color: #d694be;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
      }
    }
  }
  &.--blue {
    line-height: 1.3;
    aspect-ratio: 1;
    background-image: url("../../../../wp-content/themes/hae/assets/images/new/blue.png");
    a {color: #80ccda; font-size: 18px; display: block; margin: 20px auto 0; padding: 5px 30px; background-color: #fff; border-radius: 8px; width: fit-content; line-height: 1; position: relative;
      &:after {
        content: "";
        width: 11px;
        height: 19px;
        mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.46 15.97'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 2.13px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cpolyline class='cls-1' points='1.06 14.91 11.53 7.99 1.06 1.06'/%3E%3C/g%3E%3C/svg%3E");
        mask-repeat: no-repeat no-repeat;
        mask-position: center center;
        mask-size: 100% auto;
        background-color: #80ccda;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
      }
    }
  }
  &.--red {
    line-height: 1.3;
    aspect-ratio: 1;
    background-image: url("../../../../wp-content/themes/hae/assets/images/new/red.png");
    a {color: #f09bad; font-size: 18px; display: block; margin: 20px auto 0; padding: 5px 30px; background-color: #fff; border-radius: 8px; width: fit-content; line-height: 1; position: relative;
      &:after {
        content: "";
        width: 11px;
        height: 19px;
        mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.46 15.97'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 2.13px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cpolyline class='cls-1' points='1.06 14.91 11.53 7.99 1.06 1.06'/%3E%3C/g%3E%3C/svg%3E");
        mask-repeat: no-repeat no-repeat;
        mask-position: center center;
        mask-size: 100% auto;
        background-color: #f09bad;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
      }
    }
  }
  &.--green {
    line-height: 1.3;
    aspect-ratio: 1;
    background-image: url("../../../../wp-content/themes/hae/assets/images/new/green.png");
    a {color: #a4d3ac; font-size: 18px; display: block; margin: 20px auto 0; padding: 5px 30px; background-color: #fff; border-radius: 8px; width: fit-content; line-height: 1; position: relative;
      &:after {
        content: "";
        width: 11px;
        height: 19px;
        mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.46 15.97'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 2.13px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cpolyline class='cls-1' points='1.06 14.91 11.53 7.99 1.06 1.06'/%3E%3C/g%3E%3C/svg%3E");
        mask-repeat: no-repeat no-repeat;
        mask-position: center center;
        mask-size: 100% auto;
        background-color: #a4d3ac;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
      }
    }
  }
  &.--purple {
    line-height: 1.3;
    aspect-ratio: 1;
    background-image: url("../../../../wp-content/themes/hae/assets/images/new/purple.png");
    a {color: #a499c9; font-size: 18px; display: block; margin: 20px auto 0; padding: 5px 30px; background-color: #fff; border-radius: 8px; width: fit-content; line-height: 1; position: relative;
      &:after {
        content: "";
        width: 11px;
        height: 19px;
        mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.46 15.97'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 2.13px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cpolyline class='cls-1' points='1.06 14.91 11.53 7.99 1.06 1.06'/%3E%3C/g%3E%3C/svg%3E");
        mask-repeat: no-repeat no-repeat;
        mask-position: center center;
        mask-size: 100% auto;
        background-color: #a499c9;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
      }
    }
  }
}

.newstyle {
  * {box-sizing: border-box;}
  .newstyle-top_pattern {
    width: 100%;
    max-width: 260px;
    aspect-ratio: 767/170;
    background: url('./assets/images/top_pattern.png') no-repeat center center;
    background-size: auto 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .newstyle-title {
    position: relative;
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: center;
    color: #0783c3;
    font-size: 26px;
    text-align: center;
    margin-bottom: 20px;
    margin-top: -20px;
    &:before, &:after {
      content: "";
      width: auto;
      height: 53px;
      aspect-ratio: 25/106;
      background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.16 112.33'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %230783c3; stroke-linecap: round; stroke-linejoin: round; stroke-width: 5.67px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cg%3E%3Cpolyline class='cls-1' points='2.83 102.87 2.83 9.47 28.32 2.83 2.83 9.47 2.83 102.87 28.32 109.5'/%3E%3Cline class='cls-1' x1='15.58' y1='6.15' x2='15.58' y2='106.18'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
      background-repeat: no-repeat no-repeat;
      background-position: center center;
      background-size: 100% 100%;
    }
    &:after {transform: scale(-1, 1);}
  }
  .newstyle-sub {padding: 2px 20px; width: fit-content; text-align: left; margin-bottom: 0; margin-top: 40px; border-radius: 999px;
    b {display: block;}
  }
  .newstyle-arrow_down {display: flex; justify-content: center; align-items: center; margin: 15px 0;
    &:before {content: ""; display: block; width: 0; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 30px solid #0783c3;}
  }
  .newstyle-note {border: solid 2px #0783c3; border-radius: 15px; padding: 30px; text-align: center; width: fit-content; min-width: 60%; margin: 0 auto;
    .newstyle-note_list {text-align: left; display: flex; color: #0783c3; width: fit-content; margin: 0 auto; font-weight: 600;
      &:before {content: attr(data-list); flex-shrink: 0;}
    }
  }
}
.list-style__data {
  /* --list-mark: attr(data-list);
  --list-mark-act: attr(data-list-act); */
  list-style: none;
  padding: 0;
  > * {display: flex; width: fit-content; position: relative; cursor: pointer;
    input {width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; cursor: pointer; z-index: 10;}
    &:not(:last-child) {margin-bottom: 10px;}
    /* &:before {
      content: var(--list-mark);
      flex-shrink: 0;
      margin-right: 10px;
      margin-top: 0;
      color: #0783c3;
      font-size: 150%;
    }
    &:has(input:checked):before {content: var(--list-mark-act);} */
    &:before {
      content: "";
      width: 22px;
      aspect-ratio: 1;
      display: block;
      mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32.11 32.11'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %230783c3; stroke-miterlimit: 10; stroke-width: 1.42px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Checkbox--Streamline-Radix'%3E%3Crect class='cls-1' x='.71' y='.71' width='30.69' height='30.69'/%3E%3C/g%3E%3C/svg%3E");
      mask-repeat: no-repeat no-repeat;
      mask-position: center center;
      mask-size: 100% 100%;
      background-color: #0783c3;
      margin-right: 10px;
      margin-top: 10px;
      flex-shrink: 0;
      align-self: flex-start;
    }
    &:has(input:checked):before {
      mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32.11 32.11'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230783c3; fill-rule: evenodd; stroke-width: 0px; %7D .cls-2 %7B fill: none; stroke: %230783c3; stroke-miterlimit: 10; stroke-width: 1.42px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Checkbox--Streamline-Radix'%3E%3Cg%3E%3Crect class='cls-2' x='.71' y='.71' width='30.69' height='30.69'/%3E%3Cpath class='cls-1' d='M23.84,10.33c.44-.64.28-1.52-.36-1.96-.64-.44-1.52-.28-1.95.36l-8.11,11.82-4.06-4.89c-.5-.6-1.38-.68-1.98-.19-.6.5-.68,1.38-.18,1.98l5.25,6.33c.28.34.71.53,1.15.51.44-.02.85-.25,1.1-.61l9.17-13.36h0Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }
    p {text-decoration-color: #0783c3; text-decoration-line: underline; text-underline-offset: 5px;}
  }
}

.newLecture {
  --bg_b: #bde4f5;
  --bg_y: #fffcdb;
  --b_dark: #006eb6;
  --tit_b: #006eb6;

  background-color: var(--bg_b);
  padding: 0 !important;
  font-family: "M PLUS Rounded 1c", sans-serif;
  
  * {box-sizing: border-box; font-weight: bold;}
  .newLecture_header {
    margin: 0 auto;
    padding-bottom: 10px;
    position: relative;
    z-index: 1;
    &:after {
      content: "";
      display: block;
      width: 100%;
      height: 22.787%;
      background-color: var(--bg_y);
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: -1;
    }
    
    .newLecture_header--body {
      padding-left: clamp(16px, 5.5vw, 74px);
      padding-right: clamp(16px, 5.5vw, 74px);
      .newLecture_header--top {
        padding: 40px clamp(16px, 9%, 147px) 67px clamp(16px, 9%, 147px);
        background-color: var(--b_dark);

        *:not(h2) {color: #fff;}
        h2 {color: #fff799; text-align: center; font-size: clamp(24px, 4vw, 50px); padding-bottom: 15px; border-bottom: solid 1px #fff;}
      }
    }
    .newLecture_header--bottom {margin-top: -15%; pointer-events: none;
      .banner {position: relative;
        .banner-text {position: absolute; top: 0; left: 0; width: 1px; height: 1px; opacity: 0.1; overflow: hidden;}
      }
    }
  }
  .newLecture_header--note {width: 100px; height: 100px; line-height: 1.3; display: flex; align-items: center; justify-content: center; text-align: center; border: solid 2px #fff; border-radius: 999px;}
}

.newLecture_block {padding: 40px;
  h2 {color: var(--tit_b); text-align: center; font-size: clamp(21px, 3vw, 35px); line-height: 1; font-weight: 900;
    small {font-size: 20px; font-weight: 600;}
  }
  .newLecture_block--btn {background-color: var(--b_dark); border-radius: 25px; text-align: center; padding: 20px 30px 30px;
    * {color: #fff;}
    a {margin: 20px auto 0;}
  }

  .newLecture_block--step {padding: 0 clamp(16px, 3vw, 40px); gap: 45px; flex-wrap: wrap; justify-content: center;
    .newLecture_block--stepItem {padding: 0 16px; position: relative; max-width: 260px;
      & > p {margin: 0 -16px;}
      &:not(:last-child):after {
        content: "";
        display: block;
        width: 60px;
        height: 74px;
        background-image: url("data:image/svg+xml,%3C?xml version='1.0' encoding='UTF-8'?%3E %3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 63.72 82.6'%3E %3Cdefs%3E %3Cstyle%3E .cls-1 %7B fill: %230168a9; fill-rule: evenodd; stroke: %23006eb6; stroke-miterlimit: 10; stroke-width: 2.84px; %7D %3C/style%3E %3C/defs%3E %3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E %3Cpolygon class='cls-1' points='1.42 22.65 31.66 22.65 31.66 4 61.9 41.3 31.66 78.59 31.66 59.95 1.42 59.95 1.42 22.65'/%3E %3C/g%3E %3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 100% 100%;
        position: absolute;
        top: 92px;
        left: calc(100% - 3px);
        transform: translateY(-50%);
      }
      img {width: 216px; height: auto;}
    }
    .newLecture_block--stepItem__desc {
      background-color: var(--b_dark);
      width: 100%;
      aspect-ratio: 1;
      border-radius: 999px;
      position: relative;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin-bottom: 30px;
      z-index: 0;

      &:before, &:after {content: ""; display: block; aspect-ratio: 1; border-radius: 999px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; z-index: -1;}
      &:before {width: calc(100% + 3px); border: solid 3px var(--b_dark);}
      &:after {width: calc(100% + 12px); border: solid 1px var(--b_dark);}

      & > div {scale: 0.95; margin-top: 8px;}
      * {color: #fff; line-height: 1.5;}
      h3 {font-size: 20px;}
    }
  }
}
.block--note {
  border-radius: 25px;
  background-color: #fff;
  padding: 20px 15px;
  gap: 20px;
  
  * {color: var(--tit_b);}
  .block--note__desc {font-weight: bold; font-size: clamp(19px, 2.65vw, 29px);}
}
.block--news {padding: 0 clamp(24px, 3vw, 50px);
  img {display: block; width: 112px; height: 112px; ;}
  .block--news-item {
    &:not(:last-child) {margin-bottom: 30px;}
    h3 {color: var(--tit_b); font-size: 24px;}
    h4 {font-weight: bold;
      b {font-size: 30px; font-weight: 900;}
    }
    p {line-height: 1.4;}
  }
}
.block--contact {padding-top: 25px; padding-bottom: 30px;
  .block--contact__gr {display: flex; justify-content: center; align-items: center;}
  .block--contact__support {
    p {text-align: left; line-height: 1.5; font-size: 20px;
      small {font-size: 16px;}
    }
  }
  .block--contact__phone {
    p {font-size: 30px; line-height: 1;}
  }
}
.about--note {
  border-radius: 20px;
  background-color: #fff;
  padding: 20px;
  gap: 20px;

  img {display: block; width: 182px; height: 182px;}
  h3 {color: var(--tit_b); font-size: 28px; font-weight: bold;}
  h4 {color: var(--tit_b); font-size: 17px; font-weight: bold;}
  p {line-height: 1.5;}
}
.block--max930 {width: 100%; max-width: 930px; margin-left: auto; margin-right: auto;}
.newLecture_block--bgYellow {background-color: var(--bg_y);}
.newLecture_block--bgBlue {background-color: var(--bg_b);}

.btnSty {display: block; border-radius: 20px; text-align: center; padding: 10px 45px; position: relative; font-size: clamp(16px, 4vw, 22px); text-decoration: none; width: 100%; max-width: 604px; transition: 0.35s;
  &:hover {opacity: 0.75;}
  &.btnSty--chevron-next:after {
    content: "";
    width: 10px;
    aspect-ratio: 1;
    border: solid 2px #fff;
    border-left: none;
    border-bottom: none;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(45deg);
    pointer-events: none;
    z-index: 2;
  }
  &.btnSty--red {background-color: #ff6f1b;}
}

.newstyle-box__yellow {
  background-color: #fff9e1;
  border-radius: 15px;
  height: 100%;
  padding: 20px 20px 30px;
  text-align: center;
}

.shrink-0 {flex-shrink: 0;}
.img-full {width: 100%; height: auto;}

.border-999 {border-radius: 999px;}
.border {border: solid 1px;}
.border-dBlue {border-color: var(--b_dark);}
.rounded-25 {border-radius: 25px;}
.text-dBlue {color: var(--b_dark);}
.bg-white {background-color: #fff;}
.bg-gray {background-color: #dbdcdc;}

.p-25 {padding: 25px !important;}
.px-15 {padding-left: 15px !important; padding-right: 15px !important;}

.mx-auto {margin-left: auto !important; margin-right: auto !important;}
.mb-10 {margin-bottom: 10px;}
.mb-20 {margin-bottom: 20px;}
.mb-30 {margin-bottom: 30px;}
.mt-0 {margin-top: 0 !important;}
.mt-10 {margin-top: 10px;}
.mt-20 {margin-top: 20px;}
.mt-40 {margin-top: 40px;}

.f-12 {font-size: 12px !important;}
.f-14 {font-size: 14px !important;}
.f-19 {font-size: 19px !important;}
.f-28 {font-size: 28px !important;}
.f-34 {font-size: 34px !important;}

.spacing-0 {letter-spacing: 0;}
.fw-500 {font-weight: 500 !important;}

.line-15 {line-height: 1.5 !important;}

@media only screen and (min-width: 769px) { 
  .newui-button {border-top-width: 16px;}
  .d-md-flex {display: flex;}
  .d-md-none {display: none;}
  .order-md-2 {order: 2;}
  .col-md-6 {width: 50%; flex-shrink: 0;}
  .col-md-3 {width: 25%;}
  .block-desc {padding: 20px 30px; max-width: 100%;
    .block-desc__inner {padding: 20px 30px;}
    .block-desc__cont {
      .block-desc__cont-link {width: calc(100% - 60px); padding: 12px 15px;}
      .block-desc__cont-right {width: 156px; right: -65px;}
    }
  }
  .newui-btn {
    &.--pink {font-size: clamp(24px, 2.8vw, 42px);
      a {margin-top: 30px;}
    }
    &.--blue {font-size: clamp(16px, 2.1vw, 26px);
      a {font-size: 18px;}
    }
    &.--red {font-size: clamp(16px, 2.1vw, 26px);
      a {font-size: 18px;}
    }
    &.--green {font-size: clamp(16px, 2.0vw, 24px);
      a {font-size: 18px;}
    }
    &.--purple {font-size: clamp(16px, 2.1vw, 26px);
      a {font-size: 18px;}
    }
  }
  
  .newstyle {
    .newstyle-top_pattern {max-width: 767px;}
    .newstyle-title {gap: 40px; font-size: 68px; padding-top: 60px; margin-bottom: 40px; margin-top: 0;
      &:before, &:after {
        content: "";
        width: auto;
        height: 106px;
        aspect-ratio: 25/106;
        background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.16 112.33'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %230783c3; stroke-linecap: round; stroke-linejoin: round; stroke-width: 5.67px; %7D %3C/style%3E%3C/defs%3E%3Cg id='_レイヤー_1' data-name='レイヤー 1'%3E%3Cg%3E%3Cpolyline class='cls-1' points='2.83 102.87 2.83 9.47 28.32 2.83 2.83 9.47 2.83 102.87 28.32 109.5'/%3E%3Cline class='cls-1' x1='15.58' y1='6.15' x2='15.58' y2='106.18'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
        background-repeat: no-repeat no-repeat;
        background-position: center center;
        background-size: 100% 100%;
      }
      &:after {transform: scale(-1, 1);}
    }
    .newstyle-sub {
      b {display: inline-block; margin-left: 20px;}
    }
    .newstyle-small {padding: 0 80px;}
  }

  .newstyle-col {display: flex;
    &.md-col-2 {
      .newstyle-col__inner {width: 50%; flex-shrink: 0;}
    }
  }

  .newstyle-box__yellow {padding: 20px 40px 30px;}

  .mb-md-0 {margin-bottom: 0;}
  .mt-md-40 {margin-top: 40px;}

  .f-md-20 {font-size: 20px !important;}
  .f-md-26 {font-size: 26px !important;}
  .f-md-50 {font-size: 50px !important;}

  .gap-md-16 {gap: 16px;}
}
@media only screen and (min-width: 819px) and (max-width: 993px) {
  .block-desc {margin-bottom: 0;
    .block-desc__inner {font-size: clamp(16px, 1.9vw, 26px); padding-left: 2vw; padding-right: 2vw;}
    .block-desc__cont {
      .block-desc__cont-right {width: 15vw; right: -6vw;}
    }
  }
}
@media only screen and (min-width: 769px) and (max-width: 820px) {
  .block-desc {
    .block-desc__inner {
      .small-screen {display: block;}
    }
  }
}
@media only screen and (max-width: 768px) { 
  .sp-hidden {display: none !important;}
  .flex-sp-col {flex-direction: column;}
  .w-sp-small {width: calc(100% - 60px); max-width: 360px; margin-left: auto; margin-right: auto;}
  .newui-btn {
    &.--pink {font-size: clamp(16px, 6vw, 26px);}
    &.--blue {font-size: clamp(16px, 6vw, 26px);}
    &.--red {font-size: clamp(16px, 6vw, 26px);}
    &.--green {font-size: clamp(16px, 6vw, 26px);}
    &.--purple {font-size: clamp(16px, 6vw, 26px);}
  }
  .newstyle-col__inner .wp-block-button__link img {width: 36px;}
  .newstyle-col {
    &.md-col-2 {
      .newstyle-col__inner:not(:last-child) {margin-bottom: 30px;}
    }
  }
  .newLecture_block--stepItem {margin-left: auto; margin-right: auto;}
  .block--contact__gr {flex-direction: column;}
  .btnSty {border-radius: 15px;}
  .flex-1 {flex: 1;}
  .newLecture {border-radius: 20px !important; margin-left: -5px !important; margin-right: -5px !important;
    & .newLecture_header {
      .newLecture_header--body {padding-left: 24px; padding-right: 24px;
        .newLecture_header--top {padding: 20px 16px;
          .btnSty {width: calc(100% + 70px); margin-left: -70px; margin-top: 20px; font-weight: bold;
            b {font-weight: bold;}
          }
        }
      }
      .newLecture_header--note {font-size: 10px; width: 60px; height: 60px;}
      .newLecture_header--bottom {margin-left: -13px; margin-right: -13px; margin-top: -25%;}
    }
  }
  .newLecture_block {padding: 20px 10px;
    .newLecture_block--btn {
      p {font-size: 13px; text-align: left;}
    }
    .newLecture_block--step {
      .newLecture_block--stepItem {
        img {margin: 0 auto; display: block;}
        &:not(:last-child) {margin-bottom: 80px;
          &:after {top: 100%; left: 50%; transform: translateX(-50%) rotate(90deg);}
        }
      }
      .newLecture_block--stepItem__desc {
        h3 {font-size: 26px;}
        p {font-size: 23px;}
      }
    }
  }
  .block--news {
    img {
      width: 80px;
      height: 80px;
    }
    & .block--news-item {gap: 10px;
      h3 {font-size: 18px;}
      h4 {font-size: 14px;
        b {font-size: 20px;}
      }
    }
  }
  .about--note {
    img {margin: 0 auto 10px;}
    h4 {margin-bottom: 25px;}
  }
  .block--contact {
    .block--contact__gr {gap: 10px; align-items: flex-start; width: fit-content; margin-left: auto; margin-right: auto;}
    .block--contact__support {
      img {width: 36px; height: auto; display: block;}
      p {font-size: 16px;
        small {font-size: 12px;}
      }
    }
    & .block--contact__phone {
      img {width: 28px; height: auto; display: block;}
      p {font-size: 25px;}
    }
  }
  .sp-time {font-size: 12px; line-height: 1.3; padding: 10px;}

  .f-sp-13 {font-size: 13px !important;}
  .f-sp-14 {font-size: 14px !important;}
  .text-sp-left {text-align: left;}
}

.wp-block-heading.is-style-pocket::before {flex-shrink: 0;}