/* ====================
   introduce - INDEX
   ==================== */
[data-page='introduce'] .her-introduce-list {
  width: min(100%, 1440px);
  margin-inline: auto;
}

[data-page='introduce'] .her-introduce-list:first-of-type {
  margin-block: calc(60 / 1440 * 100%) 0;
}

[data-page='introduce'] .her-introduce-row {
  display: flex;
  width: 100%;
}

[data-page='introduce'] .her-introduce-item {
  display: flex;
  width: 50%;
}

[data-page='introduce'] .her-introduce-ph,
[data-page='introduce'] .her-introduce-profile {
  width: 50%;
}

[data-page='introduce'] .her-introduce-ph img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

[data-page='introduce'] .her-introduce-profile {
  position: relative;
  background: #fff;
}

[data-page='introduce'] .her-introduce-profile-red {
  color: #fff;
  background: #fa000f;
}

[data-page='introduce'] .her-introduce-link {
  position: relative;
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-end;
  width: 100%;
  height: 100%;
  padding-block: 0 calc(60 / 360 * 100%);
  padding-inline: calc(30 / 360 * 100%);
  color: inherit;
  text-decoration: none;
}

[data-page='introduce'] .her-session-member-name {
  margin-block: calc(10 / 226 * 100%) 0;
  font-size: min(calc(26 / 1440 * 100vw), 26px);
  font-weight: bold;
}

[data-page='introduce'] .her-session-member-name-en {
  position: relative;
  padding-block: 0 calc(10 / 226 * 100%);
  font-weight: bold;
}

[data-page='introduce'] .her-session-member-name-en::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(30 / 226 * 100%);
  height: 2px;
  content: '';
  background-color: #fa000f;
}

[data-page='introduce'] .her-introduce-profile-red .her-session-member-name-en::after {
  background-color: #fff;
}

[data-page='introduce'] .her-session-member-profile {
  margin-block: calc(30 / 260 * 100%) 0;
}

[data-page='introduce'] .her-session-member-profile .her-c-text {
  line-height: 1.6;
}

[data-page='introduce'] .her-introduce-item-reverse .her-introduce-profile {
  text-align: right;
}

[data-page='introduce'] .her-introduce-item-reverse .her-session-member-name-en::after {
  right: 0;
  left: auto;
}

[data-page='introduce'] .her-introduce-arrow-box {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(calc(42 / 1440 * 100vw), 42px);
  height: min(calc(42 / 1440 * 100vw), 42px);
  background: var(--color-red-2);
}

[data-page='introduce'] .her-introduce-arrow {
  display: block;
  width: min(calc(8 / 1440 * 100vw), 8px);
  height: min(calc(15 / 1440 * 100vw), 15px);
  line-height: 0;
}

[data-page='introduce'] .her-introduce-arrow svg {
  position: static;
  display: block;
  width: 100%;
  height: 100%;
  fill: #fff;
}

/* ====================
   balloon
   ==================== */
[data-page='introduce'] .her-introduce-profile::before {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 0;
  height: 0;
  content: '';
  transform: translateY(-50%);
}

[data-page='introduce'] .her-introduce-item:not(.her-introduce-item-reverse) .her-introduce-profile::before {
  left: calc(-12 / 360 * 100%);
  border-top: min(calc(12 / 1440 * 100vw), 12px) solid transparent;
  border-right: min(calc(12 / 1440 * 100vw), 12px) solid #fff;
  border-bottom: min(calc(12 / 1440 * 100vw), 12px) solid transparent;
}

[data-page='introduce'] .her-introduce-item-reverse .her-introduce-profile::before {
  right: calc(-12 / 360 * 100%);
  border-top: min(calc(12 / 1440 * 100vw), 12px) solid transparent;
  border-bottom: min(calc(12 / 1440 * 100vw), 12px) solid transparent;
  border-left: min(calc(12 / 1440 * 100vw), 12px) solid #fff;
}

[data-page='introduce'] .her-introduce-item:not(.her-introduce-item-reverse) .her-introduce-profile-red::before {
  border-right-color: #fa000f;
}

[data-page='introduce'] .her-introduce-item-reverse .her-introduce-profile-red::before {
  border-left-color: #fa000f;
}

/* ====================
   radius
   ==================== */
[data-page='introduce'] .her-introduce-item > div:nth-child(2) {
  border-radius: 0 min(calc(30 / 1440 * 100vw), 30px) 0 0;
}

/* ====================
   hover
   ==================== */
[data-page='introduce'] .her-introduce-link .her-session-member-name,
[data-page='introduce'] .her-introduce-link .her-session-member-name-en,
[data-page='introduce'] .her-introduce-link .her-session-member-profile,
[data-page='introduce'] .her-introduce-arrow-box {
  transition: all 0.3s;
}

@media (hover: hover) {
  [data-page='introduce'] .her-introduce-link:hover .her-session-member-name,
  [data-page='introduce'] .her-introduce-link:hover .her-session-member-name-en,
  [data-page='introduce'] .her-introduce-link:hover .her-session-member-profile,
  [data-page='introduce'] .her-introduce-link:hover .her-introduce-arrow-box {
    opacity: 0.6;
  }
}

@media screen and (width <= 767px) {
  [data-page='introduce'] .her-introduce-list:first-of-type {
    margin-block: calc(60 / 750 * 100%) 0;
  }

  [data-page='introduce'] .her-introduce-row {
    flex-flow: column nowrap;
  }

  [data-page='introduce'] .her-introduce-item {
    width: 100%;
  }

  [data-page='introduce'] .her-introduce-link {
    justify-content: center;
    padding-block: 0 calc(60 / 375 * 100%);
    padding-inline: calc(30 / 375 * 100%);
  }

  [data-page='introduce'] .her-session-member-name {
    margin-block: calc(10 / 375 * 100%) 0;
    font-size: calc(26 / 750 * 100vw);
  }

  [data-page='introduce'] .her-session-member-name-en {
    padding-block: 0 calc(10 / 375 * 100%);
  }

  [data-page='introduce'] .her-session-member-name-en::after {
    width: calc(30 / 315 * 100%);
  }

  [data-page='introduce'] .her-session-member-profile {
    margin-block: calc(30 / 315 * 100%) 0;
  }

  [data-page='introduce'] .her-introduce-arrow-box {
    width: calc(80 / 750 * 100vw);
    height: calc(80 / 750 * 100vw);
  }

  [data-page='introduce'] .her-introduce-arrow {
    width: calc(10 / 750 * 100vw);
    height: calc(18 / 750 * 100vw);
  }

  [data-page='introduce'] .her-introduce-item:not(.her-introduce-item-reverse) .her-introduce-profile::before {
    left: calc(-16 / 750 * 100vw + 1px);
    border-top: calc(16 / 750 * 100vw) solid transparent;
    border-right: calc(16 / 750 * 100vw) solid #fff;
    border-bottom: calc(16 / 750 * 100vw) solid transparent;
  }

  [data-page='introduce'] .her-introduce-item-reverse .her-introduce-profile::before {
    right: calc(-16 / 750 * 100vw + 1px);
    border-top: calc(16 / 750 * 100vw) solid transparent;
    border-bottom: calc(16 / 750 * 100vw) solid transparent;
    border-left: calc(16 / 750 * 100vw) solid #fff;
  }

  [data-page='introduce'] .her-introduce-item > div:nth-child(2) {
    border-radius: 0 calc(30 / 750 * 100vw) 0 0;
  }
}