/* 共通部分 */
body.page,
body.single,
body.archive,
body.search,
body.error404 {
  @media screen and (min-width: 751px) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
  }
  main {
    letter-spacing: 0;
    text-align: justify;
    @media screen and (min-width: 751px) {
      display: flex;
      flex-direction: column;
      flex: 1;
    }
    .inner {
      @media screen and (min-width: 751px) {
        display: flex;
        flex-direction: column;
        flex: 1;
        width: 100%;
        height: 100%;
      }
    }
    .base_wave_top {
      width: 100%;
    }
    .subpages_title {
      position: relative;
      background-image: url('../images/subpages/base_wave_top.svg');
      background-size: cover;
      background-position: center bottom;
      padding-block: 220px 80px;
      width: 100%;
      color: var(--text-color);
      font-weight: 700;
      font-size: 38px;
      text-align: center;
      letter-spacing: 0.126em;
      @media screen and (max-width: 750px) {
        background-image: url('../images/subpages/base_wave_top_sp.svg');
        padding-block: 76px 50px;
        font-size: 24px;
        letter-spacing: 0.05em;
      }
      span {
        display: block;
      }
      &::after {
        content: '•••';
        font-size: 30px;
        position: absolute;
        color: var(--primary-color);
        letter-spacing: 0.3em;
        bottom: 35px;
        left: 50%;
        translate: -50% 0;
        text-indent: 0.3em;
        @media screen and (max-width: 750px) {
          font-size: 20px;
          bottom: 20px;
          left: 50%;
        }
      }
    }
    .breadcrumbs {
      display: flex;
      flex-wrap: wrap;
      padding-top: 10px;
      font-weight: 500;
      @media screen and (max-width: 750px) {
        font-size: 14px;
        padding-top: 5px;
      }
      .breadcrumbs_item {
        display: flex;
        a {
          color: var(--primary-color);
        }
        img {
          @media screen and (max-width: 750px) {
            width: 20px;
          }
        }
      }
    }
    .contents {
      padding-top: 40px;
      @media screen and (max-width: 750px) {
        padding-top: 30px;
      }
      @media screen and (min-width: 751px) {
        margin-bottom: 30px;
      }
      p {
        font-size: 18px;
        @media screen and (max-width: 750px) {
          font-size: 16px;
        }
      }
      .pagination {
        margin-top: 103px;
        @media screen and (max-width: 750px) {
          margin-top: 30px;
        }
        .page-numbers {
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 40px;
          flex-wrap: wrap;
          @media screen and (max-width: 750px) {
            gap: 10px 22px;
          }
          li {
            span {
              &.current {
                color: var(--primary-color);
                font-weight: 500;
                @media screen and (max-width: 750px) {
                  font-size: 16px;
                }
              }
            }
            a {
              color: var(--text-color);
              font-weight: 500;
              @media screen and (max-width: 750px) {
                font-size: 16px;
              }
              img {
                &.prev {
                  margin-right: 20px;
                  @media screen and (max-width: 750px) {
                    width: 15px;
                    margin-right: 10px;
                  }
                }
                &.next {
                  margin-left: 20px;
                  @media screen and (max-width: 750px) {
                    width: 15px;
                    margin-left: 10px;
                  }
                }
              }
            }
          }
        }
      }
    }
    .base_image {
      @media screen and (min-width: 751px) {
        margin-top: auto;
      }
      @media screen and (max-width: 750px) {
        width: 125px;
        margin-top: 20px;
      }
    }
    p {
      font-weight: 500;
    }

    /* 絞り込みボタン共通パーツ */
    .contents_text {
      line-height: 1.625;
      margin-bottom: 60px;
      @media screen and (max-width: 750px) {
        margin-bottom: 30px;
      }
    }
    .category_section {
      margin-bottom: 50px;
      @media screen and (max-width: 750px) {
        margin-bottom: 20px;
      }
      .category_button {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        gap: 0 20px;
        @media screen and (max-width: 750px) {
          gap: 8px;
        }
        @media screen and (max-width: 600px) {
          grid-template-columns: 1fr 1fr 1fr;
        }
        .category_item {
          cursor: pointer;
          min-height: 50px;
          border: 1px solid var(--primary-color);
          border-radius: 99px;
          display: flex;
          align-items: center;
          justify-content: center;
          padding-inline: 20px;
          @media screen and (max-width: 750px) {
            min-height: 30px;
            padding-inline: 10px;
          }
          p {
            color: var(--primary-color);
            text-align: center;
            font-size: 16px;
            font-weight: 700;
            @media screen and (max-width: 750px) {
              font-size: 14px;
              font-weight: 500;
            }
            .category_sp {
              display: none;
              @media screen and (max-width: 500px) {
                display: block;
              }
            }
          }
          &.active_category {
            background-color: var(--primary-color);
            p {
              color: #fff;
            }
          }
        }
      }
    }

    /* 投稿一覧共通パーツ */
    .post_inner {
      ul {
        max-width: 1000px;
        margin-inline: auto;
        .li_page {
          position: relative;
          padding-right: 50px;
          border-top: 1px dashed #e3e3e3;
          @media screen and (max-width: 750px) {
            padding-right: 25px;
          }
          .post_summary {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            padding-block: 25px;
            gap: 8px 0;
            @media screen and (max-width: 750px) {
              padding-block: 15px;
            }
            .page_date {
              width: 100%;
              p {
                line-height: 1.625;
                color: var(--date-color);
                font-size: 16px;
                @media screen and (max-width: 750px) {
                  font-size: 14px;
                }
              }
            }
            .page_category {
              margin-right: 5px;
              text-align: center;
              border-radius: 12px;
              padding-block: 1.5px;
              background-color: #fff3ec;
              p {
                padding-inline: 10px;
                color: var(--category-color);
                font-size: 14px;
                font-weight: 700;
                @media screen and (max-width: 750px) {
                  font-size: 13px;
                }
              }
            }
            .page_content {
              width: 100%;
              display: block;
              p {
                font-size: 18px;
                line-height: 1.625;
                color: var(--text-color);
                @media screen and (max-width: 750px) {
                  font-size: 16px;
                }
              }
            }
          }
          .page_mark {
            position: absolute;
            top: 50%;
            translate: 0 -50%;
            right: 20px;
            @media screen and (max-width: 750px) {
              right: 0;
            }
          }
        }
        .li_page:last-child {
          border-bottom: 1px dashed #e3e3e3;
        }
      }
    }
    .subpages_btn {
      display: flex;
      justify-content: center;
      align-items: baseline;
      gap: 20px;
      margin-top: 70px !important;
      @media screen and (max-width: 750px) {
        flex-direction: column;
        align-items: center;
        margin-top: 30px !important;
      }
      .btn {
        min-width: 226px;
        width: fit-content;
        min-height: 50px;
        &:has(.btn_mark) {
          gap: 10px;
        }
        @media screen and (max-width: 750px) {
          width: 100%;
          max-width: 345px;
          min-height: 52px;
        }
        p {
          font-size: 16px;
          font-weight: 700;
          @media screen and (max-width: 480px) {
            font-size: calc(16 / 480 * 100vw);
          }
          @media screen and (max-width: 375px) {
            font-size: calc(14 / 375 * 100vw);
          }
        }
        img {
          width: 16px;
          margin: 0;
        }
      }
    }
  }
  footer {
    background-color: var(--secondary-color);
  }
}

