:root {
  --white: #FFFFFF;
  --ink: #2A2A2A;
  --ink-soft: rgba(42, 42, 42, 0.72);
  --orange: #D3884C;
  --green: #83B765;
  --blue: #5586A9;
  --purple: #C06995;
  --light-orange: #D7A772;
  --beige: #FAF6F0;
  --line: rgba(42, 42, 42, 0.14);
  --shadow: 0 18px 48px rgba(42, 42, 42, 0.1);
  --font-ja: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  --font-kaku: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
  --font-serif: "Zen Old Mincho", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-feature-settings: "palt";
}

body {
  min-width: 320px;
  margin: 0;
  color: var(--ink);
  background: var(--beige);
  font-family: var(--font-ja);
  font-feature-settings: "palt";
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0;
  overflow-x: hidden;
}

*,
*::before,
*::after {
  font-feature-settings: inherit;
}

button,
input,
textarea,
select {
  font-feature-settings: inherit;
}

body.is-menu-open {
  overflow: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  font: inherit;
}

:focus-visible {
  outline: 3px solid rgba(85, 134, 169, 0.52);
  outline-offset: 4px;
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  width: 100%;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  transition: box-shadow 180ms ease, background 180ms ease;
}

.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(22px) saturate(1.08);
  -webkit-backdrop-filter: blur(22px) saturate(1.08);
  box-shadow: 0 10px 30px rgba(42, 42, 42, 0.12);
}

.header-inner {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) auto;
  align-items: center;
  gap: 20px;
  width: min(100%, 1280px);
  min-height: 96px;
  margin: 0 auto;
  padding: 18px 30px;
}

.brand {
  display: inline-flex;
  align-items: center;
  width: 184px;
}

.brand img {
  width: 100%;
}

.global-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.global-nav a {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  padding: 0 10px;
  color: var(--ink);
  font-family: var(--font-kaku);
  line-height: 1.35;
  text-align: center;
  white-space: nowrap;
}

.global-nav a::after {
  position: absolute;
  right: 16px;
  bottom: 6px;
  left: 16px;
  height: 1px;
  content: "";
  background: var(--green);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}

.global-nav a:hover::after,
.global-nav a:focus-visible::after,
.global-nav a.is-current::after {
  transform: scaleX(1);
}

.global-nav a.is-current span {
  color: var(--green);
}

.global-nav span {
  font-size: 13px;
  font-weight: 700;
}

.global-nav small {
  color: var(--ink-soft);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-phone {
  display: grid;
  justify-items: center;
  min-width: 164px;
  padding: 10px 14px;
  border: 1px solid var(--orange);
  border-radius: 8px;
  color: var(--ink);
  background: var(--orange);
  line-height: 1.35;
  text-align: center;
}

.header-phone span {
  color: var(--white);
  font-size: 11px;
  font-weight: 700;
}

.header-phone strong {
  color: var(--white);
  font-size: 18px;
  font-weight: 900;
}

.menu-button {
  display: none;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  color: var(--white);
  background: var(--green);
  cursor: pointer;
}

.menu-lines,
.menu-lines::before,
.menu-lines::after {
  display: block;
  width: 24px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.menu-lines {
  position: relative;
}

.menu-lines::before,
.menu-lines::after {
  position: absolute;
  left: 0;
  content: "";
}

.menu-lines::before {
  top: -8px;
}

.menu-lines::after {
  top: 8px;
}

.menu-label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  color: var(--white);
  background: var(--orange);
}

.hero-photo {
  position: absolute;
  inset: 0;
}

.hero-photo::after {
  position: absolute;
  inset: 0;
  content: "";
  background: rgba(255, 255, 255, 0.28);
}

.hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(1.12) saturate(1.04);
}

.hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: min(100%, 1280px);
  min-height: 100svh;
  margin: 0 auto;
  padding: 150px 30px 110px;
}

.hero-content::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
  background: radial-gradient(circle at 22% 34%, rgba(255, 255, 255, 0.38) 0 24%, rgba(255, 255, 255, 0.13) 42%, rgba(255, 255, 255, 0) 64%),
    radial-gradient(circle at 24% 66%, rgba(255, 255, 255, 0.29) 0 22%, rgba(255, 255, 255, 0.08) 40%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.27) 0%, rgba(255, 255, 255, 0.14) 34%, rgba(255, 255, 255, 0) 58%);
  filter: blur(18px);
}

.hero-side-label {
  position: absolute;
  top: 50%;
  right: 28px;
  z-index: 3;
  padding: 14px 10px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  writing-mode: vertical-rl;
  transform: translateY(-50%);
  background: rgba(28, 28, 28, 0.26);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 999px;
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.18);
}

.eyebrow {
  margin: 0 0 20px;
  color: var(--green);
  font-size: 13px;
  font-weight: 900;
  font-family: var(--font-kaku);
  line-height: 1.4;
  text-transform: uppercase;
}

.hero .eyebrow {
  color: var(--ink);
  text-shadow: 0 2px 16px var(--white);
}

.hero h1 {
  margin: 0;
  font-family: var(--font-ja);
  font-size: 64px;
  font-weight: 900;
  line-height: 1.28;
}

.hero-word {
  display: inline-block;
  -webkit-text-stroke: 7px var(--white);
  paint-order: stroke fill;
  text-shadow: 0 3px 18px rgba(255, 255, 255, 0.92);
}

.word-connect {
  color: var(--blue);
}

.word-support {
  color: var(--green);
}

.word-share {
  color: var(--purple);
}

.hero-separator {
  color: var(--orange);
  text-shadow: 0 3px 18px rgba(42, 42, 42, 0.36);
}

.hero-lead {
  width: min(100%, 540px);
  margin: 30px 0 0;
  color: var(--ink);
  font-size: 18px;
  font-weight: 500;
  text-shadow: 0 4px 14px rgba(0, 0, 0, 0.36);
}

.hero-lead span {
  background: linear-gradient(transparent 8%, rgba(255, 255, 255, 0.92) 45%, rgba(255, 255, 255, 0.92) 100%);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  border-radius: 0.2em;
  padding: 0 0.08em;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.24);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 42px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 14px 22px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.35;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.button::after {
  margin-left: 14px;
  content: "→";
}

.button:hover {
  transform: translateY(-2px);
}

.primary-button {
  color: var(--white);
  background: var(--orange);
}

.line-button {
  color: var(--white);
  border: 1px solid var(--green);
  background: var(--green);
}

.hero-scroll {
  position: absolute;
  right: 30px;
  bottom: 28px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  font-weight: 900;
}

.hero-scroll::before {
  display: block;
  width: 6px;
  height: 6px;
  content: "";
  background: currentColor;
  border-radius: 999px;
  animation: scroll-dot 1.6s ease-in-out infinite;
}

.hero-scroll::after {
  display: block;
  width: 44px;
  height: 1px;
  content: "";
  background: currentColor;
}

@keyframes scroll-dot {
  0%,
  100% {
    transform: translateY(0);
    opacity: 0.55;
  }

  50% {
    transform: translateY(4px);
    opacity: 1;
  }
}

.section-inner {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding-right: 30px;
  padding-left: 30px;
}

.section-label span {
  display: block;
  margin-bottom: 10px;
  color: var(--green);
  font-family: var(--font-kaku);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.section-label h2 span {
  margin-bottom: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  text-transform: none;
}

.section-label h2,
.section-heading h2 {
  margin: 0;
  font-family: var(--font-ja);
  font-size: 36px;
  font-weight: 700;
  line-height: 1.46;
}

.news-strip {
  background: var(--white);
  border-bottom: 1px solid var(--line);
}

.news-strip-inner {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) auto;
  align-items: start;
  gap: 26px;
  padding-top: 28px;
  padding-bottom: 28px;
}

