@charset "UTF-8";
/*--------------------------
文字に対して、一括でfont-size、line-height、letter-spacing、font-weightを指定する
line-heightがpxの場合
---------------------------*/
/*--------------------------
文字に対して、一括でfont-size、line-height、letter-spacing、font-weightを指定する
line-heightが％の場合
---------------------------*/
/*--------------------------------
    remの換算
--------------------------------*/
/*--------------------------------
    vwにする
--------------------------------*/
/*--------------------------------
    親要素に対する割合
--------------------------------*/
/*--------------------------------
背景のグラデーション
--------------------------------*/
/*--------------------------------
一次関数
画面幅 1440pxの時は、120pxで、そこからどんどん小さくなり、1000pxの時に20pxになるという実装の際に使える関数。
--------------------------------*/
/*--------------------------------
一次関数（最大値、最小値付き）
画面幅 1440pxの時は、120pxで、そこからどんどん小さくなり、1000pxの時に20pxになるという実装の際に使える関数。
--------------------------------*/
/*--------------------------------
擬似要素の背景
--------------------------------*/
/*--------------------------------
三角形
--------------------------------*/
/*--------------------------
  フォント読み込み
---------------------------*/
body {
  font-family: "Noto Sans JP", sans-serif;
  color: #1A1A1A;
  background-color: #ffffff;
}

@media screen and (min-width: 768px) {
  .sp {
    display: none;
  }
}

.pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .pc {
    display: block;
  }
}

/*--------------------------------
リキッドの設定
--------------------------------*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default padding */
ul,
ol {
  padding: 0;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

/* Set core root defaults */
/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

/* Remove list styles on ul, ol elements with a class attribute */
ul,
ol {
  list-style: none;
}

a {
  text-decoration: none;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img {
  max-width: 100%;
  display: block;
  width: 100%;
}

/* Natural flow and rhythm in articles by default */
article > * + * {
  margin-top: 1em;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Blur images when they have no alt attribute */
img:not([alt]) {
  filter: blur(10px);
}

/* フォームリセット */
input,
button,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
}

textarea {
  resize: vertical;
}

input[type=checkbox],
input[type=radio] {
  display: none;
}

input[type=submit],
input[type=button],
label,
button,
select {
  cursor: pointer;
}

select::-ms-expand {
  display: none;
}

.inner {
  width: 100%;
  padding-right: 20px;
  padding-left: 20px;
  margin-right: auto;
  margin-left: auto;
  max-width: 500px;
}
@media screen and (min-width: 768px) {
  .inner {
    max-width: 1310px;
    padding-right: 25px;
    padding-left: 25px;
  }
}

@media screen and (min-width: 768px) {
  .top-col02__inner {
    margin-inline: initial;
    display: grid;
    grid-template-columns: max(91px, 6.3194444444vw) 1fr;
  }
}

@media screen and (min-width: 768px) {
  .parallax-image-wrap {
    position: relative;
    width: 15.75rem;
    height: 15.75rem;
    overflow: hidden;
  }
}

@media screen and (min-width: 768px) {
  .parallax-image {
    object-fit: cover;
    height: 120%;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
  }
}

/*#################################
ボタンのアニメーション
#################################*/
.button-anchor__icon {
  display: flex;
  position: relative;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  width: 0.946875rem;
  height: 0.946875rem;
  border-radius: 0.25rem;
}

.button-anchor__icon img:nth-of-type(1) {
  display: none;
  width: 70%;
}
@media screen and (min-width: 768px) {
  .button-anchor__icon img:nth-of-type(1) {
    display: block;
    position: absolute;
    top: 50%;
    transform: translate(-140%, -50%);
    transition: 0.3s;
  }
}

.button-anchor__icon img:nth-of-type(2) {
  width: 70%;
}
@media screen and (min-width: 768px) {
  .button-anchor__icon img:nth-of-type(2) {
    display: block;
    transition: 0.3s;
  }
}

.button-anchor:hover .button-anchor__icon img:nth-of-type(1) {
  transform: translate(0%, -50%);
  transition: 0.3s;
}
.button-anchor:hover .button-anchor__icon img:nth-of-type(2) {
  transform: translate(140%, 0%);
  transition: 0.3s;
}

.right-up-button__icon {
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  width: 1.23125rem;
  height: 1.23125rem;
}

.right-up-button__icon img:nth-of-type(1) {
  width: 80%;
  display: block;
  position: absolute;
  transform: translate(-140%, 190%) rotate(-45deg);
  top: 50%;
  transition: 0.3s;
}

.right-up-button__icon img:nth-of-type(2) {
  width: 80%;
  transform: rotate(-45deg);
  display: block;
}
@media screen and (min-width: 768px) {
  .right-up-button__icon img:nth-of-type(2) {
    transition: 0.3s;
  }
}

.right-up-button:hover .right-up-button__icon img:nth-of-type(1) {
  transform: translate(0%, -50%) rotate(-45deg);
  transition: 0.3s;
}
.right-up-button:hover .right-up-button__icon img:nth-of-type(2) {
  transform: translate(140%, -140%) rotate(-45deg);
  transition: 0.3s;
}

/*#################################
ボタン (細い矢印)
#################################*/
.text-wrap {
  position: relative;
  overflow: hidden;
}

.text01,
.text02 {
  display: block;
  font-family: "Jost", sans-serif;
}

.text02 {
  position: absolute;
  top: 0;
  left: 0;
}

.link__icon {
  position: relative;
  overflow: hidden;
  width: 1.75rem;
  height: 1.125rem;
}

.image01 {
  position: static;
}

.image01,
.image02 {
  display: inline-block;
  position: absolute;
  top: 33%;
  left: 29%;
}

.link--reverse a {
  flex-direction: row-reverse;
}
.link--reverse a .image01 img {
  transform: scale(-1);
}
.link--reverse a .image02 img {
  transform: scale(-1);
}

.link__anchor {
  padding-top: 1.25rem;
  padding-bottom: 1.28125rem;
  font-size: 1rem;
  line-height: 1.25;
  letter-spacing: 0em;
  font-weight: 500;
  font-family: "Jost", sans-serif;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-width: 158px;
  position: relative;
  color: #191E25;
}
@media screen and (min-width: 768px) {
  .link__anchor {
    min-width: 179px;
  }
}

.link__anchor::after {
  content: "";
  background-color: #191E25;
  width: 100%;
  height: 1px;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}

.link__anchor--white {
  color: #ffffff;
}

.link__anchor--white::after {
  background-color: #fff;
}

.link__icon {
  padding: 0.3125rem 0.5rem;
  background-color: #191E25;
  border-radius: 0.375rem;
  display: block;
}
@media screen and (min-width: 768px) {
  .link__icon {
    padding: 0.3125rem 0.5rem;
  }
}

.link__icon img {
  width: 0.625rem;
  height: 0.375rem;
}

.link__icon--white {
  background-color: #ffffff;
}

@media screen and (min-width: 1100px) {
  .top-col02__header {
    padding-left: 2.5rem;
    display: flex;
    align-items: center;
    gap: 2.5rem;
    max-width: 69.375rem;
  }
}

.top-sec-title {
  font-size: 4.375rem;
  line-height: 1;
  letter-spacing: -0.04em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}
@media screen and (min-width: 768px) {
  .top-sec-title {
    font-size: 7.5rem;
    line-height: 1;
    letter-spacing: -0.04em;
    font-weight: 400;
  }
}

.top-sec-description {
  margin-top: 0.625rem;
  font-size: 0.8125rem;
  line-height: 1.8;
  letter-spacing: 0.1em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .top-sec-description {
    font-size: 0.875rem;
    margin-top: 2.5rem;
  }
}

.top-sec-button {
  background-color: #fff;
  color: #1A1A1A;
  padding: 0.125rem 0.875rem;
  display: block;
  width: fit-content;
  font-size: 0.625rem;
  line-height: 1.8;
  letter-spacing: -0.1em;
  font-weight: 400;
  border-radius: 6.25rem;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-sec-button {
    display: none;
  }
}

.top-header-side__link {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .top-header-side__link {
    position: sticky;
    top: 12.5rem;
  }
}

.top-header-side__title {
  writing-mode: vertical-lr;
  font-size: 2rem;
  line-height: 1.2;
  letter-spacing: 0.03em;
  font-weight: 500;
  font-family: "Shippori Mincho", sans-serif;
  margin-bottom: 3.75rem;
}

.top-header-side__link-text {
  font-size: 0.625rem;
  line-height: 1.1;
  letter-spacing: 0em;
  font-weight: 400;
  margin-top: 0.625rem;
}

.cta-join__inner {
  padding: 0;
  max-width: none;
}
@media screen and (min-width: 768px) {
  .cta-join__inner {
    padding-left: 25px;
    padding-right: 25px;
    max-width: 1310px;
  }
}

.cta-join__visual {
  position: relative;
  width: 100%;
  aspect-ratio: 75/46;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .cta-join__visual {
    height: 32.5rem;
    aspect-ratio: auto;
  }
}

.cta-join__image {
  object-fit: cover;
  height: 110%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
@media screen and (min-width: 768px) {
  .cta-join__image {
    height: 120%;
  }
}

.cta-join__overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: calc(60 * (100vw - 375px) / 392 + 4px);
  background-color: rgba(0, 0, 0, 0.2);
}
@media screen and (min-width: 768px) {
  .cta-join__overlay {
    padding-bottom: 4.0625rem;
  }
}

.cta-join__heading {
  max-width: 16.875rem;
  width: 100%;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .cta-join__heading {
    max-width: 100%;
    width: fit-content;
  }
}

.cta-join__title {
  font-size: 3.125rem;
  line-height: 0.9;
  letter-spacing: -0.04em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}
@media screen and (min-width: 768px) {
  .cta-join__title {
    font-size: 6.875rem;
  }
}

.cta-join__lead {
  margin-top: 1rem;
  font-size: 0.8125rem;
  line-height: 1.6;
  letter-spacing: 0.1em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .cta-join__lead {
    text-align: center;
    font-size: 1rem;
  }
}

.cta-join__links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.05rem;
  margin-bottom: 0.05rem;
}

.cta-join__link {
  background-color: #ffffff;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  padding: 4.375rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .cta-join__link {
    padding: 6.25rem 1.875rem;
  }
}

.cta-join__link-text {
  color: #1A1A1A;
  font-size: 1.25rem;
  line-height: 1;
  letter-spacing: 0.03em;
  font-weight: 400;
}

.cta-join__link-text span {
  display: none;
}
@media screen and (min-width: 768px) {
  .cta-join__link-text span {
    display: inline;
  }
}

.cta-join__button-icon {
  background-color: #1A1A1A;
  width: 1.13625rem;
  height: 1.13625rem;
  border-radius: 0.1875rem;
}

/*--------------------------
下層ページ
---------------------------*/
/*-- 新卒ページのみ格子線を#2EE5C4に上書き --*/
body.new-graduate .grid-line {
  background: rgba(46, 229, 195, 0.5);
}

/*-- 下層ページ用 bg-grid（アニメなし・最初から表示） --*/
body:not(.front-page) .bg-grid {
  content: "";
  display: block;
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  body:not(.front-page) .bg-grid {
    background-size: max(252px, 17.5vw) max(252px, 17.5vw);
  }
}

.sub-page__hero {
  color: #ffffff;
  background: #191E1E;
  padding-block: 4rem 3.875rem;
}
@media screen and (min-width: 768px) {
  .sub-page__hero {
    padding-block: 12.5rem 3.75rem;
  }
}