/* 固定ページ */
body.page:not(.contact, .contact_confirm, .contact_send) {
  .contents {
    & > *:not(h2.wp-block-heading) {
      width: calc(100% - 56px);
      margin-left: auto;
      margin-right: auto;
      @media screen and (max-width: 750px) {
        width: calc(100% - 30px);
      }
    }
  }
}

/* 刊行物・映像投稿一覧 */
body.post-type-archive-publications {
  main {
    .contents {
      .page_date {
        width: 100%;
        max-width: 115px;
        @media screen and (max-width: 750px) {
          max-width: 100px;
        }
      }
      .category_section {
        .category_button {
          grid-template-columns: 1fr 1fr 1fr;
          max-width: 745px;
          margin-inline: auto;
        }
      }
    }
  }
}

/* イベント・セミナー投稿一覧 */
body.post-type-archive-event {
  main {
    .post_inner {
      ul {
        .li_page {
          .post_summary {
            .page_date {
              margin-right: 10px;
              width: fit-content;
              max-width: none;
              @media screen and (max-width: 750px) {
                width: 100%;
              }
            }
          }
        }
      }
    }
  }
}

/* イベント・セミナー投稿詳細ページ */
body.single-event {
  main {
    .contents {
      .date_and_categories {
        margin-bottom: 15px;
        display: flex;
        gap: 0 10px;
        @media screen and (max-width: 750px) {
          margin-bottom: 12px;
          display: block;
        }
        .event_date,
        .event_time {
          line-height: 1.625;
          color: var(--date-color);
          font-weight: 700;
        }
        .event_category {
          text-align: center;
          border-radius: 12px;
          padding-block: 1.5px;
          padding-inline: 10px;
          color: var(--category-color);
          font-size: 14px;
          font-weight: 700;
          @media screen and (max-width: 750px) {
            display: inline-block;
            font-size: 13px;
            margin-top: 8px;
          }
        }
      }
      .event_precaution {
        color: var(--validation-color);
        margin-top: 15px;
      }
      .subpages_btn {
        .btn {
          /* カスタムフィールドで申込ボタンを非活性レイアウトにするためのクラス */
          &.invalid {
            background-color: #d9d9d9;
            border: 1px solid #d9d9d9;
            cursor: auto !important;
            p {
              color: var(--text-color);
            }
          }
          &.back_btn {
            background-color: #fff;
            p {
              color: var(--primary-color);
            }
          }
        }
      }
      .registration_btn_under_text {
        text-align: center;
        font-weight: 700;
        color: var(--validation-color);
        margin-top: 20px;
        @media screen and (max-width: 750px) {
          margin-top: 10px;
        }
      }
    }
  }
}