.news-strip .section-label h2 {
  font-family: var(--font-ja);
  font-size: 20px;
}

.news-list {
  display: grid;
  gap: 0;
  min-width: 0;
}

.news-link {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  min-width: 0;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.news-link:hover {
  border-bottom-color: var(--green);
}

.news-link time {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
}

.news-link span {
  min-width: 0;
  overflow: hidden;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.news-more,
.text-link {
  display: inline-flex;
  align-items: center;
  color: var(--orange);
  font-size: 14px;
  font-weight: 900;
}

.news-more {
  padding-top: 12px;
  white-space: nowrap;
}

.news-more::after,
.text-link::after {
  margin-left: 10px;
  content: "→";
}

.statement-section {
  padding: 110px 0;
  background: var(--beige);
}

.statement-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 36px;
  width: min(100%, 900px);
}

.statement-copy h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 42px;
  line-height: 1.52;
}

.statement-copy h2 span {
  display: block;
}

.statement-body {
  display: grid;
  gap: 18px;
  max-width: 760px;
  color: var(--ink-soft);
  font-size: 17px;
}

.statement-body p,
.first-copy p,
.flow-copy p,
.recruit-copy p,
.access-copy p,
.about-content p {
  margin: 0;
}

.first-section,
.recruit-section {
  padding: 120px 0;
  background: var(--white);
}

.first-layout,
.recruit-grid,
.access-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  align-items: center;
  gap: 72px;
}

.section-photo {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.section-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.access-map-embed {
  aspect-ratio: 4 / 3.2;
  background: var(--white);
}

.access-map-embed iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 360px;
  border: 0;
}

.first-photo {
  aspect-ratio: 4 / 5;
}

.first-copy,
.recruit-copy,
.access-copy {
  display: grid;
  gap: 26px;
}

.large-copy {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: 27px;
  font-weight: 700;
  line-height: 1.65;
}

.first-copy > p:not(.large-copy),
.recruit-copy > p:not(.large-copy),
.access-copy > p {
  color: var(--ink-soft);
}

.point-list {
  display: grid;
  gap: 14px;
  margin-top: 10px;
}

.point-list article {
  display: grid;
  grid-template-columns: 58px minmax(0, 140px) minmax(0, 1fr);
  align-items: start;
  gap: 18px;
  padding: 22px 0;
  border-top: 1px solid var(--line);
}

.point-list article:last-child {
  border-bottom: 1px solid var(--line);
}

.point-list span {
  color: var(--orange);
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
}

.point-list h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.45;
}

.point-list p {
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.75;
}

.services-section {
  padding: 112px 0 122px;
  background: var(--white);
}

.services-heading {
  width: min(100%, 820px);
  margin: 0 auto 48px;
  text-align: center;
}

.services-heading h2 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-ja);
  font-size: 42px;
  font-weight: 900;
  line-height: 1.35;
}

.office-overview-section .services-heading h2 {
  font-size: 34px;
  white-space: nowrap;
}

.services-heading p {
  margin: 20px 0 0;
  color: var(--ink);
  font-size: 16px;
  font-weight: 900;
  line-height: 1.8;
}

.office-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 46px;
}

.office-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 780px;
  padding: 48px 40px 42px;
  overflow: hidden;
  border: 1px solid rgba(42, 42, 42, 0.08);
  border-radius: 48px;
  background: var(--white);
  box-shadow: 0 22px 54px rgba(42, 42, 42, 0.08);
}

.office-card::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.94) 0%,
    rgba(255, 255, 255, 0.9) 34%,
    rgba(255, 255, 255, 0.72) 68%,
    rgba(255, 255, 255, 0.48) 100%
  );
  pointer-events: none;
}

.office-card > :not(.office-oval-visual) {
  position: relative;
  z-index: 2;
}

.office-card-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 24px;
  min-height: 245px;
  max-width: 330px;
}

.office-title-block {
  text-align: left;
}

.office-small-label {
  margin: 0;
  color: var(--blue);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.4;
  text-shadow: 0 2px 14px var(--white);
}

.office-card h3 {
  margin: 0;
  font-family: var(--font-ja);
  line-height: 1;
}

.office-card h3 span {
  display: block;
  margin-top: 14px;
  color: var(--blue);
  font-size: 86px;
  font-weight: 900;
  letter-spacing: 0;
  text-shadow: 0 5px 24px var(--white);
}

.office-card h3 small {
  display: block;
  margin: 14px 0 1rem;
  color: var(--blue);
  font-size: 34px;
  font-weight: 900;
  line-height: 1.15;
  text-shadow: 0 4px 18px var(--white);
}

.office-card-kei .office-small-label,
.office-card-kei h3 span,
.office-card-kei h3 small {
  color: var(--purple);
}

.office-type {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  margin: 0;
  min-height: 34px;
  padding: 7px 14px;
  border-radius: 999px;
  color: var(--white);
  background: var(--blue);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.35;
}

.office-card-kei .office-type {
  background: var(--purple);
}

.office-oval-visual {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 0;
  border-radius: inherit;
  background: var(--white);
  box-shadow: none;
  opacity: 0.62;
}

.office-oval-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.office-description {
  display: grid;
  gap: 14px;
  margin-top: 20px;
  color: var(--ink);
  text-shadow: 0 2px 16px var(--white);
}

.office-description h4 {
  margin: 0;
  font-size: 25px;
  font-weight: 900;
  line-height: 1.45;
  text-shadow: 0 3px 18px var(--white);
}

.office-description p {
  width: min(100%, 300px);
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.9;
}

.office-service-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: auto 0 28px;
  padding: 0;
  list-style: none;
}

.office-service-list li {
  display: grid;
  place-items: center;
  gap: 12px;
  aspect-ratio: 1 / 1;
  padding: 18px 12px;
  border: 1px solid rgba(85, 134, 169, 0.18);
  border-radius: 999px;
  color: var(--blue);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 12px 28px rgba(42, 42, 42, 0.08);
  text-align: center;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.45;
  text-shadow: 0 2px 12px var(--white);
}

.office-card-kei .office-service-list li {
  border-color: rgba(192, 105, 149, 0.16);
  color: var(--purple);
  background: rgba(255, 255, 255, 0.82);
}

.office-service-list svg {
  width: 40px;
  height: 40px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.office-service-list span {
  transform: translateY(-1rem);
}

.office-button {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-width: 278px;
  min-height: 46px;
  padding: 12px 22px;
  border-radius: 999px;
  color: var(--white);
  background: var(--blue);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.35;
}

.office-button::after {
  margin-left: 16px;
  content: "→";
}

.office-card-kei .office-button {
  background: var(--purple);
}

.office-corner-illust {
  display: none;
}

.yui-corner-illust {
  left: 22px;
  width: 130px;
}

.kei-corner-illust {
  right: 34px;
  width: 160px;
}

.flow-section {
  padding: 118px 0;
  background: var(--white);
}

.flow-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 46px;
}

.flow-copy {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  align-items: end;
  gap: 48px;
}

.flow-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: flow;
}

.flow-list li {
  position: relative;
  display: grid;
  align-content: end;
  gap: 12px;
  min-height: 330px;
  overflow: hidden;
  padding: 150px 22px 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--beige);
}

.flow-list li::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 250, 244, 0.82) 52%, rgba(255, 250, 244, 0.96) 100%);
}

.flow-list li:not(:last-child)::after {
  display: none;
}

.flow-icon {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: inherit;
  background: var(--beige);
}

.flow-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  opacity: 0.68;
  transform: scale(1.04);
}