.sub-page__hero-inner {
  width: 100%;
  padding-inline: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-page__hero-inner {
    padding-inline: clamp(20px, -70 * (100vw - 1440px) / -672 + 90px, 90px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
  }
}

.breadcrumb {
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  text-transform: uppercase;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .breadcrumb {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.9375rem;
  }
}

.breadcrumb__list {
  display: flex;
  align-items: center;
  gap: 0.9375rem;
}

.breadcrumb__item {
  position: relative;
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  text-transform: uppercase;
}

.breadcrumb__item + .breadcrumb__item {
  padding-left: 1.4375rem;
}
.breadcrumb__item + .breadcrumb__item::before {
  content: ">";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  color: #ffffff;
}

.breadcrumb__link {
  color: inherit;
  text-decoration: none;
}

.breadcrumb span[typeof=BreadcrumbList] {
  display: flex;
  align-items: center;
  gap: 0.9375rem;
  flex-wrap: wrap;
}

.breadcrumb .breadcrumb-separator {
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  color: #ffffff;
  user-select: none;
}

.breadcrumb span[property=itemListElement] {
  position: relative;
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  text-transform: uppercase;
}
.breadcrumb span[property=itemListElement] a {
  font-size: inherit;
  letter-spacing: inherit;
  font-weight: inherit;
  text-transform: inherit;
  color: #ffffff;
  text-decoration: none;
}

.breadcrumb .bcn-list {
  display: flex;
  align-items: center;
  gap: 0.9375rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.breadcrumb .bcn-item {
  position: relative;
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  text-transform: uppercase;
}
.breadcrumb .bcn-item + .bcn-item {
  padding-left: 1.4375rem;
}
.breadcrumb .bcn-item + .bcn-item::before {
  content: ">";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  color: #ffffff;
}
.breadcrumb .bcn-item a {
  color: inherit;
  text-decoration: none;
}

.sub-page__title-wrapper {
  text-align: right;
}

.sub-page__title-en {
  font-family: "Jost", sans-serif;
  font-size: 3rem;
  line-height: 0.6;
  letter-spacing: 0em;
  font-weight: 300;
}
@media screen and (min-width: 768px) {
  .sub-page__title-en {
    font-size: 7.5rem;
    line-height: 0.6;
  }
}

@media screen and (min-width: 768px) {
  .sub-page__title-en--90 {
    font-size: 5.625rem;
  }
}

.sub-page__title-ja {
  font-family: "Shippori Mincho", sans-serif;
  margin-top: 0.625rem;
  font-size: 1.25rem;
  line-height: 1.1;
  letter-spacing: 0.1em;
  font-weight: 500;
  color: #DEDEDE;
}
@media screen and (min-width: 768px) {
  .sub-page__title-ja {
    margin-top: 2.5rem;
    font-size: 1.875rem;
  }
}

.sub-page__layout {
  padding-inline: 0;
}
@media screen and (min-width: 1024px) {
  .sub-page__layout {
    display: grid;
    justify-content: space-between;
    grid-template-columns: 8.4375rem 1fr;
    padding-inline: 25px;
    gap: 5.625rem;
  }
}

.sub-page__side {
  display: none;
}
@media screen and (min-width: 1024px) {
  .sub-page__side {
    display: block;
    flex: 0 0 auto;
    position: sticky;
    padding-top: 7.5rem;
    top: 7.5rem;
    height: max-content;
  }
}

.sub-page__nav {
  width: 100%;
}

.sub-page__nav-list {
  display: grid;
  gap: 1rem;
}

.sub-page__nav-link {
  display: flex;
  align-items: center;
  justify-content: baseline;
  padding: 0.25rem 0;
  font-size: 0.875rem;
  line-height: 1.5;
  letter-spacing: -0.02em;
  font-weight: 400;
  color: #1A1A1A;
  gap: 0.625rem;
  transition: color 0.25s ease;
}
.sub-page__nav-link::before {
  content: "";
  width: 0.375rem;
  height: 0.1875rem;
  flex-shrink: 0;
  background: #191E1E;
  transition: width 0.25s ease;
}

.sub-page__nav-link.is-current::before,
.sub-page__nav-link:hover::before,
.sub-page__nav-link:focus-visible::before {
  width: 1.25rem;
}

@media screen and (min-width: 768px) {
  .sub-page__section-wrapper {
    flex: 1 1 auto;
    min-width: 0;
  }
}

@media screen and (min-width: 1024px) {
  .sub-page__section-inner {
    padding-inline: 0;
  }
}

.sub-page__section-title {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 1.625rem;
  line-height: 1.5;
  letter-spacing: -0.019em;
  font-weight: 400;
  color: #000;
}
@media screen and (min-width: 768px) {
  .sub-page__section-title {
    font-size: 2.25rem;
  }
}
.sub-page__section-title::before {
  content: "";
  width: 0.625rem;
  height: 0.625rem;
  flex-shrink: 0;
  background: #7E6346;
}

.cta-recruit {
  background: #191E1E;
  padding-block: 3.75rem;
}
@media screen and (min-width: 768px) {
  .cta-recruit {
    padding-block: 4.6875rem;
  }
}

@media screen and (min-width: 768px) {
  .cta-recruit__inner {
    max-width: 1314px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
  }
}

.cta-recruit__heading {
  color: #ffffff;
}

.cta-recruit__label {
  font-size: 1.25rem;
  line-height: 1.65;
  letter-spacing: 0em;
  font-weight: 400;
}

.cta-recruit__title {
  font-family: "Jost", sans-serif;
  margin-top: 0.625rem;
  font-size: 3.125rem;
  line-height: 1;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .cta-recruit__title {
    font-size: 4.375rem;
    line-height: 1.1571428571;
    letter-spacing: 0em;
    font-weight: 400;
  }
}

.cta-recruit__cards {
  margin-top: 2.5rem;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .cta-recruit__cards {
    margin-top: 0;
  }
}

.cta-recruit__card {
  border-radius: 0.125rem;
  padding: 1.25rem;
}
@media screen and (min-width: 1024px) {
  .cta-recruit__card {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr 14.375rem;
    align-items: flex-end;
    justify-content: space-between;
    padding: 3.125rem 2.5rem;
  }
}

.cta-recruit__card--primary {
  background: #DAE1E7;
}

.cta-recruit__card--casual {
  border: 1px solid #DAE1E7;
}

.cta-recruit__card-label {
  font-family: "Jost", sans-serif;
  color: #11C3A3;
  font-size: 0.875rem;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .cta-recruit__card-label {
    font-size: 1.125rem;
  }
}

.cta-recruit__card-title {
  color: #191E1E;
  font-size: 1.625rem;
  line-height: 1.2692307692;
  letter-spacing: 0em;
  font-weight: 500;
}

.cta-recruit__card--casual .cta-recruit__card-title,
.cta-recruit__card--casual .cta-recruit__card-text {
  color: #ffffff;
}

.cta-recruit__card-text {
  margin-top: 0.625rem;
  color: #191E1E;
  font-size: 0.75rem;
  line-height: 1.6;
  letter-spacing: -0.03em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .cta-recruit__card-text {
    margin-top: 1.25rem;
    font-size: 0.875rem;
    line-height: 1.6;
  }
}

.cta-recruit__card-action {
  margin-top: 1.25rem;
}
@media screen and (min-width: 1024px) {
  .cta-recruit__card-action {
    width: 100%;
  }
}

.cta-recruit__button {
  min-height: 3.75rem;
  padding: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.875rem;
  background: #2EE5C4;
  color: #191E1E;
  text-decoration: none;
  border-radius: 0.125rem;
  transition: 0.3s;
}
@media screen and (min-width: 1024px) {
  .cta-recruit__button {
    width: 100%;
    justify-content: space-between;
    gap: 0.625rem;
  }
}

.cta-recruit__button-text {
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0em;
  font-weight: 400;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .cta-recruit__button-text {
    font-size: 1rem;
    line-height: 1.25;
  }
}

.cta-recruit__button-icon {
  width: 1.1875rem;
  height: 1.125rem;
  background: #1A1A1A;
}

.cta-recruit__button-icon img:nth-of-type(1),
.cta-recruit__button-icon img:nth-of-type(2) {
  width: 60%;
}

.cta-recruit__button:hover .cta-recruit__button-icon {
  background: #2EE5C4;
}
.cta-recruit__button:hover .cta-recruit__button-icon img:nth-of-type(1),
.cta-recruit__button:hover .cta-recruit__button-icon img:nth-of-type(2) {
  content: url("../img/common/button-arrow-black.svg");
}

.cta-recruit__card--primary .cta-recruit__button:hover {
  transition: 0.3s;
  background: #191E1E;
}
.cta-recruit__card--primary .cta-recruit__button:hover .cta-recruit__button-text {
  transition: 0.3s;
  color: #ffffff;
}

.cta-recruit__card--casual .cta-recruit__button:hover {
  transition: 0.3s;
  background: #DAE1E7;
}
.cta-recruit__card--casual .cta-recruit__button:hover .cta-recruit__button-text {
  transition: 0.3s;
  color: #191E1E;
}

/*#################################
People カード共通コンポーネント
#################################*/
.people-card__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 1200px) {
  .people-card__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.people-card__item {
  border-right: 1px solid #464a4a;
  border-bottom: 1px solid #464a4a;
}
.people-card__item:nth-of-type(2n) {
  border-right: none;
}
@media screen and (min-width: 1200px) {
  .people-card__item:nth-of-type(2n) {
    border-right: 1px solid #464a4a;
  }
}
@media screen and (min-width: 1200px) {
  .people-card__item:nth-of-type(3n) {
    border-right: none;
  }
}

.people-card__item-link {
  padding: 0.3125rem 0.3125rem 1.25rem;
  display: block;
  transition: 0.3s;
}
@media screen and (min-width: 768px) {
  .people-card__item-link {
    padding: 2.5rem;
    height: 100%;
  }
}

.people-card__image img {
  aspect-ratio: 177.5/200;
  object-fit: cover;
}

.people-card__content {
  margin-top: 1.25rem;
}

.people-card__text {
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0.03em;
  font-weight: 500;
  color: #1A1A1A;
  font-family: "Shippori Mincho", sans-serif;
}
@media screen and (min-width: 768px) {
  .people-card__text {
    font-size: 1.25rem;
    line-height: 1.5;
  }
}

.people-card__meta {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .people-card__meta {
    display: flex;
    align-items: flex-end;
  }
}

.people-card__info {
  color: #1A1A1A;
}
@media screen and (min-width: 768px) {
  .people-card__info {
    margin-right: 1.25rem;
  }
}

.people-card__department {
  font-size: 0.625rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .people-card__department {
    font-size: 0.6875rem;
    line-height: 1.3636363636;
  }
}

.people-card__name {
  font-size: 0.875rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-weight: 400;
  margin-top: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .people-card__name {
    font-size: 1.125rem;
    line-height: 1.1666666667;
  }
}

.people-card__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .people-card__bottom {
    flex: 1;
    margin-top: initial;
  }
}

.people-card__year {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.5rem;
  line-height: 1.625;
  letter-spacing: 0.1em;
  font-weight: 500;
  border: 1px solid #1A1A1A;
  color: #1A1A1A;
  min-width: 9.2375rem;
}
@media screen and (min-width: 768px) {
  .people-card__year {
    padding: 0.125rem 0.3125rem;
    min-width: auto;
    font-size: 0.625rem;
    line-height: 1.5;
  }
}

.people-card__button-arrow {
  margin-left: auto;
}

.people-card__button-icon {
  overflow: hidden;
  background-color: #1a1a1a;
  width: 1.23125rem;
  height: 1.23125rem;
  border-radius: 0.25rem;
  transition: 0.3s;
}

.people-card__item-link > *,
.people-card__item-link > * > *,
.people-card__item-link > * > * > * {
  transition: 0.3s;
}

.people-card__item-link:hover {
  background-color: #1A1A1A;
  transition: 0.3s;
}
.people-card__item-link:hover .people-card__text,
.people-card__item-link:hover .people-card__department,
.people-card__item-link:hover .people-card__name,
.people-card__item-link:hover .people-card__year {
  color: #dae1e7;
  transition: 0.3s;
}
.people-card__item-link:hover .people-card__year {
  border-color: #dae1e7;
  transition: 0.3s;
}
.people-card__item-link:hover .people-card__button-icon {
  background-color: #dae1e7;
  transition: 0.3s;
}

/*#################################
sub-people (People一覧ページ)
#################################*/
.sub-people {
  padding: 0;
}

.sub-people__inner {
  padding: 0;
}
@media screen and (min-width: 768px) {
  .sub-people__inner {
    padding: 0 25px;
  }
}

@media screen and (min-width: 768px) {
  .sub-people__body {
    padding: 5rem 0rem 6.25rem;
    border-inline: 1px solid #888166;
  }
}

@media screen and (min-width: 768px) {
  .sub-people .people-card__list {
    border-top: 1px solid #888166;
  }
}

/* 入社年度を名前の下に配置（トップページと同様） */
@media screen and (min-width: 768px) {
  .sub-people .people-card__meta {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .sub-people .people-card__info {
    margin-right: 0;
  }
}

@media screen and (min-width: 768px) {
  .sub-people .people-card__bottom {
    flex: initial;
    margin-top: 1.25rem;
  }
}

/*#################################
フローティングボタン
#################################*/
.floating-buttons {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 100;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.floating-buttons.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .floating-buttons {
    gap: 0.3125rem;
    right: 1.375rem;
    bottom: 1.375rem;
  }
}

.floating-buttons__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #2EE5C4;
  text-decoration: none;
  padding: 0.625rem 0.75rem;
  min-width: 8.875rem;
  gap: 1.25rem;
  color: #000;
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0.1em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .floating-buttons__item {
    padding: 0.8125rem 1.375rem;
    min-width: 11.375rem;
  }
}

.floating-buttons__arrow {
  background-color: #191E1E;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.floating-buttons__icon {
  width: 0.9375rem;
  height: 0.9375rem;
}

.floating-buttons__youtube-icon {
  width: 1.125rem;
  height: auto;
  flex-shrink: 0;
}

.floating-buttons__item--youtube {
  background-color: #2F3434;
  border: 1px solid #2F3434;
  font-family: "Jost", sans-serif;
  font-size: 0.9375rem;
  color: #ffffff;
  padding-inline: 0.625rem;
}
@media screen and (min-width: 768px) {
  .floating-buttons__item--youtube {
    padding-inline: 1.25rem;
  }
}

/* 初期は完全非表示 */
.fv__image img,
.fv__title,
.fv__title01,
.fv__title02,
.fv__news,
.fv__photo01 {
  opacity: 0;
  visibility: hidden;
}

body.front-page {
  color: #ffffff;
}

body.front-page .bg-grid {
  content: "";
  display: block;
  width: 100vw;
  height: 100vh;
  background-color: #191E1E;
  color: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  transition: 0.3s;
  /* ← 正方形サイズ */
}
@media screen and (min-width: 768px) {
  body.front-page .bg-grid {
    background-size: max(252px, 17.5vw) max(252px, 17.5vw);
    /* ← 正方形サイズ */
  }
}

body.front-page .bg-grid {
  overflow: hidden;
  position: fixed !important;
}

.grid-line {
  position: absolute;
  background: rgba(212, 175, 55, 0.16);
}

/* 縦線 */
.grid-line.vertical {
  width: 1px;
  height: 100%;
  top: 0;
}

/* 横線 */
.grid-line.horizontal {
  height: 1px;
  width: 100%;
  left: 0;
}

body.front-page.bg-brightness .bg-grid {
  background-color: #dae1e7;
  transition: 0.3s;
}

body.front-page .top-business__inner {
  transition: 0.3s;
}

body.front-page.bg-brightness .top-business__inner {
  background-color: #dae1e7;
  transition: 0.3s;
}

.fv {
  position: relative;
}

@media screen and (min-width: 768px) {
  .fv_inner {
    max-width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .fv__top {
    padding-top: 5rem;
  }
}

.fv__top-contents {
  position: relative;
}

.fv__title {
  background-color: #191E1E;
  font-family: "Shippori Mincho", sans-serif;
  font-size: 2rem;
  line-height: 1.1;
  letter-spacing: 0.1em;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  gap: 0.0625rem;
  width: fit-content;
  position: absolute;
  bottom: 0.75rem;
  z-index: 10;
}
@media screen and (min-width: 768px) {
  .fv__title {
    font-size: 3rem;
    line-height: 1.1;
    width: fit-content;
    height: fit-content;
    top: 50%;
    transform: translateY(-50%);
    left: 8.875rem;
    font-size: max(36px, 3.3333333333vw);
  }
}

.fv__title p {
  padding: 0.3125rem 0rem;
}
@media screen and (min-width: 768px) {
  .fv__title p {
    padding: 0.3125rem 0;
  }
}

.fv__image {
  width: 76.8vw;
  margin-left: auto;
  margin-right: calc(50% - 50vw);
}
@media screen and (min-width: 768px) {
  .fv__image {
    width: 58.75vw;
  }
}
.fv__image img {
  aspect-ratio: 288/335;
  object-fit: cover;
  object-position: 53% center;
}
@media screen and (min-width: 768px) {
  .fv__image img {
    aspect-ratio: 846/503;
    object-position: center;
    width: 100%;
  }
}

.fv__news {
  margin-right: calc(50% - 50vw);
  background-color: #2f3434;
  margin-top: 1.875rem;
  display: flex;
  align-items: stretch;
}
@media screen and (min-width: 768px) {
  .fv__news {
    width: 58.75vw;
    margin-left: auto;
  }
}

.fv__news-anchor {
  display: flex;
  color: #ffffff;
  padding: 1.21875rem 0.89375rem 1.21875rem 0.9375rem;
  align-items: center;
  flex: 1;
  min-width: 0;
}
@media screen and (min-width: 768px) {
  .fv__news-anchor {
    padding: 1.5625rem 1.875rem;
  }
}

.fv__news-title {
  text-transform: uppercase;
  font-size: 0.75rem;
  line-height: 1.4166666667;
  letter-spacing: 0em;
  font-weight: 500;
  font-family: "Jost", sans-serif;
  border-right: 1px solid #ffffff;
  padding: 0.3125rem 0.5625rem 0.3125rem 0rem;
  margin-right: 0.625rem;
}
@media screen and (min-width: 768px) {
  .fv__news-title {
    width: 5.3125rem;
    font-size: 0.9375rem;
    margin-right: 2.5rem;
  }
}

.fv__news-content {
  padding-right: 0.3125rem;
  flex: 1;
  min-width: 0;
}
@media screen and (min-width: 768px) {
  .fv__news-content {
    gap: 1.5625rem;
    padding-right: 1.25rem;
    flex: 1;
  }
}

.fv__news-viewport {
  position: relative;
  min-height: 2.125rem;
  overflow: hidden;
  perspective: 31.25rem;
}
@media screen and (min-width: 768px) {
  .fv__news-viewport {
    min-height: 1.125rem;
  }
}

.fv__news-item {
  position: absolute;
  inset: 0;
  display: block;
  opacity: 0;
  transition: opacity 0.65s ease;
}
@media screen and (min-width: 768px) {
  .fv__news-item {
    display: flex;
    align-items: center;
    gap: 1.5625rem;
  }
}

.fv__news-item.is-active {
  position: relative;
  opacity: 1;
}

.fv__news-item.is-leaving {
  opacity: 0;
}

.fv__news-date {
  font-size: 0.625rem;
  line-height: 1.4;
  letter-spacing: 0em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
  display: block;
}
@media screen and (min-width: 768px) {
  .fv__news-date {
    font-size: 0.8125rem;
  }
}

.fv__news-description {
  font-size: 0.6875rem;
  line-height: 1.1818181818;
  letter-spacing: 0.06em;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .fv__news-description {
    font-size: 0.8125rem;
  }
}

.fv__news-icon {
  position: relative;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: 1.25rem;
  height: 1.25rem;
  margin-top: 0.5rem;
}
@media screen and (min-width: 768px) {
  .fv__news-icon {
    margin-top: initial;
  }
}

.fv__news-icon svg:nth-of-type(2) {
  position: absolute;
  inset: 0;
  margin: auto;
  transition: 0.3s;
}

.fv__news-icon svg:nth-of-type(1) {
  position: absolute;
  inset: 0;
  margin: auto;
  transform: translate(-150%, 150%);
  transition: 0.3s;
}

.fv__news-anchor:hover .fv__news-icon svg:nth-of-type(2) {
  transform: translate(150%, -150%);
  transition: 0.3s;
}

.fv__news-anchor:hover .fv__news-icon svg:nth-of-type(1) {
  transform: translate(0%, 0%);
  transition: 0.3s;
}

.fv__news-controls {
  display: flex;
  flex-direction: column;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.fv__news-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s ease;
}
.fv__news-btn:first-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.fv__news-btn:hover {
  opacity: 1;
}

.fv__photo-inner {
  position: relative;
}
@media screen and (min-width: 768px) {
  .fv__photo-inner {
    padding-bottom: 8.75rem;
  }
}

.fv__photo01 {
  margin-top: 2.375rem;
  width: 12.5rem;
}
@media screen and (min-width: 768px) {
  .fv__photo01 {
    width: 15.625rem;
    position: absolute;
    left: 1.6875rem;
    bottom: 0rem;
  }
}
.fv__photo01 img {
  aspect-ratio: 1/1;
  object-fit: cover;
}

.top-where {
  padding-top: 5.25rem;
}
@media screen and (min-width: 768px) {
  .top-where {
    padding-top: 8.75rem;
    padding-bottom: 10.0625rem;
  }
}

.top-where__inner {
  position: relative;
}

.top-where__heading-group {
  background-color: #191E1E;
  color: #fff;
  padding: 1.875rem 1rem;
  margin-inline: -20px;
}
@media screen and (min-width: 376px) {
  .top-where__heading-group {
    margin-inline: 0;
    max-width: 28.75rem;
  }
}
@media screen and (min-width: 768px) {
  .top-where__heading-group {
    padding: 1.875rem 1.5rem;
    max-width: fit-content;
    margin-inline: auto;
  }
}

.top-where__title {
  font-family: "Shippori Mincho", sans-serif;
  font-size: 1.625rem;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-weight: 400;
  text-align: center;
  word-break: keep-all;
}
@media screen and (min-width: 768px) {
  .top-where__title {
    font-size: 3.5rem;
  }
}

.top-where__lead-group {
  margin-top: 3.75rem;
  font-size: 0.9375rem;
  line-height: 1.8;
  letter-spacing: 0.1em;
  font-weight: 400;
  background-color: #191E1E;
  color: #fff;
  padding: 1.875rem 1.5rem;
  margin-inline: -20px;
}
@media screen and (min-width: 376px) {
  .top-where__lead-group {
    margin-inline: 0;
    max-width: 28.75rem;
  }
}
@media screen and (min-width: 768px) {
  .top-where__lead-group {
    margin-top: 6.25rem;
    text-align: center;
    max-width: fit-content;
    margin-inline: auto;
  }
}

.top-where__lead-text--emphasis {
  font-size: 1.5625rem;
  line-height: 1.5;
  letter-spacing: 0.03em;
  font-weight: 500;
  font-family: "Shippori Mincho", sans-serif;
  margin-top: 0.625rem;
  word-break: keep-all;
}
@media screen and (min-width: 768px) {
  .top-where__lead-text--emphasis {
    margin-top: 1.25rem;
    font-size: 2.25rem;
  }
}

.top-where__image01 {
  margin-top: 4.375rem;
  width: 68.6567164179%;
  margin-left: auto;
}
@media screen and (min-width: 768px) {
  .top-where__image01 {
    position: absolute;
    width: 15.75rem;
    margin-left: initial;
    margin-top: initial;
    top: -16.25rem;
    right: 25px;
  }
}
@media screen and (min-width: 1150px) {
  .top-where__image01 {
    top: 0;
  }
}

.top-where__image02 {
  margin-top: 5rem;
  width: 68.6567164179%;
}
@media screen and (min-width: 768px) {
  .top-where__image02 {
    position: absolute;
    bottom: -10rem;
    left: 25px;
    width: 15.75rem;
    margin-left: initial;
    margin-top: initial;
  }
}
@media screen and (min-width: 1150px) {
  .top-where__image02 {
    bottom: 19.1875rem;
  }
}

@media screen and (min-width: 768px) {
  .top-where__figure.parallax-image-wrap {
    height: auto;
    overflow: visible;
  }
}
@media screen and (min-width: 768px) {
  .top-where__figure .parallax-image {
    position: static;
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    object-fit: cover;
    display: block;
  }
}

.top-where__description-group {
  margin-top: 4.375rem;
  background-color: #191E1E;
  color: #fff;
  padding: 1.875rem 1.5rem;
  margin-inline: -20px;
}
@media screen and (min-width: 376px) {
  .top-where__description-group {
    margin-inline: 0;
    max-width: 28.75rem;
  }
}
@media screen and (min-width: 768px) {
  .top-where__description-group {
    max-width: fit-content;
    margin-inline: auto;
  }
}

.top-where__description-text {
  font-size: 0.9375rem;
  line-height: 2.2;
  letter-spacing: 0.1em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .top-where__description-text {
    font-size: 0.9375rem;
    line-height: 3.4;
    text-align: center;
  }
}

.top-where__description-text--bottom {
  margin-top: 3.4em;
}

.top-where__button-group {
  width: 14.375rem;
  margin-top: 2.5rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .top-where__button-group {
    margin-top: 6.25rem;
    width: 15.625rem;
  }
}

.top-where__button {
  padding: 0.5rem 1.25rem;
  background-color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border-radius: 6.25rem;
}

.top-where__button-text {
  color: #1A1A1A;
  font-size: 0.8125rem;
  line-height: 1.5384615385;
  letter-spacing: 0em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}

.top-where__button-arrow {
  display: inline-block;
  padding: 0.25rem;
  background-color: #1A1A1A;
  border-radius: 0.25rem;
  width: 1.214375rem;
  height: 1.125rem;
}

.top-where__button-icon {
  display: flex;
  position: relative;
}

.top-where__button-icon img:nth-of-type(1) {
  display: none;
}
@media screen and (min-width: 768px) {
  .top-where__button-icon img:nth-of-type(1) {
    display: block;
    position: absolute;
    top: 50%;
    transform: translate(-140%, -50%);
    transition: 0.3s;
  }
}

@media screen and (min-width: 768px) {
  .top-where__button-icon img:nth-of-type(2) {
    display: block;
    transition: 0.3s;
  }
}

.top-where__button:hover .top-where__button-icon img:nth-of-type(1) {
  transform: translate(0%, -50%);
  transition: 0.3s;
}
.top-where__button:hover .top-where__button-icon img:nth-of-type(2) {
  transform: translate(140%, 0%);
  transition: 0.3s;
}

.top-where__button-arrow {
  display: inline-block;
  padding: 0.25rem;
  background-color: #1A1A1A;
  border-radius: 0.25rem;
  width: 1.214375rem;
  height: 1.125rem;
}

.top-where__button-icon {
  display: flex;
  position: relative;
}

.top-business {
  padding-top: 7.1875rem;
  background-color: #191E1E;
}
@media screen and (min-width: 768px) {
  .top-business {
    padding-top: 6.8125rem;
    margin-bottom: 9.375rem;
  }
}

.top-business__inner {
  margin-inline: auto;
  padding: 0 10px;
}
@media screen and (min-width: 768px) {
  .top-business__inner {
    margin-inline: initial;
    background-color: #191E1E;
    padding: 0rem 5.6875rem 0 0;
  }
}

.top-business__header-side {
  display: none;
}
@media screen and (min-width: 768px) {
  .top-business__header-side {
    display: block;
  }
}

.top-business__header-link {
  color: #ffffff;
}

.top-business__header-button-icon {
  overflow: hidden;
  background-color: #fff;
  width: 1.42875rem;
  height: 1.3125rem;
  border-radius: 0.25rem;
}

.top-business__link-text {
  color: #ffffff;
}

.top-business__header {
  padding: 0 10px;
}
@media screen and (min-width: 768px) {
  .top-business__header {
    padding-left: 2.5rem;
    padding-right: 0;
    max-width: 69.375rem;
  }
}

.top-business__visual {
  margin-top: 10.6666666667vw;
  margin-inline: -2.6666666667vw;
  position: relative;
  margin-bottom: 29.3333333333vw;
}
@media screen and (min-width: 768px) {
  .top-business__visual {
    margin-bottom: initial;
    margin-top: 2.7777777778vw;
    margin-inline: initial;
  }
}

.top-business__visual__bg {
  position: absolute;
  width: 71.7333333333vw;
  height: 133.0666666667vw;
  bottom: -16vw;
  left: 52.8%;
  transform: translate(-50%);
}
@media screen and (min-width: 768px) {
  .top-business__visual__bg {
    left: 0;
    right: 0;
    width: 100%;
    transform: none;
    height: 100%;
    bottom: 5.6944444444vw;
  }
}

.top-business__visual-list {
  position: relative;
  min-height: 69.3333333333vw;
  margin: 0;
  padding: 8vw 4.8vw;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4.8vw;
  padding-left: 20%;
}
@media screen and (min-width: 768px) {
  .top-business__visual-list {
    min-height: 25.3472222222vw;
    padding: 2.7777777778vw 0 2.7777777778vw 9vw;
    gap: 2.6388888889vw;
  }
}

.top-business__visual-list.pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .top-business__visual-list.pc {
    display: flex;
  }
}

.top-business__visual-item {
  --circle-size: 26.6666666667vw;
  --active-size: 32vw;
  position: relative;
  isolation: isolate;
  z-index: 1;
  width: var(--circle-size);
  flex: 0 0 var(--circle-size);
  aspect-ratio: 1/1;
  transition: width 0.45s ease, flex-basis 0.45s ease, z-index 0s linear 0.45s;
}
@media screen and (min-width: 768px) {
  .top-business__visual-item {
    --circle-size: 9.1701388889vw;
    --active-size: 16.875vw;
  }
}
.top-business__visual-item::before, .top-business__visual-item::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  opacity: 0;
  transform: scale(0.9);
}
.top-business__visual-item::before {
  inset: -3.7333333333vw;
  z-index: -1;
  background-color: rgba(255, 255, 255, 0.5);
}
@media screen and (min-width: 768px) {
  .top-business__visual-item::before {
    inset: -0.9722222222vw;
  }
}
.top-business__visual-item::after {
  inset: -7.4666666667vw;
  z-index: -2;
  background-color: rgba(255, 255, 255, 0.1);
}
@media screen and (min-width: 768px) {
  .top-business__visual-item::after {
    inset: -1.9444444444vw;
  }
}
.top-business__visual-item.is-active, .top-business__visual-item:focus-within {
  z-index: 3;
  width: var(--active-size);
  flex-basis: var(--active-size);
  transition: width 0.45s ease, flex-basis 0.45s ease;
}
.top-business__visual-item.is-active::before, .top-business__visual-item.is-active::after, .top-business__visual-item:focus-within::before, .top-business__visual-item:focus-within::after {
  animation: top-business-ring 2.4s ease-in-out infinite;
}
.top-business__visual-item.is-active::after, .top-business__visual-item:focus-within::after {
  animation-delay: 0.28s;
}
.top-business__visual-item.is-active .top-business__visual-link, .top-business__visual-item:focus-within .top-business__visual-link {
  gap: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .top-business__visual-item.is-active .top-business__visual-link, .top-business__visual-item:focus-within .top-business__visual-link {
    gap: 0.6944444444vw;
  }
}
.top-business__visual-item.is-active .top-business__visual-logo, .top-business__visual-item:focus-within .top-business__visual-logo {
  width: 68%;
}
.top-business__visual-item.is-active .top-business__visual-text, .top-business__visual-item:focus-within .top-business__visual-text {
  max-height: 21.3333333333vw;
  opacity: 1;
  transform: translateY(0);
}
@media screen and (min-width: 768px) {
  .top-business__visual-item.is-active .top-business__visual-text, .top-business__visual-item:focus-within .top-business__visual-text {
    max-height: 5.5555555556vw;
  }
}

