@charset "UTF-8";

/** --------------------------------------------------
 * About TRICKY
 */
.page-about .l-main {
  background-attachment: fixed;
  background-image: url(../../tricky/images/about-mainbg.webp);
  background-position: left 40% top;
  background-size: auto 108vh;
  & .c-breadcrumb {
    background-color: var(--common-color-light);
  }
}
.page-about .l-address {
  margin-block-start: 0;
}

.p-about__section {
  background-color: var(--common-color-light);
}
.p-about-heading {
  display: flex;
  flex-direction: column;
}
.p-about-intro:not(#merit *) {
  margin-block-start: calc(var(--spacer-30) * var(--amplify-x2));
}

/**
 * story
 */
.c-catch__heading:where(#story *) {
  font-size:var(--font-ratio-xl);
}
.p-about-intro:where(#story *) {
  width: 100%;
  max-width: calc((640/15) * 1em);
  margin-inline: auto;
}

/**
 * freestyle
 */
.p-about__section:where(#freestyle) {
  margin-block-start: 50vw;
}
.p-about-intro:where(#freestyle *) {
  width: 100%;
  max-width: calc((600/15) * 1em);
  margin-inline-start: auto;
  margin-inline-end: 0;
}

/**
 * merit
 */
.p-about__section:where(#merit) {
  position: relative;
  &::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: calc(100% - (var(--spacing-lg) * var(--amplify-x1h)));
    height: .1rem;
    max-width: calc((1125/15) * 1em);
    margin-inline: auto;
    background-color: var(--common-border-color);
  }
}
.p-about__subsection:not(:first-of-type) {
  margin-block-start: calc(var(--spacer-70) * var(--amplify-x2));
}
.p-about__subsection:first-of-type {
  margin-block-start: calc(var(--spacer-28) * var(--amplify-x2));
}
.p-about__subsection:last-of-type {
  padding-block-end: calc(1.3em * var(--amplify-x2));
}
.p-about__subfigure {
  overflow: hidden;
  width: 100%;
  & > * {
    object-fit: cover;
    width:  100%;
    height: 100%;
  }
}

@media (max-width: 767px) {
  .c-catch__heading:where(#story *) {
    font-weight: var(--font-weight-medium);
  }
  .c-catch__heading:where(#freestyle *, #merit *) {
    font-weight: var(--font-weight-bold);
  }
  .p-about__subfigure {
    width: calc(100% + var(--spacing-lg));
    aspect-ratio: 16 / 9;
    margin-inline: calc(var(--spacing-rg) * -1);
    margin-block-end: var(--spacing-md);
  }
}
@media (min-width: 768px) {
  .page-about .l-main {
    background-size: calc((1920/1024) * 100vw) auto;
    background-position: center center;
  }
  .p-about-heading__text--xxl {
    font-size: var(--font-ratio-xxl);
  }
  .p-about-heading__text--xl {
    font-size: var(--font-ratio-xl);
  }
  .p-about-intro > *:not([class*="p-about-heading"]) {
    font-size: var(--font-ratio-md);
    line-height: var(--line-height-xl);
  }
  .p-about__section .c-button__wrap {
    justify-content: flex-start;
  }

  .c-catch:where(#story *) {
    margin-inline-start: var(--spacer-96);
  }

  .p-about__section:where(#freestyle) {
    margin-block-start: calc((400/15) * 1em);
  }

  .p-about__subsection {
    display: flex;
    gap: var(--spacer-52);
    &:nth-of-type(odd) {
      flex-direction: row-reverse;
    }
    &:nth-of-type(even) {
      flex-direction: row;
    }
  }
  .p-about__subfigure {
    flex-shrink: 0;
    width: calc((525/15) * 1em);
    aspect-ratio: 540 / 400;
    border-radius: var(--radius-md);
  }
}
@media (min-width: 1025px) {
  .page-about .l-main {
    background-size: 192rem auto;
  }
}

/** --------------------------------------------------
 * Service Overview
 */