.flow-list span {
  position: relative;
  z-index: 1;
  color: var(--green);
  font-size: 12px;
  font-weight: 900;
}

.flow-list h3 {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: 21px;
  line-height: 1.45;
  text-shadow: 0 2px 12px rgba(255, 255, 255, 0.72);
}

.flow-list p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.8;
  text-shadow: 0 2px 12px rgba(255, 255, 255, 0.72);
}

.about-section {
  position: relative;
  overflow: hidden;
  color: var(--white);
  background: var(--orange);
}

.about-photo {
  position: absolute;
  inset: 0;
}

.about-photo::after {
  position: absolute;
  inset: 0;
  content: "";
  background: transparent;
}

.about-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 60px;
  padding-top: 118px;
  padding-bottom: 118px;
}

.light-label > span {
  color: var(--green);
}

#about-title.about-title-words {
  font-size: 78px;
  font-weight: 900;
  line-height: 1.28;
}

.about-title-words span {
  display: block;
}

.about-title-words .word-connect,
.about-title-words .word-support,
.about-title-words .word-share {
  -webkit-text-stroke: 7px var(--white);
  paint-order: stroke fill;
  text-shadow: 0 3px 18px rgba(42, 42, 42, 0.28);
}

.about-title-words .word-connect {
  color: var(--blue);
}

.about-title-words .word-support {
  color: var(--green);
}

.about-title-words .word-share {
  color: var(--purple);
}

.about-detail {
  align-self: end;
  display: grid;
  justify-items: start;
  gap: 28px;
}

.about-detail p {
  margin: 0;
  align-self: end;
  color: rgba(255, 255, 255, 0.86);
  font-size: 17px;
  text-shadow: 0 3px 16px rgba(42, 42, 42, 0.62);
}

.about-more-button {
  min-width: 178px;
  color: var(--white);
  background: var(--orange);
  box-shadow: 0 14px 32px rgba(42, 42, 42, 0.18);
}

.numbers-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.34);
}

.numbers-grid article {
  min-height: 160px;
  padding: 28px;
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(10px);
}

.numbers-grid strong {
  display: block;
  font-family: var(--font-ja);
  font-size: 42px;
  line-height: 1.1;
}

.numbers-grid span {
  margin-left: 4px;
  font-size: 16px;
}

.numbers-grid p {
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 700;
}

.recruit-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.94fr);
}

.recruit-points {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.recruit-points span {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--orange);
  font-size: 14px;
  font-weight: 900;
  background: var(--beige);
}

.recruit-photo {
  aspect-ratio: 4 / 4.7;
}

.recruit-section .primary-button {
  justify-self: start;
  color: var(--white);
}

.access-section {
  padding: 120px 0;
  background: var(--beige);
}

.access-grid {
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr);
}

.access-photo {
  aspect-ratio: 4 / 3.2;
}

address {
  display: grid;
  gap: 4px;
  font-style: normal;
}

address span {
  font-weight: 900;
}

.contact-box {
  display: grid;
  gap: 6px;
  padding: 28px;
  border-left: 4px solid var(--green);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 14px 36px rgba(42, 42, 42, 0.08);
}

.contact-box p {
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 900;
}

.contact-box a {
  color: var(--orange);
  font-family: var(--font-ja);
  font-size: 34px;
  font-weight: 700;
  line-height: 1.2;
}

.contact-box span {
  color: var(--ink-soft);
  font-weight: 700;
}

.site-footer {
  color: var(--white);
  background: var(--orange);
}

.footer-inner {
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 38px;
  padding-top: 54px;
  padding-bottom: 42px;
}

.footer-brand img {
  width: 94px;
}

.footer-nav {
  display: grid;
  gap: 0;
}

.footer-nav a,
.footer-sitemap h3 {
  color: rgba(255, 255, 255, 0.84);
  font-weight: 700;
}

.footer-sitemap {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.footer-sitemap section {
  display: grid;
  align-content: start;
  gap: 8px;
}

.footer-sitemap h3 {
  margin: 0 0 4px;
  color: var(--white);
  font-size: 14px;
}

.footer-sitemap a {
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
  line-height: 1.55;
}

.footer-copy {
  grid-column: 1 / -1;
  margin: 16px 0 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 13px;
  text-align: center;
}

.subpage-hero {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  background: var(--white);
}

.subpage-hero::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background: linear-gradient(90deg, rgba(250, 246, 240, 0.96) 0%, rgba(250, 246, 240, 0.82) 36%, rgba(250, 246, 240, 0.18) 100%);
}

.subpage-hero-photo {
  position: absolute;
  inset: 0;
}

.subpage-hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.04) brightness(1.06);
}

.first-page-hero .subpage-hero-photo img {
  object-position: 64% center;
}

.office-page-hero .subpage-hero-photo img {
  object-position: 58% center;
}

.subpage-hero-content {
  position: relative;
  z-index: 2;
  display: grid;
  align-content: center;
  justify-items: start;
  min-height: 620px;
  padding-top: 144px;
  padding-bottom: 76px;
}

.subpage-hero h1 {
  max-width: 720px;
  margin: 0;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: 58px;
  font-weight: 700;
  line-height: 1.36;
}

.subpage-hero p:not(.eyebrow) {
  width: min(100%, 560px);
  margin: 28px 0 0;
  color: var(--ink-soft);
  font-size: 18px;
  font-weight: 700;
  line-height: 2;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 18px;
  padding-bottom: 18px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
}

.breadcrumb a {
  color: var(--orange);
}

.breadcrumb a::after {
  margin-left: 10px;
  color: var(--ink-soft);
  content: "/";
}

.subpage-intro-section,
.worry-section,
.route-section,
.office-overview-section,
.office-access-section,
.faq-section,
.cta-section {
  padding: 104px 0;
}

.subpage-intro-section,
.route-section,
.faq-section {
  background: var(--white);
}

.worry-section,
.office-overview-section,
.office-access-section,
.cta-section {
  background: var(--beige);
}

.subpage-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 70px;
}

.subpage-intro-body {
  display: grid;
  gap: 20px;
  color: var(--ink-soft);
  font-size: 17px;
}

.subpage-intro-body p {
  margin: 0;
}

.compact-heading {
  margin-bottom: 36px;
}

.centered-label {
  margin-bottom: 42px;
  text-align: center;
}

.check-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.check-grid article {
  min-height: 170px;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 16px 36px rgba(42, 42, 42, 0.06);
}

.check-grid span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin-bottom: 20px;
  border-radius: 999px;
  color: var(--white);
  background: var(--green);
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 700;
}

.check-grid p {
  margin: 0;
  color: var(--ink);
  font-size: 16px;
  font-weight: 900;
  line-height: 1.8;
}

.route-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

.route-card {
  position: relative;
  display: grid;
  align-content: start;
  gap: 16px;
  min-height: 430px;
  padding: 38px;
  overflow: hidden;
  border: 1px solid rgba(85, 134, 169, 0.18);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 18px 44px rgba(42, 42, 42, 0.08);
}

.route-card-image {
  height: 230px;
  margin: -38px -38px 12px;
  overflow: hidden;
  border-radius: 8px 8px 0 0;
  background: var(--beige);
}

.route-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.route-kei {
  border-color: rgba(192, 105, 149, 0.18);
}

.route-label {
  margin: 0;
  color: var(--blue);
  font-size: 14px;
  font-weight: 900;
}

.route-kei .route-label {
  color: var(--purple);
}

.route-card h3 {
  margin: 0;
  color: var(--blue);
  font-family: var(--font-ja);
  font-size: 34px;
  font-weight: 900;
  line-height: 1.25;
}

.route-kei h3 {
  color: var(--purple);
}

