/************************************************
    Key Visual
*************************************************/
.keyVisual {
  inline-size: 100%;
}

/************************************************
    Icon Navigation
*************************************************/
.iconNavigation {
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: center;
  -js-display: flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  background-color: white;
  padding-block: 4.0625em;
  padding-inline: 5px;
}
@supports not (padding-block: 4.0625em) {
  .iconNavigation {
    padding-block-start: 4.0625em;
    padding-block-end: 4.0625em;
  }
}
@supports not (padding-inline: 5px) {
  .iconNavigation {
    padding-inline-start: 5px;
    padding-inline-end: 5px;
  }
}
.iconNavigation {
  margin: 0;
}
@media (min-width: 48rem) {
  .iconNavigation {
    font-size: 1.5em;
    padding-inline: 10px;
  }
  @supports not (padding-inline: 10px) {
    .iconNavigation {
      padding-inline-start: 10px;
      padding-inline-end: 10px;
    }
  }
}
.iconNavigation-item {
  box-sizing: border-box;
  inline-size: 50%;
  max-inline-size: 10.8333333333em;
  padding: 5px;
}
@media (min-width: 48rem) {
  .iconNavigation-item {
    inline-size: 25%;
    padding: 10px;
  }
}
.iconNavigation-item__permalink {
  color: white;
  text-decoration: none;
  display: block;
  background-color: var(--theme-color);
  background-repeat: no-repeat;
  padding-block: 7.875em 0.625em;
}
@supports not (padding-block: 7.875em 0.625em) {
  .iconNavigation-item__permalink {
    padding-block-start: 7.875em;
    padding-block-end: 0.625em;
  }
}
.iconNavigation-item__permalink {
  padding-inline: 0.55em 0.5em;
}
@supports not (padding-inline: 0.55em 0.5em) {
  .iconNavigation-item__permalink {
    padding-inline-start: 0.55em;
    padding-inline-end: 0.5em;
  }
}
.iconNavigation-item__permalink {
  border-radius: 2.5em;
}
.iconNavigation-item__permalink:hover {
  opacity: 0.8;
}
.iconNavigation-item--kaiin .iconNavigation-item__permalink {
  background-image: url("../img/icon_kaiin.svg");
  background-position: center 1.8541666667em;
  background-size: 5.7233333333em;
}
.iconNavigation-item--yakuin .iconNavigation-item__permalink {
  background-image: url("../img/icon_yakuin.svg");
  background-position: center 1.4541666667em;
  background-size: 5.7233333333em;
}
.iconNavigation-item--gaiyo .iconNavigation-item__permalink {
  background-image: url("../img/icon_gaiyo.svg");
  background-position: center 1.5958333333em;
  background-size: 5.4370833333em;
}
.iconNavigation-item--katsudo .iconNavigation-item__permalink {
  background-image: url("../img/icon_katsudo.svg");
  background-position: center 1.4541666667em;
  background-size: 5.15125em;
}

/************************************************
    Welcome
*************************************************/
.welcome {
  max-inline-size: 25rem;
  margin-inline: auto;
}
@supports not (margin-inline: auto) {
  .welcome {
    margin-inline-start: auto;
    margin-inline-end: auto;
  }
}
@media (min-width: 48rem) {
  .welcome {
    display: grid;
    grid-template-columns: 4fr 1fr 5fr;
    grid-template-rows: repeat(2, auto) 1fr;
    max-inline-size: 50em;
  }
}
.section-Welcome__content + .welcome {
  margin-block-start: 5.75em;
}
@media (min-width: 48rem) {
  .welcome__thumbnail {
    grid-column: 3;
    -ms-grid-row: 1;
    -ms-grid-row-span: 3;
    grid-row: 1 / -1;
  }
}
.welcome__title {
  font-size: 1em;
  line-height: 1.4583333333;
  margin-block: 2em 0;
}
@supports not (margin-block: 2em 0) {
  .welcome__title {
    margin-block-start: 2em;
    margin-block-end: 0;
  }
}
@media (min-width: 48rem) {
  .welcome__title {
    grid-column: 1;
    grid-row: 1;
    margin-block-start: 0;
  }
}
.welcome__title .before {
  color: var(--accent-color-01);
  font-size: 1.125em;
  font-weight: 500;
  display: block;
}
.welcome__title .text {
  color: var(--theme-color);
  font-size: 1.875em;
  font-weight: 700;
  letter-spacing: 0.1em;
  display: block;
}
.welcome__content {
  font-size: 1em;
  letter-spacing: 0.1em;
  line-height: 1.875;
  margin-block-start: 0.625em;
}
@media (min-width: 48rem) {
  .welcome__content {
    grid-column: 1;
    grid-row: 2;
  }
}
.welcome__content p {
  margin: 0;
}
.welcome__button {
  color: white;
  font-size: 1em;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  background-color: var(--theme-color);
  box-sizing: border-box;
  min-inline-size: 9.625em;
  padding-block: 1.0625em;
}
@supports not (padding-block: 1.0625em) {
  .welcome__button {
    padding-block-start: 1.0625em;
    padding-block-end: 1.0625em;
  }
}
.welcome__button {
  padding-inline: 1em;
}
@supports not (padding-inline: 1em) {
  .welcome__button {
    padding-inline-start: 1em;
    padding-inline-end: 1em;
  }
}
.welcome__button {
  border: 1px solid var(--theme-color);
  border-radius: 999px;
  margin-block-start: 2.5em;
}
@media (min-width: 48rem) {
  .welcome__button {
    grid-column: 1;
    grid-row: 3;
    justify-self: start;
    align-self: start;
  }
}
.welcome__button:hover {
  color: var(--theme-color);
  background-color: white;
}

/************************************************
    Welcome
*************************************************/
.section-Welcome__content {
  font-size: 1em;
  font-weight: 500;
  line-height: 2;
  inline-size: -moz-fit-content;
  inline-size: fit-content;
  margin-block-start: 1.75em;
  margin-inline: auto;
}
@supports not (margin-inline: auto) {
  .section-Welcome__content {
    margin-inline-start: auto;
    margin-inline-end: auto;
  }
}
.section-Welcome__content p {
  margin: 0;
}/*# sourceMappingURL=../maps/front-page.css.map */