/* お知らせ投稿一覧 */
body.post-type-archive-news {
  main {
    .category_section {
      max-width: 900px;
      margin-inline: auto;
      .category_button {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 30px 20px;
        @media screen and (max-width: 750px) {
          grid-template-columns: 1fr 1fr;
          gap: 8px;
        }
      }
    }
    .post_inner {
      ul {
        .li_page {
          .post_summary {
            flex-wrap: nowrap;
            @media screen and (max-width: 750px) {
              flex-wrap: wrap;
            }
            .page_date {
              width: 100%;
              max-width: 115px;
              @media screen and (max-width: 750px) {
                max-width: 100px;
              }
            }
            .page_category {
              margin-right: 8px;
              min-width: 160px;
              p {
                color: #fff;
              }
            }
            .page_content {
              width: auto;
              display: block;
              @media screen and (max-width: 750px) {
                width: 100%;
              }
              p {
                white-space: wrap;
              }
            }
          }
        }
      }
    }
  }
}

/* お知らせ投稿詳細ページ */
body.single-news {
  main {
    .contents {
      .post_summary {
        display: flex;
        gap: 0 10px;
        margin-bottom: 15px;
        @media screen and (max-width: 750px) {
          margin-bottom: 12px;
        }
        .page_date {
          line-height: 1.625;
          color: var(--date-color);
          font-weight: 700;
        }
        .page_category {
          text-align: center;
          border-radius: 12px;
          padding-block: 1.5px;
          width: 100%;
          max-width: 160px;
          p {
            color: #fff;
            padding-inline: 10px;
            font-size: 14px;
            font-weight: 700;
            @media screen and (max-width: 750px) {
              font-size: 13px;
            }
          }
        }
      }
    }
  }
}

/* 行政部会投稿一覧 */
body.post-type-archive-gyousei {
  main {
    .category_section {
      .category_button {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 30px 20px;
        @media screen and (max-width: 750px) {
          grid-template-columns: 1fr 1fr;
          gap: 8px;
        }
      }
    }
    .post_inner {
      ul {
        .li_page {
          .post_summary {
            .page_date {
              margin-right: 10px;
              width: fit-content;
              max-width: none;
              @media screen and (max-width: 750px) {
                width: 100%;
              }
            }
          }
        }
      }
    }
  }
}

/* フレイル予防推進会議投稿一覧 */
body.meeting {
  main {
    .contents {
      .post_inner {
        margin-block: 12px 30px;
        @media screen and (max-width: 750px) {
          margin-block: 12px 20px;
        }
        & + p {
          margin-top: 64px;
          @media screen and (max-width: 750px) {
            margin-top: 48px;
          }
        }
        ul {
          .li_page {
            .post_summary {
              .page_date {
                margin-right: 10px;
                width: fit-content;
                max-width: none;
                @media screen and (max-width: 750px) {
                  width: 100%;
                }
              }
              .page_category {
                margin-right: 8px;
              }
              .page_content {
                width: 100%;
                display: block;
              }
            }
          }
        }
      }
    }
  }
}

/* サイト内検索 */
body.search {
  main {
    .contents {
      .search_label {
        font-size: 20px;
        font-weight: 900;
        @media screen and (max-width: 750px) {
          font-size: 16px;
          font-weight: 700;
        }
      }
      .search_box {
        border: 1px solid #888;
        border-radius: 5px;
        margin-block: 15px 35px;
        @media screen and (max-width: 750px) {
          margin-block: 10px 5px;
        }
        input {
          width: calc(100% - 42px);
          padding: 7px 14px;
          font-weight: 500;
          @media screen and (max-width: 750px) {
            width: calc(100% - 35px);
            padding: 10.5px 15px;
          }
        }
      }
      .search_lists {
        li {
          border-bottom: 1px dashed #d9d9d9;
          a {
            padding-block: 25.5px;
            .search_title {
              font-weight: 900;
              font-size: 20px;
              color: var(--primary-color);
              @media screen and (max-width: 750px) {
                font-weight: 700;
                font-size: 16px;
              }
              + p {
                margin-top: 10px;
                @media screen and (max-width: 750px) {
                  font-size: 16px;
                  margin-top: 5px;
                }
              }
            }
          }
        }
      }
    }
  }
  span.search_highlight {
    background-color: #ffff00;
    font-weight: bold;
  }
}

/* 投稿・カスタム投稿詳細ページ */
body.single {
  main {
    .contents {
      & > *:not(h2.wp-block-heading):not(h2.subpages_sub_title) {
        width: calc(100% - 56px);
        margin-left: auto;
        margin-right: auto;
        @media screen and (max-width: 750px) {
          width: calc(100% - 30px);
        }
      }
      h2.subpages_sub_title {
        font-weight: 900;
        font-size: 30px;
        background-color: #fff3ec;
        padding: 20px 28px;
        border-radius: 15px;
        @media screen and (max-width: 750px) {
          font-size: 17px;
          padding: 10px 15px;
          border-radius: 7.5px;
        }
        + * {
          margin-top: 30px;
          @media screen and (max-width: 750px) {
            margin-top: 20px;
          }
        }
        + p {
          margin-top: 15px;
        }
        ~ *:not(h2.wp-block-heading) {
          width: calc(100% - 56px);
          margin-left: auto;
          margin-right: auto;
          @media screen and (max-width: 750px) {
            width: calc(100% - 30px);
          }
        }
      }
    }
  }
}

