/* ========================================
   Support 01：Hero
======================================== */

.ark-support-hero {
  --ark-support-green: #304b3b;
  --ark-support-green-light: #738478;
  --ark-support-cream: #f1f2eb;
  --ark-support-white: #f8f8f3;

  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0;

  background:
    radial-gradient(
      circle at 82% 20%,
      rgba(255, 255, 255, 0.055) 0,
      rgba(255, 255, 255, 0) 34%
    ),
    var(--ark-support-green);
}


/* ----------------------------------------
   Inner
---------------------------------------- */

.ark-support-hero-inner {
  position: relative;

  max-width: 1200px;
  min-height: 760px;

  margin: 0 auto;
  padding: 130px 48px 84px;

  display: flex;
  flex-direction: column;
  justify-content: center;
}


/* ----------------------------------------
   Copy
---------------------------------------- */

.ark-support-hero-copy {
  position: relative;
  z-index: 2;

  width: min(100%, 760px);
}


/* Eyebrow */

.ark-support-hero-eyebrow {
  margin: 0 0 32px;

  color: rgba(248, 248, 243, 0.64);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.24em;
}


/* Title */

.ark-support-hero-title {
  margin: 0;

  color: var(--ark-support-white);

  font-size: clamp(52px, 6.3vw, 88px);
  font-weight: 500;
  line-height: 1.17;
  letter-spacing: 0.025em;
}


/* Body */

.ark-support-hero-text {
  max-width: 610px;
  margin-top: 54px;

  color: rgba(248, 248, 243, 0.84);

  font-size: 17px;
  line-height: 2.15;
  letter-spacing: 0.035em;
}

.ark-support-hero-text p {
  margin: 0;
}

.ark-support-hero-text p + p {
  margin-top: 24px;
}


/* ----------------------------------------
   CTA
---------------------------------------- */

.ark-support-hero-action {
  margin-top: 52px;
}

.ark-support-hero-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;

  min-width: 310px;
  min-height: 62px;

  padding: 15px 22px 15px 26px;

  border: 1px solid rgba(241, 242, 235, 0.82);
  border-radius: 2px;

  background: var(--ark-support-cream);
  color: var(--ark-support-green);

  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.06em;

  text-decoration: none;

  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease;
}

.ark-support-hero-button:hover {
  background: transparent;
  color: var(--ark-support-white);
  transform: translateY(-2px);
}

.ark-support-hero-arrow {
  margin-left: 34px;

  font-size: 19px;
  font-weight: 400;

  transition: transform 0.25s ease;
}

.ark-support-hero-button:hover .ark-support-hero-arrow {
  transform: translateX(4px);
}


/* ----------------------------------------
   Bottom message
---------------------------------------- */

.ark-support-hero-message {
  position: absolute;
  right: 48px;
  bottom: 49px;

  margin: 0;

  color: rgba(248, 248, 243, 0.38);

  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.18em;
  writing-mode: vertical-rl;
}


/* ========================================
   Tablet
======================================== */