.route-type,
.office-detail-type {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  min-height: 34px;
  margin: 0;
  padding: 7px 14px;
  border-radius: 999px;
  color: var(--white);
  background: var(--blue);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.35;
}

.route-kei .route-type,
.kei-type {
  background: var(--purple);
}

.route-card p:not(.route-label):not(.route-type) {
  margin: 0;
  color: var(--ink-soft);
}

.subpage-flow {
  background: var(--white);
}

.faq-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: 70px;
}

.faq-list {
  display: grid;
  gap: 12px;
}

.faq-list details {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--beige);
}

.faq-list summary {
  position: relative;
  padding: 22px 58px 22px 24px;
  font-weight: 900;
  line-height: 1.7;
  cursor: pointer;
}

.faq-list summary::after {
  position: absolute;
  top: 50%;
  right: 24px;
  color: var(--orange);
  content: "+";
  font-size: 24px;
  font-weight: 900;
  transform: translateY(-50%);
}

.faq-list details[open] summary::after {
  content: "-";
}

.faq-list p {
  margin: 0;
  padding: 0 24px 24px;
  color: var(--ink-soft);
}

.cta-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 32px;
  padding-top: 52px;
  padding-bottom: 52px;
  border: 1px solid rgba(211, 136, 76, 0.24);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 18px 44px rgba(42, 42, 42, 0.08);
}

.cta-panel h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 34px;
  line-height: 1.5;
}

.cta-panel p:not(.eyebrow) {
  margin: 14px 0 0;
  color: var(--ink-soft);
}

.cta-phone {
  display: grid;
  justify-items: center;
  min-width: 250px;
  padding: 20px 24px;
  border-radius: 8px;
  color: var(--white);
  background: var(--orange);
  line-height: 1.35;
  text-align: center;
}

.cta-phone span {
  font-size: 13px;
  font-weight: 900;
}

.cta-phone strong {
  font-size: 28px;
  font-weight: 900;
}

.office-route-grid .route-card {
  min-height: 610px;
}

.office-detail-section {
  padding: 114px 0;
  background: var(--white);
}

.office-detail-kei {
  background: var(--beige);
}

.office-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  align-items: center;
  gap: 72px;
}

.reverse-grid .office-detail-photo {
  order: 2;
}

.office-detail-photo {
  aspect-ratio: 4 / 4.6;
  background: var(--beige);
}

.office-detail-copy {
  display: grid;
  gap: 24px;
}

.office-detail-copy > p:not(.large-copy):not(.office-detail-type) {
  margin: 0;
  color: var(--ink-soft);
}

.detail-points {
  display: grid;
  gap: 12px;
}

.detail-points article {
  padding: 20px 0;
  border-top: 1px solid var(--line);
}

.detail-points article:last-child {
  border-bottom: 1px solid var(--line);
}

.detail-points h3 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.45;
}

.detail-points p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
}

.office-info-list {
  display: grid;
  gap: 0;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.office-info-list div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
}

.office-info-list div + div {
  border-top: 1px solid var(--line);
}

.office-info-list dt,
.office-info-list dd {
  margin: 0;
  padding: 15px 18px;
}

.office-info-list dt {
  color: var(--ink);
  background: var(--beige);
  font-weight: 900;
}

.office-info-list dd {
  color: var(--ink-soft);
  background: var(--white);
}

.page-card-section,
.story-section,
.message-section,
.table-section,
.service-detail-section,
.news-page-section,
.policy-section {
  padding: 104px 0;
  background: var(--white);
}

.page-card-section.alt-section,
.story-section.alt-section,
.message-section.alt-section,
.table-section.alt-section,
.service-detail-section.alt-section,
.news-page-section.alt-section {
  background: var(--beige);
}

.hub-card-grid,
.story-card-grid,
.service-card-grid,
.news-card-grid,
.mini-link-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 18px;
}

.hub-card,
.story-card,
.service-card,
.news-card,
.mini-link-card {
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 220px;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 16px 38px rgba(42, 42, 42, 0.06);
}

.hub-card h3,
.story-card h3,
.service-card h3,
.news-card h3,
.mini-link-card h3 {
  margin: 0;
  font-size: 22px;
  line-height: 1.45;
}

.hub-card p,
.story-card p,
.service-card p,
.news-card p,
.mini-link-card p {
  margin: 0;
  color: var(--ink-soft);
}

.hub-card .text-link,
.mini-link-card .text-link,
.news-card .text-link {
  align-self: end;
}

.day-schedule-list {
  display: grid;
  gap: 22px;
}

.day-schedule-row {
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(320px, 1.08fr);
  align-items: stretch;
  gap: 22px;
}

.day-schedule-card {
  min-height: 0;
  padding: 30px 34px;
}

.day-schedule-card h3 {
  color: #1f3f5d;
}

.day-schedule-image {
  min-height: 210px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--beige);
  box-shadow: 0 16px 38px rgba(42, 42, 42, 0.06);
}

.day-schedule-image img {
  width: 100%;
  height: 100%;
  min-height: 210px;
  object-fit: cover;
}

@media (max-width: 900px) {
  .day-schedule-row {
    grid-template-columns: minmax(220px, 0.9fr) minmax(260px, 1.1fr);
    gap: 16px;
  }

  .day-schedule-card {
    padding: 26px;
  }
}

@media (max-width: 640px) {
  .day-schedule-row {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .day-schedule-image,
  .day-schedule-image img {
    min-height: 190px;
  }
}

.story-grid,
.message-grid,
.profile-grid,
.contact-grid,
.company-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr);
  align-items: start;
  gap: 70px;
}

.story-image,
.profile-image {
  aspect-ratio: 4 / 4.8;
  overflow: hidden;
  border-radius: 8px;
  background: var(--beige);
  box-shadow: 0 18px 44px rgba(42, 42, 42, 0.08);
}

.story-image img,
.profile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.article-body {
  display: grid;
  gap: 22px;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 2;
}

.article-body p {
  margin: 0;
}

.quote-panel {
  margin: 8px 0;
  padding: 30px;
  border-left: 5px solid var(--green);
  border-radius: 8px;
  color: var(--ink);
  background: var(--beige);
  font-family: var(--font-serif);
  font-size: 23px;
  font-weight: 700;
  line-height: 1.8;
}

.quote-panel cite {
  display: block;
  margin-top: 14px;
  color: var(--ink-soft);
  font-family: var(--font-ja);
  font-size: 14px;
  font-style: normal;
}

.profile-panel {
  display: grid;
  gap: 22px;
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 16px 38px rgba(42, 42, 42, 0.06);
}

.profile-panel h2,
.profile-panel h3 {
  margin: 0;
  line-height: 1.45;
}

.profile-name {
  margin: 0;
  color: var(--orange);
  font-size: 34px;
  font-weight: 900;
  line-height: 1.3;
}

.profile-role {
  margin: 0;
  color: var(--ink-soft);
  font-size: 15px;
  font-weight: 900;
  line-height: 1.45;
}

.profile-title-inline {
  display: inline-block;
  margin-right: 0.5em;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.45;
  vertical-align: baseline;
}

.profile-list,
.timeline-list,
.area-list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.profile-list li,
.timeline-list li,
.area-list li {
  display: grid;
  gap: 4px;
  padding: 15px 18px;
  color: var(--ink-soft);
  background: var(--white);
}

.profile-list li + li,
.timeline-list li + li,
.area-list li + li {
  border-top: 1px solid var(--line);
}

.profile-list strong,
.timeline-list strong,
.area-list strong {
  color: var(--ink);
}

.jobs-heading-panel {
  display: grid;
  gap: 24px;
  align-content: start;
}