/* お問い合わせ */
body.contact,
body.contact_confirm,
body.contact_send {
  main {
    /* ブロックパーツCSS打消し */
    p + * {
      margin-top: 0 !important;
      @media screen and (max-width: 750px) {
        margin-top: 0 !important;
      }
    }
    .contents {
      .step_box {
        padding-top: 10px;
        @media screen and (max-width: 750px) {
          padding-top: 2.5px;
        }
        .step_contents {
          display: flex;
          align-items: center;
          .step_item {
            width: 100%;
            border: 1px solid var(--primary-color);
            display: flex;
            justify-content: center;
            padding-block: 16px 15px;
            @media screen and (max-width: 750px) {
              max-height: 30px;
              padding-block: 6px 6.5px;
            }
            p {
              font-size: 18px;
              color: var(--primary-color);
              text-align: center;
              line-height: 1.6;
              font-weight: 700;
              letter-spacing: 0.29em;
              @media screen and (max-width: 750px) {
                font-size: 11px;
                font-weight: 500;
                letter-spacing: 0;
              }
            }
            &.active_step {
              background-color: var(--primary-color);
              p {
                color: #fff;
              }
            }
          }
          .step_mark {
            margin-inline: 24px 21px;
            width: 53px;
            @media screen and (max-width: 750px) {
              margin-inline: 12px 9px;
              width: 28px;
            }
          }
        }
        .step_text {
          padding-top: 40px;
          @media screen and (max-width: 750px) {
            padding-top: 20px;
          }
          p {
            font-weight: 700;
            @media screen and (max-width: 750px) {
              font-size: 500;
            }
          }
          .done_text {
            font-weight: 500;
          }
        }
      }
      .contact_box {
        margin-top: 50px;
        @media screen and (max-width: 750px) {
          margin-top: 20px;
        }
        .input_box {
          position: relative;
          display: grid;
          grid-template-columns: 308px 1fr;
          align-items: center;
          @media screen and (max-width: 750px) {
            grid-template-columns: 1fr;
            gap: 12px;
          }
          label {
            font-size: 20px;
            font-weight: 500;
            letter-spacing: 0.04em;
            @media screen and (max-width: 750px) {
              font-size: 16px;
              letter-spacing: 0;
            }
            + p {
              font-weight: 500;
            }
          }
          .input_field {
            display: grid;
            flex: 1;
            gap: 8px;
            grid-template-columns: 1fr 1fr;
            @media screen and (max-width: 750px) {
              grid-template-columns: 1fr;
              gap: 8px;
            }
            &:has(.half) {
              grid-template-columns: 400px;
              @media screen and (max-width: 750px) {
                grid-template-columns: 1fr;
              }
            }
            &:has(.tel) {
              grid-template-columns: 1fr 1fr 1fr;
              @media screen and (max-width: 750px) {
                grid-template-columns: 1fr;
              }
            }
            &:has(.textarea) {
              grid-template-columns: 1fr;
            }
            & > :last-child {
              grid-column: 1 / -1;
            }
            &.confirm {
              & > :last-child {
                grid-column: auto;
              }
            }
            input,
            textarea {
              width: 100%;
              min-height: 56px;
              border: 2px solid #e5e7ed;
              border-radius: 4px;
              padding-inline: 16px;
              resize: none;
              @media screen and (max-width: 750px) {
                font-size: 16px;
                border-radius: 4px;
                padding-inline: 8px;
                min-height: 45.5px;
              }
            }
            .textarea {
              padding-block: 16px;
              white-space: pre-line;
              height: 200px;
              @media screen and (max-width: 750px) {
                padding-block: 0;
                height: 180px;
              }
            }
            .wpcf7-not-valid-tip,
            .error_message {
              font-weight: 500;
              font-size: 14px;
              color: var(--validation-color);
              letter-spacing: 0.04em;
            }
            &.custom_validation {
              .wpcf7-not-valid-tip {
                display: none;
              }
              .error_message {
                display: none;
                margin-top: -5px;
              }
              &:has(.wpcf7-not-valid-tip) {
                .error_message {
                  display: block;
                }
              }
            }
          }
          &.confirm {
            width: fit-content;
            .input_field {
              grid-template-columns: auto auto auto;
              gap: 15px;
              @media screen and (max-width: 750px) {
                grid-template-columns: max-content max-content max-content;
                grid-auto-flow: column;
                gap: 10px;
              }
              .half {
                word-break: break-all;
              }
              &:has(.textarea) {
                @media screen and (max-width: 750px) {
                  grid-template-columns: 1fr;
                }
              }
              .textarea {
                padding-block: 0;
                word-break: break-all;
                height: auto;
              }
            }
          }
          + .input_box {
            margin-top: 30px;
            @media screen and (max-width: 750px) {
              margin-top: 24px;
            }
            &.confirm {
              margin-top: 54px;
              @media screen and (max-width: 750px) {
                margin-top: 24px;
              }
            }
          }
        }
        .check_contents {
          margin-top: 70px;
          text-align: center;
          border: 2px solid var(--primary-color);
          width: 100%;
          max-width: 600px;
          margin-inline: auto;
          padding: 30px;
          @media screen and (max-width: 750px) {
            max-width: 300px;
            margin-top: 20px;
            padding: 20px;
          }
          .check_box {
            span {
              cursor: pointer;
              margin-top: 20px;
              font-size: 18px;
              font-weight: 700;
              @media screen and (max-width: 750px) {
                font-size: 16px;
                margin-top: 10px;
              }
            }
            input {
              display: none;
              & + .wpcf7-list-item-label:before {
                content: '';
                display: inline-block;
                position: relative;
                top: 2px;
                margin-right: 10px;
                background-image: none, url('../images/subpages/icon_contact_check_box.svg');
                background-position: top 50% left 50%;
                background-repeat: no-repeat;
                background-size: contain;
                width: 18px;
                height: 18px;
                @media screen and (max-width: 750px) {
                  margin-right: 6px;
                  width: 16px;
                  height: 16px;
                }
              }
              &:checked + .wpcf7-list-item-label:before {
                background-image: url('../images/subpages/icon_contact_check.svg'),
                  url('../images/subpages/icon_contact_check_box.svg');
                background-size: 12px 12px, contain;
                @media screen and (max-width: 750px) {
                  background-size: 10px 10px, contain;
                }
              }
            }
            + p {
              font-size: 16px;
              margin-top: 10px;
              @media screen and (max-width: 750px) {
                font-size: 14px;
                margin-top: 8px;
              }
            }
          }
          .wpcf7-list-item {
            margin: 0;
          }
          a {
            font-weight: 700;
            display: inline;
            text-decoration: underline;
          }
        }
        .contact_btn {
          margin-top: 80px;
          display: flex;
          justify-content: center;
          gap: 20px;
          @media screen and (max-width: 750px) {
            margin-top: 45px;
            flex-direction: column;
            align-items: center;
            gap: 12.5px;
          }
          .submit_btn,
          .confirm_btn {
            width: fit-content;
            button.btn {
              max-width: 210px;
              min-height: 50px;
              color: #fff;
              font-weight: 700;
              padding-right: 40px;
              transition: all 0.3s;
              @media (hover: hover) {
                &:hover {
                  opacity: 0.6;
                }
              }
              @media screen and (max-width: 750px) {
                max-width: 345px;
                min-height: 52.5px;
              }
              span {
                position: relative;
                &::after {
                  content: '';
                  position: absolute;
                  top: 50%;
                  right: -27px;
                  translate: 0 -50%;
                  background-image: url('../images/home/event_btn.svg');
                  background-repeat: no-repeat;
                  background-size: contain;
                  width: 16px;
                  height: 16px;
                  cursor: pointer;
                  @media screen and (max-width: 750px) {
                    right: -26px;
                  }
                }
              }
              &.confirm {
                max-width: 178px;
                @media screen and (max-width: 750px) {
                  max-width: 345px;
                  min-height: 52.5px;
                }
              }
              p {
                font-size: 16px;
              }
            }
          }
          input.wpcf7-form-control.wpcf7-submit {
            display: none;
          }
        }
        .back_btn {
          width: fit-content;
          button.btn {
            max-width: 210px;
            min-height: 50px;
            color: var(--text-color);
            background-color: #fff;
            font-weight: 700;
            padding-left: 20px;
            transition: all 0.3s;
            @media (hover: hover) {
              &:hover {
                opacity: 0.6;
              }
            }
            @media screen and (max-width: 750px) {
              max-width: 345px;
              min-height: 52.5px;
            }
            span {
              position: relative;
              &::after {
                content: '';
                position: absolute;
                top: 50%;
                left: -27px;
                translate: 0 -50%;
                background-image: url('../images/subpages/icon_backbtn_arrow.svg');
                background-repeat: no-repeat;
                background-size: contain;
                width: 16px;
                height: 16px;
                cursor: pointer;
                @media screen and (max-width: 750px) {
                  top: 50%;
                  left: -26px;
                }
              }
            }
            p {
              font-size: 16px;
            }
          }
        }
        .top_btn {
          width: fit-content;
          position: relative;
          .btn {
            max-width: 226px;
            min-height: 50px;
            color: #fff;
            line-height: 1.6;
            font-weight: 700;
            @media screen and (max-width: 750px) {
              max-width: 345px;
              min-height: 52.5px;
            }
            p {
              font-size: 16px;
            }
          }
        }
        .wpcf7-spinner {
          display: block;
          margin: 10px auto 0;
        }
      }
    }
    .wpcf7-response-output {
      border: none;
      text-align: center;
      color: var(--validation-color);
      font-weight: 500;
      margin: 0;
    }
    .required_mark {
      font-weight: 700;
      color: var(--validation-color);
    }
  }
}

