@scope (.area-prmy-condition-first) to (.area-scdy-condition-first) {}
@scope (.area-scdy-condition-first) to (.area-tery-condition-first) {
  :scope .body {
    display: grid;
  }
  @media screen and (min-width: 1025px) {
    :scope .body {
      grid-template-rows: minmax(0, 2.5vw) max-content minmax(0, 2.5vw);
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body {
      grid-template-rows: minmax(0, 4.6875vw) max-content minmax(0, 4.6875vw);
    }
  }
  :scope .body .visual .disp {
    inline-size: 100%;
    block-size: 100%;
  }
  :scope .body .visual .disp .media {
    inline-size: 100%;
    block-size: 100%;
    aspect-ratio: 16 / 9;
  }
  :scope .body .visual .disp .media .image {
    inline-size: 100%;
    block-size: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }
  :scope .body .specifics {
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
    background-color: white;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      padding-block-start: 2.5vw;
      padding-block-end: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      padding-block-start: 3.90625vw;
      padding-block-end: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      padding-block-start: 8vw;
      padding-block-end: 8vw;
    }
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      padding-inline-start: 2.5vw;
      padding-inline-end: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      padding-inline-start: 3.90625vw;
      padding-inline-end: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      padding-inline-start: 4vw;
      padding-inline-end: 4vw;
    }
  }
  :scope .body .specifics .title .m-heading .string {
    position: relative;
    color: #1f4e79;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics .title .m-heading .string {
      padding-block-end: 0.83333vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics .title .m-heading .string {
      padding-block-end: 1.36719vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics .title .m-heading .string {
      padding-block-end: 3vw;
    }
  }
  :scope .body .specifics .title .m-heading .string::before {
    content: "";
    position: absolute;
    inset-block-end: 0;
    inset-inline-start: 0;
    display: inline-block;
    inline-size: 100%;
    background-color: #b89445;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics .title .m-heading .string::before {
      max-inline-size: 3.75vw;
      block-size: 0.10417vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics .title .m-heading .string::before {
      max-inline-size: 7.03125vw;
      block-size: 0.19531vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics .title .m-heading .string::before {
      max-inline-size: 12vw;
      block-size: 0.5vw;
    }
  }
  @media screen and (min-width: 1025px) {
    :scope:nth-of-type(odd) .body {
      grid-template-columns: 2fr minmax(0, 2.5vw) 3fr;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope:nth-of-type(odd) .body {
      grid-template-columns: 2fr minmax(0, 4.6875vw) 3fr;
    }
  }
  @media screen and (min-width: 1025px) {
    :scope:nth-of-type(even) .body {
      grid-template-columns: 3fr minmax(0, 2.5vw) 2fr;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope:nth-of-type(even) .body {
      grid-template-columns: 3fr minmax(0, 4.6875vw) 2fr;
    }
  }
  @media screen and (min-width: 601px) {
    :scope:nth-of-type(odd) .body .visual {
      grid-column: 1/3;
      grid-row: 1/3;
    }
    :scope:nth-of-type(odd) .body .specifics {
      grid-column: 2/4;
      grid-row: 2/4;
    }
    :scope:nth-of-type(even) .body .visual {
      grid-column: 2/4;
      grid-row: 2/4;
    }
    :scope:nth-of-type(even) .body .specifics {
      grid-column: 1/3;
      grid-row: 1/3;
    }
  }
}
@scope (.area-prmy-assessment-policy) to (.area-scdy-assessment-policy) {
  :scope .body .visual .disp .media {
    inline-size: 100%;
    aspect-ratio: 3 / 1;
  }
  :scope .body .visual .disp .media .image {
    inline-size: 100%;
    aspect-ratio: 3 / 1;
    object-fit: cover;
  }
  @media screen and (max-width: 600px) {
    :scope .body .visual .disp .media {
      aspect-ratio: 16 / 9;
    }
    :scope .body .visual .disp .media .image {
      aspect-ratio: 16 / 9;
    }
  }
}
@scope (.area-scdy-assessment-policy) to (.area-tery-assessment-policy) {
  :scope {
    position: relative;
  }
  :scope .body .specifics {
    position: relative;
    display: grid;
  }
  :scope .body .specifics::before {
    grid-area: number;
  }
  :scope .body .specifics .title {
    grid-area: title;
  }
  :scope .body .specifics .text {
    grid-area: text;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      row-gap: 1.25vw;
      column-gap: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      row-gap: 1.95313vw;
      column-gap: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      row-gap: 4vw;
      column-gap: 3vw;
    }
  }
  @media screen and (min-width: 601px) {
    :scope .body .specifics {
      grid-template-areas: "number title" "number text";
      grid-template-columns: max-content 1fr;
      grid-template-rows: repeat(2, max-content);
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      grid-template-areas: "number title" "text text";
      grid-template-columns: 1fr 3fr;
      grid-template-rows: repeat(2, max-content);
    }
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      padding-block-start: 3.75vw;
      padding-block-end: 3.75vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      padding-block-start: 5.27344vw;
      padding-block-end: 5.27344vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      padding-block-start: 9vw;
      padding-block-end: 9vw;
    }
  }
  :scope .body .specifics::before {
    content: attr(data-backdrop-text);
    position: static;
    display: inline-block;
    color: #e6be91;
    font-family: "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "MS PMincho", serif;
    font-weight: bold;
    line-height: 1;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics::before {
      font-size: 8.33333vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics::before {
      font-size: 13.28125vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics::before {
      font-size: 24vw;
    }
  }
  :scope .body .specifics .title .m-heading .string {
    color: #1f4e79;
  }
  :scope:not(:last-of-type)::after {
    content: "";
    position: absolute;
    inset-block-start: 100%;
    inset-inline-start: 50%;
    max-inline-size: 50%;
    inline-size: 100%;
    background-color: #b89445;
    translate: -50% -100%;
  }
  @media screen and (min-width: 1025px) {
    :scope:not(:last-of-type)::after {
      block-size: 0.05208vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope:not(:last-of-type)::after {
      block-size: 0.09766vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope:not(:last-of-type)::after {
      block-size: 0.25vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      align-items: center;
    }
  }
}
@scope (.area-prmy-work-priority) to (.area-scdy-work-priority) {
  :scope {
    background-color: rgb(247.9, 244.3, 236.4);
  }
  :scope .head {
    display: grid;
    inline-size: 100%;
  }
  @media screen and (min-width: 1025px) {
    :scope .head {
      max-inline-size: 83.33333vw;
      margin-inline-start: auto;
      margin-inline-end: auto;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .head {
      padding-inline-start: 2.34375vw;
      padding-inline-end: 2.34375vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .head {
      padding-inline-start: 4vw;
      padding-inline-end: 4vw;
    }
  }
  :scope .head {
    margin-inline-start: auto;
    margin-inline-end: 0;
  }
  :scope .head .prelude {
    grid-area: prelude;
  }
  :scope .head .visual {
    grid-area: visual;
  }
  :scope .head .title {
    grid-area: title;
  }
  :scope .head .text {
    grid-area: text;
  }
  @media screen and (min-width: 601px) {
    :scope .head {
      grid-template-areas: "prelude visual" "title visual" "text visual";
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(4, max-content);
    }
  }
  @media screen and (max-width: 600px) {
    :scope .head {
      grid-template-areas: "prelude" "visual" "title" "text";
      grid-template-rows: repeat(4, max-content);
    }
  }
  @media screen and (min-width: 1025px) {
    :scope .head {
      gap: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .head {
      gap: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .head {
      gap: 8vw;
    }
  }
  :scope .head .overview {
    display: contents;
  }
  :scope .head .visual .disp .media {
    inline-size: 100%;
    aspect-ratio: 3 / 2;
  }
  :scope .head .visual .disp .media .image {
    inline-size: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
  }
}
@scope (.area-scdy-work-priority) to (.area-tery-work-priority) {
  :scope .body .specifics {
    background-color: white;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      padding-block-start: 2.5vw;
      padding-block-end: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      padding-block-start: 3.90625vw;
      padding-block-end: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      padding-block-start: 8vw;
      padding-block-end: 8vw;
    }
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      padding-inline-start: 2.5vw;
      padding-inline-end: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      padding-inline-start: 3.90625vw;
      padding-inline-end: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      padding-inline-start: 8vw;
      padding-inline-end: 8vw;
    }
  }
  :scope .body .specifics {
    border-inline-start-color: #1f4e79;
    border-inline-start-style: solid;
  }
  @media screen and (min-width: 1025px) {
    :scope .body .specifics {
      border-inline-start-width: 1.25vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope .body .specifics {
      border-inline-start-width: 2.34375vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope .body .specifics {
      border-inline-start-width: 3vw;
    }
  }
  @media screen and (min-width: 1025px) {
    :scope:not(:last-of-type) .body {
      padding-block-end: 2.5vw;
    }
  }
  @media screen and (max-width: 1024px) and (min-width: 601px) {
    :scope:not(:last-of-type) .body {
      padding-block-end: 3.90625vw;
    }
  }
  @media screen and (max-width: 600px) {
    :scope:not(:last-of-type) .body {
      padding-block-end: 8vw;
    }
  }
}
/*# sourceMappingURL=concept.css.map */