.p-service__section {
  width: 100%;
  &:not(:first-of-type) {
    margin-block-start: calc(var(--spacer-60) * var(--amplify-x2));
  }
  & .c-title-icon__heading {
    display: flex;
  }
}
:where(#s-ai) .c-title-icon::before { background-image: url(../../common_img/ico-aisupport.svg); }
:where(#s-management) .c-title-icon::before { background-image: url(../../common_img/ico-efficiency.svg); }
:where(#s-development) .c-title-icon::before { background-image: url(../../common_img/ico-development.svg); }
:where(#s-integration) .c-title-icon::before { background-image: url(../../common_img/ico-integration.svg); }

.p-service-footer {
  margin-block-start: calc(var(--spacer-26) * var(--amplify-x1h));
  line-height: var(--line-height-lg);
}
.p-service-footer__head {
  padding-block: calc(var(--spacer-21) * var(--amplify-x1h)) .5em;
  border-width: .1rem .1rem 0 .1rem;
  border-radius: .4em;
  border-style: solid;
  border-color: var(--common-border-color);
  & * {
    font-size: var(--font-ratio-md);
  }
}
.p-service-footer__head,
.p-service-footer__desc {
  padding-inline: calc(var(--spacer-24) * var(--amplify-x1h));
}


/** --------------------------------------------------
 * Case Study
 */
/* list */
.p-casestudies {
  width: 100%;
  .c-categories + & {
    margin-block-start: calc(var(--spacer-64) * var(--amplify-x2));
  }
}
/* detail */
.p-casestudy__figure {
  overflow: hidden;
  width: 100%;
  height: auto;
  & > * {
    object-fit: cover;
    width:  100%;
    height: 100%;
  }
  & + .p-casestudy__main {
    margin-block-start: calc(var(--spacer-30) * var(--amplify-x2));
  }
}

.p-casestudy__header {
  font-size: 1em;
}
.p-casestudy__heading {
  font-size: var(--font-size-xl);
  line-height: var(--line-height-rg);
}
.p-casestudy__lead {
  margin-block-start: var(--spacing-md);
  font-size: var(--font-ratio-md);
  line-height: var(--line-height-lg);
}
.p-casestudy-info__inner {
  width: 100%;
  padding: var(--spacer-20);
  background-color: var(--common-bg-gray);
}
.p-casestudy-info__figure {
  overflow: hidden;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-rg);
  & > * {
    object-fit: cover;
    width:  100%;
    height: 100%;
  }
}
.p-casestudy-info__items {
  display: grid;
  grid-template-columns: 5em 1fr;
  column-gap: var(--spacing-rg);
  row-gap: .77em;
  font-size: var(--font-ratio-xs);
}
.p-casestudy-info__head {
  border-inline-end: .1rem solid var(--common-border-color);
}

.p-casestudy-menu {
  overflow: hidden;
  width: 100%;
  padding: calc(var(--spacer-12) * var(--amplify-x2)) calc(var(--spacer-16) * var(--amplify-x2));
  border-radius: var(--radius-md);
  background-color: var(--common-bg-gray);
}
.p-casestudy-menu__summary {
  overflow: hidden;
  width: 100%;
  padding: var(--spacing-xs) var(--spacing-rg);
  border-radius: var(--radius-rg);
  background-color: var(--common-color-gray);
  font-size: var(--font-ratio-sm);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-non);
  cursor: pointer;
}
.p-casestudy-menu__items {
  padding-block: var(--spacing-xxs);
  font-size: var(--font-ratio-xs);
}
.p-casestudy-menu__item {
  padding-block: var(--spacing-sm);
  & + & {
    border-block-start: .1rem solid var(--common-border-color);
  }
}
.p-casestudy-menu__link {
  display: flex;
  align-items: center;
  gap: var(--spacing-rg);
  &::before {
    flex-shrink: 0;
    width: 2em;
    background-size: 1.5em;
  }
}
.p-casestudy-menu__text {
  line-height: var(--line-height-non);
}
.p-casestudy__section {
  position: relative;
  &:first-of-type {
    margin-block-start: calc(var(--spacer-60) * var(--amplify-x2));
  }
  &:not(:first-of-type) {
    margin-block-start: calc(var(--spacer-50) * var(--amplify-x2));
  }
}
.p-casestudy__comments {
  margin-block-start: calc(var(--spacing-md) * var(--amplify-x2));
  font-size: var(--font-ratio-md);
  line-height: var(--line-height-lg);
}
.p-casestudy__notes {
  margin-block-start: calc(var(--spacing-rm) * var(--amplify-x2));
  padding: calc(var(--spacing-rg) * var(--amplify-x2));
  border-radius: var(--radius-rg);
  background-color: var(--common-bg-gray);
  font-size: var(--font-ratio-md);
  line-height: var(--line-height-lg);
}

:where(.p-casestudy__lead, .p-casestudy__comments, .p-casestudy__notes) > *:first-of-type {
  margin-block-start: 0;
}
:where(.p-casestudy__lead, .p-casestudy__comments, .p-casestudy__notes) > *:last-of-type {
  margin-block-end: 0;
}

@media (max-width: 767px) {
  /* list */
  .page-casestudy .c-categories {
    margin-block-start: calc(var(--spacer-40) * -1);
  }
  .p-casestudies .c-card:not(:first-of-type) {
    padding-block-start: var(--spacing-rg);
    border-block-start: .1rem solid var(--common-border-color);
  }
  /* detail */
  .p-casestudy__figure {
    overflow: hidden;
    width: 100vw;
    height: 56.25vw;
    margin-inline: calc(var(--spacing-rg) * -1);
  }
  .p-casestudy-info__inner {
    display: grid;
    grid-template-columns: min(33% , calc((160/15) * 1em)) 1fr;
    gap: var(--spacing-rg);
    margin-block-start: var(--spacing-md);
  }
  .p-casestudy-menu {
    margin-block-start: var(--spacing-lg);
  }
}
@media (min-width: 768px) {
  /* list */
  .p-casestudies {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: var(--spacer-80);
    & > *:nth-child(n + 4) {
      margin-block-start: var(--spacer-80);
    }
  }
  /* dateil */
  .p-casestudy__figure {
    overflow: hidden;
    width: 100%;
    height: auto;
    aspect-ratio: 18 / 7;
    border-radius: var(--radius-md);
  }
  .p-casestudy__main {
    display: grid;
    grid-template-columns: 51.2em 17.6em;
    grid-template-rows: auto 1fr;
    column-gap: var(--spacer-48);
  }
  .p-casestudy__header {
    grid-column: span 1;
  }
  .p-casestudy__heading {
    font-size: var(--font-ratio-max);
  }
  .p-casestudy__lead {
    margin-block-start: var(--spacing-ll);
    font-size: var(--font-ratio-lg);
    line-height: var(--line-height-xl);
  }
  .p-casestudy-info {
    grid-column: span 1;
    grid-row: span 2;
  }
  .p-casestudy-info__inner {
    position: sticky;
    top: var(--header-height);
    right: 0;
    padding: var(--spacer-20);
  }
  .p-casestudy-info__items {
    margin-block-start: var(--spacing-rg);
    line-height: var(--line-height-lg);
  }
  .p-casestudy-menu {
    margin-block-start: var(--spacer-60);
  }
  .p-casestudy-menu__summary {
    padding: var(--spacing-rg);
    font-size: var(--font-ratio-rg);
  }
  .p-casestudy-menu__items {
    font-size: var(--font-ratio-md);
  }
}


/** --------------------------------------------------
 * Contact
 */
.page-contact .l-main {
  border-block-end: .1rem solid var(--common-divider);
}

.p-pp__wrapper {
  overflow-y: scroll;
  width: 100%;
  max-width: calc((720/15) * 1em);
  height: calc((225/15) * 1em);
  padding: var(--spacing-sm);
  border-radius: var(---radius-md);
  border: 1px solid var(--common-border-color);
  background-color: var(--common-bg-gray);
  & > * {
    font-size: var(--font-ratio-sm);
  }
}
.p-pp__title {
  display: block;
  margin-block-end: var(--spacing-sm);
  border-block-end: .1rem solid var(--common-border-color);
  font-weight: var(--font-weight-bold);
}
.p-pp__items {
  counter-reset: number 0;
}
.p-pp__item {
  counter-increment: number 1;
  display: grid;
  grid-template-columns: var(--spacing-lg) 1fr;
  grid-template-rows: auto 1fr;
  gap: var(--spacing-exs);
  margin-block-start: var(--spacer-20);
  &::before {
    content: counter(number) ".";
    grid-row: span 2;
    font-weight: var(--font-weight-bold);
    text-align: right;
  }
}
.p-pp__head {
  grid-column: span 1;
  font-weight: var(--font-weight-bold);
}
.p-pp__desc {
  grid-column: span 1;
}
.p-pp__prg,
.p-pp-flex:not(.p-pp-table *) {
  margin-block: var(--spacing-xxs) var(--spacing-sm);
}
.p-pp__list > * + * {
  margin-block-start: var(--spacing-exs);
}
.p-pp__highlight {
  padding: 1em;
  border-radius: var(--radius-rg);
  background-color: var(--common-color-light);
  & *::marker {
    color: var(--common-color-primary);
  }
}
.p-pp-flex__item {
  display: flex;
  & dt {
    flex-shrink: 0;
  }
  & dd {
    flex-grow: 1;
  }
}
.p-pp-table {
  width: fit-content;
  max-width: 100%;
  margin-block: var(--spacing-xxs) var(--spacing-sm);
  gap: .1rem;
  border: .1rem solid var(--common-divider-dark);
  background-color: var(--common-divider-dark);
}
.p-pp-table__row {
  display: grid;
  gap: .1rem;
  & > * {
    padding: var(--spacing-xxs) var(--spacing-sm);
  }
}
.p-pp-table__head {
  background-color: var(--common-color-dark);
  color: var(--common-color-light);
}
.p-pp-table__desc {
  background-color: var(--common-bg-gray);
}
@media (max-width: 767px) {
  .p-pp__title {
    padding: var(--spacing-sm) var(--spacing-sm) var(--spacing-md);
  }
}
@media (min-width: 768px) {
  .p-pp__wrapper {
    height: calc((240/15) * 1em);
    padding: var(--spacer-20);
  }
  .p-pp__title {
    margin-block-end: 2.2858em;
    padding-block-start: .875em;
    padding-block-end: 1.71428em;
    text-align: center;
  }
  .p-pp__prg,
  .p-pp-table,
  .p-pp-flex:not(.p-pp-table *) {
    margin-block: var(--spacing-rg);
  }
  .p-pp-table {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr;
  }
  .p-pp-table__row {
    grid-template-rows: subgrid;
    grid-row: span 2;
    & > * {
      padding: var(--spacing-xs) var(--spacing-sr);
    }
  }
}


/** --------------------------------------------------
 * Company
 */
:where(.page-company) .c-title .c-heading__text {
  margin-block-end: calc(var(--spacer-10) * var(--amplify-x2));
}

.p-company__section:not(:first-of-type) {
  margin-block-start: calc(var(--spacer-70) * var(--amplify-x2));
}
.p-certification__item {
  display: flex;
  flex-direction: column;
  gap: calc(var(--spacing-xs) * var(--amplify-x2h));
  &:not(:first-of-type) {
    margin-block-start: calc(var(--spacing-rm) * var(--amplify-x2));
  }
}
.p-certification__image {
  flex-shrink: 0;
}
.p-certification__body {
  flex-grow: 0;
}

.p-access {
  display: flex;
  flex-direction: column;
  gap: calc(var(--spacer-26) * var(--amplify-x2));
  & + & {
   margin-block-start: calc(var((--spacer-45)) * var(--amplify-x1h));
  }
}
.p-access__figure {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  & > iframe {
    object-fit: cover;
    width:  100%;
    height: 100%;
  }
}
.p-access__head {
  margin-block-end: calc(var(--spacer-14) * var(--amplify-x2));
  padding-block-end: calc(var(--spacing-xxs) * var(--amplify-x2));
  border-block-end: .1rem solid var(--common-border-color);
  font-weight: var(--font-weight-bold);
}
.p-access__desc {
  line-height: var(--line-height-lg);
}
@media (min-width: 768px) {
  :where(.page-company) .l-container--addside {
    grid-template-columns: 14em 54.266em;
  }

  .p-company__section .c-list-table__row {
    display: grid;
    grid-template-columns: 10em 1fr;
  }

  .p-certification__item {
    flex-direction: row;
    align-items: center;
  }
  .p-certification__image {
    width: 11.4em;
    text-align: center;
  }

  .p-access {
    flex-direction: row;
  }
  .p-access__figure {
    flex-shrink: 0;
    width: 24em;
    aspect-ratio: 4 / 3;
  }
}

/** --------------------------------------------------
 * Members: list
 */
.p-members {
  position: relative;
}
.p-members-catch__heading {
  font-size: 1em;
  text-wrap: pretty;
  word-break: auto-phrase;
}
.p-members-catch__text {
  font-size: 1.2em;
}
.p-members-intro {
  margin-block-start: 1em;
}
.p-members-list__items,
.p-othermember-list__items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-block-start: calc(1.4em * var(--amplify-x2));
  gap: 1.4em;
}
.p-members-list__bg {
  overflow: hidden;
  position: relative;
  width:  100%;
  height: auto;
  aspect-ratio: 1 / 1;
  background-image: linear-gradient(0deg, transparent 8%, var(--member-color, var(--common-color-gray)) 8%, var(--member-color, var(--common-color-gray)) 67.7%, transparent 67.7%);
  background-size: cover;
  &::after {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    background-size: contain;
  }
  [data-label="staff01"] & {
    --marquee-text: 10.667;
    --member-color: var(--member-color-1);
    &::before { background-image: url(../../members/images/post1.svg); }
    &::after { background-image: url(../../members/images/staff01.webp); }
  }
  [data-label="staff02"] & {
    --marquee-text: 10.667;
    --member-color: var(--member-color-2);
    &::before { background-image: url(../../members/images/post2.svg); }
    &::after { background-image: url(../../members/images/staff02.webp); }
  }
  [data-label="staff03"] & {
    --marquee-text: 10.667;
    --member-color: var(--member-color-3);
    &::before { background-image: url(../../members/images/post3.svg); }
    &::after { background-image: url(../../members/images/staff03.webp); }
  }
  [data-label="staff04"] & {
    --marquee-text: 15.067;
    --member-color: var(--member-color-4);
    &::before { background-image: url(../../members/images/post4.svg); }
    &::after { background-image: url(../../members/images/staff04.webp); }
  }
  [data-label="staff05"] & {
    --marquee-text: 13.6;
    --member-color: var(--member-color-5);
    &::before { background-image: url(../../members/images/post5.svg); }
    &::after { background-image: url(../../members/images/staff05.webp); }
  }
}
.p-members-list__num {
  z-index: 5;
  display: flex;
  flex-direction: column;
  position: absolute;
  /* top: 1.125em; */
  top: .444em;
  right: .444em;
  font-family: var(--common-font-family-secondary);
  font-size: calc((24/var(--min-width)) * 100vw);
  line-height: var(--line-height-non);
  text-align: center;
  &::before {
    content: "Staff";
    font-size: .388em;
    line-height: var(--line-height-rg);
    text-transform: uppercase;
  }
}
.p-members-list__info {
  margin-block-start: calc(.8em * var(--amplify-x2));
  line-height: var(--line-height-non);
}
.p-members-list__post,
.p-member-info__post {
  font-size: .5em;
}
.p-members-list__name,
.p-member-info__name {
  margin-block-start: .1em;
  font-size: 1.125em;
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-md);
}
.p-members-list__ruby,
.p-member-info__ruby {
  margin-block-start: .5em;
  font-family: var(--common-font-family-secondary);
  font-size: .666em;
  letter-spacing: 0.04em;
}
@media (min-width: 768px) {
  .p-members-catch__heading {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .p-members-catch__text {
    font-size: 1.867em;
  }
  .p-members-list__items {
    column-gap: 4.267em;
    row-gap: 3.2em;
  }
  .p-othermember-list__items {
    grid-template-columns: repeat(3, 1fr);
    column-gap: 2em;
  }
  .p-members-list__num {
    /* top: 25.6%; */
    top: 5.3%;
    right: 5.3%;
    font-size: 2.067em;
    .p-othermember-list__items & {
      /* top: 23.4%; */
    }
  }
  .p-members-list__post {
    font-size: .8em;
  }
  .p-members-list__name {
    font-size: 1.334em;
  }
  .p-members-list__ruby {
    font-size: .734em;
  }

  .p-othermember-list + .c-button__wrap {
    justify-content: flex-start;
  }
}
@media (any-hover: hover) {
  .p-members-list__bg::before {
    content: "";
    opacity: 0;
    display: block;
    position: absolute;
    bottom: 8%;
    left: 0;
    width: 100%;
    height: 1em;
    background-repeat: repeat;
    background-size: calc(var(--marquee-text) * 1.5em) auto;
    background-position: left top;
    animation: marqueetext calc(var(--marquee-text) * .975s) infinite linear;
    font-size: calc(2em * var(--amplify-x2));
    transition: opacity .3s;
  }
  .p-members-list__link:hover .p-members-list__bg::before {
    opacity: .45;
  }
  .p-members-list__bg::after {
    transition: transform .3s;
  }
  .p-members-list__link:hover .p-members-list__bg::after {
    transform: scale(1.05);
  }
}

/**
 * Member detail
 */
.p-member-article {
  padding-block-start: 4.6em;
  background-color: var(--member-color);
  /*color: var(--member-text-color);*/
  color: var(--color-black);
  &[data-label="staff01"] {
    --member-color: var(--member-color-1);
  }
  &[data-label="staff02"] {
    --member-color: var(--member-color-1);
  }
  &[data-label="staff03"] {
    --member-color: var(--member-color-1);
  }
  &[data-label="staff04"] {
    --member-color: var(--member-color-1);
  }
  &[data-label="staff05"] {
    --member-color: var(--member-color-1);
  }
}

.p-member-header {
  position: relative;
}
.p-member__figure {
  z-index: 1;
  position: absolute;
  top: 0;
  width: 100%;
  aspect-ratio: 1 / 1;
  text-align: center;
  & img {
    object-fit: contain;
    object-position: right top;
    width: unset;
    height: 100%;
  }
  &::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 50%;
    background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.94)));
    background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.94));
    background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.94));
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
  }
}
.p-member-header__content {
  z-index: 5;
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
  padding-block: 4.5em 1em;
  aspect-ratio: 1 / 1;
}
.p-member-catch,
.p-member-catch__cover {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(.2rem * var(--amplify-x1h));
  font-size: 1em;
}
.p-member-catch {
  margin-block-start: 1em;
}
.p-member-catch__text {
  display: block;
  padding-inline: .2em;
  background-color: var(--common-color-light);
	font-weight: var(--font-regular);
	font-family: var(--font-jp);
  font-size: min(var(--font-ratio-max), calc((21/var(--min-width)) * 100vw));
  line-height: var(--line-height-xs);
}
.p-member-contents {
  z-index: 10;
  position: relative;
}
.p-member-section {
  margin-block-start: calc(2.134em * var(--amplify-x2))
}
.p-member-content {
  margin-block-start: 1em;
  font-size: 1em;
  line-height: var(--line-height-lg);
}
.p-member-heading {
  font-size: 1em;
}
.p-member-heading__text {
  font-size: var(--font-size-xl);
}
.p-member-profile {
  display: flex;
  align-items: flex-start;
  width: 100%;
}
.p-member-profile__head {
  flex-shrink: 0;
  &::after {
    content: "：";
    padding-inline: .5em;
  }
}
.p-member-profile__desc {
  flex-grow: 1;
}
.p-member-footer {
  padding-block: calc(2.8em * var(--amplify-x1)) calc(4.8em * var(--amplify-x1));
}
.p-member-footer__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
	font-weight: var(--font-regular);
	font-family: var(--font-jp);
  font-size: var(--font-ratio-ltd);
}