@media screen and (max-width: 768px) {
  .top-business__visual-sp-item--01 {
    padding-left: 5.8666666667vw;
  }
}

@media screen and (max-width: 768px) {
  .top-business__visual-sp-item--02 {
    padding-left: 3.4666666667vw;
    margin-top: 8.5333333333vw;
  }
}

@media screen and (min-width: 768px) {
  .top-business__visual-item--03 {
    margin-top: -2.7777777778vw;
  }
}

@media screen and (min-width: 768px) {
  .top-business__visual-item--04 {
    margin-top: -5.2083333333vw;
  }
}

@keyframes top-business-ring {
  0% {
    opacity: 0;
    transform: scale(0.9);
  }
  18% {
    opacity: 1;
    transform: scale(1);
  }
  52% {
    opacity: 1;
    transform: scale(1);
  }
  78%, 100% {
    opacity: 0;
    transform: scale(1.04);
  }
}
.top-business__visual-link {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  gap: 1.6vw;
  padding: 3.7333333333vw;
  border-radius: 50%;
  background-color: #ffffff;
  color: #1A1A1A;
  cursor: default;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .top-business__visual-link {
    gap: 0.4166666667vw;
    padding: 0.9722222222vw;
  }
}

.top-business__visual-number {
  font-size: 3.7333333333vw;
  line-height: 1;
  letter-spacing: 0;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}
@media screen and (min-width: 768px) {
  .top-business__visual-number {
    font-size: 1.1111111111vw;
  }
}

.top-business__visual-logo {
  display: block;
  width: 70%;
  transition: width 0.45s ease;
}
.top-business__visual-logo img {
  width: 100%;
  height: auto;
}

.top-business__visual-text {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(2.1333333333vw);
  transition: max-height 0.45s ease, opacity 0.35s ease, transform 0.45s ease;
  font-size: 1.6666666667vw;
  line-height: 1.3;
  font-weight: 500;
  font-family: "Shippori Mincho", sans-serif;
}
@media screen and (min-width: 768px) {
  .top-business__visual-text {
    transform: translateY(0.5555555556vw);
    font-size: 1.3888888889vw;
    line-height: 1.5;
    letter-spacing: 0.1em;
  }
}

.top-business__visual-sp-list {
  margin: 6.6666666667vw 0 0;
  padding: 0 5.3333333333vw 5.3333333333vw;
  list-style: none;
}

.top-business__visual-sp-item {
  display: flex;
  align-items: center;
  column-gap: 7.4666666667vw;
  position: relative;
  z-index: 1;
  cursor: pointer;
  transition: grid-template-columns 0.45s ease, margin-left 0.45s ease;
}

.top-business__visual-sp-item--01 {
  padding-left: 5.8666666667vw;
}

.top-business__visual-sp-item--02 {
  padding-left: 3.4666666667vw;
  margin-top: 8.5333333333vw;
}

.top-business__visual-sp-item--03 {
  padding-left: 12vw;
  margin-top: 8.5333333333vw;
}

.top-business__visual-sp-item--04 {
  padding-left: 19.4666666667vw;
  margin-top: 2.6666666667vw;
}

.top-business__visual-sp-circle {
  width: 26.6666666667vw;
  position: relative;
  isolation: isolate;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0.5333333333vw 1.8666666667vw rgba(0, 0, 0, 0.25);
  transition: width 0.45s ease, box-shadow 0.45s ease;
}
.top-business__visual-sp-circle img {
  width: 70%;
  height: auto;
  transition: width 0.45s ease;
}
.top-business__visual-sp-circle::before, .top-business__visual-sp-circle::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  opacity: 0;
  transform: scale(0.9);
  pointer-events: none;
}
.top-business__visual-sp-circle::before {
  inset: -2.9333333333vw;
  z-index: -1;
  background-color: rgba(255, 255, 255, 0.55);
}
.top-business__visual-sp-circle::after {
  inset: -6.4vw;
  z-index: -2;
  background-color: rgba(255, 255, 255, 0.12);
}

.top-business__visual-sp-item.is-active {
  grid-template-columns: 56vw minmax(0, 1fr);
}
.top-business__visual-sp-item.is-active .top-business__visual-sp-circle {
  width: 32vw;
  box-shadow: none;
}
.top-business__visual-sp-item.is-active .top-business__visual-sp-circle::before, .top-business__visual-sp-item.is-active .top-business__visual-sp-circle::after {
  animation: top-business-ring 2.4s ease-in-out infinite;
}
.top-business__visual-sp-item.is-active .top-business__visual-sp-circle::after {
  animation-delay: 0.28s;
}
.top-business__visual-sp-item.is-active .top-business__visual-sp-circle img {
  width: 68%;
}

.top-business__visual-sp-content {
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.top-business__visual-sp-number {
  font-family: "Jost", sans-serif;
  font-size: 4.2666666667vw;
  line-height: 1;
  font-weight: 400;
}

.top-business__visual-sp-label {
  margin-top: 1.3333333333vw;
  color: #C2BB9E;
  font-family: "Jost", sans-serif;
  font-size: 2.6666666667vw;
  line-height: 1;
  font-weight: 500;
}

.top-business__visual-sp-title {
  margin-top: 1.3333333333vw;
  font-family: "Shippori Mincho", sans-serif;
  font-size: 3.7333333333vw;
  line-height: 1;
  letter-spacing: 0em;
  font-weight: 500;
}

.top-business__nav {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-business__nav {
    padding: 1rem 2.5rem;
  }
}

.top-business__nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 0.25rem;
  color: #ffffff;
  background: transparent;
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s;
}
.top-business__nav-btn:hover {
  border-color: #ffffff;
}
.top-business__nav-btn:disabled {
  opacity: 0.3;
  cursor: default;
}

.top-business__nav-counter {
  font-size: 0.75rem;
  line-height: 1.6666666667;
  letter-spacing: 0.05em;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  font-family: "Jost", sans-serif;
  min-width: 3rem;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .top-business__list {
    margin-top: 2.5rem;
  }
}

.top-business__detail {
  display: none;
  padding: 1.875rem 1.25rem;
}
@media screen and (min-width: 1000px) {
  .top-business__detail {
    padding: 3.125rem 2.5rem 3.125rem 5rem;
  }
}
.top-business__detail.is-active {
  display: block;
  background-color: #303535;
}
.top-business__detail.is-active .top-business__detail-link {
  background-color: #1A1A1A;
}

@media screen and (min-width: 768px) {
  .top-business__detail-inner {
    display: grid;
    grid-template-columns: 900fr 200fr;
    gap: 2.4375rem;
  }
}

.top-business__detail-content {
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #464a4a;
  margin-bottom: 1.875rem;
}
@media screen and (min-width: 768px) {
  .top-business__detail-content {
    border-bottom: initial;
    padding-bottom: initial;
    margin-bottom: initial;
    padding-right: 3.125rem;
    border-right: 1px solid #464a4a;
  }
}

.top-business__detail-label {
  color: #c2bb9e;
  font-size: 0.75rem;
  line-height: 1.6666666667;
  letter-spacing: 0em;
  font-weight: 500;
  font-family: "Jost", sans-serif;
}
@media screen and (min-width: 768px) {
  .top-business__detail-label {
    font-size: 0.9375rem;
    line-height: 2;
  }
}

.top-business__detail-title {
  font-size: 1.375rem;
  line-height: 1.7272727273;
  letter-spacing: 0.1em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .top-business__detail-title {
    font-size: 1.875rem;
    line-height: 1.2666666667;
  }
}

.top-business__detail-text {
  margin-top: 1.875rem;
  font-size: 0.875rem;
  line-height: 1.8571428571;
  letter-spacing: 0.07em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .top-business__detail-text {
    margin-top: 1.25rem;
    font-size: 0.9375rem;
    line-height: 1.7333333333;
  }
}

.top-business__detail-button {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .top-business__detail-button {
    margin-top: 1.25rem;
  }
}

.top-business__detail-link {
  background-color: #303535;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.25rem;
  padding: 0.9375rem 0rem;
}

.top-business__detail-link-text {
  color: #ffffff;
}

.top-business__detail-icon {
  background-color: #fff;
  width: 0.946875rem;
  height: 0.946875rem;
  border-radius: 0.25rem;
}

.top-business__voice {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 1.25rem;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .top-business__voice {
    flex-direction: column;
  }
}

.top-business__voice-profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
  flex-basis: 50.4761904762%;
}
@media screen and (min-width: 768px) {
  .top-business__voice-profile {
    margin-top: 1rem;
  }
}

.top-business__voice-image {
  width: 3.75rem;
  border-radius: 50%;
  height: 3.75rem;
}
@media screen and (min-width: 768px) {
  .top-business__voice-image {
    width: 5rem;
    height: 5rem;
  }
}

.top-business__voice-photo {
  border-radius: 50%;
  height: 100%;
  object-fit: cover;
}

.top-business__voice-info {
  color: #ffffff;
}

.top-business__voice-name {
  font-size: 1rem;
  line-height: 1.1875;
  letter-spacing: 0.05em;
  font-weight: 400;
}

.top-business__voice-position {
  font-size: 0.75rem;
  line-height: 1.4166666667;
  letter-spacing: 0.05em;
  font-weight: 500;
  margin-top: 0.3125rem;
}

.top-business__voice-content {
  flex-basis: 43.1746031746%;
}

.top-business__voice-title {
  font-size: 2rem;
  line-height: 0.9;
  letter-spacing: 0em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
  color: #2EE5C4;
}
@media screen and (min-width: 768px) {
  .top-business__voice-title {
    white-space: nowrap;
    font-size: 1.875rem;
    line-height: 1.5;
    letter-spacing: 0em;
    font-weight: 400;
  }
}

.top-business__voice-link {
  margin-top: 2.1875rem;
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-business__voice-link {
    margin-top: 0rem;
  }
}

.top-business__voice-link-text {
  color: #2EE5C4;
}
@media screen and (min-width: 768px) {
  .top-business__voice-link-text {
    font-size: 1rem;
    line-height: 1.1;
    letter-spacing: 0.03em;
    font-weight: 500;
  }
}

.top-business__button-icon {
  background-color: #2EE5C4;
  width: 0.946875rem;
  height: 0.946875rem;
  border-radius: 0.25rem;
}

.top-people {
  padding: 2.75rem 0rem 3.75rem;
  background-color: #191E1E;
  transition: 0.3s;
}
@media screen and (min-width: 768px) {
  .top-people {
    padding: 0;
  }
}

body.bg-brightness .top-people {
  background-color: #dae1e7;
  transition: 0.3s;
}

.top-people__inner {
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .top-people__inner {
    margin-inline: initial;
    display: grid;
    grid-template-columns: max(91px, 6.3194444444vw) 1fr;
  }
}

.top-people__header-side {
  display: none;
}
@media screen and (min-width: 768px) {
  .top-people__header-side {
    display: block;
    padding-top: 6.25rem;
    border-right: 1px solid #464a4a;
  }
}

.top-people__header-ja {
  color: #1A1A1A;
}

.top-people__header-button-icon {
  overflow: hidden;
  background-color: #1a1a1a;
  width: 1.42875rem;
  height: 1.3125rem;
  border-radius: 0.25rem;
}

.top-people__link-text {
  color: #1A1A1A;
}

.top-people__header {
  padding: 0rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-people__header {
    border-bottom: 1px solid #464a4a;
    padding: 0rem 0 0 2.5rem;
    max-width: none;
  }
}

@media screen and (min-width: 768px) {
  .top-people__header-inner {
    border-right: 1px solid #464a4a;
    padding: 6.25rem 0 2.5rem;
    margin-right: max(89px, 6.1805555556vw);
  }
}
@media screen and (min-width: 1100px) {
  .top-people__header-inner {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 2.5rem;
  }
}

.top-people__header-title {
  color: #1A1A1A;
  font-size: 18.6666666667vw;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .top-people__header-title {
    font-size: 7.5rem;
    white-space: normal;
  }
}

.top-people__header-description {
  color: #1A1A1A;
}
@media screen and (min-width: 768px) {
  .top-people__header-description {
    max-width: 44.0625rem;
  }
}

.top-people__header-button {
  background-color: #1A1A1A;
  color: #ffffff;
}

@media screen and (min-width: 768px) {
  .top-people__body {
    padding-bottom: 6.5rem;
    border-right: 1px solid #464a4a;
    margin-right: max(89px, 6.1805555556vw);
  }
}