.jobs-recruit-image {
  aspect-ratio: 4 / 3;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 18px 44px rgba(42, 42, 42, 0.08);
}

.jobs-recruit-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.recruit-message-section {
  padding: 104px 0;
  background: var(--white);
}

.recruit-message-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  align-items: center;
  gap: 54px;
}

.recruit-message-photo {
  aspect-ratio: 16 / 9;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--beige);
  box-shadow: 0 18px 44px rgba(42, 42, 42, 0.08);
}

.recruit-message-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.recruit-message-body {
  display: grid;
  gap: 18px;
  color: var(--ink-soft);
}

.recruit-message-body p {
  margin: 0;
}

.recruit-message-lead {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.72;
}

.recruit-message-sign {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  color: var(--ink);
}

.recruit-message-sign span {
  color: var(--green);
  font-size: 13px;
  font-weight: 900;
}

.recruit-message-sign strong {
  font-size: 18px;
  font-weight: 900;
}

.info-table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.info-table th,
.info-table td {
  padding: 17px 20px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.info-table tr:last-child th,
.info-table tr:last-child td {
  border-bottom: 0;
}

.info-table th {
  width: 190px;
  color: var(--ink);
  background: var(--beige);
  font-weight: 900;
}

.info-table td {
  color: var(--ink-soft);
  background: var(--white);
}

.service-card {
  min-height: 250px;
}

.service-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  color: var(--white);
  background: var(--green);
  font-family: var(--font-serif);
  font-weight: 700;
}

.contact-panel {
  display: grid;
  justify-items: center;
  gap: 12px;
  padding: 46px 34px;
  border: 1px solid rgba(211, 136, 76, 0.24);
  border-radius: 8px;
  color: var(--white);
  background: var(--orange);
  text-align: center;
  box-shadow: 0 18px 44px rgba(42, 42, 42, 0.08);
}

.contact-panel p {
  margin: 0;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 900;
}

.contact-panel a {
  color: var(--white);
  font-size: 42px;
  font-weight: 900;
  line-height: 1.2;
}

.contact-panel span {
  color: rgba(255, 255, 255, 0.82);
  font-weight: 700;
}

.news-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 900;
}

.news-tag {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  color: var(--white);
  background: var(--green);
  line-height: 1.2;
}

.news-list-summary {
  margin: -10px 0 22px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 900;
}

.news-index-list {
  display: grid;
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 16px 38px rgba(42, 42, 42, 0.06);
}

.news-index-item {
  display: grid;
  gap: 12px;
  padding: 26px 30px;
}

.news-index-item + .news-index-item {
  border-top: 1px solid var(--line);
}

.news-index-item h3 {
  margin: 0;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.45;
}

.news-index-item p {
  margin: 0;
  color: var(--ink-soft);
}

.news-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 34px;
}

.pagination-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: var(--white);
  font-weight: 900;
  line-height: 1.2;
}

.pagination-link:hover,
.pagination-link:focus-visible,
.pagination-link.is-current {
  border-color: var(--green);
  color: var(--white);
  background: var(--green);
}

.pagination-link.is-disabled {
  opacity: 0.42;
  pointer-events: none;
}

.next-link,
.prev-link {
  min-width: 92px;
}

.policy-content {
  display: grid;
  gap: 34px;
  max-width: 880px;
}

.policy-content section {
  display: grid;
  gap: 12px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--line);
}

.policy-content h2 {
  margin: 0;
  color: var(--ink);
  font-size: 23px;
  line-height: 1.45;
}

.policy-content p,
.policy-content li {
  margin: 0;
  color: var(--ink-soft);
}

.policy-content ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 1.2em;
}

.section-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 14px;
}

.license-actions {
  margin-top: 28px;
}

.sp-br {
  display: none;
}

.keep-together {
  white-space: nowrap;
}

@media (max-width: 1080px) {
  .header-inner {
    grid-template-columns: 210px minmax(0, 1fr) auto;
    gap: 18px;
    min-height: 86px;
    padding: 16px 22px;
  }

  .brand {
    width: 200px;
  }

  .global-nav a {
    padding: 0 10px;
  }

  .header-phone {
    display: none;
  }

  .hero-content {
    padding-top: 130px;
  }

  .hero h1 {
    font-size: 48px;
  }

  .services-heading h2 {
    font-size: 36px;
  }

  .office-overview-section .services-heading h2 {
    font-size: 34px;
    white-space: nowrap;
  }

  .office-grid {
    gap: 24px;
  }

  .office-card {
    min-height: 720px;
    padding: 38px 28px 34px;
    border-radius: 38px;
  }

  .office-card-main {
    grid-template-columns: 1fr;
  }

  .office-card h3 span {
    font-size: 76px;
  }

  .office-card h3 small {
    font-size: 30px;
  }

  .office-service-list {
    gap: 12px;
  }

  .statement-grid,
  .first-layout,
  .recruit-grid,
  .access-grid,
  .section-heading,
  .about-content,
  .subpage-intro-grid,
  .faq-grid,
  .office-detail-grid {
    gap: 44px;
  }

  .subpage-hero h1 {
    font-size: 48px;
  }

  .route-card {
    padding: 32px;
  }

  .route-card-image {
    margin: -32px -32px 8px;
  }
}

@media (max-width: 900px) {
  body {
    font-size: 15px;
  }

  .menu-button {
    display: inline-flex;
  }

  .global-nav {
    position: fixed;
    top: 86px;
    right: 16px;
    left: 16px;
    display: none;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(250, 246, 240, 0.98);
    box-shadow: var(--shadow);
  }

  .global-nav.is-open {
    display: grid;
  }

  .global-nav a {
    min-height: 58px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--line);
  }

  .global-nav a:last-child {
    border-bottom: 0;
  }

  .global-nav a::after {
    display: none;
  }

  .hero h1 {
    font-size: 42px;
  }

  .hero-lead {
    font-size: 16px;
  }

  .news-strip-inner,
  .statement-grid,
  .first-layout,
  .section-heading,
  .flow-layout,
  .about-content,
  .recruit-grid,
  .access-grid,
  .subpage-intro-grid,
  .faq-grid,
  .office-detail-grid,
  .cta-panel,
  .story-grid,
  .message-grid,
  .profile-grid,
  .contact-grid,
  .company-grid,
  .recruit-message-layout {
    grid-template-columns: 1fr;
  }

  .news-strip-inner {
    align-items: start;
    gap: 16px;
    padding-top: 28px;
    padding-bottom: 28px;
  }

  .news-link {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 6px 0 12px;
  }

  .statement-section,
  .first-section,
  .services-section,
  .flow-section,
  .recruit-section,
  .access-section,
  .subpage-intro-section,
  .worry-section,
  .route-section,
  .office-overview-section,
  .office-access-section,
  .faq-section,
  .cta-section,
  .office-detail-section,
  .page-card-section,
  .story-section,
  .message-section,
  .recruit-message-section,
  .table-section,
  .service-detail-section,
  .news-page-section,
  .policy-section {
    padding: 82px 0;
  }

  .statement-copy h2 {
    font-size: 34px;
  }

  .section-label h2,
  .section-heading h2,
  .services-heading h2 {
    font-size: 31px;
  }

  .office-overview-section .services-heading h2 {
    font-size: 31px;
    white-space: normal;
  }

  .large-copy {
    font-size: 23px;
  }

  .office-grid,
  .numbers-grid,
  .check-grid {
    grid-template-columns: 1fr 1fr;
  }

  .route-grid {
    grid-template-columns: 1fr;
  }

  .subpage-hero {
    min-height: 560px;
  }

  .subpage-hero::after {
    background: linear-gradient(90deg, rgba(250, 246, 240, 0.96) 0%, rgba(250, 246, 240, 0.88) 58%, rgba(250, 246, 240, 0.44) 100%);
  }

  .subpage-hero-content {
    min-height: 560px;
    padding-top: 122px;
  }

  .subpage-hero h1 {
    font-size: 39px;
  }

  .subpage-hero p:not(.eyebrow) {
    font-size: 16px;
  }

  .reverse-grid .office-detail-photo {
    order: 0;
  }

  .cta-phone {
    justify-self: start;
  }

  .services-heading {
    margin-bottom: 34px;
  }

  .office-card {
    min-height: 680px;
    padding: 32px 22px 30px;
  }

  .office-card-main {
    grid-template-columns: 1fr;
    gap: 18px;
    min-height: 0;
  }

  .office-description p {
    width: 100%;
  }

  .office-service-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 30px;
  }

  .office-service-list li {
    padding: 14px 8px;
    font-size: 12px;
  }

  .flow-copy {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .flow-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .flow-list li:nth-child(2)::after {
    display: none;
  }
}