@media (max-width: 767px) {
  .p-member-header {
    overflow: hidden;
    margin-inline-end: -1em;
  }
  .p-member__figure {
    right: -5em;
    bottom: 0;
  }
  .p-member-header__content {
    max-width: 33.867em;
    justify-content: flex-end;
  }
  .p-member-catch {
    margin-block-start: 15vw;
  }
  .p-member-catch__cover {
    flex-direction: row;
    gap: 0;
    & > *:first-of-type {
      padding-inline-end: 0;
    }
    & > *:last-of-type {
      padding-inline-start: 0;
    }
  }
  .p-member-info {
    font-size: min(var(--font-ratio-exl), calc((20/var(--min-width)) * 100vw));
  }
}
@media (min-width: 768px) {
  .p-member-article {
    z-index: 2;
    position: relative;
    padding-block-start: 7.6em;
    .p-member-contents {
      padding-inline-start: 50%;
    }
  }
  .page-member .l-main,
  .page-member .l-footer {
    position: relative;
    z-index: 1;
  }
  .page-member .l-address {
    margin-block-start: 0;
  }
  .p-othermember {
    z-index: 11;
    position: relative;
    background-color: var(--common-color-light);
  }
  .p-member-header {
    position: fixed;
    top: 7.6em;
    right: calc(50vw - var(--spacer-60));
    width: calc(50vw + var(--spacer-60) - 2rem);
    max-width: 48.2em;
    height: calc(100vh - 7.6em);
    padding-inline-start: 2rem;
  }
  .p-member__figure {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    width: 50vw;
    aspect-ratio: 1 / 1;
    text-align: center;
    & img {
      object-fit: cover;
      object-position: center top;
      width: unset;
      height: 100%;
    }
  }
  .p-member-header__content {
    z-index: 5;
    position: relative;
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    width: 100%;
    height: auto;
    aspect-ratio: 100 / 96;
  }
  .p-member-heading__text {
    font-size: var(--font-size-xxl);
  }
  .p-member-content {
    font-size: var(--font-ratio-md);
  }
  .p-member-info {
    font-size: var(--font-ratio-xl);
  }
  .p-member-catch {
    font-size: 0.8em;
  }
  .p-member-catch__text {
    font-size: 2.8em;
  }
}
@media (min-width: 1025px) {
  .p-member__figure {
    max-width: 48em;
    height: calc(100vh - 7.6em);
    min-height: 33.867em;
    aspect-ratio: unset;
    /* mask-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 90%, transparent 100%); */
  }
  .p-member-heading__text {
    height: calc(100vh - 7.6em);
    min-height: 33.867em;
  }
  .p-member-info {
    padding-block-start: 3em;
    font-size: var(--font-ratio-xxl);
  }
  .p-member-catch {
    padding-block-end: 2em;
  }
  .p-member-catch__cover {
    flex-direction: row;
    gap: 0;
    & > *:first-of-type {
      padding-inline-end: 0;
    }
    & > *:last-of-type {
      padding-inline-start: 0;
    }
  }
  .p-member-footer {
    padding-block: calc(2.8em * var(--amplify-x2)) calc(4.8em * var(--amplify-x2));
  }
  .p-member-footer__text {
    font-size: calc((var(--font-size-xxl) + var(--font-ratio-min)) * var(--amplify-x2));
  }
}
@media (min-width: 1160px) {
  .p-member-catch {
    font-size: 0.9em;
  }
}
@media (min-width: 1280px) {
  .p-member-catch {
    font-size: 1em;
  }
}