body.meeting_login {
  p + * {
    margin-top: 0 !important;
    @media screen and (max-width: 750px) {
      margin-top: 0 !important;
    }
  }
  .input_box_inner {
    .input_box {
      display: grid;
      grid-template-columns: 230px 1fr;
      align-items: center;
      @media screen and (max-width: 750px) {
        grid-template-columns: 1fr;
      }
      label {
        font-size: 18px;
        font-weight: 700;
        letter-spacing: 0.04em;
        @media screen and (max-width: 750px) {
          font-size: 16px;
        }
      }
      .input_field {
        display: grid;
        grid-template-columns: 1fr;
        max-width: 500px;
        @media screen and (max-width: 750px) {
          margin-top: 12px;
          grid-template-columns: 1fr;
        }
        .text_box {
          color: #333;
          flex: 1;
          min-height: 42px;
          border: 0.5px solid #888;
          border-radius: 5px;
          padding-inline: 15px;
          @media screen and (max-width: 750px) {
            min-height: 45.5px;
            border-radius: 4px;
            padding-inline: 7px;
          }
        }
      }
      + * {
        padding-top: 25px;
        @media screen and (max-width: 750px) {
          padding-top: 15px;
        }
      }
    }
    .login_btn {
      width: fit-content;
      margin: 65px auto 0;
      @media screen and (max-width: 750px) {
        margin-top: 30px;
      }
      .btn {
        max-width: 210px;
        min-height: 50px;
        color: #fff;
        font-weight: 700;
        transition: all 0.3s;
        @media (hover: hover) {
          &:hover {
            opacity: 0.6;
          }
        }
      }
    }
  }
}