/* カード部分は people-card__* 共通コンポーネントを使用 */
.top-people__body .people-card__list {
  margin-top: 2.5rem;
  border-top: 1px solid #464a4a;
}
@media screen and (min-width: 768px) {
  .top-people__body .people-card__list {
    margin-top: initial;
    border-top: initial;
  }
}
@media screen and (min-width: 1400px) {
  .top-people__body .people-card__list {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* トップページ4カラム時のボーダー調整 */
@media screen and (min-width: 1400px) {
  .top-people__body .people-card__item:nth-of-type(3n) {
    border-right: 1px solid #464a4a;
  }
  .top-people__body .people-card__item:nth-of-type(4n) {
    border-right: none;
  }
}

/* トップページのみフォントサイズ変更（アーカイブは変更なし） */
@media screen and (min-width: 768px) {
  .top-people .people-card__text {
    font-size: 1rem;
    line-height: 1.875;
  }
}

@media screen and (min-width: 768px) {
  .top-people .people-card__name {
    font-size: 1rem;
    line-height: 1.3125;
  }
}

/* 黒背景時はテキストを白に */
.top-people .people-card__text,
.top-people .people-card__info,
.top-people .people-card__department,
.top-people .people-card__name,
.top-people .people-card__year {
  color: #ffffff;
}

.top-people .people-card__year {
  border-color: #ffffff;
}

/* bg-brightness（明るい背景）時は黒に戻す */
body.bg-brightness .top-people .people-card__text,
body.bg-brightness .top-people .people-card__info,
body.bg-brightness .top-people .people-card__department,
body.bg-brightness .top-people .people-card__name,
body.bg-brightness .top-people .people-card__year {
  color: #1A1A1A;
}

body.bg-brightness .top-people .people-card__year {
  border-color: #1A1A1A;
}

/* bg-brightness 時もホバー時はテキストを明るい色に戻す */
body.bg-brightness .top-people .people-card__item-link:hover .people-card__text,
body.bg-brightness .top-people .people-card__item-link:hover .people-card__department,
body.bg-brightness .top-people .people-card__item-link:hover .people-card__name,
body.bg-brightness .top-people .people-card__item-link:hover .people-card__year {
  color: #dae1e7;
}

body.bg-brightness .top-people .people-card__item-link:hover .people-card__year {
  border-color: #dae1e7;
}

/* トップページのみ、入社年度を名前の下に配置（4カラム時の折れ対策） */
@media screen and (min-width: 768px) {
  .top-people .people-card__meta {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .top-people .people-card__info {
    margin-right: 0;
  }
}

@media screen and (min-width: 768px) {
  .top-people .people-card__bottom {
    flex: initial;
    margin-top: 1.25rem;
  }
}

.top-environment {
  padding: 6.25rem 0rem;
}

.top-environment__inner {
  padding: 0rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-environment__inner {
    padding: 0rem 5.6875rem 0 0;
  }
}

.top-environment__header-side {
  display: none;
}
@media screen and (min-width: 768px) {
  .top-environment__header-side {
    display: block;
  }
}

.top-environment__header-ja {
  color: #ffffff;
}

@media screen and (min-width: 768px) {
  .top-environment__header-button-icon {
    width: 1.42875rem;
    height: 1.3125rem;
  }
}

.top-environment__link-text {
  color: #ffffff;
}

.top-environment__content {
  margin-top: 5rem;
}
@media screen and (min-width: 1100px) {
  .top-environment__content {
    margin-top: 7.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}

@media screen and (min-width: 768px) {
  .top-environment__media {
    width: 100%;
  }
}
@media screen and (min-width: 1100px) {
  .top-environment__media {
    width: 49.2845786963%;
  }
}
.top-environment__media img {
  aspect-ratio: 335/300;
  object-fit: cover;
}
@media screen and (min-width: 768px) {
  .top-environment__media img {
    aspect-ratio: 620/500;
  }
}

.top-environment__list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  align-items: flex-start;
  margin-top: 4.0625rem;
}
@media screen and (min-width: 768px) {
  .top-environment__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 1100px) {
  .top-environment__list {
    display: flex;
    width: 40.1111993646%;
    margin-top: initial;
  }
}

.top-environment__link {
  padding-left: 1.75rem;
  border-left: 2px solid #dae1e7;
  display: flex;
  gap: 1rem;
  align-items: flex-end;
}
@media screen and (min-width: 768px) {
  .top-environment__link {
    padding: 0.625rem 1.75rem;
    gap: 2.5rem;
  }
}

.top-environment__item-label {
  color: #C2BB9E;
  font-size: 0.9375rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 500;
  font-family: "Jost", sans-serif;
}

.top-environment__item-title {
  font-size: 1.125rem;
  line-height: 1.6666666667;
  letter-spacing: 0em;
  font-weight: 500;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .top-environment__item-title {
    font-size: 1.5rem;
    line-height: 1.25;
    letter-spacing: 0.1em;
  }
}

.top-environment__button-arrow {
  margin-bottom: 0.25rem;
}

.top-environment__button-icon {
  background-color: #dae1e7;
  border-radius: 0.1875rem;
}

.top-recruit__visual-wrap {
  padding: 0;
  max-width: none;
}
@media screen and (min-width: 768px) {
  .top-recruit__visual-wrap {
    padding-inline: 1.5625rem;
    max-width: 81.875rem;
  }
}

.top-recruit__visual {
  position: relative;
  width: 100%;
  aspect-ratio: 75/46;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .top-recruit__visual {
    height: 32.5rem;
    aspect-ratio: auto;
  }
}

.top-recruit__image {
  object-fit: cover;
  height: 120%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.top-recruit__title {
  font-size: 18.6666666667vw;
  line-height: 0.6;
  letter-spacing: -0.04em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
  text-align: center;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .top-recruit__title {
    font-size: 7.5rem;
    white-space: normal;
  }
}

.top-recruit__subtitle {
  margin-top: 1.875rem;
  font-size: 1.5rem;
  line-height: 1.1;
  letter-spacing: 0.1em;
  font-weight: 500;
  font-family: "Shippori Mincho", sans-serif;
  text-align: center;
}

.top-recruit__content {
  margin-top: -3.3125rem;
  padding: 0rem 0.625rem;
  border-radius: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .top-recruit__content {
    margin-top: -14.6875rem;
    max-width: 70.625rem;
    padding: 0rem 1.5625rem;
    margin-inline: auto;
  }
}

.top-recruit__inner {
  background-color: rgba(26, 26, 26, 0.55);
  backdrop-filter: blur(15px);
  padding: 6.25rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-recruit__inner {
    padding: 6.25rem 6.84375rem;
  }
}

.top-recruit__lead {
  margin-top: 3.75rem;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0.06em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .top-recruit__lead {
    font-size: 0.9375rem;
    text-align: center;
  }
}

.top-recruit__nav {
  margin-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .top-recruit__nav {
    display: flex;
    align-items: center;
    max-width: 41.4375rem;
    width: 100%;
    margin-inline: auto;
  }
}

.top-recruit__nav-item {
  padding: 0.9375rem 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .top-recruit__nav-item {
    padding: 2.5rem 1.8125rem;
    flex-direction: column;
  }
}

.top-recruit__nav-item--flow {
  color: #888166;
}
.top-recruit__nav-item--flow .top-recruit__nav-title::before {
  background-color: #888166;
}

.top-recruit__nav-title {
  font-size: 1.5625rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 500;
  font-family: "Jost", sans-serif;
  display: flex;
  gap: 0.3125rem;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .top-recruit__nav-title {
    font-size: 2.5rem;
    line-height: 1.2;
  }
}
.top-recruit__nav-title::before {
  content: "";
  display: block;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
}
@media screen and (min-width: 768px) {
  .top-recruit__nav-title::before {
    content: none;
  }
}

.top-recruit__nav-text {
  font-size: 0.9375rem;
  line-height: 1.2666666667;
  letter-spacing: 0.1em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .top-recruit__nav-text {
    font-size: 0.9375rem;
    line-height: 2.6666666667;
  }
}

.top-recruit__nav-item--interview {
  color: #7f8d9b;
  border-block: 0.8px solid #464a4a;
}
@media screen and (min-width: 768px) {
  .top-recruit__nav-item--interview {
    border-block: none;
    border-inline: 0.8px solid #464a4a;
  }
}
.top-recruit__nav-item--interview .top-recruit__nav-title::before {
  background-color: #7f8d9b;
}

.top-recruit__nav-item--positions {
  color: #7d6346;
}
.top-recruit__nav-item--positions .top-recruit__nav-title::before {
  background-color: #7d6346;
}

.top-recruit__cta {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .top-recruit__cta {
    margin-top: 1.25rem;
  }
}

.top-recruit__button {
  padding: 1.875rem 2.5rem;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  border-radius: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .top-recruit__button {
    padding: 2.1875rem 5rem;
    width: 100%;
  }
}

.top-recruit__button-text {
  font-size: 1.125rem;
  line-height: 1.1111111111;
  letter-spacing: 0.03em;
  font-weight: 400;
  color: #1A1A1A;
}

.top-recruit__button-icon {
  background-color: #1A1A1A;
  border-radius: 0.1875rem;
}

.top-movie {
  padding-bottom: 6.25rem;
}
@media screen and (min-width: 768px) {
  .top-movie {
    padding-bottom: 8.4375rem;
  }
}

.top-movie__inner {
  padding: 0rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .top-movie__inner {
    padding: 0rem 5.6875rem 0 0;
  }
}

.top-movie__header-side {
  display: none;
}
@media screen and (min-width: 768px) {
  .top-movie__header-side {
    display: block;
  }
}

.top-movie__header-ja {
  color: #ffffff;
}

@media screen and (min-width: 768px) {
  .top-movie__header-button-icon {
    width: 1.42875rem;
    height: 1.3125rem;
  }
}

.top-movie__link-text {
  color: #ffffff;
}

.top-movie__header-title {
  font-size: 3.125rem;
  line-height: 1;
  letter-spacing: -0.04em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .top-movie__header-title {
    font-size: 4.375rem;
    line-height: 1.1571428571;
    flex-shrink: 0;
  }
}

@media screen and (min-width: 768px) {
  .top-movie__header-description {
    width: 100%;
    font-size: 0.8125rem;
    line-height: 1.5;
    letter-spacing: 0.1em;
    font-weight: 300;
  }
}

.top-movie__content {
  margin-top: 4.375rem;
}
@media screen and (min-width: 768px) {
  .top-movie__content {
    margin-top: 10rem;
  }
}

.top-movie__media {
  position: relative;
  aspect-ratio: 335/223;
}
@media screen and (min-width: 768px) {
  .top-movie__media {
    max-width: 47.25rem;
    width: 100%;
    margin-inline: auto;
    aspect-ratio: 756/504;
  }
}

.top-movie__video-iframe {
  width: 100%;
  height: 100%;
  display: block;
}

.top-movie__media-shield {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  z-index: 1;
}
.top-movie__media-shield.is-playing {
  pointer-events: none;
}

.test {
  font-size: 1.25rem;
}
@media screen and (min-width: 768px) {
  .test {
    font-size: 2.5rem;
  }
}

.sub-recruitment__section {
  padding-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__section {
    padding-top: 7.5rem;
  }
}

.sub-recruitment__interview-grid {
  display: grid;
  gap: 2.5rem;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__interview-grid {
    grid-template-columns: 1fr 48.3%;
    gap: 5rem;
  }
}

.sub-recruitment__interview-lead {
  margin-top: 1.875rem;
  font-size: 1.125rem;
  letter-spacing: 0.1em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__interview-lead {
    margin-top: 2.5rem;
    font-size: 1.375rem;
  }
}

.sub-recruitment__interview-description {
  margin-top: 1.25rem;
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0.1em;
  font-weight: 500;
}

.sub-recruitment__interview-action {
  margin-top: 1.875rem;
  width: 17.375rem;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__interview-action {
    margin-top: 2.5rem;
  }
}

.sub-recruitment__interview-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem;
  background: #191E1E;
  color: #ffffff;
  border-radius: 0.1875rem;
}

.sub-recruitment__interview-button-text {
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0em;
  font-weight: 400;
}

.sub-recruitment__interview-button-icon {
  width: 1.1875rem;
  height: 1.125rem;
  border-radius: 0.1875rem;
}

.sub-recruitment__interview-button-icon img:nth-of-type(1),
.sub-recruitment__interview-button-icon img:nth-of-type(2) {
  width: 60%;
}

.sub-recruitment__interview-image {
  width: 100%;
  aspect-ratio: 335/226;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__interview-image {
    aspect-ratio: 5/4;
  }
}

.sub-recruitment__interview-image img,
.sub-recruitment__interview-sub-image img {
  height: 100%;
  object-fit: cover;
}

.sub-recruitment__entry-content {
  display: grid;
  gap: 1.875rem;
  border-radius: 0.3125rem;
  background: #191E1E;
  margin-top: 2.5rem;
  padding: 1.875rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-content {
    padding: 5rem 2.5rem;
    border-radius: 0.625rem;
  }
}
@media screen and (min-width: 1024px) {
  .sub-recruitment__entry-content {
    padding: 6.25rem 3.75rem;
  }
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-content {
    align-items: center;
    grid-template-columns: 1fr 1fr;
    gap: clamp(30px, -30 * (100vw - 1440px) / -672 + 60px, 60px);
  }
}

.sub-recruitment__entry-top {
  color: #ffffff;
}

.sub-recruitment__entry-label {
  font-family: "Jost", sans-serif;
  font-size: 3.75rem;
  font-weight: 400;
}

.sub-recruitment__entry-text {
  margin-top: 1.875rem;
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0.1em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-text {
    font-size: 0.9375rem;
  }
}

.sub-recruitment__entry-list {
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-list {
    gap: 1.25rem;
  }
}

.sub-recruitment__entry-link {
  border-radius: 0.1875rem;
  background: #ffffff;
  padding: 0.625rem 1.25rem 0.625rem 0.625rem;
  display: grid;
  grid-template-columns: 38% max-content;
  justify-content: space-between;
  align-items: center;
  gap: 0.9375rem;
  color: #1A1A1A;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-link {
    grid-template-columns: 35% max-content;
    padding-right: 2.5rem;
    min-height: 5rem;
  }
}

.sub-recruitment__entry-image {
  width: 100%;
  aspect-ratio: 5/4;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-image {
    aspect-ratio: 13/8;
  }
}
.sub-recruitment__entry-image img {
  height: 100%;
  object-fit: cover;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-image img {
    object-position: center top;
  }
}

.sub-recruitment__entry-link-body {
  display: flex;
  align-items: center;
  gap: 1.875rem;
}

.sub-recruitment__entry-link-text {
  font-size: 1rem;
  line-height: 1.25;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__entry-link-text {
    font-size: 1.25rem;
    line-height: 1;
  }
}

.sub-recruitment__entry-link-icon {
  width: 1.125rem;
  aspect-ratio: 1/1;
  background-color: #191E1E;
  border-radius: 0.1875rem;
}

.sub-recruitment__flow-content {
  color: #191E1E;
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: 1.875rem minmax(0, 1fr);
  column-gap: 0.1875rem;
  align-items: start;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-content {
    margin-top: 2.5rem;
    grid-template-columns: 6.125rem minmax(0, 1fr);
    column-gap: 0.625rem;
    max-width: 53.5rem;
    margin-left: auto;
  }
}

.sub-recruitment__flow-duration {
  min-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #F2EFEC;
  clip-path: polygon(50% 0, 100% 0.625rem, 100% calc(100% - 0.625rem), 50% 100%, 0 calc(100% - 0.625rem), 0 0.625rem);
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-duration {
    clip-path: polygon(50% 0, 100% 1.125rem, 100% calc(100% - 1.125rem), 50% 100%, 0 calc(100% - 1.125rem), 0 1.125rem);
  }
}

.sub-recruitment__flow-duration-text {
  font-size: 0.6875rem;
  line-height: 1.4;
  letter-spacing: 0.1em;
  font-weight: 400;
  writing-mode: vertical-rl;
  text-orientation: upright;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-duration-text {
    font-size: 1.25rem;
  }
}

.sub-recruitment__flow-list {
  display: grid;
  gap: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-list {
    gap: 0.625rem;
  }
}

.sub-recruitment__flow-item {
  padding: 1.25rem;
  display: grid;
  gap: 0.375rem;
  align-items: center;
  background: #F2EFED;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-item {
    min-height: 6.25rem;
    padding: 1.875rem 2.5rem;
    grid-template-columns: 8.75rem minmax(0, 1fr);
    align-items: center;
    gap: 0;
  }
}

.sub-recruitment__flow-item:nth-child(2) {
  background: #E5E0DA;
}

.sub-recruitment__flow-item:nth-child(3) {
  background: #CBC1B5;
}

.sub-recruitment__flow-item:nth-child(4) {
  background: #A4927E;
}

.sub-recruitment__flow-item:nth-child(5) {
  background: #7D6346;
  color: #fff;
}

.sub-recruitment__flow-item-step {
  font-size: 0.625rem;
  line-height: 1;
  letter-spacing: 0em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-item-step {
    font-size: 1.0625rem;
    line-height: 1.35;
  }
}

.sub-recruitment__flow-item-title {
  font-size: 1rem;
  letter-spacing: 0em;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-item-title {
    font-size: 1.125rem;
  }
}

.sub-recruitment__flow-item-text {
  margin-top: 0.375rem;
  font-size: 0.8125rem;
  line-height: 1.6;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__flow-item-text {
    margin-top: 0;
    font-size: 0.875rem;
    line-height: 2;
    letter-spacing: 0em;
    font-weight: 400;
  }
}

.sub-recruitment-faq__list {
  margin-top: 2.5rem;
  border-top: 1px solid #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-recruitment-faq__list {
    max-width: 47.875rem;
    margin-left: auto;
  }
}

.sub-recruitment-faq__item {
  border-bottom: 1px solid #191E1E;
  overflow: hidden;
}

.sub-recruitment-faq__icon {
  font-family: "Jost", sans-serif;
  font-size: 1.625rem;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-recruitment-faq__icon {
    font-size: 3.125rem;
  }
}

.sub-recruitment-faq__icon--answer {
  color: #888166;
}

.sub-recruitment-faq__question-text {
  padding-right: 1.25rem;
}

.sub-recruitment-faq__question-text,
.sub-recruitment-faq__answer-text {
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-recruitment-faq__question-text,
  .sub-recruitment-faq__answer-text {
    font-size: 1rem;
    line-height: 2;
  }
}

.sub-recruitment-faq__question {
  padding: 0.625rem 1.25rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 1.25rem;
  align-items: center;
  position: relative;
  cursor: pointer;
  list-style: none;
  background: #ffffff;
}

.sub-recruitment-faq__question::-webkit-details-marker {
  display: none;
}

.sub-recruitment-faq__question::marker {
  content: "";
}

.sub-recruitment-faq__question::before,
.sub-recruitment-faq__question::after {
  content: "";
  width: 1rem;
  height: 1px;
  background: #000;
  position: absolute;
  top: 50%;
  right: 1.25rem;
  transform-origin: center;
  transition: transform 0.35s ease, opacity 0.25s ease;
}
@media screen and (min-width: 768px) {
  .sub-recruitment-faq__question::before,
  .sub-recruitment-faq__question::after {
    width: 1.5625rem;
  }
}

.sub-recruitment-faq__question::before {
  transform: translateY(-50%);
}

.sub-recruitment-faq__question::after {
  transform: translateY(-50%) rotate(90deg);
}

.sub-recruitment-faq__item[open] .sub-recruitment-faq__question::after {
  opacity: 0;
  transform: translateY(-50%) rotate(180deg) scaleY(0.4);
}

.sub-recruitment-faq__answer {
  padding-inline: 1.25rem;
  background: #ffffff;
}

.sub-recruitment-faq__answer-inner {
  padding-bottom: 0.625rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 1.25rem;
  align-items: center;
  transform: translateY(-0.75rem);
  transition: transform 0.45s ease;
}

.sub-recruitment-faq__item[open] .sub-recruitment-faq__answer-inner {
  transform: translateY(0);
}

@supports selector(::details-content) {
  :root {
    interpolate-size: allow-keywords;
  }
  .sub-recruitment-faq__item::details-content {
    block-size: 0;
    opacity: 0;
    transition: block-size 0.5s ease, opacity 0.35s ease, content-visibility 0.5s ease allow-discrete;
  }
  .sub-recruitment-faq__item[open]::details-content {
    block-size: auto;
    opacity: 1;
  }
}
.sub-recruitment__cta {
  margin-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-recruitment__cta {
    margin-top: 6.25rem;
  }
}

.single-people {
  color: #191E1E;
  padding-top: 1.25rem;
  padding-bottom: 3.75rem;
}
@media screen and (min-width: 768px) {
  .single-people {
    padding-top: 3.75rem;
    padding-bottom: 11.25rem;
  }
}

@media screen and (min-width: 768px) {
  .single-people__inner {
    max-width: 930px;
  }
}

.single-people__thumbnail img {
  aspect-ratio: 16/9;
  object-fit: cover;
  height: auto;
}

.single-people__intro {
  margin-top: 1.25rem;
  padding-left: 1.25rem;
  border-left: 0.25rem solid #191E1E;
}
@media screen and (min-width: 768px) {
  .single-people__intro {
    margin-top: 2.5rem;
    padding-left: 1.875rem;
    border-left: 0.375rem solid #191E1E;
  }
}

.single-people__catch {
  font-size: 1.625rem;
  font-weight: 500;
  font-family: "Shippori Mincho", sans-serif;
}
@media screen and (min-width: 768px) {
  .single-people__catch {
    font-size: 2.5rem;
  }
}

.single-people__profile {
  margin-top: 1.5625rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.625rem;
}

.single-people__profile-name {
  padding-right: 1.25rem;
  border-right: 1px solid #191E1E;
}

.single-people__name-ja {
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .single-people__name-ja {
    font-size: 1.125rem;
    line-height: 1.3888888889;
  }
}

.single-people__name-en {
  font-size: 0.625rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-weight: 400;
  font-family: "Jost", sans-serif;
}
@media screen and (min-width: 768px) {
  .single-people__name-en {
    margin-top: 0.1875rem;
    font-size: 0.75rem;
    line-height: 1.25;
  }
}

.single-people__department {
  font-size: 0.8125rem;
  line-height: 1.5384615385;
  letter-spacing: 0.05em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .single-people__department {
    font-size: 1rem;
    line-height: 1.25;
    letter-spacing: 0.05em;
    font-weight: 400;
  }
}

.single-people__year {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.1875rem 0.375rem;
  border: 0.5px solid #191E1E;
  font-size: 0.625rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  font-weight: 500;
}

.single-people__video {
  margin-top: 2.5rem;
  padding-inline: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .single-people__video {
    margin-top: 4.375rem;
    padding-inline: 1.875rem;
  }
}

.single-people__video-wrap {
  position: relative;
  aspect-ratio: 16/9;
}

.single-people__video-iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.single-people__body {
  display: flex;
  flex-direction: column;
  margin-top: 2.8125rem;
}
@media screen and (min-width: 768px) {
  .single-people__body {
    flex-direction: row;
    gap: 3.75rem;
    align-items: flex-start;
    margin-top: 6.25rem;
  }
}

.single-people__sidebar-column {
  margin-top: 3.75rem;
  order: 2;
}
@media screen and (min-width: 768px) {
  .single-people__sidebar-column {
    order: unset;
    flex: 0 0 12.5rem;
    width: 12.5rem;
    margin-top: 0;
    position: sticky;
    top: 2.5rem;
    align-self: flex-start;
  }
}

@media screen and (min-width: 768px) {
  .single-people__portrait {
    width: 12.5rem;
    height: 12.5rem;
    max-width: 12.5rem;
  }
}
.single-people__portrait img {
  aspect-ratio: 1/1;
  object-fit: cover;
}

.single-people__sidebar-meta {
  margin-top: 1.25rem;
  text-align: center;
}

.single-people__sidebar-name {
  font-size: 1.125rem;
  line-height: 1.3888888889;
  letter-spacing: 0em;
  font-weight: 500;
}

.single-people__sidebar-dept {
  margin-top: 0.1875rem;
  font-size: 0.75rem;
  line-height: 1.25;
  letter-spacing: 0.05em;
  font-weight: 400;
}

@media screen and (min-width: 768px) {
  .single-people__sidebar-cta {
    margin-top: 1.25rem;
  }
}

.single-people__sidebar-cta-head {
  display: flex;
  align-items: end;
  justify-content: center;
}
.single-people__sidebar-cta-head::before, .single-people__sidebar-cta-head::after {
  content: "";
  background: url(../img/people/cta-line.svg) no-repeat center center/contain;
  width: 0.5rem;
  height: 1rem;
}
.single-people__sidebar-cta-head::after {
  transform: rotate(45deg);
}

.single-people__sidebar-cta-text {
  font-size: 0.75rem;
  line-height: 1.6;
  letter-spacing: 0em;
  font-weight: 500;
  text-align: center;
  color: #7E6346;
}

.single-people__sidebar-cta-buttons {
  display: grid;
  gap: 0.625rem;
  margin-top: 0.375rem;
}

.single-people__sidebar-btn {
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  width: min(80vw, 20.9375rem);
  padding: 1rem 1.25rem;
  font-size: 0.75rem;
  line-height: 1.6;
  letter-spacing: 0.1em;
  font-weight: 500;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .single-people__sidebar-btn {
    width: 100%;
  }
}

.single-people__sidebar-btn--casual {
  background-color: #7E6346;
  height: 3.1875rem;
}

.single-people__sidebar-btn--position {
  background-color: #191E1E;
  font-weight: 400;
  height: 3.1875rem;
}

.single-people__sidebar-btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 0.9375rem;
  height: 0.9375rem;
  border-radius: 0.1875rem;
  background-color: #ffffff;
  margin-top: 0.125rem;
}

@media screen and (min-width: 768px) {
  .single-people__sidebar-btn-icon img:nth-of-type(1) {
    width: 70%;
  }
}

.single-people__sidebar-btn-icon img:nth-of-type(2) {
  width: 70%;
}

.single-people__qa {
  order: 1;
}
@media screen and (min-width: 768px) {
  .single-people__qa {
    order: unset;
    flex: 1;
    min-width: 0;
  }
}

.single-people__qa-lead,
.single-people__qa-afterword {
  padding: 1.125rem 1.25rem;
  background: #fffdf3;
  border-left: 3px solid #C2BB9E;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .single-people__qa-lead,
  .single-people__qa-afterword {
    font-size: 0.9375rem;
    padding: 1.5rem 1.75rem;
  }
}