@media (max-width: 640px) {
  .sp-br {
    display: inline;
  }

  .header-inner {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 78px;
    padding: 14px 16px;
  }

  .brand {
    width: min(100%, 176px);
  }

  .global-nav {
    top: 78px;
  }

  .hero {
    min-height: 690px;
  }

  .hero-content {
    min-height: 690px;
    padding: 118px 20px 94px;
    align-items: flex-start;
    text-align: left;
  }

  .hero-content::before {
    display: none;
  }

  .hero-photo img {
    object-position: 60% center;
  }

  .hero-side-label {
    display: none;
  }

  .hero h1 {
    font-size: 34px;
  }

  .hero-word.is-clip-ready {
    opacity: 1 !important;
    clip-path: none !important;
    transform: none !important;
  }

  .hero-lead {
    width: 100%;
    max-width: min(320px, calc(100vw - 56px));
    overflow-wrap: break-word;
    word-break: normal;
  }

  .hero-actions {
    display: grid;
    width: min(100%, 280px);
    justify-items: start;
  }

  .button {
    min-height: 52px;
    padding: 13px 16px;
  }

  .hero-scroll {
    right: 50%;
    bottom: 22px;
    transform: translateX(50%);
  }

  .section-inner {
    padding-right: 20px;
    padding-left: 20px;
  }

  .statement-section,
  .first-section,
  .services-section,
  .flow-section,
  .recruit-section,
  .access-section,
  .subpage-intro-section,
  .worry-section,
  .route-section,
  .office-overview-section,
  .office-access-section,
  .faq-section,
  .cta-section,
  .office-detail-section,
  .page-card-section,
  .story-section,
  .message-section,
  .recruit-message-section,
  .table-section,
  .service-detail-section,
  .news-page-section,
  .policy-section {
    padding: 68px 0;
  }

  .statement-copy h2,
  .section-label h2,
  .section-heading h2,
  .services-heading h2 {
    font-size: 28px;
  }

  .office-overview-section .services-heading h2 {
    white-space: normal;
  }

  #about-title.about-title-words {
    font-size: 41px;
  }

  .large-copy {
    font-size: 21px;
  }

  .recruit-message-layout {
    gap: 28px;
  }

  .recruit-message-lead {
    font-size: 21px;
  }

  .services-heading p,
  .flow-copy p,
  .recruit-copy .large-copy {
    word-break: normal;
    overflow-wrap: break-word;
  }

  .services-heading p {
    font-size: 15px;
    line-height: 1.75;
  }

  .news-link span {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }

  .section-inner p,
  .section-inner h2,
  .section-inner h3,
  .section-inner li,
  .office-card span,
  .route-card p,
  .route-card h3,
  .story-card p,
  .story-card h3,
  .service-card p,
  .service-card h3,
  .hub-card p,
  .hub-card h3,
  .mini-link-card p,
  .mini-link-card h3,
  .check-grid p {
    min-width: 0;
    overflow-wrap: break-word;
    word-break: normal;
    white-space: normal;
  }

  .first-photo,
  .recruit-photo,
  .access-photo {
    aspect-ratio: 4 / 3.2;
  }

  .point-list article {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 10px 14px;
  }

  .point-list p {
    grid-column: 2;
  }

  .office-grid,
  .numbers-grid,
  .check-grid {
    grid-template-columns: 1fr;
  }

  .subpage-hero {
    min-height: 530px;
  }

  .subpage-hero::after {
    background: rgba(250, 246, 240, 0.82);
  }

  .subpage-hero-content {
    min-height: 530px;
    padding-top: 110px;
    padding-bottom: 58px;
  }

  .subpage-hero h1 {
    font-size: 32px;
  }

  .subpage-hero p:not(.eyebrow) {
    width: 100%;
    line-height: 1.85;
  }

  .check-grid article {
    display: block;
    min-height: 0;
    padding: 22px 20px;
  }

  .check-grid span {
    order: -1;
    width: 44px;
    height: 44px;
    margin: 0 0 14px;
    font-size: 16px;
  }

  .check-grid p {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 15px;
    line-height: 1.65;
  }

  .route-card {
    min-height: 0;
    padding: 26px;
  }

  .route-card-image {
    height: 190px;
    margin: -26px -26px 8px;
  }

  .route-card h3 {
    font-size: 30px;
  }

  .cta-panel {
    padding-top: 34px;
    padding-bottom: 34px;
  }

  .cta-panel h2 {
    font-size: 27px;
  }

  .cta-phone {
    width: 100%;
    min-width: 0;
  }

  .office-route-grid .route-card {
    min-height: 0;
  }

  .office-detail-photo {
    aspect-ratio: 4 / 3.2;
  }

  .office-info-list div {
    grid-template-columns: 1fr;
  }

  .office-info-list dd {
    border-top: 1px solid var(--line);
  }

  .story-image {
    aspect-ratio: 4 / 3.2;
  }

  .profile-image {
    aspect-ratio: 4 / 4.8;
  }

  .profile-panel,
  .hub-card,
  .story-card,
  .service-card,
  .news-card,
  .mini-link-card {
    padding: 24px;
  }

  .story-card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
  }

  .story-card .service-number {
    order: 1;
    width: 40px;
    height: 40px;
    margin-left: auto;
    flex: 0 0 auto;
  }

  .story-card h3 {
    order: 0;
    flex: 1 1 calc(100% - 54px);
    min-width: 0;
    margin: 0;
  }

  .story-card p {
    order: 2;
    flex: 0 0 100%;
  }

  .news-index-item {
    padding: 22px;
  }

  .news-index-item h3 {
    font-size: 20px;
  }

  .profile-name {
    font-size: 30px;
  }

  .quote-panel {
    padding: 24px;
    font-size: 20px;
  }

  .info-table,
  .info-table tbody,
  .info-table tr,
  .info-table th,
  .info-table td {
    display: block;
    width: 100%;
  }

  .info-table th {
    border-bottom: 1px solid var(--line);
  }

  .contact-panel {
    padding: 34px 22px;
  }

  .contact-panel a {
    font-size: 32px;
  }

  .office-card {
    min-height: 0;
    padding: 30px 22px 34px;
    border-radius: 30px;
  }

  .office-card h3 span {
    font-size: 72px;
  }

  .office-card h3 small {
    font-size: 28px;
  }

  .office-service-list {
    gap: 10px;
    margin-bottom: 24px;
  }

  .office-service-list li {
    padding: 11px 7px;
    font-size: 11px;
  }

  .office-service-list svg {
    width: 32px;
    height: 32px;
  }

  .office-button {
    width: min(100%, 278px);
    min-width: 0;
  }

  .office-corner-illust {
    opacity: 0.42;
  }

  .yui-corner-illust {
    width: 104px;
  }

  .kei-corner-illust {
    width: 124px;
  }

  .flow-list li {
    gap: 8px;
    min-height: 300px;
    padding-top: 132px;
  }

  .flow-list {
    grid-template-columns: 1fr;
  }

  .flow-list li:not(:last-child)::after {
    display: none;
    top: auto;
    right: 50%;
    bottom: -23px;
    transform: translateX(50%) rotate(90deg);
  }

  .about-content {
    padding-top: 76px;
    padding-bottom: 76px;
  }

  .numbers-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .numbers-grid article {
    display: flex;
    flex-direction: column;
    justify-content: center;
    aspect-ratio: 1 / 1;
    min-height: 0;
    padding: 18px;
  }

  .numbers-grid strong {
    font-size: 32px;
  }

  .numbers-grid p {
    margin-top: 14px;
    font-size: 13px;
  }

  .contact-box {
    padding: 22px;
  }

  .contact-box a {
    font-size: 28px;
  }

  .footer-inner {
    grid-template-columns: 1fr;
  }

  .footer-sitemap {
    grid-template-columns: 1fr 1fr;
  }

  .footer-copy {
    grid-column: auto;
  }}