/* フォーム関連共通部分 */
body.registration,
body.registration_confirm,
body.registration_send {
  font-weight: 500;
  line-height: 1.625;
  main {
    /* ブロックパーツCSS打消し */
    p + * {
      margin-top: 0 !important;
      @media screen and (max-width: 750px) {
        margin-top: 0 !important;
      }
    }
    .step_flow {
      .step_flow_inner {
        display: flex;
        align-items: center;
        .step_item {
          width: 100%;
          border: 1px solid #ff904a;
          padding-block: 15px;
          @media screen and (max-width: 750px) {
            max-height: 30px;
            padding-block: 6px 6.5px;
          }
          p {
            color: #ff904a;
            text-align: center;
            font-weight: 700;
            letter-spacing: 0.29em;
            @media screen and (max-width: 750px) {
              font-size: 11px;
              font-weight: 500;
              letter-spacing: 0;
            }
          }
          &.active_step {
            background-color: #ff904a;
            p {
              color: #fff;
            }
          }
        }
        .step_flow_mark {
          margin: 0 21px 0 24px;
          width: 53px;
          @media screen and (max-width: 750px) {
            margin: 1px 9px 0 12px;
            width: 28px;
            height: 27px;
          }
        }
      }
      .step_flow_text {
        padding-top: 40px;
        @media screen and (max-width: 750px) {
          padding-top: 20px;
        }
        p {
          font-weight: 700;
          @media screen and (max-width: 750px) {
            font-weight: 500;
          }
        }
      }
    }
    .input_box_inner {
      margin-top: 21.5px;
      @media screen and (max-width: 750px) {
        margin-top: 0;
      }
      &.confirm {
        padding-top: 33px;
        @media screen and (max-width: 750px) {
          padding-top: 0;
        }
      }
      .input_box {
        position: relative;
        display: grid;
        grid-template-columns: 308px 1fr;
        align-items: center;
        padding-block: 25px;
        border-bottom: 1px dashed #d9d9d9;
        @media screen and (max-width: 750px) {
          grid-template-columns: 1fr;
          padding-block: 12px;
        }
        label {
          font-size: 20px;
          font-weight: 500;
          letter-spacing: 0.04em;
          @media screen and (max-width: 750px) {
            font-size: 16px;
            font-weight: 700;
          }
        }
        .input_field {
          display: grid;
          flex: 1;
          gap: 10px;
          grid-template-columns: 1fr 1fr;
          @media screen and (max-width: 750px) {
            margin-top: 12px;
            grid-template-columns: 1fr;
          }
          &.details {
            display: flex;
            flex: 1;
            flex-wrap: wrap;
            gap: 0;
          }
          &.short {
            grid-template-columns: 500px;
            @media screen and (max-width: 750px) {
              grid-template-columns: 1fr;
            }
          }
          &.half {
            grid-template-columns: 250px;
            @media screen and (max-width: 750px) {
              grid-template-columns: 1fr;
            }
          }
          &.full {
            grid-template-columns: 1fr;
            @media screen and (max-width: 750px) {
              grid-template-columns: 1fr;
            }
          }
          &.tell {
            grid-template-columns: 1fr 1fr 1fr;
            @media screen and (max-width: 750px) {
              grid-template-columns: 1fr;
            }
          }
          &.correspondence {
            display: flex;
            gap: 0 20px;
            @media screen and (max-width: 750px) {
              gap: 0 8px;
            }
          }
          &.confirm {
            grid-template-columns: auto auto auto;
            gap: 15px;
            width: fit-content;
          }
          .text_box {
            color: #333;
            flex: 1;
            min-height: 42px;
            border: 0.5px solid #888;
            border-radius: 5px;
            padding-inline: 15px;
            @media screen and (max-width: 750px) {
              min-height: 45.5px;
              border-radius: 4px;
              padding-inline: 7px;
            }
            &::placeholder {
              color: #8594a4;
              @media screen and (max-width: 750px) {
                font-size: 16px;
              }
            }
          }
          .error_message {
            width: 100%;
            margin-top: 5px;
            grid-column: 1 / -1;
            @media screen and (max-width: 750px) {
              margin-top: 0;
            }
            p {
              font-size: 14px;
              color: #ff0000;
              letter-spacing: 0.04em;
            }
          }
          .select_mark {
            pointer-events: none;
            position: absolute;
            top: 42px;
            left: 530px;
            @media screen and (max-width: 750px) {
              top: 70px;
              left: clamp(244px, 0.9973vw * 100 - 54px, 693px);
            }
          }
        }
        &.send {
          grid-template-columns: 1fr;
          border-bottom: none;
          .input_field {
            &.details {
              display: block;
              p {
                font-size: 20px;
                font-weight: 700;
                @media screen and (max-width: 750px) {
                  font-size: 18px;
                }
              }
            }
          }
          .step_flow_text {
            padding-top: 30px;
            @media screen and (max-width: 750px) {
              padding-top: 20px;
            }
            p {
              font-weight: 500;
              @media screen and (max-width: 750px) {
                font-weight: 500;
              }
            }
            + * {
              margin-top: 30px;
            }
          }
          .note_text {
            display: grid;
            grid-template-columns: 70px 1fr;
          }
        }
      }
    }
    .required_mark {
      font-weight: 700;
      color: #ff0000;
      margin-right: 5px;
    }
  }
}