/* 写真差し替えによる調整 */
.p-member-article--adjust01 {
  & .p-member__figure {
    position: fixed;
    left: 0;
    top: 108px;
    width: 47vw;
    max-width: unset;
    z-index: -1;
    img {
      width: 100%;
    }
  }
  & .p-member-header__content {
    height: 100%;
  }
  & .p-member-info {
    color: #fff;
    padding-bottom: 2em;
  }
}


@media screen and (max-width: 1200px) {
  .p-member-article--adjust01 {
    padding-block-start: 80px;
    & .p-member__figure {
      top: 80px;
      height: 100%;
      & img {
        object-position: top right;
      }
    }
    &[data-label="staff02"],
    &[data-label="staff03"],
    &[data-label="staff04"],
    &[data-label="staff05"] {
      & .p-member__figure {
        & img {
          object-position: top left;
        }
      }  
    }
  }  
}


@media screen and (max-width: 767px) {
  .p-member-article--adjust01 {
    & .p-member__figure {
      position: absolute;
      top: 80px;
      z-index: auto;
      width: 100%;
      height: 400px;  
      & img {
        object-position: top left;
        object-fit: cover;
        /* height: 100%; */
      }
    }
    & .p-member-header {
      height: 400px;
      margin-inline-end: 0;
    }
    & .p-member-header__content {
      justify-content: flex-start;
    }
  }  
}

@media screen and (max-width: 428px) {
  .p-member-article--adjust01 {
    & .p-member-info {
      padding-bottom: 0;
    }
   }    
}