@charset "UTF-8";

/**
 * layout
 */
.l-page-home {
  overflow: hidden;
}
.l-page-home__section {
  padding-block-start: var(
    --page-home-section-spacer-variable,
    var(--page-home-section-spacer)
  );
}
.l-page-home__shell {
  max-width: var(--container-middle);
  margin-inline: auto;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .l-page-home {
    --page-home-section-spacer: 12rem;
  }
  .l-page-home__shell {
    padding-inline: var(--global-gutter);
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .l-page-home {
    --page-home-section-spacer: 12rem;
  }
  .l-page-home__shell {
    width: 95%;
  }
}

/**
 * module / component
 */
/* --- typography --- */
.c-page-home__heading {
  color: var(--color-theme);
  font-weight: 700;
}
/* --- for small viewport --- */
@media screen and (max-width: 960px) {
  .c-page-home__heading {
    font-size: var(--home-heading-font-size, 2.4rem);
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 961px) {
  .c-page-home__heading {
    font-size: var(--home-heading-font-size, 4rem);
  }
}

/**
 * firstview
 */
.m-page-home-firstview__carousel {
  position: relative;
}
.m-page-home-firstview__carousel::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: bottom center;
  z-index: var(--zindex-overlay);
}
/* --- for small viewport --- */
@media screen and (min-width: 767px) {
  .m-page-home-firstview__carousel::after {
    background-image: url(../../assets/images/home/home-firstview-title-small.svg);
    height: calc(80 * 100vw / 393);
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .m-page-home-firstview__carousel::after {
    background-image: url(../../assets/images/home/home-firstview-title-large.svg);
    height: calc(200 * 100vw / 1400);
  }
}

/**
 * news
 */
.l-page-home__section--news {
  --page-home-section-spacer-variable: 0;
}
.m-page-home-news {
  display: grid;
}
.m-page-home-news__heading {
  display: grid;
  grid-template-columns: 100%;
  place-items: center;
}
.m-page-home-news__list {
  display: grid;
  grid-template-columns: 100%;
}
.c-page-home-news__list-item--emergency {
  color: var(--color-admonition);
}
.c-page-home-news__link {
  --display: grid;
  width: 100%;
}
.c-page-home__news-button {
  --button-radius: 100vh;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .m-page-home-news {
    grid-template-columns: 100%;
    row-gap: 30px;
  }
  .m-page-home-news__heading {
    row-gap: 8px;
  }
  .c-page-home__heading--news {
    font-size: 30px;
    line-height: 1.5;
    text-align: center;
  }
  .m-page-home-news__list {
    row-gap: 20px;
  }
  .c-page-home-news__link {
    grid-template-columns: 100%;
  }
  .c-page-home-news__post-date {
    border-bottom: 1px solid var(--color-theme-pale);
    font-size: 12px;
    line-height: calc(20 / 12);
  }
  .c-page-home-news__post-title {
    padding-block: 10px;
    font-size: 14px;
    line-height: calc(20 / 14);
  }
  .c-page-home__news-button {
    --button-width: 150px;
    --button-height: 40px;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .l-page-home__section--news {
    padding-block-start: 5rem;
  }
  .m-page-home-news {
    grid-template-columns: auto 59rem;
    justify-content: center;
    align-items: center;
    column-gap: 5.5rem;
  }
  .m-page-home-news__heading {
    row-gap: 0.8rem;
    grid-column: 1;
    grid-row: 1 / span 2;
    width: fit-content;
  }
  .m-page-home-news__list--emergency {
    grid-column: 2;
    grid-row: 1;
  }
  .m-page-home-news__list--default {
    grid-column: 2;
  }
  .m-page-home-news:has(.m-page-home-news__list--emergency)
    .m-page-home-news__list--default {
    grid-row: 2;
  }
  .m-page-home-news:not(:has(.m-page-home-news__list--emergency))
    .m-page-home-news__list--default {
    grid-row: 1 / span 2;
  }
  .c-page-home-news__link {
    grid-template-columns: auto 1fr;
    column-gap: 20px;
    padding-block: 8px;
    border-bottom: 1px solid var(--color-theme-pale);
  }
  .c-page-home__heading--news {
    font-size: 3rem;
    line-height: 1.5;
    text-align: center;
  }
  .c-page-home-news__post-date {
    font-size: 1.2rem;
    line-height: calc(20 / 12);
  }
  .c-page-home-news__post-title {
    font-size: 1.5rem;
    line-height: calc(20 / 15);
  }
  .c-page-home__news-button {
    --button-width: 15rem;
    --button-height: 4rem;
  }
}

/**
 * firstview
 */
.c-page-home__recruit-anchor {
  position: absolute;
  z-index: var(--zindex-front);
}
/* --- for small viewport --- */
@media screen and (max-width: 960px) {
  .c-page-home__recruit-anchor {
    bottom: 3rem;
    right: 0;
    width: 220px;
    height: 220px;
  }
}
/* --- for middle viewport --- */
@media screen and (min-width: 961px) and (max-width: 1439px) {
  .c-page-home__recruit-anchor {
    bottom: 0rem;
    right: 5rem;
    width: 16rem;
    height: 16rem;
  }
}
@media screen and (min-width: 1440px) {
  .c-page-home__recruit-anchor {
    bottom: -10rem;
    right: 5rem;
    width: 25rem;
    height: 25rem;
  }
}

/**
 * lead
 */
.m-page-home-lead {
  display: grid;
  grid-template-columns: 100%;
  text-align: center;
  font-weight: 700;
}
.c-page-home-lead__thumbnail {
  max-width: 76rem;
  width: 90%;
  margin-inline: auto;
}
/* --- for small viewport --- */
@media screen and (max-width: 960px) {
  .l-page-home__section--lead {
    --page-home-section-spacer-variable: 60px;
  }
  .m-page-home-lead {
    row-gap: 10px;
  }
  .c-page-home-lead__text {
    font-size: 18px;
    line-height: calc(30 / 18);
  }
  .c-page-home-lead__title {
    font-size: 32px;
    line-height: calc(35 / 32);
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 961px) {
  .l-page-home__section--lead {
    --page-home-section-spacer-variable: 40px;
  }
  .m-page-home-lead {
    row-gap: 10px;
  }
  .c-page-home-lead__text {
    font-size: 24px;
    line-height: calc(35 / 24);
  }
  .c-page-home-lead__title {
    font-size: 40px;
    line-height: calc(58 / 40);
  }
}

/**
 * features
 */
/* --- header --- */
.m-page-home-features__header {
  position: relative;
  z-index: var(--zindex-overlay);
}
.m-page-home-features__header::before,
.m-page-home-features__header::after {
  content: "";
  position: absolute;
  pointer-events: none;
}
.m-page-home-features__header::before {
  background-color: rgba(47, 117, 201, 0.5);
  border-radius: 100vh;
  z-index: var(--zindex-base);
}
.m-page-home-features__header::after {
  right: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-size: 100%;
  z-index: var(--zindex-front);
}
.m-page-home-features__heading {
  display: grid;
  grid-template-columns: 100%;
}
.c-page-home-features__heading-notes {
  font-weight: 700;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .m-page-home-features__header {
    padding-block-end: calc(125 * var(--cqi));
  }
  .m-page-home-features__header::before {
    right: calc(-100 * var(--cqi) - var(--global-gutter));
    bottom: calc(-46 * var(--cqi));
    width: calc(200 * var(--cqi));
    height: calc(200 * var(--cqi));
  }
  .m-page-home-features__header::after {
    width: calc(370 * var(--cqi));
    height: calc(112 * var(--cqi));
    background-image: url(../../assets/images/home/feature-heading-background-small.svg);
  }
  .m-page-home-features__heading {
    row-gap: 1rem;
    padding-inline: 5rem;
  }
  .c-page-home__heading--features {
    --home-heading-font-size: 59px;
  }
  .c-page-home__heading--features .number {
    font-size: calc(66 / 45 * 1em);
  }
  .c-page-home-features__heading-notes {
    font-size: 20px;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .m-page-home-features__header {
    padding-inline-start: calc(445 * 100vw / var(--container-wide-value));
    padding-block-end: calc(40 * 100vw / var(--container-wide-value));
  }
  .m-page-home-features__header::before {
    right: calc(-210 * 100vw / var(--container-wide-value));
    bottom: calc(-48 * 100vw / var(--container-wide-value));
    width: calc(420 * 100vw / var(--container-wide-value));
    height: calc(420 * 100vw / var(--container-wide-value));
  }
  .m-page-home-features__header::after {
    width: calc(1320 * 100vw / var(--container-wide-value));
    height: calc(194 * 100vw / var(--container-wide-value));
    background-image: url(../../assets/images/home/feature-heading-background-large.svg);
  }
  .m-page-home-features__heading {
    row-gap: 0.5rem;
  }
  .c-page-home__heading--features {
    --home-heading-font-size: 5.9rem;
  }
  .c-page-home__heading--features .number {
    font-size: calc(66 / 45 * 1em);
  }
  .c-page-home-features__heading-notes {
    font-size: 2.4rem;
  }
}

/* --- achievement --- */
.m-page-home-features__achievements {
  display: grid;
  grid-template-columns: var(--achievements-grid-template-columns);
}
.c-page-home-features-achievement {
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: auto 1fr;
  row-gap: 2rem;
}
.c-page-home-features-achievement__title {
  display: grid;
  place-items: center;
  height: calc(22 / 13 * 2em);
  font-size: 1.3rem;
  line-height: calc(22 / 13);
  font-weight: 700;
  text-align: center;
}
.c-page-home-features-achievement__thumbnail,
.c-page-home-features-achievement__caption {
  align-self: start;
}
.c-page-home-features-achievement__caption {
  height: 100%;
}
.c-page-home-features-achievement__caption > dl {
  display: grid;
  grid-template-columns: 100%;
  row-gap: 1rem;
}
.c-page-home-features-achievement__heading {
  --line-height: 1.5;
  display: grid;
  grid-template-columns: 100%;
  font-size: 2rem;
  text-align: center;
  line-height: var(--line-height);
}
.c-page-home-features-achievement__heading--caption {
  display: grid;
  place-items: center;
  height: calc(var(--line-height) * 2 * 1em);
  font-size: 1.4rem;
}
.c-page-home-features-achievement__caption dd {
  --line-height: calc(22 / 14);
  font-size: 1.4rem;
  line-height: var(--line-height);
}
.c-page-home-features-achievement__caption dd > dl {
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: auto 1fr;
}
.c-page-home-features-achievement__caption dd > dl > dt {
  height: calc(var(--line-height) * 2 * 1em);
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .m-page-home-features__achievements {
    --achievements-grid-template-columns: 100%;
    row-gap: 6rem;
    max-width: var(--container-narrow);
    margin-inline: auto;
    margin-block-start: 8rem;
  }
  .c-page-home-features-achievement__caption {
    text-align: center;
  }
}
/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .m-page-home-features__achievements {
    --achievements-grid-template-columns: repeat(5, 1fr);
    column-gap: 2rem;
    margin-block-start: 3rem;
  }
}

/* --- contents --- */
.m-page-home-features__contents {
  position: relative;
  max-width: calc(var(--container-wide-value) * var(--rate));
  width: 100%;
  margin-inline: auto;
  container-type: inline-size;
  container-name: container;
}
.m-page-home-features__contents::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
}
.m-page-home-features-contents {
  position: relative;
}
.m-page-home-features-contents__shell {
  position: relative;
}
.m-page-home-features-contents__shell:nth-child(2)::before,
.m-page-home-features-contents__shell:nth-child(5)::before {
  content: "";
  position: absolute;
  border-radius: 100vh;
  background-color: rgba(246, 196, 69, 0.5);
  z-index: var(--zindex-behind);
}
.c-page-home-features-contents__heading {
  color: var(--color-theme);
  font-weight: 700;
  text-align: center;
}
.c-page-home-features-contents__sub-heading {
  font-weight: 700;
}
.m-page-home-features-contents__container {
  display: grid;
  justify-content: center;
  margin-inline: auto;
}
.c-page-home-features-contents__ceo {
  width: fit-content;
  font-family: var(--font-ja-serif);
  font-weight: 700;
  text-align: center;
}
/* --- for small viewport --- */
@media screen and (max-width: 767px) {
  .m-page-home-features__contents {
    padding-block-start: calc(120 * var(--rate));
    padding-inline: calc(20 * var(--rate));
  }
  .m-page-home-features__contents::before {
    top: calc(130 * var(--rate));
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/home/home-feature-background-small.svg);
    background-size: 100%;
    background-position: top center;
  }
  .c-page-home-features-contents__heading {
    font-size: calc(24 * var(--rate));
    line-height: calc(36 / 24);
    text-align: center;
  }
  .c-page-home-features-contents__heading + * {
    margin-block-start: var(
      --features-contents-heading-spacer,
      calc(40 * var(--rate))
    );
  }
  .c-page-home-features-contents__sub-heading {
    width: fit-content;
    margin-inline: auto;
    font-size: calc(20 * var(--rate));
    line-height: calc(30 / 20);
  }
  .c-page-home-features-contents__sub-heading + * {
    margin-block-start: var(
      --features-contents-sub-heading-spacer,
      calc(20 * var(--rate))
    );
  }
  .c-page-home-features-contents__description {
    font-size: calc(15 * var(--rate));
    line-height: calc(30 / 15);
  }
  .c-page-home-features-contents__ceo {
    padding-block-end: calc(18 * var(--rate));
    line-height: 1.5;
  }
  .c-page-home-features-contents__ceo dt {
    font-size: calc(15 * var(--rate));
  }
  .c-page-home-features-contents__ceo dd {
    font-size: calc(24 * var(--rate));
  }
  .c-page-home__feature-button {
    --button-width: calc(280 * var(--rate));
    --button-height: calc(50 * var(--rate));
    --button-font-size: calc(15 * var(--rate));
    margin-block-start: calc(40 * var(--rate));
    margin-inline: auto;
  }
  .m-page-home-features-contents__container {
    grid-template-columns: 100%;
  }
  .c-page-home-features-contents__thumbnail {
    grid-row: 2;
    margin-block-start: var(
      --features-contents-thumbnail-spacer,
      calc(50 * var(--rate))
    );
  }
  .c-page-home-features-contents__summary-box {
    grid-row: 1;
  }
  .m-page-home-features-contents__container[data-layout="ceo-thumbnail"]
    .c-page-home-features-contents__thumbnail {
    display: grid;
    grid-template-columns: calc(200 * var(--rate)) 1fr;
    align-items: end;
    gap: calc(16 * var(--rate));
    padding-inline: calc(5 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(1)
    .m-page-home-features-contents__container {
    --features-contents-heading-spacer: calc(75 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(1)
    .c-page-home-features-contents__heading {
    padding-inline-end: calc(30 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(1)
    .c-page-home-features-contents__sub-heading {
    padding-inline-end: calc(30 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(1)
    .c-page-home-features-contents__description {
    --features-contents-sub-heading-spacer: calc(110 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(2) {
    margin-block-start: calc(120 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(2)
    .c-page-home-features-contents__thumbnail {
    --features-contents-thumbnail-spacer: calc(20 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(3) {
    margin-block-start: calc(315 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(4) {
    margin-block-start: calc(260 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(5) {
    margin-block-start: calc(120 * var(--rate));
  }
  .m-page-home-features-contents__shell:nth-child(2)::before,
  .m-page-home-features-contents__shell:nth-child(5)::before {
    top: calc(-100 * var(--rate));
    left: calc(-120 * var(--rate));
    width: calc(200 * var(--rate));
    height: calc(200 * var(--rate));
  }
}

/* --- for large viewport --- */
@media screen and (min-width: 768px) {
  .m-page-home-features__contents {
    padding-block-start: calc(120 * var(--cqi));
  }
  .m-page-home-features__contents::before {
    top: calc(58 * var(--cqi));
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/home/home-feature-background-large.svg);
    background-size: calc(1390 * var(--cqi));
  }
  .c-page-home-features-contents__heading {
    font-size: calc(40 * var(--cqi));
    line-height: calc(58 / 40);
  }
  .c-page-home-features-contents__heading + * {
    margin-block-start: var(
      --features-contents-heading-spacer,
      calc(85 * var(--cqi))
    );
  }
  .c-page-home-features-contents__sub-heading {
    width: 100%;
    margin-inline: auto;
    font-size: calc(24 * var(--cqi));
    line-height: calc(35 / 24);
  }
  .c-page-home-features-contents__sub-heading + * {
    margin-block-start: var(
      --features-contents-sub-heading-spacer,
      calc(40 * var(--cqi))
    );
  }
  .c-page-home-features-contents__description {
    font-size: calc(18 * var(--cqi));
    line-height: calc(30 / 18);
  }
  .c-page-home-features-contents__ceo {
    padding-block-end: calc(18 * var(--cqi));
  }
  .c-page-home-features-contents__ceo dt {
    font-size: calc(18 * var(--cqi));
    line-height: calc(26 / 18);
  }
  .c-page-home-features-contents__ceo dd {
    font-size: calc(28 * var(--cqi));
    line-height: calc(40 / 28);
  }
  .c-page-home__feature-button {
    --button-width: calc(280 * var(--cqi));
    --button-height: calc(50 * var(--cqi));
    --button-font-size: calc(15 * var(--cqi));
    margin-block-start: calc(40 * var(--cqi));
    margin-inline: auto;
  }
  .m-page-home-features-contents__container[data-layout="left-thumbnail"] {
    grid-template-columns:
      calc(190 * var(--cqi))
      calc(530 * var(--cqi))
      calc(30 * var(--cqi))
      calc(460 * var(--cqi))
      calc(230 * var(--cqi));
  }
  .m-page-home-features-contents__container[data-layout="left-thumbnail"]
    .c-page-home-features-contents__thumbnail {
    grid-column: 2;
  }
  .m-page-home-features-contents__container[data-layout="left-thumbnail"]
    .c-page-home-features-contents__summary-box {
    grid-column: 4;
  }
  .m-page-home-features-contents__container[data-layout="right-thumbnail"] {
    grid-template-columns:
      calc(260 * var(--cqi))
      calc(460 * var(--cqi))
      calc(30 * var(--cqi))
      calc(530 * var(--cqi))
      calc(160 * var(--cqi));
  }
  .m-page-home-features-contents__container[data-layout="right-thumbnail"]
    .c-page-home-features-contents__thumbnail {
    grid-column: 4;
  }
  .m-page-home-features-contents__container[data-layout="right-thumbnail"]
    .c-page-home-features-contents__summary-box {
    grid-column: 2;
  }
  .m-page-home-features-contents__container[data-layout="ceo-thumbnail"] {
    grid-template-columns:
      calc(260 * var(--cqi))
      calc(460 * var(--cqi))
      calc(70 * var(--cqi))
      calc(650 * var(--cqi));
  }
  .m-page-home-features-contents__container[data-layout="ceo-thumbnail"]
    .c-page-home-features-contents__thumbnail {
    grid-column: 4;
    display: grid;
    grid-template-columns: calc(300 * var(--cqi)) auto;
    column-gap: calc(14 * var(--cqi));
    align-items: end;
    transform: translateY(calc(-18 * var(--cqi)));
  }
  .m-page-home-features-contents__container[data-layout="ceo-thumbnail"]
    .c-page-home-features-contents__summary-box {
    grid-column: 2;
  }
  .m-page-home-features-contents__shell:has([data-layout="ceo-thumbnail"])
    .c-page-home-features-contents__sub-heading {
    padding-inline: calc(260 * var(--cqi));
  }
  .c-page-home-features-contents__thumbnail,
  .c-page-home-features-contents__summary-box {
    grid-row: 1;
  }
  .c-page-home-features-contents__thumbnail {
    align-self: start;
  }
  .m-page-home-features-contents__shell:nth-child(1)
    .m-page-home-features-contents__container {
    --features-contents-heading-spacer: calc(167 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(2) {
    margin-block-start: calc(195 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(3) {
    margin-block-start: calc(195 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(4) {
    margin-block-start: calc(222 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(5) {
    margin-block-start: calc(190 * var(--cqi));
    padding-block-end: 10px;
  }
  .m-page-home-features-contents__shell:nth-child(2)::before,
  .m-page-home-features-contents__shell:nth-child(5)::before {
    left: calc(-210 * var(--cqi));
    width: calc(420 * var(--cqi));
    height: calc(420 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(3)::before {
    content: "";
    position: absolute;
    border-radius: 100vh;
    background-color: rgba(47, 117, 201, 0.5);
    z-index: var(--zindex-behind);
  }
  .m-page-home-features-contents__shell:nth-child(2)::before {
    top: calc(-120 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(3)::before {
    top: calc(-290 * var(--cqi));
    right: calc(-210 * var(--cqi));
    width: calc(420 * var(--cqi));
    height: calc(420 * var(--cqi));
  }
  .m-page-home-features-contents__shell:nth-child(5)::before {
    top: calc(-160 * var(--cqi));
  }
}