/* お申し込み(入力)画面 */
body.registration {
  .privacy_inner {
    margin: 70px auto 0;
    max-width: 800px;
    border: 2px solid #ff904a;
    padding-block: 22.5px;
    @media screen and (max-width: 750px) {
      margin: 21.5px 0;
      padding-block: 10px;
      padding-inline: 10px;
    }
    .privacy_consent {
      text-align: center;
      width: fit-content;
      margin-inline: auto;
      .privacy_consent_space {
        margin-bottom: 20px;
        @media screen and (max-width: 750px) {
          margin-bottom: 10px;
        }
      }
    }
    .consent_box {
      margin-top: 20px;
      justify-content: center;
      align-items: center;
      display: flex;
      font-size: 18px;
      @media screen and (max-width: 750px) {
        margin-top: 10px;
      }
      .under_line {
        text-decoration: underline;
        text-underline-offset: 2px;
        a {
          width: fit-content;
          display: contents;
        }
      }
      .under_line:hover {
        opacity: 0.5;
        transition: opacity 0.2s ease;
      }
      input[type='checkbox'] {
        appearance: none;
        width: 18px;
        height: 18px;
        border: 1px solid #888;
        border-radius: 5px;
        margin-right: 5px;
        margin-top: 3px;
        position: relative;
        cursor: pointer;
        @media screen and (max-width: 750px) {
          width: 15px;
          height: 15px;
          border-radius: 0.5px;
        }
        &::after {
          content: '';
          width: 11.44px;
          height: 8.56px;
          position: absolute;
          bottom: 4px;
          left: 3px;
          background-image: url('../images/subpages/check_mark.svg');
          background-size: contain;
          background-repeat: no-repeat;
          opacity: 0;
          @media screen and (max-width: 750px) {
            width: 11.44px;
            height: 8.56px;
            bottom: 3px;
            left: 1px;
          }
        }
        &:checked::after {
          opacity: 1;
        }
      }
      label[for='consent']:hover {
        opacity: 0.5;
        transition: opacity 0.2s ease;
      }
      label {
        @media screen and (max-width: 750px) {
          font-size: 14px;
        }
      }
    }
  }
  .add_someone {
    margin-top: 60px;
    padding-top: 35px;
    position: relative;
    border-top: 1px solid #d9d9d9;
    @media screen and (max-width: 750px) {
      margin-top: 30px;
      padding-top: 15px;
    }
    &::before {
      content: '';
      position: absolute;
      background-color: #ff904a;
      width: 100px;
      top: -1px;
      left: 0;
      height: 1px;
    }
  }
  .select_box {
    min-height: 42px;
    border: 0.5px solid #888;
    border-radius: 5px;
    padding-left: 14px;
    cursor: pointer;
    @media screen and (max-width: 750px) {
      min-height: 45.5px;
    }
  }
  .radio_button {
    display: flex;
    align-items: center;
    input[type='radio'] {
      appearance: none;
      width: 18px;
      height: 18px;
      border: 1px solid #888;
      border-radius: 50%;
      position: relative;
      cursor: pointer;
      margin-right: 10px;
      @media screen and (max-width: 750px) {
        width: 15px;
        height: 15px;
        margin-right: 5px;
      }
      &::after {
        content: '';
        width: 10px;
        height: 10px;
        background-color: #888;
        border-radius: 50%;
        position: absolute;
        top: 3px;
        left: 3px;
        opacity: 0;
        @media screen and (max-width: 750px) {
          width: 9px;
          height: 9px;
          top: 2px;
          left: 2px;
        }
      }
      &:checked::after {
        opacity: 1;
      }
    }
  }
  .registration_under {
    margin-top: 25px;
    @media screen and (max-width: 750px) {
      margin-top: 30px;
    }
    .mail {
      margin-top: 100px;
      text-align: center;
      @media screen and (max-width: 750px) {
        margin-top: 25.5px;
      }
    }
    .confirm_btn {
      margin-top: 30px;
      @media screen and (max-width: 750px) {
        margin-top: 45px;
      }
      .btn {
        width: 226px;
        min-height: 50px;
        margin: 0 auto;
        @media screen and (max-width: 750px) {
          width: 100%;
          min-height: 52.5px;
        }
        p {
          letter-spacing: -0.06em;
          font-size: 16px;
          @media screen and (max-width: 750px) {
            letter-spacing: 0;
          }
        }
        .btn_mark {
          width: 16px;
          margin-left: 14px;
          @media screen and (max-width: 750px) {
            margin-left: 7px;
          }
        }
      }
    }
    .confirm_btn a.disabled {
      pointer-events: none;
      opacity: 0.5;
    }
    .alert_apply {
      text-align: center;
      margin-top: 26px;
      @media screen and (max-width: 750px) {
        margin-top: 42px;
      }
    }
    #add_btn {
      margin: 25px auto 0;
      min-height: 50px;
      width: 178px;
      @media screen and (max-width: 750px) {
        margin-top: 12.5px;
        min-height: 25px;
        width: 137px;
      }
      p {
        color: #fff;
        letter-spacing: 0.16em;
        font-weight: 700;
        font-size: 16px;
        @media screen and (max-width: 750px) {
          letter-spacing: 0;
          font-size: 14px;
          font-weight: 500;
        }
      }
    }
    .add_btn:disabled {
      opacity: 0.4;
      pointer-events: none;
      cursor: default;
    }
  }
  .confirm_box {
    display: flex;
    align-items: center;
    margin-right: 10px;
    &.consent {
      gap: 10px;
      margin-right: 0;
      @media screen and (max-width: 750px) {
        gap: 3px;
      }
      input[type='confirmbox'] {
        margin-right: 0;
      }
      p {
        text-decoration: underline;
        text-underline-offset: 2px;
      }
    }
  }
}