/* Motion layer for the animation demo copy. */
:root {
  --motion-ease: cubic-bezier(0.2, 0.84, 0.28, 1);
  --motion-soft: cubic-bezier(0.18, 0.9, 0.25, 1);
  --motion-fast: 235ms;
  --motion-medium: 550ms;
  --motion-slow: 1120ms;
}

.site-header,
.header-inner,
.brand,
.brand img {
  transition: min-height var(--motion-fast) ease, padding var(--motion-fast) ease, width var(--motion-fast) ease, transform var(--motion-fast) ease, box-shadow var(--motion-fast) ease, background var(--motion-fast) ease;
}

.site-header.is-scrolled .header-inner {
  min-height: 74px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.site-header.is-scrolled .brand {
  width: 164px;
}

.site-header.is-scrolled .global-nav a {
  min-height: 48px;
}

.site-header.is-scrolled .header-phone {
  transform: translateY(-1px) scale(0.96);
}

.hero-photo img,
.subpage-hero-photo img,
.about-photo img {
  animation: hero-breath 36s ease-in-out infinite alternate;
  transform-origin: center;
  will-change: transform;
}

@keyframes hero-breath {
  from {
    transform: scale(1.02);
  }

  to {
    transform: scale(1.08);
  }
}

.hero .eyebrow,
.hero h1 .hero-word,
.hero-lead,
.hero-actions,
.subpage-hero-content > * {
  animation: hero-rise 1170ms var(--motion-soft) both;
}

.hero .eyebrow {
  animation-delay: 160ms;
}

.hero h1 .hero-word:nth-of-type(1) {
  animation-delay: 340ms;
}

.hero h1 .hero-word:nth-of-type(2) {
  animation-delay: 510ms;
}

.hero h1 .hero-word:nth-of-type(3) {
  animation-delay: 680ms;
}

.hero-lead {
  animation-delay: 885ms;
}

.hero-actions {
  animation-delay: 1070ms;
}

.subpage-hero-content > * {
  animation-delay: calc(160ms + (var(--motion-order, 0) * 170ms));
}

@keyframes hero-rise {
  from {
    opacity: 0;
    transform: translateY(24px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.motion-ready .motion-item,
.motion-ready .motion-image,
.motion-ready .thread-line {
  opacity: 0;
  transition: opacity var(--motion-slow) var(--motion-soft), transform var(--motion-slow) var(--motion-soft), clip-path 1280ms var(--motion-soft);
  transition-delay: calc(var(--motion-order, 0) * 90ms);
  will-change: opacity, transform, clip-path;
}

.motion-ready .motion-item {
  transform: translateY(24px);
}

.motion-ready .motion-item.is-visible,
.motion-ready .thread-line.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.motion-image {
  position: relative;
}

.motion-ready .motion-image {
  clip-path: inset(0 100% 0 0 round 8px);
  transform: translateY(18px);
}

.motion-ready .motion-image.is-visible {
  opacity: 1;
  clip-path: inset(0 0 0 0 round 8px);
  transform: translateY(0);
}

.motion-image img,
.route-card-image img,
.office-oval-visual img,
.flow-icon img,
.day-schedule-image img,
.story-image img,
.profile-image img,
.jobs-recruit-image img {
  transition: transform 885ms var(--motion-soft), opacity 550ms ease, filter 550ms ease;
}

.motion-ready .motion-image:not(.is-visible) img {
  transform: scale(1.06);
}

.motion-ready .motion-image.is-visible img {
  transform: scale(1);
}

.button::after,
.text-link::after,
.office-button::after,
.news-more::after {
  display: inline-block;
  transition: transform var(--motion-fast) ease;
}

.button:hover::after,
.button:focus-visible::after,
.text-link:hover::after,
.text-link:focus-visible::after,
.office-button:hover::after,
.office-button:focus-visible::after,
.news-more:hover::after,
.news-more:focus-visible::after {
  transform: translateX(4px);
}

.office-card,
.route-card,
.hub-card,
.story-card,
.service-card,
.news-card,
.mini-link-card,
.check-grid article,
.flow-list li,
.news-index-item,
.contact-box,
.cta-phone {
  transition: transform var(--motion-medium) var(--motion-ease), box-shadow var(--motion-medium) var(--motion-ease), border-color var(--motion-medium) ease, background var(--motion-medium) ease;
}

@media (hover: hover) and (pointer: fine) {
  .office-card:hover,
  .route-card:hover,
  .hub-card:hover,
  .story-card:hover,
  .service-card:hover,
  .news-card:hover,
  .mini-link-card:hover,
  .check-grid article:hover,
  .news-index-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 24px 58px rgba(42, 42, 42, 0.12);
  }

  .flow-list li:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 44px rgba(42, 42, 42, 0.1);
  }

  .office-card:hover .office-oval-visual img,
  .route-card:hover .route-card-image img,
  .flow-list li:hover .flow-icon img,
  .day-schedule-row:hover .day-schedule-image img,
  .story-grid:hover .story-image img {
    transform: scale(1.035);
  }
}

.thread-line {
  position: relative;
}

.thread-line > li {
  position: relative;
  z-index: 1;
}

.thread-line::before {
  position: absolute;
  top: 78px;
  right: 12%;
  left: 12%;
  z-index: 0;
  height: 2px;
  content: "";
  background: linear-gradient(90deg, var(--blue), var(--green), var(--purple));
  border-radius: 999px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1560ms var(--motion-soft);
  transition-delay: 235ms;
}

.thread-line.is-visible::before {
  transform: scaleX(1);
}

.cta-panel.is-visible .cta-phone,
.contact-box.is-visible {
  animation: phone-warmth 1625ms ease both;
}

@keyframes phone-warmth {
  0% {
    box-shadow: 0 0 0 0 rgba(211, 136, 76, 0.26), 0 18px 44px rgba(42, 42, 42, 0.08);
  }

  45% {
    box-shadow: 0 0 0 10px rgba(211, 136, 76, 0.1), 0 22px 50px rgba(42, 42, 42, 0.1);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(211, 136, 76, 0), 0 18px 44px rgba(42, 42, 42, 0.08);
  }
}

.count-up {
  font-variant-numeric: tabular-nums;
}

.hero h1 {
  overflow: visible;
}

.hero-word {
  display: inline-block;
}

.hero-word.is-clip-ready {
  opacity: 0;
  clip-path: inset(0 0 100% 0);
  transform: translateY(1.2rem);
  animation: none;
  will-change: opacity, clip-path, transform;
}

.flow-list.has-flow-arrows li:not(:last-child) {
  overflow: visible;
}

.flow-list.has-flow-arrows li:not(:last-child)::after {
  display: none;
  position: absolute;
  top: 50%;
  right: -18px;
  z-index: 3;
  width: 36px;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(211, 132, 70, 0.9), transparent);
  opacity: 0.72;
  transform: translateY(-50%);
  pointer-events: none;
}

.flow-arrow-dot {
  display: none;
  position: absolute;
  top: 50%;
  right: -11px;
  z-index: 4;
  width: 8px;
  height: 8px;
  border-top: 2px solid rgba(211, 132, 70, 0.95);
  border-right: 2px solid rgba(211, 132, 70, 0.95);
  opacity: 0.82;
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
}

.button,
.office-button,
.cta-phone,
.header-phone {
  will-change: transform;
}

.button > *,
.office-button > *,
.cta-phone > *,
.header-phone > * {
  pointer-events: none;
}

.ambient-section {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.ambient-section > .section-inner {
  position: relative;
  z-index: 1;
}

.ambient-wash {
  position: absolute;
  inset: 0 -10%;
  z-index: 0;
  overflow: visible;
  pointer-events: none;
  will-change: transform;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
}

.hero .ambient-wash {
  z-index: 2;
  opacity: 0.34;
  mix-blend-mode: screen;
}

.hero.ambient-section .hero-photo {
  position: absolute;
  z-index: 0;
}

.hero.ambient-section .hero-content {
  position: relative;
  z-index: 3;
}

.hero.ambient-section .hero-side-label,
.hero.ambient-section .hero-scroll {
  z-index: 4;
}

.ambient-wash-shape {
  position: absolute;
  display: block;
  width: clamp(92px, 11vw, 190px);
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  filter: blur(18px);
  opacity: 0.32;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}

.ambient-wash-shape.is-green {
  background: rgba(131, 183, 101, 0.62);
}

.ambient-wash-shape.is-coral {
  background: rgba(224, 139, 119, 0.5);
}

.ambient-wash-shape.is-orange {
  background: rgba(211, 132, 70, 0.52);
}

.ambient-wash-shape.is-blue {
  background: rgba(85, 134, 169, 0.48);
}

.ambient-wash-shape.is-purple {
  background: rgba(192, 105, 149, 0.46);
}

.ambient-wash-shape.is-leaf {
  background: rgba(164, 207, 113, 0.5);
}

.ambient-wash-shape.is-sun {
  background: rgba(215, 167, 114, 0.48);
}

.ambient-wash-shape:nth-child(1) {
  top: 10%;
  left: 8%;
}

.ambient-wash-shape:nth-child(2) {
  top: 17%;
  right: 12%;
  width: clamp(74px, 8vw, 142px);
}

.ambient-wash-shape:nth-child(3) {
  top: 42%;
  left: -2%;
  width: clamp(116px, 14vw, 230px);
  opacity: 0.24;
}

.ambient-wash-shape:nth-child(4) {
  top: 54%;
  right: 5%;
  width: clamp(98px, 12vw, 210px);
}

.ambient-wash-shape:nth-child(5) {
  bottom: 8%;
  left: 22%;
  width: clamp(70px, 7vw, 130px);
  opacity: 0.28;
}

.ambient-wash-shape:nth-child(6) {
  right: 26%;
  bottom: 12%;
  width: clamp(110px, 13vw, 220px);
}

.ambient-wash-shape:nth-child(7) {
  top: 34%;
  left: 44%;
  width: clamp(62px, 6vw, 118px);
  opacity: 0.24;
}

.ambient-wash--promise .ambient-wash-shape:nth-child(1) {
  top: 6%;
  left: 12%;
}

.ambient-wash--promise .ambient-wash-shape:nth-child(2) {
  top: 20%;
  right: 18%;
}

.ambient-wash--promise .ambient-wash-shape:nth-child(3) {
  top: 48%;
  left: 8%;
}

.ambient-wash--promise .ambient-wash-shape:nth-child(4) {
  right: 8%;
  bottom: 14%;
}

.ambient-wash--promise .ambient-wash-shape:nth-child(5) {
  bottom: 8%;
  left: 34%;
}

.ambient-wash--flow .ambient-wash-shape:nth-child(1) {
  top: 12%;
  right: 8%;
  left: auto;
}

.ambient-wash--flow .ambient-wash-shape:nth-child(3) {
  top: 38%;
  left: 3%;
}

.ambient-wash--cta .ambient-wash-shape:nth-child(1) {
  top: 8%;
  right: 10%;
  left: auto;
}

.ambient-wash--cta .ambient-wash-shape:nth-child(2) {
  top: 28%;
  left: 8%;
  right: auto;
}

.statement-section.ambient-promise .statement-copy h2,
.story-section.ambient-promise .section-label h2 {
  position: relative;
  display: inline-block;
}

.statement-section.ambient-promise .ambient-wash,
.story-section.ambient-promise .ambient-wash {
  opacity: 0.9;
}

.statement-section.ambient-promise .ambient-wash-shape,
.story-section.ambient-promise .ambient-wash-shape {
  filter: blur(14px);
  opacity: 0.42;
}

.day-schedule-row {
  position: relative;
}

.day-schedule-row::before {
  position: absolute;
  top: 32px;
  bottom: -34px;
  left: 18px;
  width: 2px;
  content: "";
  background: linear-gradient(180deg, rgba(85, 134, 169, 0.38), rgba(131, 183, 101, 0.12));
  border-radius: 999px;
  opacity: 0;
  transform: scaleY(0);
  transform-origin: top;
  transition: opacity var(--motion-medium) ease, transform 1015ms var(--motion-soft);
}

.day-schedule-row.is-visible::before {
  opacity: 1;
  transform: scaleY(1);
}

.faq-list summary::after {
  transition: transform var(--motion-fast) ease, color var(--motion-fast) ease;
}

.faq-list details[open] summary::after {
  color: var(--green);
  content: "-";
  transform: translateY(-50%) rotate(180deg);
}

.faq-list details[open] p {
  animation: faq-open 340ms var(--motion-ease) both;
}

@keyframes faq-open {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 900px) {
  .site-header.is-scrolled .header-inner {
    min-height: 76px;
  }

  .site-header.is-scrolled .brand {
    width: min(100%, 178px);
  }

  .thread-line::before {
    display: none;
  }

  .flow-list.has-flow-arrows li:not(:last-child)::after,
  .flow-arrow-dot {
    display: none;
  }

  .ambient-wash {
    inset: 0 -18%;
  }

  .ambient-wash-shape {
    opacity: 0.16;
    filter: blur(44px);
  }
}

@media (max-width: 640px) {
  .hero-photo img,
  .subpage-hero-photo img,
  .about-photo img {
    animation-duration: 47s;
  }

  .site-header.is-scrolled .header-inner {
    min-height: 70px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .site-header.is-scrolled .brand {
    width: min(100%, 156px);
  }

  .motion-ready .motion-item {
    transform: translateY(16px);
  }

  .ambient-wash-shape {
    width: 148px;
    height: auto;
    opacity: 0.12;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }

  .motion-ready .motion-item,
  .motion-ready .motion-image,
  .motion-ready .thread-line {
    opacity: 1;
    clip-path: none;
    transform: none;
  }

  .hero-word.is-clip-ready {
    opacity: 1;
    clip-path: none;
    transform: none;
  }

  .thread-line::before {
    transform: none;
  }

  .ambient-wash-shape {
    transform: none !important;
  }
}