.single-people__qa-lead {
  margin-bottom: 2.5rem;
}

.single-people__qa-afterword {
  margin-top: 2.5rem;
}

.single-people__qa-list {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.single-people__qa-header {
  position: relative;
}

.single-people__qa-number {
  display: block;
  font-family: "Jost", sans-serif;
  font-size: 3rem;
  line-height: 0.625;
  letter-spacing: 0em;
  font-weight: 500;
  color: #C2BB9E;
}
@media screen and (min-width: 768px) {
  .single-people__qa-number {
    font-size: 3.625rem;
  }
}

.single-people__qa-num-digit {
  color: #191E1E;
}

.single-people__qa-question-wrap {
  padding: 0.9375rem 0.625rem 0 0.9375rem;
  border-top: 3px solid #C2BB9E;
  border-left: 3px solid #C2BB9E;
}
@media screen and (min-width: 768px) {
  .single-people__qa-question-wrap {
    padding: 1.25rem;
  }
}

.single-people__qa-question {
  font-family: "Shippori Mincho", sans-serif;
  font-size: 1.125rem;
  line-height: 1.6666666667;
  letter-spacing: 0em;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .single-people__qa-question {
    font-size: 1.25rem;
  }
}

.single-people__qa-answer {
  margin-top: 1.25rem;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
  padding-inline: 0.625rem;
}
@media screen and (min-width: 768px) {
  .single-people__qa-answer {
    font-size: 0.9375rem;
    padding-inline: 1.25rem;
  }
}
.single-people__qa-answer > * + * {
  margin-top: 1.25rem;
}

.single-people__rich-block {
  margin-top: 2.5rem;
}
.single-people__rich-block img {
  width: 100%;
  height: auto;
  display: block;
}
.single-people__rich-block p {
  margin-top: 1rem;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .single-people__rich-block p {
    font-size: 0.9375rem;
  }
}

.single-people__movie-description {
  margin-top: 1.25rem;
  padding-inline: 0;
}
@media screen and (min-width: 768px) {
  .single-people__movie-description {
    margin-top: 1.875rem;
  }
}

.single-people__others {
  padding-top: 3.75rem;
  overflow-x: clip;
}
@media screen and (min-width: 768px) {
  .single-people__others {
    padding-top: 6.75rem;
  }
}

.people-others__inner {
  padding-right: 0;
  max-width: 500px;
}
@media screen and (min-width: 768px) {
  .people-others__inner {
    max-width: 930px;
  }
}

.people-others__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 20px;
}
@media screen and (min-width: 768px) {
  .people-others__head {
    padding-right: 25px;
  }
}

.people-others__title {
  font-size: 1.4375rem;
  line-height: 2.6086956522;
  font-weight: 700;
  font-family: "Shippori Mincho", sans-serif;
}
@media screen and (min-width: 768px) {
  .people-others__title {
    font-size: 2rem;
  }
}

.people-others__nav {
  display: flex;
  gap: 0.625rem;
}

.people-others__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5625rem;
  height: 2.1875rem;
  background-color: #191E25;
  cursor: pointer;
  transition: opacity 0.3s;
  border-radius: 0.375rem;
}
.people-others__btn img {
  width: 0.5rem;
  height: 0.3125rem;
}
.people-others__btn:hover {
  opacity: 0.6;
}
.people-others__btn.swiper-button-disabled {
  cursor: default;
  pointer-events: none;
}

.people-others__btn--next img {
  transform: rotate(180deg);
}

.swiper.people-others__swiper {
  overflow: visible;
  clip-path: inset(0 -9999px 0 0);
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .swiper.people-others__swiper {
    margin-top: 2.5rem;
  }
}

.people-others__item {
  margin-right: 0.9375rem;
  height: auto;
}

.people-others__swiper .people-others__item {
  width: 7.5rem;
}
@media screen and (min-width: 768px) {
  .people-others__swiper .people-others__item {
    width: 13.75rem;
  }
}

.people-others__item-link {
  display: block;
}
@media screen and (min-width: 768px) {
  .people-others__item-link {
    height: 100%;
  }
}

.people-others__image {
  overflow: hidden;
}
.people-others__image img {
  aspect-ratio: 120/132;
  object-fit: cover;
  transition: transform 0.3s;
}
@media screen and (min-width: 768px) {
  .people-others__image img {
    aspect-ratio: 220/260;
  }
}

.people-others__item-link:hover .people-others__image img {
  transform: scale(1.05);
}

.people-others__content {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.375rem;
  color: #191E1E;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .people-others__content {
    gap: 0.625rem;
  }
}

.people-others__name-ja {
  font-size: 0.9375rem;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .people-others__name-ja {
    font-size: 1.125rem;
  }
}

.people-others__name-en {
  font-family: "Jost", sans-serif;
  font-size: 0.625rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .people-others__name-en {
    font-size: 0.75rem;
    line-height: 1.25;
  }
}

.people-others__department {
  font-size: 0.625rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .people-others__department {
    font-size: 0.875rem;
    line-height: 1.4285714286;
  }
}

.people-others__year {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline: auto;
  font-size: 0.5rem;
  line-height: 1.875;
  letter-spacing: 0.1em;
  font-weight: 500;
  border: 0.5px solid #1A1A1A;
  color: #1A1A1A;
  padding: 0.125rem 0.1875rem 0.1875rem;
}
@media screen and (min-width: 768px) {
  .people-others__year {
    font-size: 0.625rem;
    line-height: 1.5;
    width: 4.4375rem;
  }
}

.single-people__link {
  margin-top: 2.5rem;
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 1024px) {
  .sub-page__layout--environment {
    grid-template-columns: 12.875rem 1fr;
  }
}

.sub-page__side--environment {
  padding-top: 6.25rem;
}

.sub-environment__section {
  padding-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__section {
    padding-top: 6.25rem;
  }
}

.sub-environment__section-inner {
  padding-inline: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__section-inner {
    padding-inline: 1.5625rem;
  }
}
@media screen and (min-width: 1024px) {
  .sub-environment__section-inner {
    padding-inline: 0;
  }
}

.sub-environment__career-lead {
  margin-top: 1.875rem;
  font-size: 1.25rem;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-lead {
    margin-top: 2.5rem;
    font-size: 1.5rem;
  }
}

.sub-environment__career-desc {
  margin-top: 1.25rem;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-desc {
    margin-top: 1.25rem;
    font-size: 0.9375rem;
    line-height: 2;
  }
}

.sub-environment__career-diagram {
  position: relative;
  background: #F2F1ED;
  overflow: hidden;
  padding: 1.25rem 1.125rem 2.75rem;
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-diagram {
    padding-block: 2.1875rem 2.125rem;
    padding-inline: clamp(10px, -20 * (100vw - 1440px) / -672 + 30px, 30px);
  }
}
.sub-environment__career-diagram::before {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  width: 63.125rem;
  height: 63.125rem;
  background: #E7E2DC;
  top: -38.75rem;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .sub-environment__career-diagram::before {
    top: 50%;
    transform: translateX(0) translateY(-50%);
    left: -33.875rem;
  }
}
.sub-environment__career-diagram::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  width: 35rem;
  height: 35rem;
  background: #D9D0C7;
  top: -19.5625rem;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .sub-environment__career-diagram::after {
    top: 50%;
    transform: translateX(0) translateY(-50%);
    left: -19.8125rem;
  }
}

.sub-environment__career-vision-label {
  display: inline-block;
  position: relative;
  z-index: 1;
  background: #191E1E;
  color: #ffffff;
  font-size: 0.8125rem;
  letter-spacing: 0.1em;
  font-weight: 500;
  padding: 0.125rem 0.375rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-vision-label {
    font-size: 0.875rem;
  }
}

.sub-environment__career-flow {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 0.625rem 1fr;
  gap: 0.625rem;
  align-items: center;
  margin-top: 1.875rem;
}
.sub-environment__career-flow > :nth-child(4) {
  grid-column: 1/-1;
  justify-self: center;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-flow > :nth-child(4) {
    grid-column: auto;
    justify-self: auto;
  }
}
.sub-environment__career-flow > :nth-child(5) {
  grid-column: 1/-1;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-flow > :nth-child(5) {
    grid-column: auto;
  }
}
@media screen and (min-width: 768px) {
  .sub-environment__career-flow {
    margin-top: 2.8125rem;
    grid-template-columns: minmax(0, 2fr) 1.625rem minmax(0, 2fr) 1.625rem minmax(0, 5fr);
    align-items: start;
    gap: clamp(5px, -5 * (100vw - 1440px) / -672 + 10px, 10px);
  }
}
@media screen and (min-width: 1024px) {
  .sub-environment__career-flow {
    max-width: 885px;
  }
}

.sub-environment__career-arrow {
  width: 0.625rem;
  height: 1.1875rem;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  background-color: #000;
  justify-self: center;
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-arrow {
    margin-top: 6.0625rem;
    clip-path: none;
    background-color: transparent;
    background-image: url(../img/environment/arrow-right.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 1.625rem;
    height: 0.625rem;
  }
}

@media screen and (max-width: 767px) {
  .sub-environment__career-flow > :nth-child(4) {
    width: 1.1875rem;
    height: 0.625rem;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    margin-top: 0;
  }
}

.sub-environment__career-tier {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-tier {
    gap: 1.25rem;
  }
}

.sub-environment__career-tier-heading {
  text-align: center;
  font-size: 0.8125rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 500;
  padding-bottom: 0.9375rem;
  border-bottom: 2px solid #000;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-tier-heading {
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: 0em;
    font-weight: 700;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: calc(1.2em + 0.9375rem);
    overflow: visible;
  }
}

.sub-environment__career-tier-list {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-tier-list {
    gap: 0.625rem;
  }
}

.sub-environment__career-tier-item {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 0.625rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 400;
  color: #ffffff;
  padding: 0.625rem;
  border-radius: 3.125rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-tier-item {
    font-size: 0.8125rem;
    line-height: 1.2;
  }
}

.sub-environment__career-tier--dark .sub-environment__career-tier-item {
  background: #191E1E;
}

.sub-environment__career-tier--brown .sub-environment__career-tier-list {
  display: grid;
  grid-template-columns: 200fr 222fr;
  gap: 0.125rem 0.25rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-tier--brown .sub-environment__career-tier-list {
    gap: 0.625rem 0.25rem;
  }
}

.sub-environment__career-tier--brown .sub-environment__career-tier-item {
  font-size: 0.6875rem;
  line-height: 1.2;
  letter-spacing: 0.02em;
  font-weight: 400;
  background: #7D6346;
}
@media screen and (min-width: 768px) {
  .sub-environment__career-tier--brown .sub-environment__career-tier-item {
    font-size: 0.8125rem;
  }
}

.sub-environment__career-deco {
  position: absolute;
  z-index: 2;
  left: 1.125rem;
  bottom: 0;
  width: 55vw;
  pointer-events: none;
}
@media screen and (min-width: 1024px) {
  .sub-environment__career-deco {
    width: 39.4444444444vw;
    max-width: 568px;
  }
}

.sub-environment__office-lead {
  margin-top: 1.875rem;
  font-size: 1.25rem;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-environment__office-lead {
    margin-top: 2.5rem;
    font-size: 1.5rem;
  }
}

.sub-environment__office-desc {
  margin-top: 1.25rem;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-environment__office-desc {
    margin-top: 1.25rem;
    font-size: 0.9375rem;
    line-height: 2;
  }
}

.sub-environment__office-body {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__office-body {
    flex-direction: row;
    align-items: flex-start;
    gap: 2.5rem;
    margin-top: 2.5rem;
  }
}

.sub-environment__office-tabs {
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
}
@media screen and (min-width: 768px) {
  .sub-environment__office-tabs {
    flex-direction: column;
    width: 8.75rem;
    flex-shrink: 0;
    gap: 0;
  }
}

.sub-environment__office-tab {
  flex-shrink: 0;
  padding-bottom: 0.75rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  letter-spacing: 0em;
  font-weight: 500;
  color: #A9A6A0;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
}
.sub-environment__office-tab.is-active {
  color: #191E1E;
  border-color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-environment__office-tab {
    text-align: left;
    padding: 1rem 0 0.1875rem;
    border-bottom: 1px solid transparent;
    font-size: 0.9375rem;
    width: fit-content;
  }
  .sub-environment__office-tab.is-active {
    color: #191E1E;
    border-color: #191E1E;
  }
}

.sub-environment__office-panels {
  min-width: 0;
}
@media screen and (min-width: 768px) {
  .sub-environment__office-panels {
    flex: 1 1 auto;
  }
}

.sub-environment__office-panel {
  display: none;
}
.sub-environment__office-panel.is-active {
  display: block;
}
.sub-environment__office-panel img {
  width: 100%;
  aspect-ratio: 631/453;
  object-fit: cover;
  display: block;
}

.sub-environment__office-swiper {
  width: 100%;
}
.sub-environment__office-swiper .swiper-slide img {
  width: 100%;
  aspect-ratio: 631/453;
  object-fit: cover;
  display: block;
}

.sub-environment__training-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__training-list {
    margin-top: 2.5rem;
  }
}

.sub-environment__training-item {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__training-item {
    gap: 1.25rem;
  }
}

.sub-environment__training-marker {
  display: flex;
  align-items: center;
  gap: 0.3125rem;
  background: #191E1E;
  padding: 0.3125rem 0.625rem;
  width: fit-content;
}
.sub-environment__training-marker::before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 0.6875rem;
  height: 0.5625rem;
  margin-top: 0.125rem;
  background: url(../img/environment/triangle.svg) no-repeat center center/contain;
}

.sub-environment__training-timing {
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  font-weight: 400;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .sub-environment__training-timing {
    font-size: 0.875rem;
  }
}

.sub-environment__training-content--double {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__training-content--double {
    flex-direction: row;
    gap: 2.5rem;
  }
}

.sub-environment__training-block {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  padding-left: 0.625rem;
  border-left: 2px solid #191E1E;
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .sub-environment__training-block {
    padding-left: 1.25rem;
  }
}

.sub-environment__training-title {
  font-size: 1.125rem;
  letter-spacing: 0em;
  font-weight: 500;
  color: #000;
}
@media screen and (min-width: 768px) {
  .sub-environment__training-title {
    font-size: 1.5rem;
  }
}

.sub-environment__training-text {
  font-size: 0.75rem;
  line-height: 1.6;
  letter-spacing: 0em;
  font-weight: 400;
  color: #000;
}
@media screen and (min-width: 768px) {
  .sub-environment__training-text {
    font-size: 0.9375rem;
    line-height: 1.6;
  }
}

.sub-environment__welfare-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.3125rem 0.375rem;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__welfare-list {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 0.625rem;
    margin-top: 2.5rem;
  }
}

.sub-environment__welfare-item {
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
  padding: 0.9375rem 0.625rem;
  background: #FAF9F7;
  min-height: 8.125rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__welfare-item {
    padding-block: 3.125rem;
    padding-inline: clamp(15px, -15 * (100vw - 1440px) / -672 + 30px, 30px);
    gap: 0.625rem;
    min-height: 16.25rem;
  }
}

.sub-environment__welfare-title {
  font-size: 0.9375rem;
  letter-spacing: 0em;
  font-weight: 500;
  color: #191E1E;
  display: flex;
  align-items: center;
  gap: 0.3125rem;
}
.sub-environment__welfare-title::before {
  content: "";
  background: url(../img/environment/check-icon.svg) no-repeat center center/contain;
  width: 0.8125rem;
  height: 0.625rem;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .sub-environment__welfare-title::before {
    width: 1.1875rem;
    height: 0.9375rem;
  }
}
@media screen and (min-width: 768px) {
  .sub-environment__welfare-title {
    font-size: 1.5rem;
    letter-spacing: 0.1em;
    font-weight: 500;
    gap: 0.625rem;
  }
}

.sub-environment__welfare-text {
  font-size: 0.6875rem;
  line-height: 1.6;
  letter-spacing: 0em;
  font-weight: 400;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-environment__welfare-text {
    font-size: 0.875rem;
    line-height: 1.6;
  }
}

.sub-environment__stats-group {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-group {
    margin-top: 2.5rem;
  }
}