@media (max-width: 1024px) {

  .ark-support-hero-inner {
    min-height: 720px;
    padding: 110px 40px 74px;
  }

  .ark-support-hero-title {
    font-size: clamp(50px, 8vw, 72px);
  }

  .ark-support-hero-text {
    margin-top: 46px;
  }

  .ark-support-hero-message {
    right: 32px;
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 767px) {

  .ark-support-hero-inner {
    min-height: auto;

    padding:
      92px
      24px
      82px;
  }

  .ark-support-hero-copy {
    width: 100%;
  }

  .ark-support-hero-eyebrow {
    margin-bottom: 25px;

    font-size: 10px;
    letter-spacing: 0.22em;
  }

  .ark-support-hero-title {
    font-size: clamp(44px, 13vw, 58px);
    line-height: 1.2;
  }

  .ark-support-hero-text {
    margin-top: 42px;

    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.025em;
  }

  .ark-support-hero-text p + p {
    margin-top: 21px;
  }

  .ark-support-hero-action {
    margin-top: 44px;
  }

  .ark-support-hero-button {
    width: 100%;
    min-width: 0;
    min-height: 60px;

    padding: 14px 20px 14px 22px;

    font-size: 14px;
  }

  .ark-support-hero-arrow {
    margin-left: 20px;
  }

  .ark-support-hero-message {
    position: static;

    margin-top: 58px;

    font-size: 10px;
    letter-spacing: 0.16em;

    text-align: right;
    writing-mode: horizontal-tb;
  }
}

/* ========================================
   Support 02：Now / 2026
======================================== */

.ark-support-now {
  --ark-now-green: #304b3b;
  --ark-now-green-soft: #65776c;
  --ark-now-bg: #f1f2eb;
  --ark-now-text: #35443b;
  --ark-now-line: rgba(48, 75, 59, 0.25);

  position: relative;
  overflow: hidden;

  width: 100%;
  max-width: none !important;

  margin: 0 !important;
  padding: 0;

  background: var(--ark-now-bg);
  color: var(--ark-now-text);
}


/* ----------------------------------------
   Inner
---------------------------------------- */

.ark-support-now-inner {
  width: min(100% - 96px, 1100px);

  margin: 0 auto;
  padding: 140px 0 130px;
}


/* ========================================
   Header
======================================== */

.ark-support-now-header {
  margin-bottom: 88px;
}

.ark-support-now-eyebrow {
  margin: 0 0 28px;

  color: var(--ark-now-green-soft);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.24em;
}

.ark-support-now-heading {
  margin: 0;

  color: var(--ark-now-green);

  font-size: clamp(48px, 5.4vw, 72px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.025em;
}


/* ========================================
   Main content
======================================== */

.ark-support-now-content {
  display: grid;

  grid-template-columns:
    minmax(0, 1.05fr)
    minmax(380px, 0.95fr);

  gap: 100px;

  align-items: center;
}


/* ----------------------------------------
   Copy
---------------------------------------- */

.ark-support-now-copy {
  max-width: 560px;
}

.ark-support-now-title {
  margin: 0 0 48px;

  color: var(--ark-now-green);

  font-size: clamp(31px, 3vw, 43px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.ark-support-now-text {
  color: rgba(53, 68, 59, 0.82);

  font-size: 16px;
  line-height: 2.15;
  letter-spacing: 0.035em;
}

.ark-support-now-text p {
  margin: 0;
}

.ark-support-now-text p + p {
  margin-top: 28px;
}


/* ========================================
   Current Position visual
======================================== */

.ark-support-now-position {
  position: relative;

  min-height: 510px;

  display: flex;
  align-items: center;
  justify-content: center;
}


/* Years */

.ark-support-now-years {
  position: absolute;
  top: 8px;
  left: 0;
  right: 0;

  display: flex;
  justify-content: space-between;

  color: rgba(48, 75, 59, 0.5);

  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
}


/* Horizontal timeline */

.ark-support-now-line {
  position: absolute;

  top: 45px;
  left: 4px;
  right: 4px;

  height: 1px;

  background: var(--ark-now-line);
}

.ark-support-now-line-start,
.ark-support-now-line-current {
  position: absolute;
  top: 50%;

  width: 9px;
  height: 9px;

  border-radius: 50%;

  transform: translateY(-50%);
}

.ark-support-now-line-start {
  left: -4px;

  border: 1px solid var(--ark-now-green-soft);
  background: var(--ark-now-bg);
}

.ark-support-now-line-current {
  right: -4px;

  width: 13px;
  height: 13px;

  background: var(--ark-now-green);
}


/* ----------------------------------------
   Current card
---------------------------------------- */

.ark-support-now-card {
  position: relative;

  width: min(100%, 390px);

  margin-top: 44px;
  padding: 56px 48px 52px;

  border: 1px solid rgba(48, 75, 59, 0.18);

  background: rgba(255, 255, 255, 0.31);
}

.ark-support-now-card::before {
  content: "";

  position: absolute;

  top: -45px;
  right: 0;

  width: 1px;
  height: 45px;

  background: rgba(48, 75, 59, 0.28);
}

.ark-support-now-card-label {
  margin: 0 0 24px;

  color: var(--ark-now-green-soft);

  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.2em;
}

.ark-support-now-card-year {
  margin: 0 0 34px;

  color: rgba(48, 75, 59, 0.22);

  font-size: 76px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.04em;
}

.ark-support-now-card-title {
  margin: 0;

  color: var(--ark-now-green);

  font-size: 29px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.04em;
}

.ark-support-now-card-text {
  margin: 32px 0 0;

  padding-top: 24px;

  border-top: 1px solid rgba(48, 75, 59, 0.16);

  color: var(--ark-now-green-soft);

  font-size: 13px;
  line-height: 1.8;
  letter-spacing: 0.06em;
}


/* ========================================
   Next message
======================================== */

.ark-support-now-next {
  margin-top: 100px;

  display: flex;
  align-items: flex-start;

  gap: 32px;
}

.ark-support-now-next-line {
  flex: 0 0 80px;

  height: 1px;

  margin-top: 15px;

  background: rgba(48, 75, 59, 0.46);
}

.ark-support-now-next p {
  margin: 0;

  color: var(--ark-now-green);

  font-size: 18px;
  line-height: 2;
  letter-spacing: 0.04em;
}


/* ========================================
   Tablet
======================================== */

@media (max-width: 1024px) {

  .ark-support-now-inner {
    width: min(100% - 72px, 960px);

    padding-top: 120px;
    padding-bottom: 110px;
  }

  .ark-support-now-header {
    margin-bottom: 72px;
  }

  .ark-support-now-content {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(330px, 0.85fr);

    gap: 64px;
  }

  .ark-support-now-card {
    padding: 46px 38px;
  }

  .ark-support-now-card-year {
    font-size: 68px;
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 767px) {

  .ark-support-now-inner {
    width: auto;

    margin: 0;
    padding: 92px 24px 88px;
  }


  /* Header */

  .ark-support-now-header {
    margin-bottom: 62px;
  }

  .ark-support-now-eyebrow {
    margin-bottom: 22px;

    font-size: 10px;
  }

  .ark-support-now-heading {
    font-size: clamp(42px, 12vw, 54px);
    line-height: 1.28;
  }


  /* Content */

  .ark-support-now-content {
    display: block;
  }

  .ark-support-now-copy {
    max-width: none;
  }

  .ark-support-now-title {
    margin-bottom: 36px;

    font-size: 29px;
    line-height: 1.55;
  }

  .ark-support-now-text {
    font-size: 15px;
    line-height: 2.05;
  }

  .ark-support-now-text p + p {
    margin-top: 24px;
  }


  /* Position */

  .ark-support-now-position {
    min-height: 0;

    margin-top: 72px;
    padding-top: 64px;
  }

  .ark-support-now-years {
    top: 0;

    font-size: 10px;
  }

  .ark-support-now-line {
    top: 35px;
  }

  .ark-support-now-card {
    width: 100%;

    margin-top: 0;
    padding: 42px 30px 38px;
  }

  .ark-support-now-card::before {
    display: none;
  }

  .ark-support-now-card-label {
    margin-bottom: 20px;

    font-size: 9px;
  }

  .ark-support-now-card-year {
    margin-bottom: 26px;

    font-size: 60px;
  }

  .ark-support-now-card-title {
    font-size: 25px;
  }

  .ark-support-now-card-text {
    margin-top: 26px;
    padding-top: 20px;
  }


  /* Next */

  .ark-support-now-next {
    margin-top: 64px;

    display: block;
  }

  .ark-support-now-next-line {
    display: block;

    width: 54px;
    height: 1px;

    margin: 0 0 26px;
  }

  .ark-support-now-next p {
    font-size: 15px;
    line-height: 2;
  }
}

/* ========================================
   Support 03：History / Journey
======================================== */

.ark-support-history {
  --ark-history-green: #304b3b;
  --ark-history-green-soft: #697b70;
  --ark-history-bg: #e8ebe3;
  --ark-history-line: rgba(48, 75, 59, 0.22);
  --ark-history-text: #46554c;

  position: relative;
  overflow: hidden;

  width: 100%;
  max-width: none !important;

  margin: 0 !important;
  padding: 0;

  background: var(--ark-history-bg);
  color: var(--ark-history-green);
}


/* ========================================
   Inner
======================================== */

.ark-support-history-inner {
  width: min(100% - 96px, 1100px);

  margin: 0 auto;
  padding: 150px 0 140px;

  display: grid;
  grid-template-columns: minmax(300px, 0.78fr) minmax(0, 1.22fr);
  column-gap: 110px;
}


/* ========================================
   Header
======================================== */

.ark-support-history-header {
  align-self: start;
  position: sticky;
  top: 120px;
}

.ark-support-history-eyebrow {
  margin: 0 0 28px;

  color: var(--ark-history-green-soft);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.24em;
}

.ark-support-history-heading {
  margin: 0;

  color: var(--ark-history-green);

  font-size: clamp(42px, 4.7vw, 62px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.025em;
}

.ark-support-history-lead {
  margin: 46px 0 0;

  color: rgba(48, 75, 59, 0.68);

  font-size: 15px;
  line-height: 2.1;
  letter-spacing: 0.035em;
}


/* ========================================
   Timeline
======================================== */

.ark-support-history-timeline {
  position: relative;
}


/* 縦線 */

.ark-support-history-timeline::before {
  content: "";

  position: absolute;

  top: 10px;
  bottom: 0;
  left: 92px;

  width: 1px;

  background: var(--ark-history-line);
}


/* ----------------------------------------
   Item
---------------------------------------- */

.ark-support-history-item {
  position: relative;

  display: grid;
  grid-template-columns: 64px 56px minmax(0, 1fr);

  padding-bottom: 82px;
}

.ark-support-history-item:last-child {
  padding-bottom: 0;
}


/* Year */

.ark-support-history-year {
  padding-top: 3px;

  color: rgba(48, 75, 59, 0.58);

  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.1em;
}


/* ----------------------------------------
   Marker
---------------------------------------- */

.ark-support-history-marker {
  position: relative;

  display: flex;
  justify-content: center;

  z-index: 2;
}

.ark-support-history-marker span {
  display: block;

  width: 11px;
  height: 11px;

  margin-top: 5px;

  border: 1px solid rgba(48, 75, 59, 0.65);
  border-radius: 50%;

  background: var(--ark-history-bg);
}


/* ----------------------------------------
   Content
---------------------------------------- */

.ark-support-history-content {
  padding: 0 0 0 8px;
}

.ark-support-history-step {
  margin: 0 0 13px;

  color: var(--ark-history-green-soft);

  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.22em;
}

.ark-support-history-content h3 {
  margin: 0;

  color: var(--ark-history-green);

  font-size: 25px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.035em;
}

.ark-support-history-content > p:not(.ark-support-history-step) {
  max-width: 430px;

  margin: 20px 0 0;

  color: rgba(70, 85, 76, 0.79);

  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.035em;
}


/* ========================================
   Current / 2026
======================================== */

.ark-support-history-item.is-current {
  padding-top: 12px;
}

.ark-support-history-item.is-current .ark-support-history-year {
  color: var(--ark-history-green);

  font-size: 15px;
}

.ark-support-history-item.is-current .ark-support-history-marker span {
  width: 17px;
  height: 17px;

  margin-top: 2px;

  border: none;

  background: var(--ark-history-green);

  box-shadow:
    0 0 0 7px var(--ark-history-bg),
    0 0 0 8px rgba(48, 75, 59, 0.18);
}

.ark-support-history-item.is-current .ark-support-history-step {
  color: var(--ark-history-green);

  font-weight: 700;
}

.ark-support-history-item.is-current .ark-support-history-content {
  padding-bottom: 40px;
}

.ark-support-history-item.is-current .ark-support-history-content h3 {
  font-size: 31px;
}


/* ========================================
   Bottom message
======================================== */

.ark-support-history-message {
  grid-column: 1 / -1;

  margin-top: 125px;
  padding-top: 58px;

  border-top: 1px solid rgba(48, 75, 59, 0.21);

  display: grid;
  grid-template-columns: minmax(250px, 0.78fr) minmax(0, 1.22fr);

  column-gap: 110px;
}

.ark-support-history-message-small {
  margin: 6px 0 0;

  color: var(--ark-history-green-soft);

  font-size: 10px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.22em;
}

.ark-support-history-message-main {
  margin: 0;

  color: var(--ark-history-green);

  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.035em;
}


/* ========================================
   Tablet
======================================== */

@media (max-width: 1024px) {

  .ark-support-history-inner {
    width: min(100% - 72px, 960px);

    padding: 125px 0 115px;

    grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);

    column-gap: 70px;
  }

  .ark-support-history-header {
    top: 90px;
  }

  .ark-support-history-timeline::before {
    left: 82px;
  }

  .ark-support-history-item {
    grid-template-columns: 58px 48px minmax(0, 1fr);

    padding-bottom: 70px;
  }

  .ark-support-history-content h3 {
    font-size: 23px;
  }

  .ark-support-history-message {
    column-gap: 70px;
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 767px) {

  .ark-support-history-inner {
    width: auto;

    margin: 0;
    padding: 94px 24px 90px;

    display: block;
  }


  /* Header */

  .ark-support-history-header {
    position: static;
  }

  .ark-support-history-eyebrow {
    margin-bottom: 22px;

    font-size: 10px;
  }

  .ark-support-history-heading {
    font-size: clamp(39px, 11vw, 50px);
    line-height: 1.35;
  }

  .ark-support-history-lead {
    margin-top: 34px;

    font-size: 14px;
    line-height: 2;
  }


  /* Timeline */

  .ark-support-history-timeline {
    margin-top: 72px;
  }

  .ark-support-history-timeline::before {
    top: 8px;
    bottom: 0;
    left: 53px;
  }

  .ark-support-history-item {
    grid-template-columns: 39px 30px minmax(0, 1fr);

    padding-bottom: 62px;
  }

  .ark-support-history-year {
    padding-top: 2px;

    font-size: 10px;
  }

  .ark-support-history-marker span {
    width: 9px;
    height: 9px;

    margin-top: 3px;
  }

  .ark-support-history-content {
    padding-left: 7px;
  }

  .ark-support-history-step {
    margin-bottom: 10px;

    font-size: 8px;
  }

  .ark-support-history-content h3 {
    font-size: 21px;
    line-height: 1.55;
  }

  .ark-support-history-content > p:not(.ark-support-history-step) {
    margin-top: 15px;

    font-size: 13px;
    line-height: 1.95;
  }


  /* Current */

  .ark-support-history-item.is-current {
    padding-top: 4px;
  }

  .ark-support-history-item.is-current .ark-support-history-year {
    font-size: 11px;
  }

  .ark-support-history-item.is-current .ark-support-history-marker span {
    width: 15px;
    height: 15px;

    margin-top: 0;

    box-shadow:
      0 0 0 5px var(--ark-history-bg),
      0 0 0 6px rgba(48, 75, 59, 0.18);
  }

  .ark-support-history-item.is-current .ark-support-history-content h3 {
    font-size: 25px;
  }


  /* Bottom message */

  .ark-support-history-message {
    margin-top: 72px;
    padding-top: 38px;

    display: block;
  }

  .ark-support-history-message-small {
    margin-bottom: 23px;

    font-size: 9px;
  }

  .ark-support-history-message-main {
    font-size: 21px;
    line-height: 1.8;
  }
}

/* ========================================
   Support 03：History / Media
   写真・動画・記事リンク
======================================== */

/* 写真・動画の共通コンテナ */

.ark-support-history-media {
  width: 100%;
  min-width: 0;
  margin: 28px 0 0;
}


/* ========================================
   2022：味噌の写真2枚
======================================== */

.ark-support-history-gallery {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 10px;

  width: 100%;
}

.ark-support-history-gallery-item {
  position: relative;
  min-width: 0;
  overflow: hidden;

  aspect-ratio: 4 / 3;

  background: #d9dfd5;
}

.ark-support-history-gallery-item img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;
}


/* ========================================
   2025：醤油の写真
======================================== */

.ark-support-history-image {
  width: 100%;
  overflow: hidden;

  aspect-ratio: 16 / 10;

  background: #d9dfd5;
}

.ark-support-history-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;
}


/* ========================================
   2023：羊の出産動画
======================================== */

.ark-support-history-video {
  position: relative;

  width: 100%;
  overflow: hidden;

  aspect-ratio: 16 / 9;

  background: #26362c;
}

.ark-support-history-video video {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: contain;
}


/* ========================================
   写真・動画のキャプション
======================================== */

.ark-support-history-media figcaption {
  margin: 12px 0 0;

  color: rgba(48, 75, 59, 0.62);

  font-size: 11px;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0.025em;
}


/* ========================================
   元記事へのリンク
======================================== */

.ark-support-history-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;

  margin-top: 18px;
  padding-bottom: 5px;

  border-bottom: 1px solid rgba(48, 75, 59, 0.35);

  color: var(--ark-history-green);

  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.035em;
  text-decoration: none;

  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.ark-support-history-link:hover {
  color: var(--ark-history-green-soft);
  border-color: var(--ark-history-green-soft);
}

.ark-support-history-link span {
  font-size: 15px;
  line-height: 1;
}


/* ========================================
   Tablet
======================================== */

@media (max-width: 1024px) {

  .ark-support-history-media {
    margin-top: 24px;
  }

  .ark-support-history-gallery {
    gap: 8px;
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 767px) {

  .ark-support-history-media {
    margin-top: 22px;
  }

  /* 味噌の写真は縦並び */

  .ark-support-history-gallery {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .ark-support-history-gallery-item {
    aspect-ratio: 4 / 3;
  }

  /* 醤油 */

  .ark-support-history-image {
    aspect-ratio: 4 / 3;
  }

  /* 動画 */

  .ark-support-history-video {
    aspect-ratio: 16 / 9;
  }

  /* キャプション */

  .ark-support-history-media figcaption {
    margin-top: 10px;

    font-size: 10px;
    line-height: 1.8;
  }

  /* 記事リンク */

  .ark-support-history-link {
    margin-top: 15px;

    font-size: 11px;
  }

}

/* ========================================
   Support 04：The Next Chapter
======================================== */

.ark-support-future {
  --ark-future-green: #304b3b;
  --ark-future-green-light: #738478;
  --ark-future-white: #f4f5ef;
  --ark-future-text: rgba(244, 245, 239, 0.76);
  --ark-future-line: rgba(244, 245, 239, 0.22);

  position: relative;
  overflow: hidden;

  width: 100%;
  max-width: none !important;

  margin: 0 !important;
  padding: 0;

  background: var(--ark-future-green);
  color: var(--ark-future-white);
}


/* ========================================
   Inner
======================================== */

.ark-support-future-inner {
  width: min(100% - 96px, 1100px);

  margin: 0 auto;
  padding: 150px 0 135px;
}


/* ========================================
   Header
======================================== */

.ark-support-future-header {
  display: grid;

  grid-template-columns:
    minmax(300px, 0.82fr)
    minmax(0, 1.18fr);

  column-gap: 110px;

  margin-bottom: 130px;
}

.ark-support-future-eyebrow {
  grid-column: 1 / -1;

  margin: 0 0 34px;

  color: rgba(244, 245, 239, 0.57);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.24em;
}

.ark-support-future-heading {
  margin: 0;

  color: var(--ark-future-white);

  font-size: clamp(43px, 4.7vw, 64px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.025em;
}

.ark-support-future-lead {
  align-self: end;

  max-width: 470px;

  margin: 0 0 7px;

  color: var(--ark-future-text);

  font-size: 16px;
  line-height: 2.1;
  letter-spacing: 0.04em;
}


/* ========================================
   Roadmap
======================================== */

.ark-support-future-roadmap {
  position: relative;

  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));

  column-gap: 42px;
}


/* 横ライン */

.ark-support-future-roadmap::before {
  content: "";

  position: absolute;

  top: 93px;
  left: 0;
  right: 0;

  height: 1px;

  background: var(--ark-future-line);
}


/* ========================================
   Stage
======================================== */

.ark-support-future-stage {
  position: relative;
}


/* ----------------------------------------
   Top
---------------------------------------- */

.ark-support-future-stage-top {
  min-height: 74px;
}

.ark-support-future-stage-label {
  margin: 0 0 9px;

  color: rgba(244, 245, 239, 0.48);

  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.24em;
}

.ark-support-future-stage-year {
  margin: 0;

  color: var(--ark-future-white);

  font-size: 22px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.08em;
}


/* ----------------------------------------
   Marker
---------------------------------------- */

.ark-support-future-stage-marker {
  position: relative;

  height: 39px;

  display: flex;
  align-items: flex-start;
}

.ark-support-future-stage-marker span {
  position: relative;
  z-index: 2;

  display: block;

  width: 11px;
  height: 11px;

  border: 1px solid rgba(244, 245, 239, 0.65);
  border-radius: 50%;

  background: var(--ark-future-green);
}

.ark-support-future-stage.is-now .ark-support-future-stage-marker span {
  width: 15px;
  height: 15px;

  border: none;

  background: var(--ark-future-white);

  box-shadow:
    0 0 0 6px var(--ark-future-green),
    0 0 0 7px rgba(244, 245, 239, 0.23);
}


/* ========================================
   Stage body
======================================== */

.ark-support-future-stage-body {
  padding-top: 20px;
  padding-right: 20px;
}

.ark-support-future-stage-body h3 {
  min-height: 110px;

  margin: 0;

  color: var(--ark-future-white);

  font-size: 26px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.035em;
}

.ark-support-future-stage-body > p {
  max-width: 310px;

  margin: 26px 0 0;

  color: var(--ark-future-text);

  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.035em;
}


/* ========================================
   2036 details
======================================== */

.ark-support-future-detail {
  margin-top: 40px;

  border-top: 1px solid rgba(244, 245, 239, 0.15);
}

.ark-support-future-detail-block {
  padding: 24px 0;

  border-bottom: 1px solid rgba(244, 245, 239, 0.15);
}

.ark-support-future-detail-label {
  margin: 0 0 12px;

  color: rgba(244, 245, 239, 0.45);

  font-size: 8px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.2em;
}

.ark-support-future-detail-block > p:last-child {
  margin: 0;

  color: rgba(244, 245, 239, 0.76);

  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}


/* ========================================
   2050 note
======================================== */

.ark-support-future-note {
  margin-top: 35px !important;
  padding-top: 25px;

  border-top: 1px solid rgba(244, 245, 239, 0.15);

  color: rgba(244, 245, 239, 0.57) !important;

  font-size: 12px !important;
}


/* ========================================
   Closing
======================================== */

.ark-support-future-closing {
  margin-top: 130px;
  padding-top: 58px;

  border-top: 1px solid rgba(244, 245, 239, 0.2);

  display: grid;
  grid-template-columns: minmax(180px, 0.55fr) minmax(0, 1.45fr);

  column-gap: 80px;
}

.ark-support-future-closing-label {
  margin: 7px 0 0;

  color: rgba(244, 245, 239, 0.45);

  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.22em;
}

.ark-support-future-closing-text {
  margin: 0;

  color: var(--ark-future-white);

  font-size: clamp(22px, 2.15vw, 29px);
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.035em;
}

.ark-support-future-closing-line {
  display: block;
  white-space: nowrap;
}


/* ========================================
   Tablet
======================================== */

@media (max-width: 1024px) {

  .ark-support-future-inner {
    width: min(100% - 72px, 960px);

    padding: 125px 0 115px;
  }

  .ark-support-future-header {
    grid-template-columns:
      minmax(280px, 0.85fr)
      minmax(0, 1.15fr);

    column-gap: 70px;

    margin-bottom: 105px;
  }

  .ark-support-future-roadmap {
    column-gap: 28px;
  }

  .ark-support-future-stage-body h3 {
    font-size: 23px;
  }

  .ark-support-future-stage-body > p {
    font-size: 13px;
  }

  .ark-support-future-closing {
    column-gap: 70px;
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 767px) {

  .ark-support-future-inner {
    width: auto;

    margin: 0;
    padding: 94px 24px 90px;
  }


  /* Header */

  .ark-support-future-header {
    display: block;

    margin-bottom: 80px;
  }

  .ark-support-future-eyebrow {
    margin-bottom: 23px;

    font-size: 10px;
  }

  .ark-support-future-heading {
    font-size: clamp(38px, 10.8vw, 49px);
    line-height: 1.4;
  }

  .ark-support-future-lead {
    max-width: none;

    margin-top: 38px;

    font-size: 14px;
    line-height: 2;
  }


  /* Roadmap */

  .ark-support-future-roadmap {
    display: block;
  }

  .ark-support-future-roadmap::before {
    top: 4px;
    bottom: 0;
    left: 6px;
    right: auto;

    width: 1px;
    height: auto;
  }


  /* Stage */

  .ark-support-future-stage {
    position: relative;

    padding-left: 42px;
    padding-bottom: 80px;
  }

  .ark-support-future-stage:last-child {
    padding-bottom: 0;
  }

  .ark-support-future-stage-top {
    min-height: 0;

    margin-bottom: 18px;
  }

  .ark-support-future-stage-label {
    margin-bottom: 8px;

    font-size: 8px;
  }

  .ark-support-future-stage-year {
    font-size: 18px;
  }


  /* Marker */

  .ark-support-future-stage-marker {
    position: absolute;

    top: 3px;
    left: 0;

    height: auto;
  }

  .ark-support-future-stage-marker span {
    width: 11px;
    height: 11px;
  }

  .ark-support-future-stage.is-now .ark-support-future-stage-marker span {
    width: 13px;
    height: 13px;

    margin-left: -1px;

    box-shadow:
      0 0 0 5px var(--ark-future-green),
      0 0 0 6px rgba(244, 245, 239, 0.2);
  }


  /* Body */

  .ark-support-future-stage-body {
    padding: 0;
  }

  .ark-support-future-stage-body h3 {
    min-height: 0;

    font-size: 23px;
    line-height: 1.6;
  }

  .ark-support-future-stage-body > p {
    max-width: none;

    margin-top: 20px;

    font-size: 13px;
    line-height: 1.95;
  }


  /* Detail */

  .ark-support-future-detail {
    margin-top: 30px;
  }

  .ark-support-future-detail-block {
    padding: 20px 0;
  }


  /* Closing */

  .ark-support-future-closing {
    margin-top: 82px;
    padding-top: 38px;
    display: block;
  }

  .ark-support-future-closing-label {
    margin-bottom: 23px;
  }

  .ark-support-future-closing-text {
    font-size: 21px;
    line-height: 1.85;
  }

  .ark-support-future-closing-line {
    white-space: normal;
  }
}

/* ========================================
   Support 05：Why Support
======================================== */

.ark-support-why {
  --ark-why-green: #304b3b;
  --ark-why-green-soft: #687a6e;
  --ark-why-bg: #f1f2eb;
  --ark-why-bg-soft: rgba(255, 255, 255, 0.34);
  --ark-why-text: #46554c;
  --ark-why-line: rgba(48, 75, 59, 0.18);

  position: relative;
  overflow: hidden;

  width: 100%;
  max-width: none !important;

  margin: 0 !important;
  padding: 0;

  background: var(--ark-why-bg);
  color: var(--ark-why-green);
}


/* ========================================
   Inner
======================================== */

.ark-support-why-inner {
  width: min(100% - 96px, 1100px);

  margin: 0 auto;
  padding: 150px 0 140px;
}


/* ========================================
   Header
======================================== */

.ark-support-why-header {
  max-width: 900px;

  margin-bottom: 110px;
}

.ark-support-why-eyebrow {
  margin: 0 0 30px;

  color: var(--ark-why-green-soft);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.24em;
}

.ark-support-why-heading {
  margin: 0;

  color: var(--ark-why-green);

  font-size: clamp(46px, 5.4vw, 72px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.025em;
}

.ark-support-why-heading {
  max-width: none;
  font-size: clamp(46px, 5vw, 66px);
}

.ark-support-why-heading-line {
  display: block;
  white-space: nowrap;
}


/* ========================================
   Intro
======================================== */

.ark-support-why-intro {
  display: grid;

  grid-template-columns:
    minmax(280px, 0.8fr)
    minmax(0, 1.2fr);

  column-gap: 110px;

  margin-bottom: 120px;
}

.ark-support-why-intro-main {
  margin: 0;

  color: var(--ark-why-green);

  font-size: clamp(27px, 2.8vw, 37px);
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0.035em;
}

.ark-support-why-intro-text {
  max-width: 520px;

  color: rgba(70, 85, 76, 0.8);

  font-size: 15px;
  line-height: 2.15;
  letter-spacing: 0.035em;
}

.ark-support-why-intro-text p {
  margin: 0;
}

.ark-support-why-intro-text p + p {
  margin-top: 28px;
}


/* ========================================
   Buy / Support comparison
======================================== */

.ark-support-why-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  margin-bottom: 135px;

  border-top: 1px solid var(--ark-why-line);
  border-bottom: 1px solid var(--ark-why-line);
}

.ark-support-why-compare-item {
  min-height: 480px;

  padding: 54px 58px 50px;
}

.ark-support-why-compare-item + .ark-support-why-compare-item {
  border-left: 1px solid var(--ark-why-line);
}


/* BUY側 */

.ark-support-why-compare-item.is-buy {
  background: transparent;
}


/* SUPPORT側 */

.ark-support-why-compare-item.is-support {
  background: var(--ark-why-bg-soft);
}


/* Label */

.ark-support-why-compare-label {
  margin: 0 0 22px;

  color: var(--ark-why-green-soft);

  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.22em;
}


/* Heading */

.ark-support-why-compare-item h3 {
  min-height: 90px;

  margin: 0;

  color: var(--ark-why-green);

  font-size: 27px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.035em;
}


/* Flow */

.ark-support-why-compare-flow {
  margin-top: 44px;

  color: rgba(48, 75, 59, 0.64);
}

.ark-support-why-compare-flow p {
  margin: 0;

  font-size: 14px;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.ark-support-why-compare-flow span {
  display: block;

  margin: 13px 0;

  color: rgba(48, 75, 59, 0.35);

  font-size: 16px;
}

.ark-support-why-compare-flow .ark-support-why-compare-goal {
  margin-top: 4px;

  color: var(--ark-why-green);

  font-size: 19px;
  font-weight: 500;
}


/* ========================================
   Foundation
======================================== */

.ark-support-why-foundation {
  display: grid;

  grid-template-columns:
    minmax(280px, 0.8fr)
    minmax(0, 1.2fr);

  column-gap: 110px;

  margin-bottom: 135px;
}


/* Head */

.ark-support-why-foundation-label {
  margin: 0 0 24px;

  color: var(--ark-why-green-soft);

  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.22em;
}

.ark-support-why-foundation-head h3 {
  margin: 0;

  color: var(--ark-why-green);

  font-size: clamp(29px, 3vw, 40px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.035em;
}


/* ========================================
   List
======================================== */

.ark-support-why-list {
  border-top: 1px solid var(--ark-why-line);
}

.ark-support-why-list-item {
  display: grid;

  grid-template-columns: 56px 150px minmax(0, 1fr);

  column-gap: 22px;

  align-items: start;

  padding: 30px 0;

  border-bottom: 1px solid var(--ark-why-line);
}

.ark-support-why-list-number {
  margin: 5px 0 0;

  color: rgba(48, 75, 59, 0.4);

  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
}

.ark-support-why-list-item h4 {
  margin: 0;

  color: var(--ark-why-green);

  font-size: 19px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.ark-support-why-list-item > p:last-child {
  margin: 0;

  color: rgba(70, 85, 76, 0.76);

  font-size: 13px;
  line-height: 1.95;
  letter-spacing: 0.03em;
}


/* ========================================
   Closing
======================================== */

.ark-support-why-closing {
  padding-top: 58px;

  border-top: 1px solid var(--ark-why-line);

  display: grid;

  grid-template-columns:
    minmax(190px, 0.55fr)
    minmax(0, 1.45fr);

  column-gap: 80px;
}

.ark-support-why-closing-label {
  margin: 7px 0 0;

  color: var(--ark-why-green-soft);

  font-size: 9px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.22em;
}

.ark-support-why-closing-copy {
  color: rgba(48, 75, 59, 0.72);

  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.035em;
}

.ark-support-why-closing-copy p {
  margin: 0;
}

.ark-support-why-closing-main {
  margin-top: 32px !important;

  color: var(--ark-why-green);

  font-size: clamp(22px, 2.1vw, 28px);
  font-weight: 500;
  line-height: 1.8;
}

.ark-support-why-closing-line {
  display: block;
  white-space: nowrap;
}

/* ========================================
   Tablet
======================================== */

@media (max-width: 1024px) {

  .ark-support-why-inner {
    width: min(100% - 72px, 960px);

    padding: 125px 0 115px;
  }

  .ark-support-why-header {
    margin-bottom: 90px;
  }

  .ark-support-why-intro,
  .ark-support-why-foundation,
  .ark-support-why-closing {
    column-gap: 70px;
  }

  .ark-support-why-compare-item {
    padding: 48px 42px;
  }

  .ark-support-why-list-item {
    grid-template-columns: 48px 125px minmax(0, 1fr);
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 767px) {

  .ark-support-why-inner {
    width: auto;

    margin: 0;
    padding: 94px 24px 90px;
  }


  /* Header */

  .ark-support-why-header {
    margin-bottom: 68px;
  }

  .ark-support-why-eyebrow {
    margin-bottom: 22px;

    font-size: 10px;
  }

  .ark-support-why-heading {
    font-size: clamp(34px, 9.5vw, 44px);
    line-height: 1.4;
  }

  .ark-support-why-heading-line {
    white-space: normal;
  }


  /* Intro */

  .ark-support-why-intro {
    display: block;

    margin-bottom: 72px;
  }

  .ark-support-why-intro-main {
    font-size: 27px;
  }

  .ark-support-why-intro-text {
    max-width: none;

    margin-top: 36px;

    font-size: 14px;
    line-height: 2;
  }

  .ark-support-why-intro-text p + p {
    margin-top: 23px;
  }


  /* Comparison */

  .ark-support-why-compare {
    display: block;

    margin-bottom: 80px;
  }

  .ark-support-why-compare-item {
    min-height: 0;

    padding: 38px 0 42px;
  }

  .ark-support-why-compare-item + .ark-support-why-compare-item {
    border-left: none;
    border-top: 1px solid var(--ark-why-line);
  }

  .ark-support-why-compare-item.is-support {
    margin-left: -24px;
    margin-right: -24px;

    padding-left: 24px;
    padding-right: 24px;
  }

  .ark-support-why-compare-item h3 {
    min-height: 0;

    font-size: 23px;
  }

  .ark-support-why-compare-flow {
    margin-top: 31px;
  }


  /* Foundation */

  .ark-support-why-foundation {
    display: block;

    margin-bottom: 82px;
  }

  .ark-support-why-foundation-head h3 {
    font-size: 28px;
  }

  .ark-support-why-list {
    margin-top: 48px;
  }

  .ark-support-why-list-item {
    display: grid;

    grid-template-columns: 38px minmax(0, 1fr);

    column-gap: 12px;

    padding: 25px 0;
  }

  .ark-support-why-list-number {
    grid-row: 1 / 3;
  }

  .ark-support-why-list-item h4 {
    font-size: 18px;
  }

  .ark-support-why-list-item > p:last-child {
    margin-top: 8px;

    font-size: 13px;
  }


  /* Closing */

  .ark-support-why-closing {
    display: block;

    padding-top: 38px;
  }

  .ark-support-why-closing-label {
    margin-bottom: 24px;
  }

  .ark-support-why-closing-copy {
    font-size: 14px;
  }

  .ark-support-why-closing-main {
    margin-top: 27px !important;

    font-size: 18px;
    line-height: 1.85;
  }

  .ark-support-why-closing-line {
    white-space: normal;
  }
}

/* ========================================
   Section 6：支援によって、生まれるもの
======================================== */
.ark-support-impact::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 72px;
  height: 1px;
  background: rgba(48, 75, 59, 0.28);
  transform: translateX(-50%);
}

.ark-support-impact {
  --impact-green: #304b3b;
  --impact-green-soft: #66776b;
  --impact-bg: #f1f2eb;
  --impact-line: rgba(48, 75, 59, 0.22);

  position: relative;
  width: 100vw;
  max-width: none;
  margin: 0;
  margin-left: calc(50% - 50vw);
  padding: 130px 24px 140px;
  background: var(--impact-bg);
  overflow: hidden;
}

.ark-support-impact-inner {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}


/* -------------------------
   Header
------------------------- */

.ark-support-impact-header {
  max-width: 820px;
  margin: 0 auto 90px;
  text-align: center;
}

.ark-support-impact-eyebrow {
  margin: 0 0 26px;
  color: var(--impact-green-soft);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.2em;
}

.ark-support-impact-title {
  margin: 0;
  color: var(--impact-green);
  font-family: serif;
  font-size: clamp(40px, 4.2vw, 60px);
  font-weight: 500;
  line-height: 1.38;
  letter-spacing: 0.03em;
}

.ark-support-impact-lead {
  margin: 38px auto 0;
  color: #525b54;
  font-size: 16px;
  line-height: 2.15;
  letter-spacing: 0.04em;
}


/* -------------------------
   Flow
------------------------- */

.ark-support-impact-flow {
  position: relative;
  max-width: 940px;
  margin: 0 auto;
}

/* 縦線 */
.ark-support-impact-flow::before {
  content: "";
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: 59px;
  width: 1px;
  background: var(--impact-line);
}

.ark-support-impact-item {
  position: relative;
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 42px;
  align-items: start;
  padding: 0 0 70px;
}

.ark-support-impact-item:last-child {
  padding-bottom: 0;
}


/* Number */

.ark-support-impact-number {
  position: relative;
  z-index: 2;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 120px;
  height: 120px;

  border: 1px solid rgba(48, 75, 59, 0.32);
  border-radius: 50%;

  background: var(--impact-bg);

  color: var(--impact-green);
  font-family: serif;
  font-size: 22px;
  letter-spacing: 0.08em;
}


/* Content */

.ark-support-impact-content {
  padding-top: 14px;
  padding-bottom: 56px;
  border-bottom: 1px solid var(--impact-line);
}

.ark-support-impact-item:last-child .ark-support-impact-content {
  border-bottom: none;
}

.ark-support-impact-label {
  margin: 0 0 10px;
  color: var(--impact-green-soft);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
}

.ark-support-impact-heading {
  margin: 0;
  color: var(--impact-green);
  font-family: serif;
  font-size: 32px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.06em;
}

.ark-support-impact-text {
  max-width: 690px;
  margin: 18px 0 0;
  color: #525b54;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 0.035em;
}


/* -------------------------
   Bottom message
------------------------- */

.ark-support-impact-message {
  margin: 120px auto 0;
  padding: 82px 40px;
  border-top: 1px solid rgba(48, 75, 59, 0.3);
  border-bottom: 1px solid rgba(48, 75, 59, 0.3);
  text-align: center;
}

.ark-support-impact-message-small {
  margin: 0 0 24px;
  color: var(--impact-green-soft);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
}

.ark-support-impact-message-main {
  margin: 0;
  color: var(--impact-green);
  font-family: serif;
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.05em;
}


/* -------------------------
   PC only
------------------------- */

.ark-pc-only {
  display: inline;
}


/* ========================================
   Tablet
======================================== */

@media (max-width: 900px) {

  .ark-support-impact {
    padding: 110px 28px 120px;
  }

  .ark-support-impact-header {
    margin-bottom: 72px;
  }

  .ark-support-impact-item {
    grid-template-columns: 96px 1fr;
    gap: 32px;
  }

  .ark-support-impact-flow::before {
    left: 47px;
  }

  .ark-support-impact-number {
    width: 96px;
    height: 96px;
    font-size: 19px;
  }

}


/* ========================================
   Mobile
======================================== */

@media (max-width: 600px) {

  .ark-support-impact {
    padding: 88px 20px 96px;
  }

  .ark-support-impact-header {
    margin-bottom: 64px;
    text-align: left;
  }

  .ark-support-impact-eyebrow {
    margin-bottom: 20px;
    font-size: 10px;
  }

  .ark-support-impact-title {
    font-size: clamp(34px, 9.5vw, 43px);
    line-height: 1.45;
  }

  .ark-support-impact-lead {
    margin-top: 28px;
    font-size: 14px;
    line-height: 2;
  }

  .ark-pc-only {
    display: none;
  }


  /* Flow */

  .ark-support-impact-flow::before {
    top: 27px;
    bottom: 28px;
    left: 27px;
  }

  .ark-support-impact-item {
    grid-template-columns: 56px 1fr;
    gap: 20px;
    padding-bottom: 52px;
  }

  .ark-support-impact-number {
    width: 56px;
    height: 56px;
    font-size: 14px;
  }

  .ark-support-impact-content {
    padding-top: 2px;
    padding-bottom: 44px;
  }

  .ark-support-impact-label {
    margin-bottom: 6px;
    font-size: 9px;
  }

  .ark-support-impact-heading {
    font-size: 25px;
  }

  .ark-support-impact-text {
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.95;
  }


  /* Bottom */

  .ark-support-impact-message {
    margin-top: 82px;
    padding: 58px 10px;
  }

  .ark-support-impact-message-small {
    margin-bottom: 20px;
    font-size: 9px;
    line-height: 1.6;
  }

  .ark-support-impact-message-main {
    font-size: clamp(30px, 8.8vw, 39px);
    line-height: 1.55;
  }
}

/* ========================================
   Section 6 → Section 7 の余白を消す
======================================== */

.ark-support-impact {
  margin-block-end: 0 !important;
}

.ark-support-plan {
  margin-block-start: 0 !important;
}

/* ========================================
   Section 7：支援のかたち
======================================== */

.ark-support-plan {
  --plan-green: #304b3b;
  --plan-green-soft: #69796e;
  --plan-bg: #e7e9df;
  --plan-card: #f4f4ee;
  --plan-line: rgba(48, 75, 59, 0.22);

  position: relative;
  width: 100vw;
  max-width: none;
  margin: 0;
  margin-left: calc(50% - 50vw);
  padding: 130px 24px 140px;

  background: var(--plan-bg);
  overflow: hidden;
}

.ark-support-plan-inner {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}


/* -------------------------
   Header
------------------------- */

.ark-support-plan-header {
  max-width: 800px;
  margin: 0 auto 72px;
  text-align: center;
}

.ark-support-plan-eyebrow {
  margin: 0 0 24px;

  color: var(--plan-green-soft);

  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
}

.ark-support-plan-title {
  margin: 0;

  color: var(--plan-green);

  font-family: serif;
  font-size: clamp(42px, 5vw, 64px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.05em;
}

.ark-support-plan-lead {
  margin: 30px auto 0;

  color: #535c55;

  font-size: 15px;
  line-height: 2.1;
  letter-spacing: 0.04em;
}


/* -------------------------
   Main card
------------------------- */

.ark-support-plan-card {
  max-width: 980px;
  margin: 0 auto;

  background: var(--plan-card);

  border-top: 1px solid rgba(48, 75, 59, 0.34);
  border-bottom: 1px solid rgba(48, 75, 59, 0.34);
}


/* -------------------------
   Price
------------------------- */

.ark-support-plan-price-area {
  padding: 72px 40px 68px;

  text-align: center;

  border-bottom: 1px solid var(--plan-line);
}

.ark-support-plan-type {
  margin: 0 0 26px;

  color: var(--plan-green);

  font-family: serif;
  font-size: 20px;
  letter-spacing: 0.12em;
}

.ark-support-plan-price {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 12px;

  color: var(--plan-green);
}

.ark-support-plan-price-prefix {
  font-size: 16px;
  letter-spacing: 0.1em;
}

.ark-support-plan-price-number {
  font-family: serif;
  font-size: clamp(64px, 8vw, 104px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.02em;
}

.ark-support-plan-price-unit {
  font-family: serif;
  font-size: 24px;
}

.ark-support-plan-renewal {
  margin: 24px 0 0;

  color: var(--plan-green-soft);

  font-size: 12px;
  letter-spacing: 0.14em;
}


/* -------------------------
   Benefits
------------------------- */

.ark-support-plan-benefits {
  padding: 10px 72px;
}

.ark-support-plan-benefit {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 30px;

  padding: 48px 0;

  border-bottom: 1px solid var(--plan-line);
}

.ark-support-plan-benefit:last-child {
  border-bottom: none;
}

.ark-support-plan-benefit-number {
  margin: 4px 0 0;

  color: var(--plan-green-soft);

  font-family: serif;
  font-size: 17px;
}

.ark-support-plan-benefit-label {
  margin: 0 0 10px;

  color: var(--plan-green-soft);

  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.2em;
}

.ark-support-plan-benefit-title {
  margin: 0;

  color: var(--plan-green);

  font-family: serif;
  font-size: 27px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.ark-support-plan-benefit-text {
  max-width: 680px;
  margin: 15px 0 0;

  color: #555e57;

  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.035em;
}


/* -------------------------
   Note
------------------------- */

.ark-support-plan-note {
  max-width: 760px;
  margin: 82px auto 0;

  text-align: center;

  color: #5b645d;
}

.ark-support-plan-note p {
  margin: 0;

  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}

.ark-support-plan-note-emphasis {
  margin-top: 20px !important;

  color: var(--plan-green);

  font-family: serif;
  font-size: 23px !important;
  line-height: 1.8 !important;
}


/* ========================================
   Mobile
======================================== */

@media (max-width: 600px) {

  .ark-support-plan {
    padding: 88px 18px 96px;
  }

  .ark-support-plan-header {
    margin-bottom: 54px;
    text-align: left;
  }

  .ark-support-plan-eyebrow {
    margin-bottom: 18px;
    font-size: 9px;
  }

  .ark-support-plan-title {
    font-size: clamp(34px, 9vw, 42px);
  }

  .ark-support-plan-lead {
    margin-top: 24px;

    font-size: 14px;
    line-height: 2;
  }


  /* Card */

  .ark-support-plan-price-area {
    padding: 52px 16px 48px;
  }

  .ark-support-plan-type {
    margin-bottom: 20px;
    font-size: 17px;
  }

  .ark-support-plan-price {
    gap: 7px;
  }

  .ark-support-plan-price-prefix {
    font-size: 13px;
  }

  .ark-support-plan-price-number {
    font-size: clamp(52px, 16vw, 72px);
  }

  .ark-support-plan-price-unit {
    font-size: 19px;
  }

  .ark-support-plan-renewal {
    margin-top: 19px;
    font-size: 10px;
  }


  /* Benefits */

  .ark-support-plan-benefits {
    padding: 0 20px;
  }

  .ark-support-plan-benefit {
    grid-template-columns: 34px 1fr;
    gap: 14px;

    padding: 38px 0;
  }

  .ark-support-plan-benefit-number {
    font-size: 14px;
  }

  .ark-support-plan-benefit-label {
    font-size: 8px;
  }

  .ark-support-plan-benefit-title {
    font-size: 22px;
  }

  .ark-support-plan-benefit-text {
    margin-top: 12px;

    font-size: 13px;
    line-height: 1.95;
  }


  /* Note */

  .ark-support-plan-note {
    margin-top: 62px;
    text-align: left;
  }

  .ark-support-plan-note p {
    font-size: 13px;
  }

  .ark-support-plan-note-emphasis {
    margin-top: 16px !important;

    font-size: 20px !important;
    line-height: 1.75 !important;
  }
}

/* ========================================
   Corporate Support
======================================== */

.ark-support-corporate {
  max-width: 980px;
  margin: 120px auto 0;
  padding-top: 96px;

  border-top: 1px solid var(--plan-line);
}


/* -------------------------
   Header
------------------------- */

.ark-support-corporate-header {
  max-width: 720px;
  margin: 0 auto 64px;

  text-align: center;
}

.ark-support-corporate-eyebrow {
  margin: 0 0 22px;

  color: var(--plan-green-soft);

  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.22em;
}

.ark-support-corporate-title {
  margin: 0;

  color: var(--plan-green);

  font-family: serif;
  font-size: clamp(34px, 4vw, 50px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.05em;
}

.ark-support-corporate-lead {
  margin: 28px 0 0;

  color: #59625b;

  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.04em;
}


/* -------------------------
   Plans
------------------------- */

.ark-support-corporate-plans {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.ark-support-corporate-card {
  position: relative;

  display: flex;
  flex-direction: column;

  padding: 54px 42px 42px;

  background: var(--plan-card);

  border-top: 1px solid rgba(48, 75, 59, 0.34);
  border-bottom: 1px solid rgba(48, 75, 59, 0.34);
}

.ark-support-corporate-card--special {
  border-color: rgba(143, 116, 62, 0.55);
}


/* -------------------------
   Special label
------------------------- */

.ark-support-corporate-special-label {
  position: absolute;
  top: 0;
  left: 50%;

  margin: 0;
  padding: 7px 18px;

  transform: translate(-50%, -50%);

  background: #8f743e;
  color: #fff;

  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.18em;

  white-space: nowrap;
}


/* -------------------------
   Name
------------------------- */

.ark-support-corporate-label {
  margin: 0 0 13px;

  color: var(--plan-green-soft);

  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.2em;

  text-align: center;
}

.ark-support-corporate-name {
  margin: 0;

  color: var(--plan-green);

  font-family: serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.05em;

  text-align: center;
}


/* -------------------------
   Price
------------------------- */

.ark-support-corporate-price {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 8px;

  margin-top: 34px;

  color: var(--plan-green);
}

.ark-support-corporate-prefix {
  font-size: 12px;
  letter-spacing: 0.1em;
}

.ark-support-corporate-number {
  font-family: serif;
  font-size: clamp(40px, 4.5vw, 56px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.015em;
}

.ark-support-corporate-unit {
  font-family: serif;
  font-size: 15px;
}

.ark-support-corporate-renewal {
  margin: 20px 0 0;

  color: var(--plan-green-soft);

  font-size: 10px;
  letter-spacing: 0.12em;

  text-align: center;
}


/* -------------------------
   Description
------------------------- */

.ark-support-corporate-description {
  margin-top: 38px;
  padding-top: 30px;

  border-top: 1px solid var(--plan-line);
}

.ark-support-corporate-description p {
  margin: 0;

  color: #555e57;

  font-size: 13px;
  line-height: 1.95;
  letter-spacing: 0.035em;
}

.ark-support-corporate-description p + p {
  margin-top: 18px;
}


/* -------------------------
   Button
------------------------- */

.ark-support-corporate-button {
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: 100%;
  min-height: 58px;

  margin-top: auto;
  padding: 15px 20px;

  background: var(--plan-green);
  color: #fff !important;

  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.05em;

  text-decoration: none !important;

  transition:
    background-color 0.25s ease,
    transform 0.25s ease;
}

.ark-support-corporate-description + .ark-support-corporate-button {
  margin-top: 34px;
}

.ark-support-corporate-button:hover {
  background: #23392d;
  transform: translateY(-2px);
}

.ark-support-corporate-button--special {
  background: #8f743e;
}

.ark-support-corporate-button--special:hover {
  background: #78602f;
}

/* -------------------------
   Individual CTA
------------------------- */

.ark-support-plan-action {
  padding: 10px 72px 62px;
  text-align: center;
}

.ark-support-plan-button {
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: 100%;
  max-width: 560px;
  min-height: 64px;

  margin: 0 auto;
  padding: 16px 24px;

  background: var(--plan-green);
  color: #fff !important;

  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.05em;

  text-decoration: none !important;

  transition:
    background-color 0.25s ease,
    transform 0.25s ease;
}

.ark-support-plan-button:hover {
  background: #23392d;
  transform: translateY(-2px);
}

.ark-support-plan-action-notes {
  margin-top: 22px;
}

.ark-support-plan-action-notes p {
  margin: 5px 0;

  color: var(--plan-green-soft);

  font-size: 11px;
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.ark-support-plan-action {
  padding: 6px 20px 42px;
}

.ark-support-plan-button {
  min-height: 58px;
  padding: 14px 18px;
  font-size: 12px;
}

.ark-support-plan-action-notes {
  margin-top: 18px;
}

.ark-support-plan-action-notes p {
  font-size: 10px;
}

/* ========================================
   Corporate Support - Mobile Fix
======================================== */

@media (max-width: 768px) {

  /* -------------------------
     Corporate section
  ------------------------- */

  .ark-support-corporate {
    margin-top: 80px;
    padding-top: 72px;
  }

  .ark-support-corporate-header {
    max-width: none;
    margin-bottom: 48px;
    text-align: left;
  }

  .ark-support-corporate-eyebrow {
    margin-bottom: 18px;
    font-size: 9px;
  }

  .ark-support-corporate-title {
    font-size: 34px;
    line-height: 1.5;
  }

  .ark-support-corporate-lead {
    margin-top: 24px;
    font-size: 13px;
    line-height: 1.95;
  }


  /* -------------------------
     Cards
  ------------------------- */

  .ark-support-corporate-plans {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 52px;

    width: 100%;
  }

  .ark-support-corporate-card {
    width: 100%;
    min-width: 0;

    padding: 52px 26px 32px;
  }


  /* -------------------------
     Plan title
  ------------------------- */

  .ark-support-corporate-label {
    font-size: 8px;
    line-height: 1.7;
  }

  .ark-support-corporate-name {
    font-size: 23px;
    line-height: 1.6;
  }


  /* -------------------------
     Price
  ------------------------- */

  .ark-support-corporate-price {
    display: flex;
    flex-wrap: nowrap;

    justify-content: center;
    align-items: baseline;

    gap: 7px;

    width: 100%;
    margin-top: 30px;
  }

  .ark-support-corporate-prefix {
    flex: 0 0 auto;

    font-size: 11px;
  }

  .ark-support-corporate-number {
    flex: 0 1 auto;

    font-size: clamp(38px, 12vw, 54px);
    line-height: 1;

    white-space: nowrap;
  }

  .ark-support-corporate-unit {
    flex: 0 0 auto;

    font-size: 12px;

    white-space: nowrap;
  }

  .ark-support-corporate-renewal {
    margin-top: 20px;

    font-size: 10px;
    line-height: 1.7;
  }


  /* -------------------------
     Description
  ------------------------- */

  .ark-support-corporate-description {
    margin-top: 32px;
    padding-top: 28px;
  }

  .ark-support-corporate-description p {
    font-size: 13px;
    line-height: 1.95;
  }

  .ark-support-corporate-description p + p {
    margin-top: 18px;
  }


  /* -------------------------
     Button
  ------------------------- */

  .ark-support-corporate-button {
    min-height: 58px;

    margin-top: 32px;
    padding: 14px 18px;

    font-size: 12px;
  }


  /* -------------------------
     Special
  ------------------------- */

  .ark-support-corporate-special-label {
    padding: 7px 16px;

    font-size: 8px;
  }

}

/* ========================================
   Section 7 → Section 8 の余白を消す
======================================== */

.ark-support-plan {
  margin-block-end: 0 !important;
}

.ark-support-plan + .ark-support-join {
  margin-block-start: 0 !important;
}

/* ========================================
  Section 8 Before You Board
======================================== */

.ark-support-before-board {
  --before-green: #304b3b;
  --before-text: #f1f0e8;
  --before-text-soft: rgba(241, 240, 232, 0.68);
  --before-line: rgba(241, 240, 232, 0.22);

  position: relative;

  width: 100vw;
  max-width: none;

  margin: 0;
  margin-left: calc(50% - 50vw);

  padding: 110px 24px 120px;

  background: var(--before-green);

  overflow: hidden;
}

.ark-support-before-board-inner {
  width: 100%;
  max-width: 1120px;

  margin: 0 auto;
}


/* ========================================
   Diagnosis
======================================== */

.ark-support-diagnosis {
  max-width: 720px;

  margin: 0 auto;

  text-align: center;
}


/* Eyebrow */

.ark-support-diagnosis-eyebrow {
  margin: 0 0 26px;

  color: var(--before-text-soft);

  font-size: 10px;
  font-weight: 600;

  letter-spacing: 0.26em;
}


/* Title */

.ark-support-diagnosis-title {
  margin: 0;

  color: var(--before-text);

  font-family: serif;
  font-size: clamp(34px, 4vw, 48px);
  font-weight: 400;

  line-height: 1.5;
  letter-spacing: 0.06em;
}


/* Text */

.ark-support-diagnosis-text {
  margin: 30px 0 0;

  color: var(--before-text-soft);

  font-size: 14px;
  line-height: 2;

  letter-spacing: 0.04em;
}


/* ========================================
   Diagnosis Link
======================================== */

.ark-support-diagnosis-link {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 34px;

  margin-top: 34px;
  padding: 8px 0 10px;

  color: var(--before-text) !important;

  border-bottom: 1px solid var(--before-line);

  font-size: 13px;
  letter-spacing: 0.05em;

  text-decoration: none !important;

  transition:
    border-color 0.25s ease,
    opacity 0.25s ease;
}

.ark-support-diagnosis-link:hover {
  border-color: var(--before-text);
}

.ark-support-diagnosis-arrow {
  display: inline-block;

  font-size: 16px;

  transition: transform 0.25s ease;
}

.ark-support-diagnosis-link:hover
.ark-support-diagnosis-arrow {
  transform: translateX(5px);
}


/* ========================================
   Bottom Message
======================================== */

.ark-support-before-board-bottom {
  position: relative;

  max-width: 720px;

  margin: 100px auto 0;
  padding-top: 74px;

  text-align: center;
}

.ark-support-before-board-bottom::before {
  content: "";

  position: absolute;
  top: 0;
  left: 50%;

  width: 100%;
  height: 1px;

  transform: translateX(-50%);

  background: var(--before-line);
}


/* English */

.ark-support-before-board-bottom-en {
  margin: 0 0 24px;

  color: var(--before-text-soft);

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.24em;
}


/* Main message */

.ark-support-before-board-bottom-text {
  margin: 0;

  color: var(--before-text);

  font-family: serif;
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 400;

  line-height: 1.65;
  letter-spacing: 0.06em;
}


/* ========================================
   Mobile
======================================== */

@media (max-width: 600px) {

  .ark-support-before-board {
    padding: 82px 20px 90px;
  }


  /* Diagnosis */

  .ark-support-diagnosis {
    text-align: left;
  }

  .ark-support-diagnosis-eyebrow {
    margin-bottom: 20px;

    font-size: 8px;
    letter-spacing: 0.22em;
  }

  .ark-support-diagnosis-title {
    font-size: 30px;
  }

  .ark-support-diagnosis-text {
    margin-top: 24px;

    font-size: 13px;
    line-height: 1.95;
  }


  /* Link */

  .ark-support-diagnosis-link {
    justify-content: space-between;

    width: 100%;

    margin-top: 28px;

    padding-bottom: 12px;

    font-size: 12px;
  }


  /* Bottom */

  .ark-support-before-board-bottom {
    margin-top: 74px;
    padding-top: 58px;

    text-align: left;
  }

  .ark-support-before-board-bottom-en {
    margin-bottom: 20px;

    font-size: 7px;
    line-height: 1.8;
  }

  .ark-support-before-board-bottom-text {
    font-size: 27px;
    line-height: 1.65;
  }

}

/* ========================================
   Section 9：FAQ・お問い合わせ導線
======================================== */

.ark-support-help {
  --help-green: #304b3b;
  --help-green-soft: #69786e;
  --help-bg: #f1f2eb;
  --help-line: rgba(48, 75, 59, 0.22);

  position: relative;

  width: 100vw;
  max-width: none;

  margin: 0;
  margin-left: calc(50% - 50vw);

  margin-block-start: 0 !important;
  margin-block-end: 0 !important;

  padding: 126px 24px 110px;

  background: var(--help-bg);

  overflow: hidden;
}

.ark-support-help-inner {
  width: 100%;
  max-width: 1040px;

  margin: 0 auto;
}


/* -------------------------
   Header
------------------------- */

.ark-support-help-header {
  max-width: 760px;

  margin: 0 auto 72px;

  text-align: center;
}

.ark-support-help-eyebrow {
  margin: 0 0 24px;

  color: var(--help-green-soft);

  font-size: 10px;
  font-weight: 600;

  letter-spacing: 0.24em;
}

.ark-support-help-title {
  margin: 0;

  color: var(--help-green);

  font-family: serif;
  font-size: clamp(40px, 4.5vw, 60px);
  font-weight: 400;

  line-height: 1.45;
  letter-spacing: 0.05em;
}

.ark-support-help-lead {
  margin: 30px auto 0;

  color: #59625b;

  font-size: 14px;
  line-height: 2.05;
  letter-spacing: 0.04em;
}


/* -------------------------
   Links
------------------------- */

.ark-support-help-links {
  max-width: 900px;

  margin: 0 auto;

  border-top: 1px solid var(--help-line);
}

.ark-support-help-link {
  position: relative;

  display: flex;

  min-height: 190px;

  padding: 42px 74px 42px 34px;

  align-items: center;
  justify-content: space-between;

  border-bottom: 1px solid var(--help-line);

  color: inherit !important;
  text-decoration: none !important;

  transition:
    background 0.25s ease,
    padding-left 0.25s ease;
}

.ark-support-help-link:hover {
  padding-left: 44px;

  background: rgba(48, 75, 59, 0.035);
}


/* Content */

.ark-support-help-link-content {
  max-width: 670px;
}

.ark-support-help-link-label {
  margin: 0 0 10px;

  color: var(--help-green-soft);

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.22em;
}

.ark-support-help-link-title {
  margin: 0;

  color: var(--help-green);

  font-family: serif;
  font-size: 29px;
  font-weight: 400;

  line-height: 1.5;
  letter-spacing: 0.05em;
}

.ark-support-help-link-text {
  margin: 14px 0 0;

  color: #59625b;

  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.035em;
}


/* Arrow */

.ark-support-help-link-arrow {
  position: absolute;

  right: 34px;

  color: var(--help-green);

  font-size: 23px;

  transition: transform 0.25s ease;
}

.ark-support-help-link:hover .ark-support-help-link-arrow {
  transform: translateX(5px);
}


/* -------------------------
   Bottom message
------------------------- */

.ark-support-help-bottom {
  margin-top: 94px;

  text-align: center;
}

.ark-support-help-bottom-en {
  margin: 0 0 20px;

  color: var(--help-green-soft);

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.25em;
}

.ark-support-help-bottom-message {
  margin: 0;

  color: var(--help-green);

  font-family: serif;
  font-size: clamp(25px, 2.8vw, 36px);
  font-weight: 400;

  line-height: 1.7;
  letter-spacing: 0.06em;
}


/* ========================================
   Mobile
======================================== */

@media (max-width: 600px) {

  .ark-support-help {
    padding: 86px 20px 78px;
  }


  /* Header */

  .ark-support-help-header {
    margin-bottom: 52px;

    text-align: left;
  }

  .ark-support-help-eyebrow {
    margin-bottom: 18px;

    font-size: 8px;
  }

  .ark-support-help-title {
    font-size: clamp(33px, 9vw, 41px);
    line-height: 1.5;
  }

  .ark-support-help-lead {
    margin-top: 24px;

    font-size: 13px;
    line-height: 2;
  }


  /* Links */

  .ark-support-help-link {
    min-height: 0;

    padding: 34px 48px 34px 4px;

    align-items: flex-start;
  }

  .ark-support-help-link:hover {
    padding-left: 4px;
  }

  .ark-support-help-link-label {
    margin-bottom: 8px;

    font-size: 8px;
  }

  .ark-support-help-link-title {
    font-size: 24px;
  }

  .ark-support-help-link-text {
    margin-top: 12px;

    font-size: 12px;
    line-height: 1.9;
  }

  .ark-support-help-link-arrow {
    top: 50%;
    right: 5px;

    transform: translateY(-50%);

    font-size: 20px;
  }

  .ark-support-help-link:hover .ark-support-help-link-arrow {
    transform: translate(4px, -50%);
  }


  /* Bottom */

  .ark-support-help-bottom {
    margin-top: 70px;
  }

  .ark-support-help-bottom-en {
    font-size: 8px;
    line-height: 1.7;
  }

  .ark-support-help-bottom-message {
    font-size: clamp(23px, 7vw, 29px);
    line-height: 1.75;
  }
}

/* ========================================
   支援ページ：メインコンテンツ上下の余白を削除
======================================== */

[data-vertical-spacing*="top"] {
  padding-top: 0 !important;
}

[data-vertical-spacing*="bottom"] {
  padding-bottom: 0 !important;
}