/* お申し込み(確認)画面 */
body.registration_confirm {
  .add_border {
    margin-top: 60px;
    position: relative;
    border-top: 1px solid #d9d9d9;
    @media screen and (max-width: 750px) {
      margin-top: 43px;
      padding-top: 17px;
    }
    &::before {
      content: '';
      position: absolute;
      background-color: #ff904a;
      width: 100px;
      top: -1px;
      left: 0;
      height: 1px;
    }
  }
  .registration_confirm_under {
    margin-top: 100px;
    justify-content: center;
    display: flex;
    gap: 10px;
    @media screen and (max-width: 750px) {
      margin-top: 41px;
      flex-direction: column;
      align-items: center;
      gap: 12.5px;
    }
    .back_btn {
      .btn {
        background-color: #d9d9d9;
        border: 1px solid #d9d9d9;
        max-width: 210px;
        min-height: 50px;
        @media screen and (max-width: 750px) {
          max-width: 345px;
          min-height: 52.5px;
        }
        p {
          color: #000;
          font-size: 16px;
        }
        .btn_mark_black {
          margin: 0 0 -1px 10px;
          @media screen and (max-width: 750px) {
            margin: 0 0 -3px 7px;
          }
        }
      }
    }
    .registration_btn {
      .btn {
        max-width: 210px;
        min-height: 50px;
        @media screen and (max-width: 750px) {
          max-width: 345px;
          min-height: 52.5px;
        }
        p {
          font-size: 16px;
        }
        .btn_mark {
          width: 16px;
          margin-block: 0;
        }
      }
    }
  }
}

/* お申し込み(完了)画面 */
body.registration_send {
  .registration_send_under {
    margin-top: 75px;
    @media screen and (max-width: 750px) {
      margin-top: 10px;
    }
    .details_back_btn {
      .btn {
        width: 226px;
        min-height: 50px;
        margin: 0 auto;
        @media screen and (max-width: 750px) {
          width: 100%;
          min-height: 52.5px;
        }
        p {
          font-size: 16px;
        }
        .btn_mark {
          margin-block: 0;
        }
      }
    }
  }
}

/* サイトマップ */
body.sitemap {
  .contents {
    a {
      color: #333;
    }
  }
}

/* 404 */
body.error404,
body.not_found {
  main {
    .contents {
      .error_message {
        text-align: center;
      }
    }
  }
}