.sub-environment__stats-group-heading {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.3125rem 0;
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0em;
  font-weight: 500;
  color: #191E1E;
}
.sub-environment__stats-group-heading::before {
  content: "";
  display: block;
  flex-shrink: 0;
  background: url(../img/environment/diamond.svg) no-repeat center center/contain;
  width: 0.9375rem;
  height: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-group-heading {
    font-size: 1.75rem;
    line-height: 1.5;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.sub-environment__stats-note {
  margin-top: 0.9375rem;
  text-align: right;
  color: #191E1E;
  opacity: 0.5;
  font-size: 0.6875rem;
  letter-spacing: 0.03em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-note {
    margin-top: 1.25rem;
    font-size: 0.75rem;
  }
}

.sub-environment__stats-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.sub-environment__stats-item img {
  flex: 1;
  object-fit: contain;
}

.sub-environment__stats-item.sub-environment__stats-item--fullSp {
  grid-column: 1/3;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-item.sub-environment__stats-item--fullSp {
    grid-column: auto;
  }
}

.sub-environment__stats-item--wide {
  grid-column: 1/-1;
}

.sub-environment__stats-list--capital {
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--capital {
    grid-template-columns: repeat(6, 1fr);
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-list--capital .sub-environment__stats-item {
    grid-column: span 2;
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-list--capital .sub-environment__stats-item:nth-child(4),
  .sub-environment__stats-list--capital .sub-environment__stats-item:nth-child(5) {
    grid-column: span 3;
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-list--capital .sub-environment__stats-item:nth-child(6) {
    grid-column: 1/-1;
  }
}

.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(1) {
  order: 1;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(1) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(2) {
  order: 2;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(2) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(3) {
  order: 3;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(3) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(4) {
  order: 5;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(4) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(5) {
  order: 4;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(5) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(6) {
  order: 6;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(6) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(7) {
  order: 7;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(7) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(8) {
  order: 8;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(8) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(9) {
  order: 9;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(9) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(10) {
  order: 10;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(10) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(11) {
  order: 11;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(11) {
    order: initial;
  }
}
.sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(12) {
  order: 12;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-list--ma .sub-environment__stats-item:nth-child(12) {
    order: initial;
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-list--agent {
    grid-template-columns: repeat(6, 1fr);
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-list--agent .sub-environment__stats-item {
    grid-column: span 2;
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-list--agent .sub-environment__stats-item--half {
    grid-column: span 3;
    align-self: start;
    aspect-ratio: 479/316;
  }
  .sub-environment__stats-list--agent .sub-environment__stats-item--half img {
    height: 100%;
  }
}

@media screen and (min-width: 768px) {
  .sub-environment__stats-item.sub-environment__stats-item--threeHalf {
    grid-column: 1/3;
  }
}

.sub-environment__stats-item.sub-environment__stats-item--threeHalfSp {
  grid-column: 1/3;
}
@media screen and (min-width: 768px) {
  .sub-environment__stats-item.sub-environment__stats-item--threeHalfSp {
    grid-column: 3/4;
  }
}

.sub-environment__cta {
  margin-top: 8.125rem;
}

@media screen and (min-width: 1024px) {
  .sub-page__layout--business {
    grid-template-columns: 8.125rem 1fr;
  }
}

.sub-business__section-wrapper {
  padding-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-business__section-wrapper {
    padding-top: 7.5rem;
  }
}

.sub-business__intro-body {
  margin-top: 1.875rem;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-body {
    display: grid;
    grid-template-columns: 1fr min(40vw, 30rem);
    grid-template-rows: auto auto;
    column-gap: clamp(30px, -50 * (100vw - 1440px) / -672 + 80px, 80px);
    row-gap: 2.8125rem;
    margin-top: 2.5rem;
    align-items: start;
  }
}

.sub-business__intro-image {
  order: -1;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-image {
    order: 0;
    grid-column: 2;
    grid-row: 2;
    width: auto;
    align-self: end;
  }
}

.sub-business__intro-heading {
  font-size: 1.25rem;
  letter-spacing: 0.1em;
  font-weight: 500;
  color: #000;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-heading {
    font-size: 2rem;
    line-height: 1.56;
    letter-spacing: 0em;
    font-weight: 500;
    grid-column: 1/-1;
    grid-row: 1;
    margin-top: 0;
  }
}

.sub-business__intro-content {
  color: #000;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-content {
    grid-column: 1;
    grid-row: 2;
    margin-top: 0;
  }
}

.sub-business__intro-desc {
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-desc {
    font-size: 0.9375rem;
  }
}

.sub-business__intro-cta {
  width: 16.3125rem;
  margin-right: auto;
  margin-top: 1.875rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.1875rem;
  gap: 1.25rem;
  padding: 1.25rem;
  background: #191E1E;
  color: #ffffff;
  text-decoration: none;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-cta {
    width: 100%;
    min-width: 18.75rem;
    margin-top: 3.4375rem;
  }
}

.sub-business__intro-cta-label {
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-cta-label {
    font-size: 0.9375rem;
    line-height: 1.3333333333;
    letter-spacing: 0.03em;
    font-weight: 400;
  }
}

.sub-business__intro-cta-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.1875rem;
  height: 1.125rem;
  border-radius: 0.1875rem;
  background-color: #ffffff;
  margin-top: 0.125rem;
}
@media screen and (min-width: 768px) {
  .sub-business__intro-cta-icon {
    width: 0.9375rem;
    height: 0.9375rem;
  }
}

@media screen and (min-width: 768px) {
  .sub-business__intro-cta-icon img:nth-of-type(1) {
    width: 70%;
  }
}

.sub-business__intro-cta-icon img:nth-of-type(2) {
  width: 70%;
}

.sub-business__service-wrapper {
  margin-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-business__service-wrapper {
    margin-top: 5rem;
  }
}

.sub-business__service + .sub-business__service {
  margin-top: 1.25rem;
}

.sub-business__service-card {
  border: 4px solid #7E6346;
  overflow: hidden;
  padding: 1.875rem 0.6875rem 3.75rem;
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .sub-business__service-card {
    border: 5px solid #7E6346;
    padding: 3.75rem;
  }
}

.sub-business__service-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 0.5rem;
  border-bottom: 0.1875rem solid #191E1E;
  gap: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .sub-business__service-head {
    border-bottom: 0.3125rem solid #191E1E;
    padding-bottom: 0.9375rem;
    gap: 1.25rem;
  }
}

.sub-business__service-head-right {
  display: flex;
  flex-direction: column;
}

.sub-business__service-num {
  font-family: "Jost", sans-serif;
  font-size: 2.625rem;
  line-height: 1.4285714286;
  letter-spacing: -0.05em;
  font-weight: 500;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__service-num {
    font-size: 4.375rem;
    line-height: 0.8571428571;
    letter-spacing: -0.05em;
    font-weight: 500;
  }
}

.sub-business__service-name-ja {
  font-size: 1rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 500;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__service-name-ja {
    font-size: 1.25rem;
    line-height: 1.2;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.sub-business__service-name-en {
  font-family: "Jost", sans-serif;
  font-size: 1.375rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 500;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__service-name-en {
    font-size: 2.5rem;
    line-height: 1.2;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.sub-business__service-block-wrapper {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-business__service-block-wrapper {
    margin-top: 3.4375rem;
  }
}

@media screen and (min-width: 768px) {
  .sub-business__service-block {
    display: grid;
    grid-template-columns: 1fr clamp(440px, -260 * (100vw - 1023px) / -255 + 700px, 700px);
    gap: 1.5rem;
  }
}
@media screen and (min-width: 1024px) {
  .sub-business__service-block {
    grid-template-columns: 1fr clamp(480px, -283 * (100vw - 1440px) / -416 + 763px, 763px);
  }
}

.sub-business__service-block + .sub-business__service-block {
  margin-top: 1.875rem;
  padding-top: 1.875rem;
  border-top: 0.1875rem solid #EFEDE6;
}
@media screen and (min-width: 768px) {
  .sub-business__service-block + .sub-business__service-block {
    margin-top: 3.125rem;
    padding-top: 2.1875rem;
  }
}

.sub-business__service-block-label {
  display: inline-block;
  background: #191E1E;
  color: #ffffff;
  font-size: 1rem;
  letter-spacing: 0em;
  font-weight: 500;
  padding: 0 0.3125rem;
  width: fit-content;
  align-self: start;
}
@media screen and (min-width: 768px) {
  .sub-business__service-block-label {
    font-size: 1.125rem;
    letter-spacing: 0em;
    font-weight: 500;
    margin-top: 0.625rem;
  }
}

.sub-business__service-block-body {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-business__service-block-body {
    margin-top: 0;
  }
}

.sub-business__service-text {
  color: #191E1E;
}
.sub-business__service-text h2,
.sub-business__service-text h3,
.sub-business__service-text h4 {
  font-size: 1rem;
  line-height: 1.4;
  letter-spacing: 0em;
  font-weight: 700;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__service-text h2,
  .sub-business__service-text h3,
  .sub-business__service-text h4 {
    font-size: 1.25rem;
    line-height: 2;
    letter-spacing: 0em;
    font-weight: 700;
  }
}
.sub-business__service-text p {
  font-size: 0.75rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-business__service-text p {
    font-size: 0.875rem;
  }
}
.sub-business__service-text h2 + p,
.sub-business__service-text h3 + p,
.sub-business__service-text h4 + p {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-business__service-text h2 + p,
  .sub-business__service-text h3 + p,
  .sub-business__service-text h4 + p {
    margin-top: 0.9375rem;
  }
}
.sub-business__service-text p + h2,
.sub-business__service-text p + h3,
.sub-business__service-text p + h4 {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-business__service-text p + h2,
  .sub-business__service-text p + h3,
  .sub-business__service-text p + h4 {
    margin-top: 1.875rem;
  }
}

.sub-business__people-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-business__people-list {
    gap: 1.875rem 3.75rem;
  }
}

.sub-business__people-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.sub-business__people-avatar {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.sub-business__people-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (min-width: 768px) {
  .sub-business__people-avatar {
    width: 6.875rem;
    height: 6.875rem;
  }
}

.sub-business__people-name {
  margin-top: 0.625rem;
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  font-weight: 400;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__people-name {
    font-size: 1rem;
  }
}

.sub-business__people-role {
  margin-top: 0.1875rem;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  font-weight: 400;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__people-role {
    margin-top: 0.5rem;
  }
}

.sub-business__people-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  margin-top: 0.9375rem;
  font-size: 0.75rem;
  line-height: 1.1;
  letter-spacing: 0.03em;
  font-weight: 500;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-business__people-link {
    font-size: 1rem;
    line-height: 1.1;
    margin-top: 1.25rem;
    gap: 0.625rem;
  }
}

.sub-business__people-link-icon {
  background: #191E1E;
  border-radius: 0.1875rem;
  width: 0.9375rem;
  height: 0.9375rem;
  margin-top: 0.125rem;
}

@media screen and (min-width: 768px) {
  .sub-business__people-link-icon img:nth-of-type(1) {
    width: 70%;
  }
}

.sub-business__people-link-icon img:nth-of-type(2) {
  width: 70%;
}

.sub-business__cta {
  margin-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-business__cta {
    margin-top: 8.75rem;
  }
}

.br-title-about {
  display: none;
}
@media screen and (min-width: 768px) and (max-width: 830px) {
  .br-title-about {
    display: block;
  }
}

@media screen and (min-width: 1024px) {
  .sub-page__layout--about {
    grid-template-columns: 9.75rem 1fr;
  }
}

.sub-about__section-wrapper {
  padding-top: 3.75rem;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-about__section-wrapper {
    padding-top: 7.5rem;
  }
}

.sub-about__section + .sub-about__section {
  padding-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-about__section + .sub-about__section {
    padding-top: 6.25rem;
  }
}

.sub-about__topics {
  margin-top: 3.75rem;
  display: flex;
  flex-direction: column;
  gap: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-about__topics {
    margin-top: 7.5rem;
    gap: 6.875rem;
  }
}

@media screen and (min-width: 768px) {
  .sub-about__topic {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 3.75rem;
  }
}

@media screen and (min-width: 768px) {
  .sub-about__topic-head {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
  }
}

.sub-about__topic-label-en {
  font-size: 0.625rem;
  letter-spacing: 0.06em;
  font-weight: 400;
  background: #191E1E;
  padding: 0.125rem;
  color: #ffffff;
  display: inline-flex;
}
@media screen and (min-width: 768px) {
  .sub-about__topic-label-en {
    font-size: 0.75rem;
    writing-mode: vertical-rl;
    padding: 0.125rem 0;
  }
}

.sub-about__topic-title {
  font-size: 1rem;
  line-height: 1.875;
  letter-spacing: 0em;
  font-weight: 500;
  display: flex;
}
@media screen and (min-width: 768px) {
  .sub-about__topic-title {
    font-size: 1.625rem;
    writing-mode: vertical-rl;
  }
}

.sub-about__topic-body {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__topic-body {
    margin-top: -0.625rem;
    padding-inline: 2.5rem;
  }
}

@media screen and (min-width: 768px) {
  .sub-about__values .sub-about__topic-body {
    padding-inline: 0;
  }
}

.sub-about__topic-lead {
  font-size: 1.25rem;
  letter-spacing: 0.1em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-about__topic-lead {
    font-size: 2rem;
    line-height: 1.5625;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.sub-about__topic-desc {
  margin-top: 1.25rem;
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__topic-desc {
    font-size: 1rem;
    margin-top: 3.125rem;
  }
}

.sub-about__topic-desc--mt0 {
  margin-top: 0;
}

.sub-about__topic-desc p + p {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__topic-desc p + p {
    margin-top: 3.125rem;
  }
}

.sub-about__logo-diagram {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__logo-diagram {
    margin-top: 3.4375rem;
  }
}

.sub-about__belief-image {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__belief-image {
    margin-top: 3.4375rem;
  }
}

.sub-about__values-list {
  list-style: none;
  margin-top: 1.25rem;
  display: grid;
  gap: 1.875rem;
}
@media screen and (min-width: 768px) {
  .sub-about__values-list {
    gap: 2.5rem;
    padding-inline: 2.5rem;
    margin-top: 3.75rem;
  }
}

.sub-about__values-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__values-item {
    gap: 2.5rem;
  }
}

.sub-about__values-num {
  font-family: "Jost", sans-serif;
  font-size: 0.625rem;
  line-height: 6;
  letter-spacing: 0em;
  font-weight: 400;
  color: #ffffff;
  background: #191E1E;
  padding: 0 0.375rem;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  .sub-about__values-num {
    width: 3.75rem;
    height: 3.75rem;
    font-size: 1rem;
    line-height: 3.75;
    padding: 0 1.875rem;
  }
}

.sub-about__values-en {
  font-family: "Jost", sans-serif;
  font-size: 1rem;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__values-en {
    font-size: 1.25rem;
  }
}

.sub-about__values-title {
  font-size: 1.125rem;
  line-height: 1.7;
  letter-spacing: 0em;
  font-weight: 500;
  margin-top: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .sub-about__values-title {
    font-size: 1.5rem;
    line-height: 1.7;
    margin-top: 0;
  }
}

.sub-about__values-images {
  margin-top: 4.375rem;
  margin-right: -1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__values-images {
    margin-top: 6.25rem;
    margin-right: -1.5625rem;
  }
}
@media screen and (min-width: 1024px) {
  .sub-about__values-images {
    margin-right: clamp(-90px, -60 * (100vw - 1300px) / 140 - 30px, -30px);
  }
}

.sub-about__values-swiper {
  overflow: visible;
  clip-path: inset(0 -9999px 0 0);
  --swiper-wrapper-transition-timing-function: linear;
}

.sub-about__values-images-inner {
  align-items: stretch;
}

.sub-about__values-images-inner .sub-about__values-image {
  flex-shrink: 0;
  width: 10rem;
  height: 10rem;
  margin-right: 0.75rem;
}
.sub-about__values-images-inner .sub-about__values-image img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
}
@media screen and (min-width: 768px) {
  .sub-about__values-images-inner .sub-about__values-image {
    width: 20rem;
    height: 20rem;
    margin-right: 1.25rem;
  }
}

.sub-about__vision-body {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__vision-body {
    margin-top: 3.4375rem;
  }
}

.sub-about__initiative-list {
  margin-top: 1.5625rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-list {
    margin-top: 2.1875rem;
  }
}

.sub-about__initiative-card {
  background: #303535;
  padding: 1.875rem 0.9375rem;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-card {
    padding: 5rem;
  }
}
.sub-about__initiative-card:first-child {
  background: #fff;
  border: 1px solid #303535;
}
.sub-about__initiative-card:first-child .sub-about__initiative-title,
.sub-about__initiative-card:first-child .sub-about__initiative-desc {
  color: #191E1E;
}

.sub-about__initiative-label-en {
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  font-weight: 500;
  color: #C2BB9E;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-label-en {
    font-size: 1.25rem;
  }
}

.sub-about__initiative-title {
  margin-top: 0.1875rem;
  font-size: 1.25rem;
  letter-spacing: 0em;
  font-weight: 500;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-title {
    font-size: 1.875rem;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.sub-about__initiative-desc {
  margin-top: 1.25rem;
  font-size: 0.75rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-desc {
    margin-top: 4.375rem;
    font-size: 0.9375rem;
    line-height: 2;
    letter-spacing: 0.1em;
  }
}

@media screen and (min-width: 768px) {
  .sub-about__initiative-desc--able {
    margin-top: 0;
  }
}

.sub-about__initiative-image {
  aspect-ratio: 153/109;
  margin-top: 1.5625rem;
}
.sub-about__initiative-image img {
  height: 100%;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-image {
    aspect-ratio: 365/143;
    margin-top: 3.4375rem;
    max-width: 45.625rem;
    margin-inline: auto;
  }
}

.sub-about__initiative-image--able {
  aspect-ratio: 40/21;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-image--able {
    aspect-ratio: 21/11;
    flex: 0 0 49%;
    max-width: 49%;
    margin-top: 0;
  }
}

.sub-about__initiative-image + .sub-about__initiative-desc {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-image + .sub-about__initiative-desc {
    margin-top: 3.4375rem;
  }
}

.sub-about__initiative-movies {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-movies {
    margin-top: 3.75rem;
    flex-direction: row;
    gap: 1.25rem;
    max-width: 820px;
    margin-inline: auto;
  }
}

.sub-about__initiative-movie {
  position: relative;
  width: 100%;
}

.sub-about__initiative-movie__thumbnail {
  overflow: hidden;
  aspect-ratio: 16/9;
  position: relative;
  cursor: pointer;
}
.sub-about__initiative-movie__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sub-about__initiative-movie__thumbnail iframe {
  width: 100%;
  height: 100%;
  display: block;
}

.sub-about__movie-play {
  position: absolute;
  width: 5rem;
  height: 2rem;
  bottom: 1rem;
  right: 1rem;
  background: #C2BB9E;
}
@media screen and (min-width: 768px) {
  .sub-about__movie-play {
    width: 8rem;
    height: 3.25rem;
    bottom: 1.875rem;
    right: 1.5625rem;
  }
}

.sub-about__movie-play-button {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
}
@media screen and (min-width: 768px) {
  .sub-about__movie-play-button {
    gap: 1.25rem;
  }
}

.sub-about__movie-play-text {
  font-size: 0.75rem;
  line-height: 1.6666666667;
  letter-spacing: 0.03em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-about__movie-play-text {
    font-size: 1rem;
  }
}

.sub-about__movie-play-icon {
  width: 0.875rem;
}
.sub-about__movie-play-icon img {
  aspect-ratio: 14/10.2;
}
@media screen and (min-width: 768px) {
  .sub-about__movie-play-icon {
    width: 1.125rem;
  }
}

.sub-about__initiative-able-wrapper {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-able-wrapper {
    margin-top: 4.375rem;
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: 2.5rem;
  }
}

@media screen and (min-width: 768px) {
  .sub-about__initiative-able-body {
    flex: 1;
    min-width: 0;
  }
}

.sub-about__initiative-link {
  margin-top: 1.5625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  background: #191E1E;
  padding: 1.25rem 2.5rem;
}

.sub-about__initiative-link-text {
  color: #ffffff;
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0.03em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__initiative-link-text {
    font-size: 0.9375rem;
  }
}

.sub-about__initiative-link-icon {
  background: #ffffff;
  width: 0.9375rem;
  height: 0.9375rem;
  border-radius: 0.1875rem;
}

.sub-about__ceo-body {
  margin-top: 1.875rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-body {
    flex-direction: row-reverse;
    gap: 3.75rem;
    align-items: flex-start;
    margin-top: 3.75rem;
  }
}

.sub-about__ceo-info {
  display: grid;
  grid-template-columns: 50% 50%;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-info {
    flex: 0 0 39.3%;
    grid-template-columns: 1fr;
  }
}

.sub-about__ceo-image {
  aspect-ratio: 17/15;
}
.sub-about__ceo-image img {
  height: 100%;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-image {
    aspect-ratio: 4/5;
  }
}

.sub-about__ceo-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-meta {
    margin-top: 3.75rem;
    align-items: baseline;
  }
}

.sub-about__ceo-meta-inner {
  text-align: left;
}

.sub-about__ceo-name {
  font-size: 1.25rem;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-name {
    font-size: 1.25rem;
    line-height: 1.25;
  }
}

.sub-about__ceo-name-en {
  font-family: "Jost", sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  font-weight: 400;
}

.sub-about__ceo-role {
  margin-top: 0.3125rem;
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0.05em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-role {
    margin-top: 0.625rem;
    font-size: 1.125rem;
  }
}

.sub-about__ceo-message {
  color: #000;
}
.sub-about__ceo-message h3 {
  font-size: 1.5rem;
  letter-spacing: 0.1em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-message h3 {
    font-size: 2.25rem;
    line-height: 1.3888888889;
    letter-spacing: 0.1em;
    font-weight: 400;
  }
}
.sub-about__ceo-message p {
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-message p {
    font-size: 1rem;
    line-height: 2;
    letter-spacing: 0.1em;
  }
}
.sub-about__ceo-message h3 + p {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-message h3 + p {
    margin-top: 3.125rem;
  }
}
.sub-about__ceo-message p + p {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-message p + p {
    margin-top: 2.5rem;
  }
}
@media screen and (min-width: 768px) {
  .sub-about__ceo-message {
    flex: 1;
    min-width: 0;
    margin-top: -0.9375rem;
  }
}

.sub-about__member-list {
  list-style: none;
  margin-top: 1.875rem;
  display: flex;
  flex-direction: column;
  gap: 1.875rem;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-about__member-list {
    margin-top: 2.5rem;
    gap: 4.5rem;
  }
}

.sub-about__member-item {
  display: grid;
  grid-template-columns: min(48vw, 12.5rem) 1fr;
  grid-template-areas: "image info" "message message";
  column-gap: 1.25rem;
  row-gap: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .sub-about__member-item {
    grid-template-columns: 14.6875rem 1fr;
    grid-template-areas: "image info" "image message";
    column-gap: clamp(20px, -40 * (100vw - 1440px) / -672 + 60px, 60px);
    row-gap: 1.5625rem;
  }
}

.sub-about__member-image {
  grid-area: image;
  overflow: hidden;
  aspect-ratio: 3/2;
  align-self: start;
}
.sub-about__member-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}
@media screen and (min-width: 768px) {
  .sub-about__member-image {
    aspect-ratio: 1/1;
  }
}

.sub-about__member-info {
  grid-area: info;
  margin-block: auto 0;
}
@media screen and (min-width: 768px) {
  .sub-about__member-info {
    display: flex;
    align-items: center;
  }
}

@media screen and (min-width: 768px) {
  .sub-about__member-name-block {
    padding-right: 1.25rem;
    border-right: 0.125rem solid #191E1E;
  }
}

.sub-about__member-name {
  font-size: 1.125rem;
  line-height: 1.3888888889;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-about__member-name {
    font-size: 1.25rem;
    line-height: 1.25;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.sub-about__member-name-en {
  font-family: "Jost", sans-serif;
  font-size: 0.75rem;
  line-height: 1.25;
  letter-spacing: 0.05em;
  font-weight: 400;
}

.sub-about__member-role {
  margin-top: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0.05em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__member-role {
    margin-top: 0;
    padding-left: 1.25rem;
    font-size: 1rem;
    line-height: 1.25;
  }
}

.sub-about__member-message {
  grid-area: message;
  font-size: 0.875rem;
  line-height: 1.8;
  letter-spacing: 0em;
  font-weight: 400;
}

.sub-about__member-link-text {
  font-size: 0.5625rem;
  line-height: 2.2222222222;
  letter-spacing: 0.03em;
  font-weight: 400;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .sub-about__member-link-text {
    font-size: 0.75rem;
    line-height: 1.6666666667;
  }
}

.sub-about__member-link-icon {
  border-radius: 1px;
  background: #ffffff;
  width: 0.625rem;
  height: 0.625rem;
}
@media screen and (min-width: 768px) {
  .sub-about__member-link-icon {
    width: 0.9375rem;
    height: 0.9375rem;
    border-radius: 0.1875rem;
  }
}

.sub-about__book-list {
  list-style: none;
  margin-top: 1.875rem;
  display: grid;
  gap: 0.625rem;
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  .sub-about__book-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.875rem;
  }
}

.sub-about__book-item {
  display: grid;
  justify-content: center;
  grid-template-columns: 27% 1fr;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .sub-about__book-item {
    grid-template-columns: 1fr;
  }
}

.sub-about__book-cover {
  overflow: hidden;
  max-height: 18.75rem;
  display: flex;
  justify-content: center;
  margin-inline: auto;
}
.sub-about__book-cover img {
  height: 100%;
  object-fit: contain;
}

@media screen and (min-width: 768px) {
  .sub-about__book-info {
    text-align: center;
  }
}

.sub-about__book-title {
  font-size: 1rem;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .sub-about__book-title {
    font-size: 1.25rem;
    max-width: 300px;
    margin-inline: auto;
  }
}

.sub-about__book-author {
  margin-top: 0.625rem;
  font-size: 0.75rem;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .sub-about__book-author {
    font-size: 0.9375rem;
    margin-top: 1.25rem;
  }
}

.sub-about__cta {
  margin-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .sub-about__cta {
    margin-top: 10.25rem;
  }
}

.header {
  color: #ffffff;
  position: sticky;
  top: 0;
  z-index: 900;
  background-color: #191E1E;
  transition: background-color 0.3s ease;
}
@media screen and (min-width: 768px) {
  .header {
    position: fixed;
    width: 100%;
    background-color: transparent;
  }
}

@media screen and (min-width: 768px) {
  body:not(.new-graduate) .header.is-scrolled {
    background-color: transparent;
  }
}
body.new-graduate .header {
  background: #ffffff;
}

@media screen and (min-width: 768px) {
  body.new-graduate .header__right {
    gap: 1.5rem;
  }
}

.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem 0.4375rem;
}
@media screen and (min-width: 768px) {
  .header__inner {
    padding: 0rem 1.25rem 0rem;
    align-items: flex-start;
  }
}

body.front-page .header__inner {
  padding-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  body.front-page .header__inner {
    padding-top: 1.625rem;
  }
}

body.new-graduate .header__inner {
  padding: 0.625rem 0.625rem 0rem;
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__inner {
    padding: 0.9375rem 1.875rem;
    align-items: center;
  }
}

.header__logo {
  flex-shrink: 0;
  transition: 0.3s;
}
.header__logo a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  gap: 0.3125rem;
  padding: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .header__logo a {
    gap: 1.25rem;
    padding: 0.6875rem 1.25rem 0;
  }
}
.header__logo img {
  width: 2.5rem;
  height: auto;
  transition: width 0.3s ease;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .header__logo img {
    width: 6.1875rem;
    align-self: flex-start;
  }
}

@media screen and (min-width: 768px) {
  body:not(.new-graduate) .header.is-scrolled .header__logo {
    background-color: #191E1E;
    top: 0;
    left: 0;
    transition: 0.3s;
    border-radius: 0 0 2rem 0;
  }
  body:not(.new-graduate) .header.is-scrolled .header__logo a {
    border-radius: 0 0 2rem 0;
    border-right: 4px solid #454545;
    border-bottom: 4px solid #454545;
    padding: 0.625rem 1.25rem;
    display: inline-flex;
  }
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__logo {
    gap: 0.3125rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
@media screen and (min-width: 1024px) {
  body.new-graduate .header__logo {
    flex-direction: row;
    gap: calc(-36 * (100vw - 1440px) / -416 + 51px);
  }
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__logo a {
    padding: 0;
  }
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__logo img {
    width: min(29vw, 19.125rem);
  }
}

body.new-graduate .header__logo img {
  content: url(../img/common/logo-black.svg);
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__logo img {
    content: url(../img/common/logo-row.svg);
  }
}

body.new-graduate .header__logo-text {
  color: #191E1E;
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__logo-text {
    display: none;
  }
}

body:not(.new-graduate) .header__logo-text--new-graduate {
  display: none;
}

.header__logo-text--new-graduate {
  font-family: "Jost", sans-serif;
  color: #191E1E;
  font-size: 1.125rem;
  line-height: 1.1111111111;
  letter-spacing: 0em;
  font-weight: 400;
}

.header__logo-text {
  font-family: "Jost", sans-serif;
  font-size: 0.5rem;
  letter-spacing: 0em;
  font-weight: 400;
  display: block;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .header__logo-text {
    font-size: 1rem;
  }
}

.header__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .header__right {
    gap: 0.5rem;
    flex-direction: row;
    align-items: center;
  }
}

@media screen and (min-width: 768px) {
  body:not(.new-graduate) .header.is-scrolled .header__sns {
    background-color: #191E1E;
    transition: 0.3s;
  }
  body:not(.new-graduate) .header {
    position: static;
  }
  body:not(.new-graduate) .header__logo {
    position: fixed;
    top: 1.5625rem;
    left: 1.25rem;
    z-index: 10000;
  }
  body:not(.new-graduate) .header__right {
    position: fixed;
    top: 0.9375rem;
    right: 0rem;
    z-index: 100000;
    border-radius: 0.75rem;
    padding: 0.625rem 1.25rem;
  }
}
.header__sns {
  display: flex;
  align-items: center;
  list-style: none;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .header__sns {
    padding: 0.3125rem 1rem;
    border-radius: 3.125rem;
    margin-right: 0.75rem;
  }
}

body.new-graduate .header__sns {
  padding-right: 1.25rem;
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__sns {
    padding-right: 0;
  }
}

.header__sns-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s;
}
.header__sns-link a:hover {
  opacity: 0.6;
}
.header__sns-link img {
  display: block;
  width: 1.3125rem;
  height: 1.3125rem;
}

.header__nav-sns-link--facebook img {
  width: 0.5625rem;
}
@media screen and (min-width: 768px) {
  .header__nav-sns-link--facebook img {
    width: 0.75rem;
    height: 1.375rem;
  }
}

.header__nav-sns-link--instagram img {
  height: 1.3125rem;
}

.header__nav-sns-link--youtube img {
  height: 1.2rem;
}

body.new-graduate .header__nav-sns-link--x img {
  content: url("../img/common/x-black.svg");
}

body.new-graduate .header__nav-sns-link--facebook img {
  content: url("../img/common/facebook-fill.svg");
}

body.new-graduate .header__nav-sns-link--instagram img {
  content: url("../img/common/insta-black.svg");
}

body.new-graduate .header__nav-sns-link--youtube img {
  content: url("../img/common/youtube-black.svg");
}

.header__nav-wrapper {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .header__nav-wrapper {
    gap: 1rem;
  }
}

body.new-graduate .header__nav-wrapper {
  gap: 0.1875rem;
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__nav-wrapper {
    gap: 1.25rem;
  }
}

.header__nav-list {
  display: flex;
  align-items: center;
  list-style: none;
  gap: 0.1875rem;
}

.header__nav-item a {
  font-size: 0.625rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 500;
  color: #ffffff;
  padding: 0.25rem 0.5625rem;
  display: flex;
  align-items: center;
  text-decoration: none;
  border-radius: 4.625rem;
  border: 0.5px solid #D4D4D4;
}
@media screen and (min-width: 768px) {
  .header__nav-item a {
    font-size: 0.75rem;
    line-height: 1.6666666667;
    letter-spacing: 0.1em;
    background-color: #191E1E;
  }
}
.header__nav-item a {
  transition: 0.3s;
}
.header__nav-item a:hover {
  opacity: 0.6;
  transition: 0.3s;
}

.header__nav-item--casual a {
  color: #000;
  background-color: #ffffff;
  border-color: #2EE5C4;
}

body.new-graduate .header__nav-item a {
  background: #191E1E;
  color: #ffffff;
  border-color: rgba(25, 30, 30, 0.25);
}

body.new-graduate .header__nav-item--casual a {
  color: #191E1E;
  background-color: #fff;
  border: 1px solid #2EE5C4;
}

.header__hamburger {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.3125rem;
  width: 1.75rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  position: relative;
  z-index: 1002;
}
@media screen and (min-width: 768px) {
  .header__hamburger {
    width: 3.8125rem;
    gap: 0.375rem;
    background-color: #191E1E;
    border-radius: 2rem;
    padding: 0.5625rem 1.25rem;
  }
}
.header__hamburger span {
  display: block;
  height: 1px;
  background-color: #ffffff;
  transition: transform 0.35s ease, opacity 0.35s ease, width 0.35s ease;
}
.header__hamburger span:nth-child(1) {
  width: 100%;
}
.header__hamburger span:nth-child(2) {
  width: 65%;
}
@media screen and (min-width: 768px) {
  .header__hamburger span:nth-child(2) {
    width: 62%;
  }
}
.header__hamburger span:nth-child(3) {
  width: 100%;
}
.header__hamburger.is-open {
  pointer-events: none;
}
.header__hamburger.is-open span:nth-child(1),
.header__hamburger.is-open span:nth-child(2),
.header__hamburger.is-open span:nth-child(3) {
  opacity: 0;
}

body.new-graduate .header__hamburger span {
  background-color: #191E1E;
}
@media screen and (min-width: 768px) {
  body.new-graduate .header__hamburger span {
    background-color: #ffffff;
  }
}

.header__hamburger-close {
  display: none;
  font-family: "Jost", sans-serif;
  font-size: 0.75rem;
  line-height: 1.6666666667;
  letter-spacing: 0.06em;
  font-weight: 500;
  color: #ffffff;
  white-space: nowrap;
  position: fixed;
  z-index: 1003;
  cursor: pointer;
  top: 1.875rem;
  right: 1.25rem;
}
@media screen and (min-width: 768px) {
  .header__hamburger-close {
    font-size: 1.125rem;
    top: 3.125rem;
    right: 3.125rem;
  }
}
@media screen and (min-width: 1024px) {
  .header__hamburger-close {
    top: 5.625rem;
    right: 5.625rem;
  }
}

html.is-drawer-open .header__hamburger-close {
  display: block;
}

html.is-drawer-open {
  overflow: hidden;
}

.header__drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #191E1E;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease, visibility 0s linear 0.35s;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.header__drawer.is-open {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s ease, visibility 0s linear 0s;
}

.header__drawer-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.125rem;
  padding: 3.375rem 1.25rem 5rem;
  min-height: 100%;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .header__drawer-inner {
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    padding-top: 18.4027777778vw;
    min-height: unset;
    width: 100%;
    padding-inline: 1.5625rem;
    max-width: 1015px;
    gap: 3.125rem;
  }
}
@media screen and (min-width: 1024px) {
  .header__drawer-inner {
    justify-content: space-between;
    padding-top: 16.5625rem;
  }
}

.header__drawer-logo {
  flex-shrink: 0;
}
.header__drawer-logo img {
  width: 5rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .header__drawer-logo img {
    width: 12.5rem;
  }
}

.header__drawer-content {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .header__drawer-content {
    gap: 3.75rem;
    width: auto;
  }
}

.header__drawer-nav {
  padding: 0;
}

.header__drawer-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.9375rem;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (min-width: 1024px) {
  .header__drawer-list {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: repeat(3, 1fr);
    grid-auto-flow: column;
    column-gap: 4.375rem;
    row-gap: 1.25rem;
  }
}

.header__drawer-item a {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  text-decoration: none;
  transition: opacity 0.3s;
}
.header__drawer-item a:hover {
  opacity: 0.6;
}
@media screen and (min-width: 768px) {
  .header__drawer-item a {
    gap: 0.625rem;
  }
}

.header__drawer-item-en {
  font-family: "Jost", sans-serif;
  font-size: 2rem;
  line-height: 1.03125;
  letter-spacing: 0em;
  font-weight: 400;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .header__drawer-item-en {
    font-size: 3rem;
    line-height: 0.8958333333;
    letter-spacing: 0em;
    font-weight: 400;
  }
}

.header__drawer-item-ja {
  font-size: 0.8125rem;
  line-height: 1.2307692308;
  letter-spacing: 0em;
  font-weight: 400;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .header__drawer-item-ja {
    font-size: 0.9375rem;
  }
}

.header__drawer-sns {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .header__drawer-sns {
    justify-content: flex-start;
  }
}

.header__drawer-sns-item a {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s;
}
.header__drawer-sns-item a:hover {
  opacity: 0.6;
}
.header__drawer-sns-item img {
  display: block;
  width: 1.25rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .header__drawer-sns-item img {
    width: 1.5rem;
  }
}

.header__drawer-cta {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media screen and (min-width: 1024px) {
  .header__drawer-cta {
    flex-direction: row;
  }
}

.header__drawer-cta-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.9375rem 1.25rem;
  text-decoration: none;
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0.03em;
  font-weight: 500;
  color: #191E1E;
  width: 15.9375rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .header__drawer-cta-btn {
    font-size: 1.125rem;
    padding: 1.25rem;
    width: 100%;
  }
}

.header__drawer-cta-btn--white {
  background-color: #ffffff;
}

.header__drawer-cta-btn--green {
  background-color: #2EE5C4;
}

.header__drawer-cta-icon {
  background: #191E1E;
  border-radius: 0.1875rem;
  width: 0.9375rem;
  height: 0.9375rem;
}

.footer {
  background-color: #DAE1E7;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
@media screen and (min-width: 768px) {
  .footer {
    padding-top: 2.9375rem;
    padding-bottom: 1.5rem;
  }
}

@media screen and (min-width: 768px) {
  .footer__inner {
    max-width: 1380px;
  }
}
@media screen and (min-width: 1024px) {
  .footer__inner {
    padding-left: 3.125rem;
  }
}

.footer__wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .footer__wrap {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
  }
}

.footer__left {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .footer__left {
    gap: 1.875rem;
    padding: 0 1.5625rem 1.5625rem;
  }
}
@media screen and (min-width: 1024px) {
  .footer__left {
    padding: 0 3.125rem 1.5625rem;
  }
}

.footer__logo a {
  display: block;
}
.footer__logo img {
  width: 6.25rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .footer__logo img {
    width: 6.875rem;
  }
}

.footer__link a {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  font-size: 0.625rem;
  font-weight: 400;
  color: #000;
  text-decoration: none;
  transition: opacity 0.3s;
  white-space: nowrap;
}
.footer__link a::after {
  content: "";
  background: url(../img/common/link-circle.svg) no-repeat center center/contain;
  width: 1rem;
  height: 1rem;
  margin-top: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .footer__link a::after {
    width: 1.25rem;
    height: 1.25rem;
  }
}
.footer__link a:hover {
  opacity: 0.6;
}
@media screen and (min-width: 768px) {
  .footer__link a {
    font-size: 0.8125rem;
  }
}

.footer__nav {
  margin-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .footer__nav {
    margin-top: 0;
  }
}

.footer__nav-items {
  list-style: none;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.25rem;
  padding-inline: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .footer__nav-items {
    flex-direction: row;
    justify-content: flex-end;
    padding: 0;
  }
}

.footer__nav-item a {
  font-size: 0.875rem;
  font-weight: 400;
  color: #191E1E;
  text-decoration: none;
  transition: opacity 0.3s;
}
.footer__nav-item a:hover {
  opacity: 0.6;
}

.footer__sns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .footer__sns {
    justify-content: flex-end;
  }
}

.footer__sns-link {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s;
}
.footer__sns-link:hover {
  opacity: 0.6;
}
.footer__sns-link img {
  width: 1.25rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .footer__sns-link img {
    width: 1.5rem;
  }
}

.footer__sns-link--x img {
  width: 1.125rem;
}
@media screen and (min-width: 768px) {
  .footer__sns-link--x img {
    width: 1.25rem;
  }
}

.footer__copyright {
  display: block;
  margin-top: 3.75rem;
  text-align: center;
  font-size: 0.6875rem;
  letter-spacing: 0.03em;
  font-weight: 400;
  color: #191E1E;
  opacity: 0.5;
}
@media screen and (min-width: 768px) {
  .footer__copyright {
    margin-top: 2.5rem;
    text-align: right;
    font-size: 0.6875rem;
  }
}

.ng-page {
  color: #191E1E;
  overflow-x: clip;
}

.ng-page .sub-page__nav-link.is-current::before,
.ng-page .sub-page__nav-link:hover::before,
.ng-page .sub-page__nav-link:focus-visible::before {
  width: 0.375rem;
}

.ng-page .sub-page__nav-link.is-current,
.ng-page .sub-page__nav-link:hover,
.ng-page .sub-page__nav-link:focus-visible {
  color: #2EE5C4;
}

.ng-section-header__ja {
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 400;
  color: #ffffff;
  background: #191E1E;
  display: block;
  width: fit-content;
  padding: 0.125rem 0.1875rem;
}
@media screen and (min-width: 768px) {
  .ng-section-header__ja {
    font-size: 1.625rem;
    padding: 0.1875rem;
  }
}

.ng-section-header__en {
  margin-top: 0.625rem;
  font-family: "Jost", sans-serif;
  display: block;
  font-size: 3.125rem;
  line-height: 0.8;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .ng-section-header__en {
    font-size: 5.625rem;
  }
}

.ng-inner {
  padding-inline: 0.625rem;
}
@media screen and (min-width: 768px) {
  .ng-inner {
    padding-inline: 1.5625rem;
    max-width: 1170px;
  }
}
@media screen and (min-width: 1024px) {
  .ng-inner {
    padding-inline: 0;
  }
}

@media screen and (min-width: 768px) {
  .ng-massage__inner {
    padding-inline: 1.5625rem;
  }
}

.ng-hero {
  padding: 1.25rem 0 4.125rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .ng-hero {
    padding: 0;
    padding-top: 5rem;
  }
}

.ng-hero__inner {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  max-width: 500px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .ng-hero__inner {
    max-width: 1155px;
    margin-right: max(0px, (100vw - 1440px) / 2);
    margin-left: auto;
    flex-direction: row-reverse;
    align-items: flex-start;
    gap: 1.5625rem;
    padding-inline: 1.5625rem;
  }
}

.ng-hero__image-wrapper {
  position: relative;
}
@media screen and (min-width: 768px) {
  .ng-hero__image-wrapper {
    width: min(55vw, 48.75rem);
  }
}

.ng-hero__swiper,
.ng-hero__image {
  width: 100%;
}

.ng-hero__image img {
  width: 100%;
  height: auto;
  display: block;
}

.ng-hero__lead {
  text-align: left;
  font-size: 3.375rem;
  line-height: 1;
  letter-spacing: -0.08em;
  font-weight: 700;
  padding-right: 0.625rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__lead {
    writing-mode: vertical-rl;
    text-align: start;
    font-size: min(8.3vw, 7.5rem);
    line-height: 0.93;
    letter-spacing: 0;
    padding-left: 0rem;
    padding-right: clamp(0px, -25 * (100vw - 1440px) / -416 + 25px, 25px);
    width: auto;
    margin-top: 2.1875rem;
  }
}

.ng-hero__deck {
  position: absolute;
  z-index: 50;
  left: 0.625rem;
  bottom: -2.875rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__deck {
    left: clamp(-190px, -100 * (100vw - 768px) / 672 - 90px, -90px);
    bottom: clamp(5px, -47 * (100vw - 1440px) / -672 + 52px, 52px);
  }
}

.ng-hero__deck-label {
  font-family: "Jost", sans-serif;
  font-size: 0.875rem;
  line-height: 1.4285714286;
  letter-spacing: 0em;
  font-weight: 500;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .ng-hero__deck-label {
    font-size: 0.875rem;
    line-height: 1.7857142857;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.ng-hero__deck-title {
  font-size: 1rem;
  line-height: 1.25;
  letter-spacing: 0em;
  font-weight: 500;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .ng-hero__deck-title {
    font-size: 1.25rem;
    line-height: 1.25;
  }
}

.ng-hero__deck-content {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__deck-content {
    margin-top: 1.25rem;
    gap: clamp(5px, -15 * (100vw - 1440px) / -672 + 20px, 20px);
  }
}

.ng-hero__deck-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ng-hero__deck-item {
  font-size: 0.8125rem;
  line-height: 1.5384615385;
  letter-spacing: 0em;
  font-weight: 700;
  background: #ffffff;
  padding-inline: 0.625rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__deck-item {
    padding-block: 0.125rem;
    font-size: clamp(14px, -4 * (100vw - 1440px) / -672 + 18px, 18px);
    line-height: 1.4;
  }
}
.ng-hero__deck-group--highlight .ng-hero__deck-item {
  color: #ffffff;
  background: #191E1E;
  font-size: 0.9375rem;
  letter-spacing: 0em;
  font-weight: 700;
  padding-inline: 0.375rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__deck-group--highlight .ng-hero__deck-item {
    font-size: clamp(16px, -6 * (100vw - 1440px) / -672 + 22px, 22px);
    padding-inline: 0.625rem;
  }
}

.ng-hero__decoration {
  position: absolute;
  z-index: -1;
}

.ng-hero__decoration--e {
  width: 8.9375rem;
  height: auto;
  left: -6.125rem;
  top: 0;
}
@media screen and (min-width: 768px) {
  .ng-hero__decoration--e {
    width: 11.4583333333vw;
    max-width: 10.3125rem;
    left: clamp(-75px, -30 * (100vw - 768px) / 672 - 45px, -45px);
  }
}

.ng-hero__decoration--circle {
  width: 15.125rem;
  height: auto;
  left: -7.5rem;
  bottom: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__decoration--circle {
    width: 13.0555555556vw;
    max-width: 11.75rem;
    left: -3.25rem;
    bottom: -0.625rem;
  }
}

.ng-hero__decoration--w {
  width: 15rem;
  height: auto;
  right: -7.5rem;
  top: 12rem;
}
@media screen and (min-width: 768px) {
  .ng-hero__decoration--w {
    width: 16.6666666667vw;
    max-width: 15rem;
    right: -1.875rem;
    top: auto;
    bottom: clamp(-80px, -32 * (100vw - 768px) / 672 - 48px, -48px);
  }
}

.ng-message {
  background-color: #191E1E;
  color: #ffffff;
  padding-block: 5rem;
}
@media screen and (min-width: 768px) {
  .ng-message {
    padding-block: 8.75rem;
  }
}

.ng-message__label {
  font-family: "Jost", sans-serif;
  font-size: 0.875rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 400;
  text-transform: uppercase;
}
@media screen and (min-width: 768px) {
  .ng-message__label {
    font-size: 1.25rem;
  }
}

.ng-message__body {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .ng-message__body {
    margin-top: 3.75rem;
  }
}

.ng-message__para {
  display: flex;
  flex-direction: column;
}
.ng-message__para + .ng-message__para {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .ng-message__para + .ng-message__para {
    margin-top: 3.75rem;
  }
}

.ng-message__line {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.1em;
  font-size: 4.8vw;
  background: linear-gradient(90deg, #fff var(--ng-reveal, 0%), rgba(255, 255, 255, 0.2) var(--ng-reveal, 0%));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
@media screen and (min-width: 768px) {
  .ng-message__line {
    font-size: min(3.2vw, 2.5rem);
    line-height: 1.45;
    letter-spacing: 0.1em;
  }
}

@media screen and (min-width: 768px) {
  .sub-page__layout--new-graduate {
    grid-template-columns: 10.75rem 1fr;
    max-width: 1320px;
  }
}

.ng-culture,
.ng-flow {
  padding-top: 3.75rem;
}
@media screen and (min-width: 768px) {
  .ng-culture,
  .ng-flow {
    padding-top: 10rem;
  }
}

.ng-interview {
  padding-top: 5.375rem;
}
@media screen and (min-width: 768px) {
  .ng-interview {
    padding-top: 10rem;
    clip-path: inset(0 -100vw 0 0);
  }
}

.ng-interview__inner {
  padding-right: 0;
  padding-left: 0.625rem;
  max-width: none;
}
@media screen and (min-width: 768px) {
  .ng-interview__inner {
    padding-left: 1.5625rem;
  }
}
@media screen and (min-width: 1024px) {
  .ng-interview__inner {
    padding-left: 0;
  }
}

.swiper.ng-interview__swiper {
  position: relative;
  overflow: visible;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .swiper.ng-interview__swiper {
    margin-top: 3.75rem;
  }
}

.ng-interview__swiper .ng-interview__slide {
  width: 17.5rem;
  margin-right: 1.25rem;
}
@media screen and (min-width: 768px) {
  .ng-interview__swiper .ng-interview__slide {
    width: 35rem;
    margin-right: 2.5rem;
  }
}

.ng-interview__slide-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.ng-interview__img-wrap {
  position: relative;
}

.ng-interview__counter {
  position: absolute;
  top: 0.6875rem;
  left: 0.625rem;
  font-family: "Jost", sans-serif;
  font-size: 1.25rem;
  line-height: 0.8;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .ng-interview__counter {
    top: 1.4375rem;
    left: 1.25rem;
    font-size: 1.875rem;
  }
}

.ng-interview__counter-tot {
  font-size: 0.75rem;
}
@media screen and (min-width: 768px) {
  .ng-interview__counter-tot {
    font-size: 1rem;
  }
}

.ng-interview__link-btn {
  position: absolute;
  top: 0;
  right: 0;
  width: 2.25rem;
  height: 2.25rem;
  background: #2EE5C4;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
@media screen and (min-width: 768px) {
  .ng-interview__link-btn {
    width: 4.375rem;
    height: 4.375rem;
  }
}

.ng-interview__link-btn-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: 0.9375rem;
  height: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .ng-interview__link-btn-icon {
    width: 1.375rem;
    height: 1.375rem;
  }
}
.ng-interview__link-btn-icon svg {
  width: 100%;
  height: auto;
  transition: 0.3s;
}
.ng-interview__link-btn-icon svg:nth-of-type(1) {
  position: relative;
}
.ng-interview__link-btn-icon svg:nth-of-type(2) {
  position: absolute;
  inset: 0;
  margin: auto;
  transform: translate(-140%, 140%);
}

.ng-interview__img {
  border: 1px solid #2EE5C4;
  overflow: hidden;
  aspect-ratio: 14/9;
  display: block;
}
.ng-interview__img img {
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}

.ng-interview__slide-link:hover .ng-interview__img img {
  transform: scale(1.05);
}
.ng-interview__slide-link:hover .ng-interview__link-btn-icon svg:nth-of-type(1) {
  transform: translate(140%, -140%);
}
.ng-interview__slide-link:hover .ng-interview__link-btn-icon svg:nth-of-type(2) {
  transform: translate(0, 0);
}

.ng-interview__quote {
  margin-top: -0.0625rem;
}

.ng-interview__quote-text {
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 700;
  background: #191E1E;
  padding: 0.1875rem 0.625rem;
  display: block;
  width: fit-content;
}
@media screen and (min-width: 768px) {
  .ng-interview__quote-text {
    font-size: 2rem;
    line-height: 1.2;
  }
}

.ng-interview__quote-main {
  color: #2EE5C4;
}
@media screen and (min-width: 768px) {
  .ng-interview__quote-main {
    padding: 0.625rem 0.625rem 0.3125rem;
  }
}

.ng-interview__quote-sub {
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .ng-interview__quote-sub {
    padding: 0.3125rem 0.625rem 0.625rem;
  }
}

.ng-interview__profile {
  margin-top: 0.625rem;
}

.ng-interview__name-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.625rem;
}

.ng-interview__name {
  font-size: 1.125rem;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .ng-interview__name {
    font-size: 1.625rem;
  }
}

.ng-interview__pos {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #191E1E;
  padding: 0.125rem 0.5rem;
  line-height: 1;
  white-space: nowrap;
  font-size: 0.6875rem;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .ng-interview__pos {
    padding: 0.25rem 0.625rem;
    font-size: 0.8125rem;
  }
}

.ng-interview__role {
  margin-top: 0.1875rem;
  font-size: 0.75rem;
  line-height: 1.5;
  letter-spacing: 0em;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  .ng-interview__role {
    font-size: 0.875rem;
  }
}

.ng-interview__header {
  display: flex;
  align-items: flex-end;
  gap: 1.875rem;
}

.ng-interview__nav {
  display: flex;
  gap: 0.125rem;
  flex-shrink: 0;
}

.ng-interview__prev,
.ng-interview__next {
  width: 2.375rem;
  height: 2.5rem;
  background: #191E1E;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ng-interview__prev svg,
.ng-interview__next svg {
  width: 0.5rem;
  height: 0.75rem;
  fill: #ffffff;
  transition: fill 0.3s;
}
.ng-interview__prev.is-boundary,
.ng-interview__next.is-boundary {
  pointer-events: none;
  cursor: default;
}
.ng-interview__prev.is-boundary svg,
.ng-interview__next.is-boundary svg {
  fill: #2EE5C4;
}

.ng-culture__list {
  display: flex;
  flex-direction: column;
  gap: 0.0625rem;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .ng-culture__list {
    margin-top: 3.75rem;
  }
}

.ng-culture__item {
  background: #191E25;
  padding: 1.875rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1.875rem;
}
@media screen and (min-width: 768px) {
  .ng-culture__item {
    display: grid;
    grid-template-columns: 1fr 55%;
    gap: 1.25rem;
    padding: clamp(30px, -30 * (100vw - 1440px) / -672 + 60px, 60px) clamp(20px, -20 * (100vw - 1440px) / -672 + 40px, 40px);
  }
}

.ng-culture__item-head {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  flex-shrink: 0;
}

.ng-culture__label {
  font-family: "Jost", sans-serif;
  font-size: 0.75rem;
  line-height: 0.8;
  letter-spacing: 0em;
  font-weight: 500;
  color: #2EE5C4;
}
@media screen and (min-width: 768px) {
  .ng-culture__label {
    font-size: 0.8125rem;
  }
}

.ng-culture__title {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.375rem;
  line-height: 1.2;
  letter-spacing: 0em;
  font-weight: 500;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .ng-culture__title {
    font-size: 2rem;
  }
}

.ng-culture__text {
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6;
  color: #ffffff;
}
.ng-culture__text span {
  color: #2EE5C4;
}
@media screen and (min-width: 768px) {
  .ng-culture__text {
    font-size: 1.25rem;
  }
}

.ng-flow__list {
  margin-top: 1.875rem;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
  padding: 0;
}
@media screen and (min-width: 768px) {
  .ng-flow__list {
    margin-top: 3.75rem;
  }
}

.ng-flow__item {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  background: #ffffff;
  padding: 1.25rem 0.625rem;
  border: 1px solid #191E1E;
}
@media screen and (min-width: 768px) {
  .ng-flow__item {
    gap: 2.5rem;
    padding: 1.875rem 2.5rem;
  }
}
.ng-flow__item--last {
  background: #191E1E;
}
.ng-flow__item--last .ng-flow__step-label,
.ng-flow__item--last .ng-flow__step-num {
  color: #ffffff;
}
.ng-flow__item--last .ng-flow__desc {
  color: #ffffff;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  .ng-flow__item--last .ng-flow__desc {
    line-height: 2;
  }
}

.ng-flow__step {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3125rem;
  flex-shrink: 0;
  min-width: 2.125rem;
  font-family: "Jost", sans-serif;
  padding-top: 0.125rem;
}
@media screen and (min-width: 768px) {
  .ng-flow__step {
    gap: 0.625rem;
  }
}

.ng-flow__step-triangle {
  position: absolute;
  left: 50%;
  transform: translate(-50%);
  bottom: -1.125rem;
}
.ng-flow__step-triangle svg {
  width: 0.75rem;
  height: 0.375rem;
}

.ng-flow__step-label {
  font-size: 0.9375rem;
  line-height: 0.8;
  letter-spacing: 0em;
  font-weight: 500;
}

.ng-flow__step-num {
  font-size: 1.25rem;
  line-height: 1.15;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .ng-flow__step-num {
    font-size: 1.875rem;
    line-height: 0.7666666667;
    letter-spacing: 0em;
    font-weight: 500;
  }
}

.ng-flow__label {
  font-size: 0.8125rem;
  letter-spacing: 0em;
  font-weight: 700;
  background: #2EE5C4;
  flex-shrink: 0;
  width: 6.25rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .ng-flow__label {
    font-size: 1.25rem;
    width: 8.75rem;
  }
}

.ng-flow__desc {
  margin-top: 0.3125rem;
  font-size: 0.8125rem;
  line-height: 2;
  letter-spacing: 0em;
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .ng-flow__desc {
    font-size: 1.125rem;
  }
}

.ng-img-strip {
  overflow: visible;
  clip-path: inset(0 -100vw 0 0.625rem);
  padding-top: 2.5rem;
  padding-left: 0.625rem;
}
@media screen and (min-width: 768px) {
  .ng-img-strip {
    padding-top: 8.625rem;
    padding-left: 1.5625rem;
    clip-path: inset(0 -100vw 0 1.5625rem);
  }
}
@media screen and (min-width: 1024px) {
  .ng-img-strip {
    padding-left: 0;
    clip-path: inset(0 -100vw 0 0);
  }
}

.ng-img-strip__track {
  display: flex;
  width: max-content;
  animation: ng-strip-scroll 14s linear infinite;
}
.ng-img-strip__track img {
  width: 9.375rem;
  height: 11.6875rem;
  object-fit: cover;
  flex-shrink: 0;
  margin-right: 0.375rem;
}
@media screen and (min-width: 768px) {
  .ng-img-strip__track img {
    width: 20rem;
    height: 25rem;
  }
}

@keyframes ng-strip-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
.ng-entry {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .ng-entry {
    margin-top: 6.25rem;
  }
}

.ng-entry__panel {
  background: #191E1E;
  border: 0.1875rem solid #2EE5C4;
  padding: 1.25rem;
}
@media screen and (min-width: 768px) {
  .ng-entry__panel {
    padding: 2.5rem;
    display: grid;
    grid-template-columns: 60% 1fr;
    align-items: flex-end;
    justify-content: space-between;
    border-width: 0.375rem;
    gap: 1.25rem;
  }
}

.ng-entry__label {
  font-family: "Jost", sans-serif;
  font-size: 5rem;
  line-height: 0.8;
  letter-spacing: 0em;
  font-weight: 400;
  color: #2EE5C4;
}
@media screen and (min-width: 768px) {
  .ng-entry__label {
    font-size: 6.875rem;
  }
}

.ng-entry__tag {
  display: flex;
  align-items: center;
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .ng-entry__tag {
    margin-top: 2.6875rem;
  }
}

.ng-entry__tag-line {
  display: block;
  height: 2px;
  width: 0.9375rem;
  background: #2EE5C4;
  flex-shrink: 0;
  transform: rotate(66deg);
}
.ng-entry__tag-line--after {
  transform: rotate(-66deg);
}
@media screen and (min-width: 768px) {
  .ng-entry__tag-line {
    width: 1.5625rem;
  }
}

.ng-entry__tag-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2;
  color: #2EE5C4;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .ng-entry__tag-text {
    font-size: 1.75rem;
  }
}

.ng-entry__desc {
  margin-top: 0.625rem;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.4;
  color: #ffffff;
}
@media screen and (min-width: 768px) {
  .ng-entry__desc {
    margin-top: 1.25rem;
    font-size: 1.125rem;
    line-height: 1.5;
  }
}

.ng-entry__btn {
  position: relative;
  margin-top: 1.875rem;
  display: flex;
  align-items: center;
  background: #2EE5C4;
  color: #191E1E;
  font-family: "Jost", sans-serif;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.6;
  padding: 1.25rem;
}
@media screen and (min-width: 768px) {
  .ng-entry__btn {
    font-size: 1.25rem;
    flex-shrink: 0;
    max-width: 23.0625rem;
  }
}
@media screen and (min-width: 1440px) {
  .ng-entry__btn {
    padding: 1.875rem 2.5rem;
  }
}

.ng-entry__btn-arrow {
  position: absolute;
  background: #191E1E;
  width: 2.5rem;
  aspect-ratio: 1/1;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width: 768px) {
  .ng-entry__btn-arrow {
    width: clamp(25px, -15 * (100vw - 1440px) / -672 + 40px, 40px);
  }
}

.ng-entry__btn-arrow-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: 1.0625rem;
  height: 0.875rem;
}
.ng-entry__btn-arrow-icon img {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.0625rem;
  height: 0.875rem;
}
.ng-entry__btn-arrow-icon img:nth-of-type(1) {
  display: none;
}
@media screen and (min-width: 768px) {
  .ng-entry__btn-arrow-icon img:nth-of-type(1) {
    display: block;
    transform: translate(-200%, 200%) rotate(-45deg);
    transition: 0.3s;
  }
}
.ng-entry__btn-arrow-icon img:nth-of-type(2) {
  transform: rotate(-45deg);
}
@media screen and (min-width: 768px) {
  .ng-entry__btn-arrow-icon img:nth-of-type(2) {
    transition: 0.3s;
  }
}

.ng-entry__btn:hover .ng-entry__btn-arrow-icon img:nth-of-type(1) {
  transform: translate(0%, 0%) rotate(-45deg);
  transition: 0.3s;
}
.ng-entry__btn:hover .ng-entry__btn-arrow-icon img:nth-of-type(2) {
  transform: translate(200%, -200%) rotate(-45deg);
  transition: 0.3s;
}

.ng-faq {
  padding-top: 4.375rem;
}
@media screen and (min-width: 768px) {
  .ng-faq {
    padding-top: 10rem;
  }
}

.ng-faq__list {
  margin-top: 1.875rem;
  display: flex;
  flex-direction: column;
  border-bottom: 0.8px solid #191E1E;
}
@media screen and (min-width: 768px) {
  .ng-faq__list {
    margin-top: 3.75rem;
  }
}

.ng-faq__item {
  border-top: 0.8px solid #191E1E;
}

.ng-faq__q {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.625rem;
  background: #ffffff;
  cursor: pointer;
  user-select: none;
  list-style: none;
}
.ng-faq__q::-webkit-details-marker, .ng-faq__q::marker {
  display: none;
}
@media screen and (min-width: 768px) {
  .ng-faq__q {
    gap: 1.25rem;
    padding: 0.625rem 1.25rem;
  }
}

.ng-faq__q-label {
  font-family: "Jost", sans-serif;
  font-size: 1.875rem;
  font-weight: 400;
  line-height: 1;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .ng-faq__q-label {
    font-size: 3.125rem;
    line-height: 1.4;
  }
}

.ng-faq__q-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.9375rem;
  line-height: 1.5;
  letter-spacing: 0em;
  font-weight: 500;
  color: #191E1E;
  flex: 1;
}
@media screen and (min-width: 768px) {
  .ng-faq__q-text {
    font-size: 1rem;
    line-height: 2;
  }
}

.ng-faq__icon {
  display: block;
  width: 0.9375rem;
  height: 0.9375rem;
  flex-shrink: 0;
  position: relative;
  transition: transform 0.3s;
}
@media screen and (min-width: 768px) {
  .ng-faq__icon {
    width: 1.5625rem;
    height: 1.5625rem;
  }
}
.ng-faq__icon::before, .ng-faq__icon::after {
  content: "";
  position: absolute;
  background: #191E1E;
  transition: transform 0.3s, opacity 0.3s;
}
.ng-faq__icon::before {
  width: 0.9375rem;
  height: 0.125rem;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
@media screen and (min-width: 768px) {
  .ng-faq__icon::before {
    width: 1.5625rem;
  }
}
.ng-faq__icon::after {
  width: 0.125rem;
  height: 0.9375rem;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .ng-faq__icon::after {
    height: 1.5625rem;
  }
}

details.ng-faq__item[open] .ng-faq__icon::after {
  transform: translateX(-50%) rotate(90deg);
  opacity: 0;
}

.ng-faq__a {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0 0.625rem 0.625rem;
  background: #ffffff;
  transform: translateY(-0.5rem);
  transition: transform 0.4s ease;
}
@media screen and (min-width: 768px) {
  .ng-faq__a {
    gap: 1.25rem;
    padding: 0 1.25rem 0.625rem;
  }
}

details.ng-faq__item[open] .ng-faq__a {
  transform: translateY(0);
}

details.ng-faq__item:not([open]) .ng-faq__a {
  display: none;
}

@supports selector(::details-content) {
  details.ng-faq__item:not([open]) .ng-faq__a {
    display: flex;
  }
  details.ng-faq__item {
    interpolate-size: allow-keywords;
  }
  details.ng-faq__item::details-content {
    block-size: 0;
    opacity: 0;
    transition: block-size 0.4s ease, opacity 0.3s ease, content-visibility 0.4s ease allow-discrete;
  }
  details.ng-faq__item[open]::details-content {
    block-size: auto;
    opacity: 1;
  }
}
.ng-faq__a-label {
  font-family: "Jost", sans-serif;
  font-size: 1.875rem;
  font-weight: 400;
  color: #2EE5C4;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .ng-faq__a-label {
    font-size: 3.125rem;
    line-height: 1.4;
  }
}

.ng-faq__a-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 2;
  flex: 1;
}
@media screen and (min-width: 768px) {
  .ng-faq__a-text {
    font-size: 0.8125rem;
  }
}

.ng__cta {
  margin-top: 6.25rem;
}
@media screen and (min-width: 768px) {
  .ng__cta {
    margin-top: 11.875rem;
  }
}

/*# sourceMappingURL=style.css.map */
