@charset "UTF-8";

/* ==========================================================================
   Base
   ========================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: #fff;
  color: #333;
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* トップページは単語の途中で改行しない */
.page-top {
  word-break: keep-all;
  overflow-wrap: break-word;
}

.page-sub {
  word-break: normal;
  line-break: strict;
  overflow-wrap: anywhere;
}

@supports (word-break: auto-phrase) {
  .page-sub {
    word-break: auto-phrase;
  }
}

a {
  color: #20ad92;
  text-decoration: none;
}

a:hover {
  color: #00cc55;
}

p {
  margin: 0;
}

h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: 500;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

dl,
dt,
dd {
  margin: 0;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

@keyframes glowA {
  0%   { transform: translate3d(-8%, -6%, 0) scale(.92); opacity: .5; }
  35%  { transform: translate3d(14%, 8%, 0) scale(1.22); opacity: 1; }
  68%  { transform: translate3d(4%, 16%, 0) scale(1.05); opacity: .62; }
  100% { transform: translate3d(-8%, -6%, 0) scale(.92); opacity: .5; }
}

@keyframes glowB {
  0%   { transform: translate3d(0, 0, 0) scale(1); opacity: .45; }
  40%  { transform: translate3d(-18%, 22%, 0) scale(1.5); opacity: 1; }
  70%  { transform: translate3d(10%, -14%, 0) scale(1.1); opacity: .6; }
  100% { transform: translate3d(0, 0, 0) scale(1); opacity: .45; }
}

@keyframes pulse {
  0%,
  100% {
    box-shadow: 0 18px 44px -16px rgba(0, 204, 85, .62), 0 0 0 1px rgba(0, 204, 85, .35), 0 0 34px rgba(0, 204, 85, .3), inset 0 1px 0 rgba(255, 255, 255, .38);
  }
  50% {
    box-shadow: 0 22px 56px -14px rgba(0, 204, 85, .78), 0 0 0 1px rgba(0, 204, 85, .5), 0 0 62px rgba(0, 204, 85, .46), inset 0 1px 0 rgba(255, 255, 255, .38);
  }
}


/* ==========================================================================
   Layout
   ========================================================================== */

.l-wrapper {
  width: 100%;
  overflow-x: clip;
}

/* Header
   ----------------------------------------------------------------- */
/* ページ上部（メインビジュアルの上）では背景なしで置き、
   スクロールしてメニューが見えなくなったら、上から追従バーが降りてくる */
.l-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.l-header.is-fixed {
  position: fixed;
  background: rgba(13, 25, 27, .9);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  backdrop-filter: blur(18px) saturate(1.2);
  border-bottom-color: rgba(255, 255, 255, .16);
  box-shadow: 0 14px 34px -26px rgba(0, 0, 0, .7);
  transform: translateY(-100%);
  transition: transform .55s cubic-bezier(.22, .8, .25, 1);
}

.l-header.is-fixed.is-show {
  transform: none;
}

.l-header.is-fixed .l-header__inner {
  padding-top: 12px;
  padding-bottom: 12px;
}

.l-header.is-fixed .l-header__logo img {
  height: 26px;
}

.l-header__inner {
  transition: padding .3s ease;
}

/* メニューを開いている間は常に表示 */
.is-menu-open .l-header {
  position: fixed;
  transform: none;
}

.l-header__inner {
  display: flex;
  align-items: center;
  gap: 28px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 28px;
}

.l-header__logo {
  display: block;
  flex-shrink: 0;
  line-height: 0;
}

.l-header__logo img {
  display: block;
  width: auto;
  height: 30px;
}

.l-header__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 26px;
  margin-left: auto;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .5);
}

.l-header__nav a,
.l-header__nav a:hover {
  position: relative;
  padding: 6px 0;
  color: #fff;
}

.l-header__nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: #20ad92;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .45s cubic-bezier(.165, .84, .44, 1);
}

.l-header__nav a:hover::after,
.l-header__nav a.is-current::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.l-header__nav a.is-current,
.l-header__nav a.is-current:hover {
  color: #00cc55;
}

/* ハンバーガーボタン（SPのみ表示） */
.l-header__toggle {
  display: none;
  flex-direction: column;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  background: rgba(255, 255, 255, .04);
  cursor: pointer;
}

.l-header__toggle span {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: #fff;
  transition: transform .25s ease, opacity .2s ease;
}

.l-header__toggle.is-open span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.l-header__toggle.is-open span:nth-child(2) {
  opacity: 0;
}

.l-header__toggle.is-open span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Menu（SP）
   ----------------------------------------------------------------- */
.l-menu {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 49;
  display: none;
  flex-direction: column;
  padding: 96px 24px 48px;
  background: rgba(13, 25, 27, .97);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.l-menu__nav {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.l-menu__nav a,
.l-menu__nav a:hover {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 4px;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #fff;
}

.l-menu__nav a::after {
  content: "→";
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  color: #20ad92;
}

.l-menu__nav a.is-current,
.l-menu__nav a.is-current:hover {
  color: #00cc55;
}

.l-menu .c-btn-line {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 560px;
  margin: 36px auto 0;
  font-size: 16px;
}

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

/* Footer
   ----------------------------------------------------------------- */
.l-footer {
  padding: clamp(56px, 7vw, 88px) 28px;
  background: #44433f;
  color: #fff;
}

.l-footer__inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 36px;
  max-width: 1200px;
  margin: 0 auto;
}

.l-footer__logo {
  display: block;
  width: auto;
  height: 34px;
}

.l-footer__office {
  font-size: 13px;
  line-height: 1.9;
  color: rgba(255, 255, 255, .8);
}

.l-footer__logo + .l-footer__office {
  margin-top: 12px;
}

.l-footer__nav {
  display: none;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-top: 22px;
  font-size: 13px;
  line-height: 1.8;
}

.l-footer__nav a,
.l-footer__nav a:hover {
  color: rgba(255, 255, 255, .86);
}

.l-footer__address {
  font-size: 13px;
  line-height: 2.1;
  color: rgba(255, 255, 255, .8);
}

.l-footer__place + .l-footer__place {
  margin-top: 18px;
}

.l-footer__place-name {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  color: #20ad92;
}

/* Section / Container
   ----------------------------------------------------------------- */
.l-section {
  position: relative;
  padding: clamp(80px, 11vw, 170px) 28px;
  overflow: hidden;
  scroll-margin-top: 84px;
}

.l-section--sub {
  padding-top: clamp(76px, 10vw, 150px);
  padding-bottom: clamp(76px, 10vw, 150px);
}

.l-container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}

.l-container--narrow {
  max-width: 1080px;
}


/* ==========================================================================
   Components
   ========================================================================== */

/* Buttons
   ----------------------------------------------------------------- */
.c-btn-line,
.c-btn-line:hover {
  color: #fff;
}

/* ボタンのホバー：色が左から流れ込み、文字色が反転、矢印が右へ動く */
.c-btn-line {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 17px 30px 17px 34px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: linear-gradient(160deg, #20e874, #00a845);
  font-size: clamp(15px, 1.8vw, 17px);
  font-weight: 700;
  letter-spacing: .04em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -3px 6px rgba(0, 60, 25, .25), 0 2px 4px rgba(0, 60, 25, .3), 0 14px 30px -18px rgba(0, 204, 85, .55);
  transition: color .45s cubic-bezier(.165, .84, .44, 1), border-color .45s, box-shadow .45s;
}

.c-btn-line::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #fff;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .5s cubic-bezier(.165, .84, .44, 1);
}

.c-btn-line::after {
  content: "→";
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  transition: transform .5s cubic-bezier(.165, .84, .44, 1);
}

.c-btn-line:hover {
  color: #00a845;
  border-color: #00a845;
  box-shadow: 0 2px 4px rgba(0, 60, 25, .18), 0 18px 34px -20px rgba(0, 204, 85, .6);
}

.c-btn-line:hover::before {
  transform: scaleX(1);
  transform-origin: left center;
}

.c-btn-line:hover::after {
  transform: translateX(6px);
}

.c-btn-line--sm {
  gap: 8px;
  padding: 12px 20px 12px 24px;
  font-size: 15px;
  white-space: nowrap;
}

.c-btn-outline {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 14px 26px 14px 30px;
  border: 1px solid rgba(13, 25, 27, .45);
  border-radius: 999px;
  font-size: 13px;
  letter-spacing: .06em;
  color: #0d191b;
  transition: color .45s cubic-bezier(.165, .84, .44, 1), border-color .45s;
}

.c-btn-outline::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #20ad92;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .5s cubic-bezier(.165, .84, .44, 1);
}

.c-btn-outline span {
  display: inline-block;
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  transition: transform .5s cubic-bezier(.165, .84, .44, 1);
}

.c-btn-outline:hover {
  border-color: #20ad92;
  color: #fff;
}

.c-btn-outline:hover::before {
  transform: scaleX(1);
  transform-origin: left center;
}

.c-btn-outline:hover span {
  transform: translateX(6px);
}

@media (prefers-reduced-motion: reduce) {
  .c-btn-line,
  .c-btn-line::before,
  .c-btn-line::after,
  .c-btn-outline,
  .c-btn-outline::before,
  .c-btn-outline span {
    transition: none;
  }
}

/* Heading
   ----------------------------------------------------------------- */
.c-en {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .3em;
  color: #20ad92;
}

.c-heading {
  position: relative;
  margin-bottom: clamp(40px, 5vw, 72px);
}

.c-heading__en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(64px, 11.5vw, 150px);
  line-height: .82;
  letter-spacing: -.01em;
  color: #f1eee6;
}

.c-heading__title {
  margin-top: clamp(-22px, -2vw, -10px);
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(23px, 3.6vw, 42px);
  line-height: 1.5;
  color: #0d191b;
  text-wrap: pretty;
}

.c-heading__lead {
  max-width: 32em;
  margin-top: 26px;
  font-size: 14px;
  line-height: 2.15;
  color: #555;
  text-wrap: pretty;
}

.c-heading__more {
  margin-top: clamp(28px, 3.5vw, 40px);
}

/* 英字見出し＋ラベル＋見出し（下層ページ用） */
.c-title-en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.01em;
  color: #f1eee6;
}

.c-title-label {
  margin-top: clamp(18px, 2.4vw, 28px);
}

.c-title {
  margin-top: 14px;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(24px, 3.6vw, 42px);
  line-height: 1.5;
  color: #0d191b;
}

.c-title-lead {
  max-width: 34em;
  margin-top: 24px;
  font-size: 14px;
  line-height: 2.15;
  color: #555;
  text-wrap: pretty;
}

/* Photo
   ----------------------------------------------------------------- */
.c-photo {
  position: relative;
  width: 100%;
  box-shadow: 0 2px 4px rgba(13, 25, 27, .12), 0 20px 32px -20px rgba(13, 25, 27, .4), 0 50px 90px -50px rgba(13, 25, 27, .55);
}

.c-cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 濃色帯の右側に重ねる写真 */
.c-side-photo {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(50%, 880px);
  -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .55) 14%, #000 34%, #000 100%);
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .55) 14%, #000 34%, #000 100%);
}

/* Decoration
   ----------------------------------------------------------------- */
.c-deco {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.c-deco--ring {
  border: 1px solid rgba(255, 255, 255, .08);
}

.c-deco--dot {
  width: 10px;
  height: 10px;
  background: #00cc55;
  box-shadow: 0 0 28px 8px rgba(0, 204, 85, .55);
  animation: glowB 8s ease-in-out infinite;
  will-change: transform;
}

.c-deco--hero {
  width: 60vw;
  height: 60vw;
  max-width: 820px;
  max-height: 820px;
  background: radial-gradient(circle at 50% 50%, rgba(32, 173, 146, .3), transparent 66%);
  animation: glowA 11s ease-in-out infinite;
  will-change: transform;
}

/* Contact
   ----------------------------------------------------------------- */
.c-contact {
  position: relative;
  padding: clamp(80px, 11vw, 160px) 28px;
  background: linear-gradient(135deg, #eeeed8 0%, #d1ede5 100%);
  overflow: hidden;
  scroll-margin-top: 84px;
}

.c-contact__ring {
  top: -18%;
  left: -6%;
  width: 34vw;
  height: 34vw;
  max-width: 440px;
  max-height: 440px;
  border: 1px solid rgba(13, 25, 27, .08);
}

.c-contact__glow {
  bottom: -20%;
  right: -10%;
  width: 40vw;
  height: 40vw;
  max-width: 520px;
  max-height: 520px;
  background: radial-gradient(circle, rgba(0, 204, 85, .16), transparent 70%);
}

.c-contact__inner {
  position: relative;
  max-width: 920px;
  margin: 0 auto;
  text-align: center;
}

.c-contact__title {
  margin-top: clamp(22px, 3vw, 34px);
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: min(clamp(25px, 4.2vw, 46px), calc((100vw - 40px) / 12.4));
  line-height: 1.45;
  color: #0d191b;
  text-wrap: pretty;
}

.c-contact__title span {
  display: inline-block;
}

.c-contact__text {
  max-width: 34em;
  margin: 26px auto 0;
  font-size: 14px;
  line-height: 2.15;
  color: #333;
  text-wrap: pretty;
}

.c-contact__btn {
  margin-top: clamp(34px, 4.5vw, 52px);
}

/* Tags
   ----------------------------------------------------------------- */
.c-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.c-tags li {
  padding: 7px 13px;
  border: 1px solid rgba(13, 25, 27, .12);
  font-size: 12px;
  color: #333;
}


/* ==========================================================================
   Top page
   ========================================================================== */

/* About
   ----------------------------------------------------------------- */
.p-about {
  padding-bottom: 0;
}

.p-about__glow {
  top: 6%;
  left: -10%;
  width: 34vw;
  height: 34vw;
  max-width: 460px;
  max-height: 460px;
  background: radial-gradient(circle, rgba(32, 173, 146, .1), transparent 70%);
}

.p-about__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(32px, 5vw, 72px);
  align-items: stretch;
}

.p-about__text {
  max-width: 27em;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(15px, 1.8vw, 18px);
  line-height: 2.05;
  color: #0d191b;
  text-wrap: pretty;
}

.p-about__text--strong {
  max-width: 30em;
  margin-top: 24px;
  font-size: clamp(16px, 2vw, 20px);
  font-weight: 700;
}

.p-about__more {
  margin-top: clamp(28px, 3.5vw, 40px);
}

.p-about__img {
  aspect-ratio: 4 / 5;
  min-height: 320px;
}

/* Mission
   ----------------------------------------------------------------- */
.p-mission {
  position: relative;
  width: 100vw;
  margin-top: clamp(48px, 7vw, 104px);
  margin-left: calc(50% - 50vw);
  padding: clamp(56px, 7.5vw, 100px) 0;
  background: #0d191b;
  color: #fff;
  overflow: hidden;
}

.p-mission__glow {
  top: -30%;
  right: -4%;
  width: 40vw;
  height: 40vw;
  max-width: 520px;
  max-height: 520px;
  background: radial-gradient(circle at 40% 40%, rgba(0, 204, 85, .26), transparent 68%);
}

.p-mission__img {
  width: min(50%, 860px);
}

.p-mission__inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 28px;
}

.p-mission__title {
  margin-top: 18px;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(24px, 4.4vw, 52px);
  line-height: 1.42;
  color: #fff;
  text-shadow: 0 16px 44px rgba(0, 0, 0, .4);
}

.p-mission__text {
  max-width: 34em;
  margin-top: 24px;
  font-size: 14px;
  line-height: 2.15;
  color: rgba(255, 255, 255, .72);
  text-wrap: pretty;
}

/* Worry
   ----------------------------------------------------------------- */
.p-worry {
  position: relative;
  padding: clamp(72px, 10vw, 150px) 28px;
  background: #f1eee7;
  overflow: hidden;
}

.p-worry__glow {
  top: -10%;
  right: -8%;
  width: 36vw;
  height: 36vw;
  max-width: 480px;
  max-height: 480px;
  background: radial-gradient(circle, rgba(32, 173, 146, .16), transparent 70%);
}

.p-worry__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}

.p-worry__img {
  aspect-ratio: 4 / 5;
}

.p-worry__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.p-worry__voices {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(8px, 1.1vw, 13px);
}

.p-worry__voices li,
.p-worry__question,
.p-worry__answer {
  max-width: 100%;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 500;
  line-height: 1.6;
  color: #0d191b;
  text-wrap: pretty;
}

.p-worry__voices li {
  font-size: clamp(17px, 2.2vw, 24px);
}

.p-worry__question {
  margin-top: clamp(36px, 4.5vw, 56px);
  font-size: clamp(17px, 2.3vw, 26px);
}

.p-worry__answer {
  margin-top: 16px;
  font-size: clamp(21px, 2.9vw, 33px);
}

/* Service
   ----------------------------------------------------------------- */
.p-service {
  background: #f5f5f5;
}

.p-service .c-heading__en {
  color: #e9e6df;
}

.p-service__group {
  display: flex;
  align-items: baseline;
  gap: clamp(14px, 2.5vw, 28px);
  padding-bottom: clamp(18px, 2.5vw, 26px);
  border-bottom: 2px solid #0d191b;
}

.p-service__group + .p-service__cards + .p-service__group {
  margin-top: clamp(56px, 7vw, 110px);
}

.p-service__group-title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(20px, 3.2vw, 38px);
  line-height: 1.4;
  color: #0d191b;
  text-wrap: pretty;
}

.p-service__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: clamp(18px, 2.4vw, 28px);
  margin-top: clamp(26px, 3.5vw, 44px);
}

.p-service__card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #fff 0%, #fbfaf7 100%);
  border: 1px solid rgba(13, 25, 27, .07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(13, 25, 27, .05), 0 38px 70px -46px rgba(13, 25, 27, .6);
  overflow: hidden;
}

.p-service__card-img {
  position: relative;
  flex: none;
  height: clamp(170px, 15vw, 210px);
}

.p-service__card-body {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 16px;
  padding: clamp(30px, 3.6vw, 48px);
  container-type: inline-size;
}

.p-service__card-num {
  position: absolute;
  top: 14px;
  right: 22px;
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 84px;
  line-height: 1;
  color: #f4f2ec;
}

.p-service__card-en {
  position: relative;
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 11px;
  letter-spacing: .26em;
  color: #20ad92;
}

.p-service__card-title {
  position: relative;
  font-size: clamp(15px, 6.2cqw, 22px);
  font-weight: 700;
  line-height: 1.5;
  color: #0d191b;
  white-space: nowrap;
}

.p-service__card-text {
  font-size: 14px;
  line-height: 2.1;
  color: #555;
  text-wrap: pretty;
}

.p-service__card-note {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid #f0ede7;
  font-size: 12px;
  letter-spacing: .06em;
  color: #20ad92;
}

/* Case
   ----------------------------------------------------------------- */
.p-case__head {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: end;
  margin-bottom: clamp(40px, 5vw, 72px);
}

.p-case__head .c-heading {
  margin-bottom: 0;
}

.p-case__img {
  aspect-ratio: 16 / 9;
}

.p-case__list {
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 4vw, 56px);
}

.p-case__item {
  position: relative;
  padding: clamp(28px, 3.6vw, 48px);
  background: linear-gradient(180deg, #fff 0%, #faf9f7 100%);
  border: 1px solid rgba(13, 25, 27, .06);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 2px 4px rgba(13, 25, 27, .05), 0 18px 32px -22px rgba(13, 25, 27, .4), 0 44px 80px -50px rgba(13, 25, 27, .6);
}

.p-case__item-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: clamp(14px, 2.5vw, 26px);
}

.p-case__check {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(34px, 5vw, 64px);
  line-height: .9;
  color: #20ad92;
}

.p-case__item-title {
  flex: 1;
  min-width: 240px;
  font-size: clamp(17px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.5;
  color: #0d191b;
  text-wrap: pretty;
}

.p-case__flow {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: clamp(6px, .8vw, 10px);
  align-items: stretch;
  margin-top: clamp(24px, 3vw, 36px);
}

.p-case__box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 36px 32px;
  background: #fff;
  border: 1px solid rgba(13, 25, 27, .08);
  box-shadow: 0 1px 2px rgba(13, 25, 27, .05);
}

.p-case__label {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 11px;
  letter-spacing: .24em;
  color: #20ad92;
}

.p-case__box-text {
  margin-top: 16px;
  font-size: 15px;
  line-height: 1.9;
  color: #333;
  text-wrap: pretty;
}

.p-case__box-text--after {
  color: #0d191b;
}

.p-case__arrow {
  align-self: center;
  font-size: 22px;
  text-align: center;
  color: #20ad92;
}

/* Reason
   ----------------------------------------------------------------- */
.p-reason {
  background: #f1eee7;
  overflow: clip;
}

.p-reason .c-heading__en {
  color: #e5e0d5;
}

.p-reason__glow {
  bottom: -16%;
  right: -8%;
  width: 40vw;
  height: 40vw;
  max-width: 520px;
  max-height: 520px;
  background: radial-gradient(circle, rgba(32, 173, 146, .14), transparent 70%);
}

.p-reason__grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}

.p-reason__img {
  position: sticky;
  top: 110px;
  aspect-ratio: 1 / 1;
}

.p-reason__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0 clamp(24px, 4vw, 56px);
  align-items: start;
  padding: clamp(28px, 3.5vw, 44px) 0;
  border-top: 1px solid rgba(13, 25, 27, .14);
}

.p-reason__item:last-child {
  border-bottom: 1px solid rgba(13, 25, 27, .14);
}

.p-reason__num {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(56px, 7vw, 96px);
  font-weight: 700;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.5px #20ad92;
}

.p-reason__body {
  padding-top: clamp(6px, 1vw, 14px);
}

.p-reason__title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(19px, 2.4vw, 26px);
  line-height: 1.6;
  color: #0d191b;
  text-wrap: pretty;
}

.p-reason__text {
  max-width: 44em;
  margin-top: 12px;
  font-size: 14px;
  line-height: 2.1;
  color: #555;
  text-wrap: pretty;
}

/* Flow
   ----------------------------------------------------------------- */
.p-flow__list {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(12px, 2vw, 20px) 0;
  padding-top: 8px;
}

.p-flow__list::before {
  content: "";
  position: absolute;
  top: 40px;
  left: calc(10% + 4px);
  right: calc(10% + 4px);
  z-index: 0;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(13, 25, 27, .22) 0 6px, transparent 6px 12px);
}

.p-flow__step {
  position: relative;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  min-width: 0;
  text-align: center;
}

.p-flow__num {
  position: relative;
  z-index: 1;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border: 2px solid #20ad92;
  border-radius: 50%;
  background: #fff;
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #20ad92;
}

.p-flow__text {
  min-width: 0;
  max-width: 12em;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14px, 1.5vw, 16px);
  font-weight: 500;
  line-height: 1.7;
  color: #0d191b;
  text-wrap: pretty;
}

/* Contact（トップ）
   ----------------------------------------------------------------- */
.p-top-contact {
  padding-top: clamp(80px, 11vw, 170px);
  padding-bottom: clamp(80px, 11vw, 170px);
}

.p-top-contact .c-contact__title {
  font-size: min(clamp(25px, 4.2vw, 46px), calc((100vw - 40px) / 17.5));
}

.p-top-contact__guide {
  margin-top: clamp(34px, 4.5vw, 52px);
}

.p-top-contact__guide-lead {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: .04em;
  color: #0d191b;
}

.p-top-contact__guide-list {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin: 18px auto 0;
  font-size: 14px;
  line-height: 1.9;
  color: #333;
}

.p-top-contact__guide-list li {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.p-top-contact__guide-list li::before {
  content: "・";
  color: #20ad92;
}

.p-top-contact .c-contact__btn {
  margin-top: clamp(36px, 4.5vw, 56px);
}


/* ==========================================================================
   Sub pages（サービス / 当所について）
   ========================================================================== */

/* Hero
   ----------------------------------------------------------------- */
.p-subhero {
  position: relative;
  padding: calc(clamp(56px, 8vw, 110px) + 76px) 28px clamp(64px, 9vw, 110px);
  background: #0d191b;
  color: #fff;
  overflow: hidden;
}

.p-subhero__glow {
  top: -34%;
  left: -10%;
}

.p-subhero__ring {
  bottom: -40%;
  right: 6%;
  width: 38vw;
  height: 38vw;
  max-width: 480px;
  max-height: 480px;
}

.p-subhero__dot {
  top: 26%;
  right: 22%;
}

.p-subhero__inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}

/* トップのメインコピーと同じ書体・サイズ感に揃える */
.p-subhero__title {
  margin-top: clamp(22px, 3vw, 34px);
  font-size: clamp(26px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.49;
  letter-spacing: .01em;
  color: #fff;
  text-shadow: 0 18px 50px rgba(0, 0, 0, .45);
}

.p-subhero__title--fit {
  font-size: min(clamp(26px, 4vw, 48px), calc((100vw - 40px) / 11.2));
}

.p-subhero__lead {
  max-width: 32em;
  margin-top: clamp(26px, 3.4vw, 40px);
  font-size: 15px;
  line-height: 2.2;
  color: rgba(255, 255, 255, .74);
  text-wrap: pretty;
}

.p-subhero__links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: clamp(32px, 4vw, 48px);
}

.p-subhero__links a {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  padding: 12px 20px;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 999px;
  font-size: 13px;
  color: #fff;
  transition: border-color .2s, color .2s;
}

.p-subhero__links a:hover {
  border-color: #00cc55;
  color: #00cc55;
}

.p-subhero__links span {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  color: #20ad92;
}

/* Service sections
   ----------------------------------------------------------------- */
.p-svc--01 {
  background: linear-gradient(180deg, #fff 0%, #f5f5f5 100%);
}

.p-svc--02 {
  background: linear-gradient(180deg, #fff 0%, #eef3f1 100%);
}

.p-svc--03 {
  background: linear-gradient(180deg, #fff 0%, #f1eee7 100%);
}

.p-svc__glow--02 {
  top: 6%;
  right: -10%;
  width: 34vw;
  height: 34vw;
  max-width: 460px;
  max-height: 460px;
  background: radial-gradient(circle, rgba(32, 173, 146, .1), transparent 70%);
}

.p-svc__glow--03 {
  bottom: -16%;
  left: -8%;
  width: 40vw;
  height: 40vw;
  max-width: 520px;
  max-height: 520px;
  background: radial-gradient(circle, rgba(32, 173, 146, .14), transparent 70%);
}

.p-svc__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(20px, 3vw, 44px);
  align-items: baseline;
  padding-bottom: clamp(18px, 2.5vw, 26px);
  border-bottom: 2px solid #0d191b;
}

.p-svc__num {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(30px, 4.4vw, 52px);
  line-height: 1;
  color: #20ad92;
}

.p-svc__title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(22px, 3.4vw, 40px);
  line-height: 1.4;
  color: #0d191b;
  text-wrap: pretty;
}

.p-svc__intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 4.5vw, 72px);
  align-items: center;
  margin-top: clamp(28px, 3.4vw, 44px);
}

.p-svc__intro-body {
  max-width: 36em;
}

.p-svc__catch {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(18px, 2.2vw, 25px);
  line-height: 1.6;
  color: #0d191b;
  text-wrap: pretty;
}

.p-svc__catch span {
  display: inline-block;
}

.p-svc__lead {
  margin-top: 20px;
  font-size: 14px;
  line-height: 2.15;
  color: #555;
  text-wrap: pretty;
}

.p-svc__img {
  aspect-ratio: 16 / 10;
}

.p-svc__cards {
  display: flex;
  flex-direction: column;
  gap: clamp(18px, 2.4vw, 28px);
  margin-top: clamp(34px, 4.4vw, 60px);
}

.p-svc__card {
  position: relative;
  display: grid;
  grid-template-columns: clamp(64px, 8vw, 96px) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 40px);
  padding: clamp(30px, 3.6vw, 46px);
  background: linear-gradient(180deg, #fff 0%, #fbfaf7 100%);
  border: 1px solid rgba(13, 25, 27, .1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(13, 25, 27, .05), 0 38px 70px -46px rgba(13, 25, 27, .6);
}

.p-svc__card-num {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(28px, 3.2vw, 40px);
  font-weight: 700;
  line-height: 1;
  color: #20ad92;
}

.p-svc__card-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.p-svc__card-en {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 11px;
  letter-spacing: .26em;
  color: #20ad92;
}

.p-svc__card-title {
  font-size: clamp(17px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.5;
  color: #0d191b;
  text-wrap: pretty;
}

.p-svc__card-catch {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: 15px;
  line-height: 1.9;
  color: #0d191b;
}

.p-svc__card-catch span {
  display: inline-block;
}

.p-svc__card-text {
  max-width: 44em;
  font-size: 14px;
  line-height: 2.1;
  color: #555;
  text-wrap: pretty;
}

.p-svc__card-items {
  margin-top: 8px;
  padding-top: 18px;
  border-top: 1px solid rgba(13, 25, 27, .1);
}

.p-svc__card-items-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  color: #20ad92;
}

.p-svc__card-note {
  margin-top: 16px;
  font-size: 12px;
  line-height: 1.9;
  color: #888;
}

.p-svc__btn {
  margin-top: clamp(32px, 4vw, 52px);
  text-align: center;
}

/* Plan
   ----------------------------------------------------------------- */
.p-plan {
  position: relative;
  padding: clamp(76px, 10vw, 140px) 0;
  background: #0d191b;
  color: #fff;
  overflow: hidden;
  scroll-margin-top: 84px;
}

.p-plan__glow {
  top: -24%;
  right: -4%;
  width: 40vw;
  height: 40vw;
  max-width: 520px;
  max-height: 520px;
  background: radial-gradient(circle at 40% 40%, rgba(0, 204, 85, .24), transparent 68%);
}

.p-plan__inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 28px;
}

.p-plan__title {
  margin-top: 18px;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(25px, 4.2vw, 48px);
  line-height: 1.45;
  color: #fff;
  text-shadow: 0 16px 44px rgba(0, 0, 0, .4);
}

.p-plan__lead {
  max-width: 34em;
  margin-top: 24px;
  font-size: 14px;
  line-height: 2.15;
  color: rgba(255, 255, 255, .72);
  text-wrap: pretty;
}

.p-plan__block {
  margin-top: clamp(40px, 5vw, 66px);
}

.p-plan__block--spot {
  margin-top: clamp(40px, 5vw, 64px);
}

.p-plan__label {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 11px;
  letter-spacing: .24em;
  color: #20ad92;
}

.p-plan__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: clamp(14px, 2vw, 22px);
  margin-top: 20px;
}

.p-plan__card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: clamp(26px, 3vw, 38px);
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .14);
}

.p-plan__card-title {
  font-size: clamp(17px, 2vw, 21px);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
}

.p-plan__card-text {
  font-size: 14px;
  line-height: 2;
  color: rgba(255, 255, 255, .72);
  text-wrap: pretty;
}

.p-plan__price {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
}

.p-plan__price span {
  margin-left: 4px;
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: 15px;
}

.p-plan__option {
  margin-top: clamp(20px, 2.6vw, 30px);
  padding: clamp(22px, 2.6vw, 30px);
  border-left: 2px solid #00cc55;
  background: rgba(0, 204, 85, .08);
}

.p-plan__option-title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
  color: #fff;
}

.p-plan__option-title span {
  white-space: nowrap;
}

.p-plan__option-text {
  margin-top: 12px;
  font-size: 14px;
  line-height: 2;
  color: rgba(255, 255, 255, .78);
  text-wrap: pretty;
}

.p-plan__spot {
  margin-top: 20px;
}

.p-plan__spot li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: baseline;
  padding: 20px 0;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.p-plan__spot li:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.p-plan__spot-name {
  font-size: 15px;
  line-height: 1.7;
  color: #fff;
}

.p-plan__spot-price {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}

.p-plan__spot-price span {
  margin-left: 3px;
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: 13px;
  font-weight: 400;
}

.p-plan__spot-price--text {
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: 16px;
}

.p-plan__note {
  margin-top: 20px;
  font-size: 12px;
  line-height: 1.9;
  color: rgba(255, 255, 255, .5);
}

/* FAQ
   ----------------------------------------------------------------- */
.p-faq__en {
  margin-top: clamp(14px, 2vw, 22px);
}

.p-faq__list {
  margin-top: clamp(30px, 4vw, 52px);
}

.p-faq__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(16px, 2.4vw, 32px);
  padding: clamp(26px, 3.2vw, 40px) 0;
  border-top: 1px solid rgba(13, 25, 27, .14);
}

.p-faq__item:last-child {
  border-bottom: 1px solid rgba(13, 25, 27, .14);
}

.p-faq__q {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 700;
  line-height: 1.2;
  color: #20ad92;
}

.p-faq__question {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(16px, 1.9vw, 21px);
  line-height: 1.7;
  color: #0d191b;
  text-wrap: pretty;
}

.p-faq__question span {
  display: inline-block;
}

.p-faq__answer {
  margin-top: 16px;
  font-size: 14px;
  line-height: 2.15;
  color: #555;
  text-wrap: pretty;
}

/* About page
   ----------------------------------------------------------------- */
.p-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 4.5vw, 72px);
  align-items: end;
}

.p-head__img {
  aspect-ratio: 16 / 9;
}

.p-record__glow {
  top: 4%;
  left: -10%;
  width: 34vw;
  height: 34vw;
  max-width: 460px;
  max-height: 460px;
  background: radial-gradient(circle, rgba(32, 173, 146, .1), transparent 70%);
}

.p-record__en {
  font-size: clamp(38px, 6.4vw, 84px);
}

.p-record__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 24px);
  margin-top: clamp(40px, 5vw, 66px);
}

.p-record__stat {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
  padding: clamp(26px, 3vw, 38px);
  background: linear-gradient(180deg, #fff 0%, #fbfaf7 100%);
  border: 1px solid rgba(13, 25, 27, .07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(13, 25, 27, .05), 0 34px 64px -46px rgba(13, 25, 27, .6);
}

.p-record__num {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 700;
  line-height: 1.1;
  color: #0d191b;
}

.p-record__num span {
  margin-left: 6px;
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: 15px;
}

.p-record__num--text {
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: clamp(18px, 2vw, 26px);
  line-height: 1.4;
}

.p-record__label {
  padding-top: 14px;
  border-top: 1px solid #f0ede7;
  font-size: 12px;
  letter-spacing: .06em;
  color: #20ad92;
}

.p-record__types {
  margin-top: clamp(44px, 5.5vw, 76px);
  padding-top: clamp(28px, 3.4vw, 40px);
  border-top: 1px solid rgba(13, 25, 27, .12);
}

.p-record__types-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  color: #0d191b;
}

.p-record__types-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.p-record__types-list li {
  padding: 9px 16px;
  border: 1px solid rgba(13, 25, 27, .14);
  font-size: 13px;
  line-height: 1.6;
  color: #333;
}

.p-record__types-list .is-etc {
  padding: 9px 4px;
  border: 0;
  color: #888;
}

.p-philosophy {
  position: relative;
  padding: clamp(72px, 9.5vw, 130px) 0;
  background: #0d191b;
  color: #fff;
  overflow: hidden;
}

.p-philosophy__glow {
  top: -28%;
  right: -4%;
  width: 40vw;
  height: 40vw;
  max-width: 520px;
  max-height: 520px;
  background: radial-gradient(circle at 40% 40%, rgba(0, 204, 85, .26), transparent 68%);
}

.p-philosophy__inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 28px;
}

.p-philosophy__title {
  margin-top: 18px;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(25px, 4.2vw, 50px);
  line-height: 1.45;
  color: #fff;
  text-shadow: 0 16px 44px rgba(0, 0, 0, .4);
}

.p-philosophy__body {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: clamp(24px, 3.4vw, 56px);
  max-width: 960px;
  margin-top: clamp(28px, 3.6vw, 44px);
}

.p-philosophy__catch {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(15px, 1.7vw, 18px);
  line-height: 2.1;
  color: #fff;
  text-wrap: pretty;
}

.p-philosophy__text {
  font-size: 14px;
  line-height: 2.15;
  color: rgba(255, 255, 255, .72);
  text-wrap: pretty;
}

.p-message {
  background: #f1eee7;
}

.p-message__glow {
  top: -8%;
  right: -8%;
  width: 36vw;
  height: 36vw;
  max-width: 480px;
  max-height: 480px;
  background: radial-gradient(circle, rgba(32, 173, 146, .16), transparent 70%);
}

.p-message__en {
  font-size: clamp(44px, 7.4vw, 100px);
  color: #e5e0d5;
}

.p-message__title {
  max-width: 24em;
  font-size: clamp(21px, 3.2vw, 38px);
  line-height: 1.55;
  text-wrap: pretty;
}

.p-message__title span {
  display: inline-block;
}

.p-message__body {
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2.4vw, 28px);
  max-width: 760px;
  margin: clamp(40px, 5vw, 72px) auto 0;
}

.p-message__body p {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(15px, 1.7vw, 17px);
  line-height: 2.15;
  color: #333;
  text-wrap: pretty;
}

.p-message__body .p-message__quote {
  padding-left: clamp(18px, 2vw, 26px);
  border-left: 2px solid #20ad92;
  font-size: clamp(16px, 1.9vw, 19px);
  font-weight: 600;
  line-height: 2.05;
  color: #0d191b;
}

.p-message__body .p-message__sign {
  margin-top: clamp(12px, 1.6vw, 20px);
  padding-top: clamp(20px, 2.4vw, 28px);
  border-top: 1px solid rgba(13, 25, 27, .14);
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: 13px;
  line-height: 1.9;
  color: #0d191b;
  text-align: right;
}

.p-message__sign span {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: 17px;
  font-weight: 600;
}

.u-nowrap {
  white-space: nowrap;
}

.p-approach {
  background: #f5f5f5;
}

.p-approach__en {
  font-size: clamp(40px, 6.6vw, 88px);
  color: #e9e6df;
}

.p-approach__label span {
  display: inline-block;
}

.p-approach__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2.4vw, 28px);
  margin-top: clamp(34px, 4.4vw, 60px);
}

.p-approach__card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: clamp(30px, 3.6vw, 46px);
  background: linear-gradient(180deg, #fff 0%, #fbfaf7 100%);
  border: 1px solid rgba(13, 25, 27, .07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(13, 25, 27, .05), 0 38px 70px -46px rgba(13, 25, 27, .6);
}

.p-approach__num {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 700;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.5px #20ad92;
}

.p-approach__title {
  font-size: clamp(17px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.5;
  color: #0d191b;
  text-wrap: pretty;
}

.p-approach__title span {
  display: inline-block;
}

.p-approach__text {
  font-size: 14px;
  line-height: 2.1;
  color: #555;
  text-wrap: pretty;
}

.p-partner__en {
  font-size: clamp(42px, 7vw, 94px);
}

.p-partner__title span {
  display: inline-block;
}

.p-partner__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: clamp(18px, 2.4vw, 28px);
  margin-top: clamp(36px, 4.6vw, 64px);
}

.p-partner__card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: clamp(30px, 3.6vw, 46px);
  background: #f1eee7;
}

.p-partner__card-en {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: 11px;
  letter-spacing: .26em;
  color: #20ad92;
}

.p-partner__card-title {
  font-size: clamp(16px, 1.9vw, 20px);
  font-weight: 700;
  line-height: 1.6;
  color: #0d191b;
  text-wrap: pretty;
}

.p-partner__card-text {
  font-size: 14px;
  line-height: 2.1;
  color: #555;
  text-wrap: pretty;
}

.p-partner__card-note {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid rgba(13, 25, 27, .12);
  font-size: 12px;
  line-height: 1.9;
  color: #20ad92;
}

.p-partner__card-note span {
  display: inline-block;
}

.p-partner__caution {
  margin-top: 24px;
  font-size: 12px;
  line-height: 1.9;
  color: #888;
}

.p-office {
  background: #f1eee7;
}

.p-office__inner {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
}

.p-office__en {
  font-size: clamp(44px, 7.4vw, 100px);
  color: #e5e0d5;
}

.p-office__list {
  display: grid;
  grid-template-columns: minmax(0, 160px) minmax(0, 1fr);
  margin-top: clamp(30px, 4vw, 52px);
}

.p-office__list dt,
.p-office__list dd {
  padding: 20px 0;
  border-top: 1px solid rgba(13, 25, 27, .14);
}

.p-office__list dt:last-of-type,
.p-office__list dd:last-of-type {
  border-bottom: 1px solid rgba(13, 25, 27, .14);
}

.p-office__list dt {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #0d191b;
}

.p-office__list dd {
  font-size: 14px;
  line-height: 2;
  color: #333;
}

.p-office__line {
  display: block;
}

.p-office__nowrap {
  display: inline-block;
}


/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1000px) {
  .l-header__inner {
    justify-content: space-between;
    gap: 16px;
  }

  .l-header__nav,
  .l-header__inner .c-btn-line--sm {
    display: none;
  }

  .l-header__toggle {
    display: inline-flex;
  }

  .l-menu.is-open {
    display: flex;
  }

  .l-footer__nav {
    display: flex;
  }
}

@media (max-width: 960px) {
  .p-approach__cards {
    grid-template-columns: minmax(0, 1fr);
  }

  .p-approach__text {
    max-width: 40em;
  }
}

@media (max-width: 900px) {
  .p-flow__list {
    flex-direction: column;
    align-items: center;
    gap: 40px 0;
  }

  .p-flow__list::before {
    top: 32px;
    bottom: 32px;
    left: 32px;
    right: auto;
    width: 1px;
    height: auto;
    background: repeating-linear-gradient(180deg, rgba(13, 25, 27, .22) 0 6px, transparent 6px 12px);
  }

  .p-flow__step {
    flex-direction: row;
    align-items: center;
    gap: 20px;
    width: 100%;
    max-width: none;
    text-align: left;
  }

  .p-flow__text {
    max-width: 20em;
  }
}

@media (max-width: 860px) {
  /* 濃色帯の写真は下に回す */
  .c-side-photo {
    top: auto;
    left: 0;
    right: 0;
    width: 100%;
    height: 78vw;
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .75) 14%, #000 28%, #000 100%);
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .75) 14%, #000 28%, #000 100%);
  }

  .p-mission,
  .p-subhero {
    padding-bottom: calc(64vw + 24px);
  }




  .p-worry__grid,
  .p-case__head,
  .p-reason__grid,
  .p-svc__intro,
  .p-head {
    grid-template-columns: minmax(0, 1fr);
  }

  .p-worry__img,
  .p-reason__img {
    max-width: 420px;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
  }

  .p-reason__img {
    position: relative;
    top: auto;
  }

  .p-worry__body,
  .p-worry__voices {
    align-items: center;
  }

  .p-worry__voices li,
  .p-worry__question,
  .p-worry__answer {
    text-align: center;
  }

  .p-service__card-title {
    white-space: normal;
  }

  .p-case__flow {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .p-case__arrow {
    transform: rotate(90deg);
  }

  .p-case__box {
    padding: 26px 22px;
  }

  .p-reason__item {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }

  .p-svc__head {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }

  .p-plan__spot li {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  .p-faq__item {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

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

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

  .p-office__list dt {
    padding-bottom: 6px;
    color: #20ad92;
  }

  .p-office__list dt:last-of-type {
    border-bottom: 0;
  }

  .p-office__list dd {
    padding-top: 0;
    border-top: 0;
  }
}

@media (max-width: 600px) {
  .l-section,
  .l-footer,
  .c-contact,
  .p-subhero,
  .p-worry {
    padding-left: 20px;
    padding-right: 20px;
  }

  .p-mission__inner,
  .p-plan__inner,
  .p-philosophy__inner {
    padding: 0 20px;
  }

  .l-header__inner {
    padding: 12px 20px;
  }

  .c-btn-line {
    padding: 16px 24px;
  }

  .c-btn-line--sm {
    padding: 10px 16px;
    font-size: 13px;
  }



  .p-svc__card {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    padding: 28px 22px;
  }

  .u-pc {
    display: none;
  }
}

.l-footer__sns {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-top: 12px;
  color: inherit;
  text-decoration: none;
}

.l-footer__sns:hover {
  opacity: 0.7;
}

.l-footer__sns:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

.l-footer__address {
  text-align: left;
}

.l-footer__sns {
  justify-content: flex-start;
  padding: 0;
}
/* ==========================================================================
   Opening（トップページのオープニング）
   ・html.is-opening のときだけ表示（JSなし／動きを減らす設定では出ない）
   ・タイミングはCSSだけで完結。JSは「スキップ」と後片付けのみ
   ========================================================================== */

.c-opening {
  display: none;
}

html.is-opening {
  --op-out: 2.6s; /* 幕が上がり始める時刻 */
}

html.is-opening body {
  overflow: hidden;
}

html.is-opening.is-opened body {
  overflow: visible;
}

html.is-opening .c-opening {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  background:
    radial-gradient(60% 50% at 50% 45%, rgba(32, 173, 146, .14), transparent 70%),
    #0d191b;
  color: #fff;
  cursor: pointer;
  animation: opCurtain 1s cubic-bezier(.76, 0, .24, 1) var(--op-out) forwards;
}

.c-opening__logo {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--op-h) * .28);
  height: var(--op-h);
  --op-h: clamp(34px, 7vw, 58px);
  animation: opLogoOut .8s cubic-bezier(.76, 0, .24, 1) var(--op-out) forwards;
}

.c-opening__mark {
  height: 100%;
  width: auto;
  overflow: visible;
}

/* ロゴマーク：5本のバーを1本ずつ描く（緑で描いて白に変わる） */
.c-opening__bar {
  fill: #20ad92;
  transform-box: fill-box;
  animation:
    opBar .6s cubic-bezier(.65, 0, .35, 1) calc(.3s + var(--i) * .13s) both,
    opBarColor .6s ease 1.45s forwards;
}

.c-opening__bar--h { transform-origin: left center; --op-axis: scaleX(0); }
.c-opening__bar--v { transform-origin: center top;  --op-axis: scaleY(0); }

/* ワードマーク：左から拭うように、ぼかしから焦点が合う */
.c-opening__word {
  height: 100%;
  width: auto;
  clip-path: inset(0 100% 0 0);
  filter: blur(8px);
  opacity: 0;
  animation: opWord .9s cubic-bezier(.22, .8, .25, 1) 1s forwards;
}

.c-opening__line {
  display: block;
  width: min(260px, 50vw);
  height: 1px;
  background: linear-gradient(90deg, transparent, #20ad92 20%, #20ad92 80%, transparent);
  transform: scaleX(0);
  animation:
    opLine .8s cubic-bezier(.65, 0, .35, 1) 1.45s forwards,
    opFadeOut .5s ease var(--op-out) forwards;
}

.c-opening__sub {
  font-family: Jost, sans-serif;
  font-size: 11px;
  letter-spacing: .6em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .72);
  padding-left: .6em; /* letter-spacing分の中心ずれ補正 */
  white-space: nowrap;
  text-align: center;
  opacity: 0;
  animation:
    opSub .8s ease 1.7s forwards,
    opFadeOut .5s ease var(--op-out) forwards;
}

/* スキップ時：全部を即座に最終状態へ */
html.is-opening.is-skip .c-opening,
html.is-opening.is-skip .c-opening * {
  animation-duration: .45s !important;
  animation-delay: 0s !important;
}
html.is-opening.is-skip {
  --hero-start: .35s;
}

@keyframes opBar {
  from { transform: var(--op-axis); }
  to   { transform: none; }
}

@keyframes opBarColor {
  to { fill: #fff; }
}

@keyframes opWord {
  to { clip-path: inset(0 0 0 0); filter: blur(0); opacity: 1; }
}

@keyframes opLine {
  to { transform: scaleX(1); }
}

@keyframes opSub {
  from { opacity: 0; transform: translateY(6px); filter: blur(3px); }
  to   { opacity: 1; transform: none; filter: blur(0); }
}

@media (max-width: 600px) {
  .c-opening__sub {
    font-size: 10px;
    letter-spacing: .32em;
    padding-left: .32em;
  }
}

@keyframes opFadeOut {
  to { opacity: 0; }
}

@keyframes opLogoOut {
  to { opacity: 0; transform: translateY(-24px) scale(.96); filter: blur(4px); }
}

@keyframes opCurtain {
  0%   { clip-path: inset(0 0 0 0); }
  100% { clip-path: inset(0 0 100% 0); visibility: hidden; }
}




/* ==========================================================================
   Motion（スクロールで要素がふわっと現れる・カードのホバー）
   ・html.js-anim のときだけ（JSなし／動きを減らす設定では常に表示）
   ========================================================================== */

html.js-anim .js-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity .9s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s),
    transform .9s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s);
}

html.js-anim .js-reveal.is-inview {
  opacity: 1;
  transform: none;
}

/* 写真は少し拡大した状態から落ち着く */
html.js-anim .c-photo.js-reveal .c-cover {
  transform: scale(1.06);
  transition: transform 1.6s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s);
}

html.js-anim .c-photo.js-reveal.is-inview .c-cover {
  transform: none;
}

/* カード：ホバーで少し浮き、写真がゆっくり寄る */
.p-service__card,
.p-svc__card,
.p-approach__card,
.p-partner__card,
.p-plan__card,
.p-recruit__card {
  transition: transform .5s cubic-bezier(.165, .84, .44, 1), box-shadow .5s cubic-bezier(.165, .84, .44, 1);
}

.p-service__card:hover,
.p-svc__card:hover,
.p-approach__card:hover,
.p-partner__card:hover,
.p-plan__card:hover,
.p-recruit__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 2px 4px rgba(13, 25, 27, .06), 0 44px 80px -44px rgba(13, 25, 27, .55);
}

.p-service__card-img {
  overflow: hidden;
}

.p-service__card-img .c-cover {
  transition: transform 1.2s cubic-bezier(.165, .84, .44, 1);
}

.p-service__card:hover .p-service__card-img .c-cover {
  transform: scale(1.06);
}

@media (prefers-reduced-motion: reduce) {
  .p-service__card,
  .p-svc__card,
  .p-approach__card,
  .p-partner__card,
  .p-plan__card,
  .p-recruit__card,
  .p-service__card-img .c-cover {
    transition: none;
  }

  .p-service__card:hover,
  .p-svc__card:hover,
  .p-approach__card:hover,
  .p-partner__card:hover,
  .p-plan__card:hover,
  .p-recruit__card:hover {
    transform: none;
  }
}

/* ==========================================================================
   Recruit page（採用情報）
   ========================================================================== */

.p-recruit__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
  gap: 14px 40px;
  margin-top: clamp(40px, 5vw, 64px);
}

.p-recruit__list li {
  position: relative;
  padding: 18px 0 18px 34px;
  border-bottom: 1px solid rgba(13, 25, 27, .1);
  font-size: 15px;
  line-height: 1.9;
  color: #333;
}

.p-recruit__list li::before {
  content: "";
  position: absolute;
  top: 27px;
  left: 4px;
  width: 12px;
  height: 7px;
  border-left: 2px solid #20ad92;
  border-bottom: 2px solid #20ad92;
  transform: rotate(-45deg);
}

.p-recruit__list--light {
  grid-template-columns: 1fr;
  margin-top: 0;
}

.p-recruit__list--light li {
  border-bottom-color: rgba(255, 255, 255, .14);
  color: rgba(255, 255, 255, .9);
}

.p-recruit__note {
  margin-top: 24px;
  font-size: 13px;
  line-height: 1.9;
  color: #666;
}

.p-recruit__flow::before {
  left: calc(12.5% + 4px);
  right: calc(12.5% + 4px);
}

.p-recruit .p-flow {
  background: #fbfaf7;
}

.p-recruit__job .c-title-en,
.p-recruit .p-flow .c-title-en {
  font-size: clamp(42px, 7vw, 94px);
}

.p-recruit .p-flow .c-title-label {
  margin-bottom: clamp(40px, 5vw, 64px);
}

/* ==========================================================================
   Top hero（明るい全面写真＋大きなロゴ＋右側の縦書きメニュー）
   ========================================================================== */

.p-hero {
  position: relative;
  min-height: max(660px, 100svh);
  padding: 0;
  overflow: hidden;
  background: #fff;
  color: #0d191b;
  isolation: isolate;
}

.p-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.p-hero__bg .c-cover {
  object-position: 58% 28%;
}

/* 左から白く抜けるベール（文字の読みやすさを確保） */
.p-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .9) 30%, rgba(255, 255, 255, .45) 52%, rgba(255, 255, 255, .08) 72%, rgba(255, 255, 255, .28) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .35) 0%, rgba(255, 255, 255, 0) 40%);
}

.p-hero__seo {
  position: absolute;
  top: 28px;
  left: clamp(20px, 3vw, 44px);
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: 12px;
  letter-spacing: .08em;
  color: #333;
}

.p-hero__logo {
  position: absolute;
  top: clamp(72px, 9vh, 110px);
  left: clamp(20px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: clamp(220px, 22vw, 330px);
  color: #0d191b;
}

.p-hero__logo:hover {
  color: #0d191b;
}

.p-hero__logo img {
  width: 100%;
  height: auto;
}

.p-hero__logo-sub {
  padding-left: 32%;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14px, 1.3vw, 18px);
  font-weight: 500;
  letter-spacing: .5em;
}

.p-hero__logo-en {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-left: 32%;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 13px;
  letter-spacing: .14em;
  color: #20ad92;
}

.p-hero__logo-en::before,
.p-hero__logo-en::after {
  content: "";
  flex: 0 0 18px;
  height: 1px;
  background: currentColor;
}

/* 縦書きメニュー：最初の項目がいちばん右 */
.p-hero__nav {
  position: absolute;
  top: clamp(110px, 15vh, 170px);
  right: calc(56px + clamp(28px, 4vw, 72px));
  display: flex;
  flex-direction: row-reverse;
  gap: clamp(22px, 2.6vw, 40px);
}

.p-hero__nav a {
  position: relative;
  padding-top: 40px;
  writing-mode: vertical-rl;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14px, 1.1vw, 16px);
  font-weight: 500;
  letter-spacing: .32em;
  color: #0d191b;
  text-shadow: 0 0 14px rgba(255, 255, 255, .9);
  transition: color .3s;
}

.p-hero__nav a::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 50%;
  width: 18px;
  height: 1px;
  margin-left: -9px;
  background: currentColor;
  transition: width .4s cubic-bezier(.165, .84, .44, 1), margin .4s cubic-bezier(.165, .84, .44, 1), background-color .3s;
}

.p-hero__nav a:hover {
  color: #20ad92;
}

.p-hero__nav a:hover::before {
  width: 30px;
  margin-left: -15px;
}

.p-hero__body {
  position: absolute;
  left: clamp(20px, 3vw, 44px);
  bottom: clamp(56px, 9vh, 110px);
  max-width: min(640px, 52vw);
}

.p-hero__en {
  margin-bottom: 18px;
}

.p-hero__title {
  display: flex;
  flex-direction: column;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 500;
  color: #0d191b;
}

.p-hero__title-sm {
  font-size: clamp(18px, 2vw, 26px);
  line-height: 1.9;
  letter-spacing: .16em;
}

.p-hero__title-lg {
  margin-top: clamp(14px, 2vh, 26px);
  font-size: clamp(26px, 3.3vw, 46px);
  line-height: 1.5;
  letter-spacing: .12em;
}

.p-hero__lead {
  margin-top: clamp(20px, 3vh, 32px);
  font-size: 14px;
  line-height: 2.1;
  color: #333;
}

.p-hero__btn {
  margin-top: clamp(22px, 3.4vh, 36px);
}

.p-hero__stats {
  display: grid;
  grid-template-columns: repeat(3, auto);
  justify-content: start;
  gap: 28px;
  margin-top: clamp(26px, 4vh, 44px);
  padding-top: 20px;
  border-top: 1px solid rgba(13, 25, 27, .14);
}

.p-hero__stat-label {
  font-size: 11px;
  letter-spacing: .1em;
  color: #555;
}

.p-hero__stat-num {
  margin-top: 4px;
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(28px, 2.8vw, 38px);
  font-weight: 700;
  line-height: 1.1;
  color: #0d191b;
}

.p-hero__stat-num span {
  margin-left: 4px;
  font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  font-size: 12px;
  font-weight: 700;
}

/* スクロールの合図 */
.p-hero__scroll {
  position: absolute;
  right: calc(56px + clamp(28px, 4vw, 72px));
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  height: 120px;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 13px;
  letter-spacing: .2em;
  color: #0d191b;
}

.p-hero__scroll span {
  writing-mode: vertical-rl;
}

.p-hero__scroll::after {
  content: "";
  flex: 1;
  width: 1px;
  background: linear-gradient(#0d191b, #0d191b) no-repeat top / 1px 40% , rgba(13, 25, 27, .15);
  animation: heroScroll 2.2s cubic-bezier(.65, 0, .35, 1) infinite;
}

@keyframes heroScroll {
  0%   { background-position: 0 -100%, 0 0; }
  100% { background-position: 0 260%, 0 0; }
}

/* トップでは、縦書きメニューが見えている間は横のバーを出さない（PC） */
@media (min-width: 1001px) {
  .page-top .l-header:not(.is-fixed) {
    visibility: hidden;
  }
}

/* スマホ・タブレットのトップ：白い写真の上なのでロゴとボタンを濃色に */
@media (max-width: 1000px) {
  .page-top .l-header:not(.is-fixed) {
    border-bottom-color: rgba(13, 25, 27, .08);
  }

  .page-top .l-header:not(.is-fixed) .l-header__logo {
    visibility: hidden;
  }

  .page-top .l-header:not(.is-fixed) .l-header__toggle {
    border-color: rgba(13, 25, 27, .3);
    background: rgba(255, 255, 255, .6);
  }

  .page-top .l-header:not(.is-fixed) .l-header__toggle span {
    background: #0d191b;
  }

  .is-menu-open.page-top .l-header .l-header__toggle span {
    background: #fff;
  }

  .p-hero {
    min-height: max(640px, 100svh);
  }

  .p-hero__nav,
  .p-hero__scroll,
  .p-hero__seo {
    display: none;
  }

  .p-hero__logo {
    top: 18px;
    left: 20px;
    gap: 6px;
    width: 170px;
  }

  .p-hero__logo-en {
    display: none;
  }

  .p-hero__logo-sub {
    font-size: 12px;
    letter-spacing: .4em;
  }

  .p-hero__bg .c-cover {
    object-position: 60% 20%;
  }

  .p-hero__bg::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .1) 28%, rgba(255, 255, 255, .55) 46%, rgba(255, 255, 255, .94) 62%, #fff 100%);
  }

  .p-hero__body {
    left: 20px;
    right: 20px;
    bottom: 40px;
    max-width: none;
  }

  .p-hero__stats {
    gap: 16px 20px;
  }
}

@media (max-width: 600px) {
  .p-hero__title-sm {
    font-size: 17px;
    letter-spacing: .1em;
  }

  .p-hero__title-lg {
    margin-top: 8px;
    font-size: 23px;
    letter-spacing: .06em;
  }

  .p-hero__lead {
    font-size: 13px;
  }

  .p-hero__stats {
    grid-template-columns: repeat(3, auto);
    gap: 14px;
  }

  .p-hero__stat-num {
    font-size: 24px;
  }
}

/* メインビジュアルの登場（白から、ぼかしが晴れるように順番に） */
html {
  --hero-start: .25s;
}

html.is-opening {
  --hero-start: calc(var(--op-out) + .15s);
}

html.js-anim .p-hero__bg {
  animation: heroBg 2.4s cubic-bezier(.22, .8, .25, 1) var(--hero-start) both;
}

html.js-anim .p-hero__intro {
  opacity: 0;
  animation: heroIntro 1.3s cubic-bezier(.22, .8, .25, 1) calc(var(--hero-start) + var(--hi, 0s)) forwards;
}

@keyframes heroBg {
  from { opacity: 0; transform: scale(1.06); }
  to   { opacity: 1; transform: none; }
}

@keyframes heroIntro {
  from { opacity: 0; transform: translateY(14px); filter: blur(6px); }
  to   { opacity: 1; transform: none; filter: blur(0); }
}

/* ==========================================================================
   右端の固定タブ（電話・LINE）とページトップ
   ========================================================================== */

.c-sidetabs {
  position: fixed;
  top: 110px;
  right: 0;
  z-index: 45;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.c-sidetabs a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 56px;
  padding: 22px 0;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .14em;
  box-shadow: 0 10px 24px -14px rgba(13, 25, 27, .6);
  transition: width .35s cubic-bezier(.165, .84, .44, 1), filter .3s;
}

.c-sidetabs a:hover {
  width: 64px;
  color: #fff;
  filter: brightness(1.08);
}

.c-sidetabs span {
  writing-mode: vertical-rl;
  text-orientation: upright;
}

.c-sidetabs__tel {
  background: #0d191b;
}

.c-sidetabs__tel span {
  font-family: Jost, "Zen Kaku Gothic New", sans-serif;
  letter-spacing: .02em;
  text-orientation: upright;
}

.c-sidetabs__line {
  background: #06c755;
}

.c-pagetop {
  position: fixed;
  right: 0;
  bottom: 24px;
  z-index: 45;
  width: 56px;
  height: 56px;
  background: #20ad92;
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s, visibility .4s, filter .3s;
}

.c-pagetop::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: -4px 0 0 -7px;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  transform: rotate(45deg);
}

.c-pagetop.is-show {
  opacity: 1;
  visibility: visible;
}

.c-pagetop:hover {
  filter: brightness(1.1);
}

/* スマホ：画面下の2ボタンに */
@media (max-width: 1000px) {
  .c-sidetabs {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    flex-direction: row;
    gap: 0;
  }

  .c-sidetabs a {
    flex: 1;
    flex-direction: row;
    justify-content: center;
    gap: 8px;
    width: auto;
    padding: 15px 0;
    font-size: 14px;
    letter-spacing: .06em;
    box-shadow: none;
  }

  .c-sidetabs a:hover {
    width: auto;
  }

  .c-sidetabs span {
    writing-mode: horizontal-tb;
  }

  .c-pagetop {
    bottom: 66px;
    width: 46px;
    height: 46px;
  }

  body {
    padding-bottom: 52px;
  }
}

/* ==========================================================================
   スクロール表示の強化（見出しはぼかしから、写真は横から開く）
   ========================================================================== */

html.js-anim .c-heading.js-reveal,
html.js-anim .c-title.js-reveal,
html.js-anim .c-title-label.js-reveal {
  filter: blur(8px);
  transition:
    opacity 1.4s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s),
    transform 1.4s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s),
    filter 1.4s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s);
}

html.js-anim .c-heading.js-reveal.is-inview,
html.js-anim .c-title.js-reveal.is-inview,
html.js-anim .c-title-label.js-reveal.is-inview {
  filter: none;
}

/* 写真：枠ごと隠すと画面に入った判定が取れないため、中の画像だけを横から開く */
html.js-anim .c-photo.js-reveal {
  opacity: 1;
  transform: none;
}

html.js-anim .c-photo.js-reveal .c-cover {
  clip-path: inset(0 100% 0 0);
  transform: scale(1.06);
  transition:
    clip-path 1.4s cubic-bezier(.77, 0, .175, 1) var(--rd, 0s),
    transform 1.8s cubic-bezier(.22, .8, .25, 1) var(--rd, 0s);
}

html.js-anim .c-photo.js-reveal.is-inview .c-cover {
  clip-path: inset(0 0 0 0);
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .p-hero__scroll::after {
    animation: none;
  }
}

/* --- Top hero 調整：ロゴ→コピーを縦に流し、写真は右端を白く抜いてメニューの居場所をつくる --- */
.p-hero {
  display: flex;
  flex-direction: column;
  padding: clamp(68px, 9vh, 104px) clamp(20px, 3vw, 44px) clamp(40px, 7vh, 80px);
}

.p-hero__logo {
  position: relative;
  top: auto;
  left: auto;
}

.p-hero__body {
  position: relative;
  left: auto;
  bottom: auto;
  margin-top: auto;
  padding-top: clamp(32px, 6vh, 64px);
  max-width: min(660px, 54vw);
}

.p-hero__title-lg {
  white-space: nowrap;
  font-size: clamp(24px, 2.8vw, 42px);
}

.p-hero__bg {
  right: clamp(200px, 19vw, 320px);
  -webkit-mask-image: linear-gradient(90deg, #000 78%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(90deg, #000 78%, rgba(0, 0, 0, 0) 100%);
}

.p-hero__bg .c-cover {
  object-position: 100% 22%;
}

.p-hero__bg::after {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .97) 0%, rgba(255, 255, 255, .9) 32%, rgba(255, 255, 255, .4) 56%, rgba(255, 255, 255, 0) 76%),
    linear-gradient(180deg, rgba(255, 255, 255, .3) 0%, rgba(255, 255, 255, 0) 40%);
}

/* 右側の白い帯にうっすら色味 */
.p-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(180deg, #f6f9f9 0%, #fff 60%);
}

.p-hero__nav {
  right: calc(56px + clamp(24px, 3vw, 48px));
  gap: clamp(18px, 1.9vw, 32px);
}

@media (max-width: 1000px) {
  .p-hero {
    padding: 18px 20px 40px;
  }

  .p-hero__body {
    max-width: none;
    padding-top: 40vh;
  }

  .p-hero__bg {
    right: 0;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .p-hero__bg .c-cover {
    object-position: 84% 18%;
  }

  .p-hero__title-lg {
    white-space: normal;
  }
}

.p-hero__logo-en {
  white-space: nowrap;
  font-size: 12px;
  letter-spacing: .06em;
}

.p-hero__logo-en::after {
  display: none;
}

@media (max-width: 1000px) {
  .p-hero__logo-sub {
    white-space: nowrap;
  }

  .p-hero__body {
    right: auto;
    left: auto;
    padding-top: calc(52vh - 60px);
  }

  .p-hero__bg {
    bottom: auto;
    height: 58vh;
    -webkit-mask-image: linear-gradient(180deg, #000 70%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(180deg, #000 70%, rgba(0, 0, 0, 0) 100%);
  }

  .p-hero__bg::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 24%, rgba(255, 255, 255, 0) 70%, rgba(255, 255, 255, .8) 100%);
  }
}

/* --- ヒーロー：人物なしのビル写真に合わせて全面敷き。左のビルは白く淡く、右の空にメニュー --- */
.p-hero__bg {
  right: 0;
  -webkit-mask-image: none;
  mask-image: none;
}

.p-hero__bg .c-cover {
  object-position: 30% 40%;
}

.p-hero__bg::after {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .86) 34%, rgba(255, 255, 255, .5) 58%, rgba(255, 255, 255, .42) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .25) 0%, rgba(255, 255, 255, 0) 45%, rgba(255, 255, 255, .35) 100%);
}

/* 右端タブはLINEだけに */
.c-sidetabs {
  top: 50%;
  transform: translateY(-50%);
}

.c-sidetabs__line {
  padding: 26px 0;
}

@media (max-width: 1000px) {
  .c-sidetabs {
    top: auto;
    transform: none;
  }

  .p-hero__bg {
    height: 58vh;
  }

  .p-hero__bg .c-cover {
    object-position: 20% 50%;
  }

  .p-hero__bg::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .6) 0%, rgba(255, 255, 255, .25) 30%, rgba(255, 255, 255, .45) 70%, rgba(255, 255, 255, .9) 100%);
  }
}


/* --- フォント調整：見出しは細身の明朝、本文はすっきりしたゴシック、英数字はJost --- */
body {
  font-feature-settings: "palt" 0;
  letter-spacing: .02em;
}

h1, h2, h3, h4 {
  font-feature-settings: "palt" 1;
}

.c-heading__title,
.c-title,
.c-contact__title,
.p-hero__title {
  font-weight: 500;
  letter-spacing: .08em;
}

.p-hero__title-sm {
  letter-spacing: .18em;
}

.p-hero__title-lg {
  font-weight: 600;
  letter-spacing: .1em;
}

.p-hero__stat-num {
  font-weight: 500;
  letter-spacing: .02em;
}

.c-en {
  font-weight: 500;
  letter-spacing: .28em;
}

.p-hero__bg::after {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .84) 34%, rgba(255, 255, 255, .38) 58%, rgba(255, 255, 255, .22) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 45%, rgba(255, 255, 255, .3) 100%);
}

.p-hero__bg .c-cover {
  object-position: 30% 35%;
}

/* ==========================================================================
   実績の数字：スロットのように回って確定 → 「全国」がドーンと登場
   ========================================================================== */

.p-hero__count {
  display: inline-flex;
  font-variant-numeric: tabular-nums;
}

.p-hero__reel {
  display: inline-block;
  height: 1.1em;
  overflow: hidden;
  line-height: 1.1;
}

.p-hero__reel-strip {
  display: flex;
  flex-direction: column;
  transform: translateY(0);
  transition: transform var(--reel-dur, 1.6s) cubic-bezier(.16, .84, .3, 1) var(--reel-delay, 0s);
}

.p-hero__reel-strip > span {
  display: block;
  height: 1.1em;
}

.p-hero__stat-num--pop {
  overflow: visible;
}

.p-hero__pop {
  display: inline-block;
  font-size: 1.25em;
  transform-origin: 50% 70%;
}

.p-hero__pop-unit {
  display: inline-block;
}

html.js-anim .p-hero__stat-num--pop .p-hero__pop,
html.js-anim .p-hero__stat-num--pop .p-hero__pop-unit {
  opacity: 0;
}

html.js-anim .p-hero__stat-num--pop.is-pop .p-hero__pop {
  animation: statPop .6s cubic-bezier(.34, 1.56, .64, 1) forwards;
}

html.js-anim .p-hero__stat-num--pop.is-pop .p-hero__pop-unit {
  animation: statUnit .4s ease .3s forwards;
}

@keyframes statPop {
  0%   { opacity: 0; transform: scale(2.4); filter: blur(8px); }
  60%  { opacity: 1; filter: blur(0); }
  100% { opacity: 1; transform: scale(1); filter: blur(0); }
}

@keyframes statUnit {
  from { opacity: 0; transform: translateX(-6px); }
  to   { opacity: 1; transform: none; }
}

/* 単位（年以上・事業所超・可能）だけ小さく。数字・リール・「全国」は本来の大きさ */
.p-hero__stat-num .p-hero__count,
.p-hero__stat-num .p-hero__count span,
.p-hero__stat-num .p-hero__reel,
.p-hero__stat-num .p-hero__reel-strip,
.p-hero__stat-num .p-hero__reel-strip > span {
  margin: 0;
  font-family: Jost, sans-serif;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: 0;
}

.p-hero__stat-num .p-hero__count + span {
  margin-left: 4px;
}

.p-hero__stat-num .p-hero__pop {
  margin: 0;
  font-family: "Shippori Mincho", serif;
  font-size: 1.15em;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1;
}

.p-hero__stat-num .p-hero__pop-unit {
  margin-left: 6px;
}

/* ==========================================================================
   ヒーロー右下：「運営指導・監査に、不安を感じている方へ。」＋Scroll
   ========================================================================== */

.p-worry {
  scroll-margin-top: 70px;
}

.p-hero__invite {
  position: absolute;
  right: calc(56px + clamp(24px, 3vw, 48px));
  bottom: clamp(40px, 7vh, 80px);
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  column-gap: 28px;
  width: min(420px, 32vw);
  padding: 28px 26px 28px 32px;
  background: rgba(255, 255, 255, .58);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  backdrop-filter: blur(16px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, .8);
  box-shadow: 0 30px 60px -36px rgba(13, 25, 27, .45);
  color: #0d191b;
  transition: background-color .5s, box-shadow .5s cubic-bezier(.165, .84, .44, 1);
}

/* 左上の細い緑ライン（アクセント） */
.p-hero__invite::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 32px;
  width: 48px;
  height: 2px;
  background: #20ad92;
  transition: width .6s cubic-bezier(.165, .84, .44, 1);
}

.p-hero__invite:hover {
  color: #0d191b;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 36px 70px -34px rgba(13, 25, 27, .5);
}

.p-hero__invite:hover::before {
  width: calc(100% - 64px);
}

.p-hero__invite-en {
  grid-column: 1;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 14px;
  letter-spacing: .08em;
  color: #20ad92;
}

.p-hero__invite-title {
  grid-column: 1;
  display: flex;
  flex-direction: column;
  margin-top: 10px;
  font-family: "Shippori Mincho", serif;
  font-size: clamp(17px, 1.5vw, 21px);
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .1em;
}

.p-hero__invite-text {
  grid-column: 1;
  margin-top: 12px;
  font-size: 12px;
  line-height: 1.9;
  letter-spacing: .04em;
  color: #444;
}

/* 右側：縦の「Scroll」と、下へ流れるライン */
.p-hero__invite-scroll {
  grid-column: 2;
  grid-row: 1 / 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 13px;
  letter-spacing: .22em;
}

.p-hero__invite-scroll span {
  writing-mode: vertical-rl;
}

.p-hero__invite-scroll::after {
  content: "";
  flex: 1;
  min-height: 56px;
  width: 1px;
  background: linear-gradient(#0d191b, #0d191b) no-repeat top / 1px 40%, rgba(13, 25, 27, .15);
  animation: heroScroll 2s cubic-bezier(.65, 0, .35, 1) infinite;
}

@media (max-width: 1000px) {
  .p-hero__invite {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-hero__invite-scroll::after {
    animation: none;
  }
}

/* ==========================================================================
   メニューバーのロゴ：トップの大きなロゴと同じ組み（緑のマーク＋EntReaL＋行政書士事務所）
   ========================================================================== */

.l-header__logo {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  line-height: 1;
  color: #fff;
}

.l-header__logo:hover {
  color: #fff;
}

.l-header__logo img {
  height: 28px;
}

.l-header__logo-sub {
  padding-left: 32%;
  font-family: "Shippori Mincho", serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .42em;
  white-space: nowrap;
  color: rgba(255, 255, 255, .92);
}

.l-header.is-fixed .l-header__logo img {
  height: 26px;
}

@media (max-width: 600px) {
  .l-header__logo img,
  .l-header.is-fixed .l-header__logo img {
    height: 24px;
  }

  .l-header__logo-sub {
    font-size: 10px;
    letter-spacing: .36em;
  }
}

/* 下層ページ：最初からメニューバーを濃色に（写真の上でも文字が読めるように） */
.page-sub .l-header:not(.is-fixed) {
  background: rgba(13, 25, 27, .82);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  backdrop-filter: blur(18px) saturate(1.2);
  border-bottom-color: rgba(255, 255, 255, .16);
}

/* ==========================================================================
   装飾：EntReaLのロゴマーク（透かし）・写真うしろの色ブロック・ひし形の線
   りっか様のような「模様・四角」で余白のバランスをとる
   ========================================================================== */

:root {
  --mark-green: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 183 160'%3E%3Cg fill='%2320ad92'%3E%3Crect width='183' height='23'/%3E%3Crect x='137' width='23' height='160'/%3E%3Crect x='92' y='53' width='22' height='107'/%3E%3Crect y='53' width='69' height='23'/%3E%3Crect y='137' width='69' height='23'/%3E%3C/g%3E%3C/svg%3E");
  --mark-sand: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 183 160'%3E%3Cg fill='%23b9ab8c'%3E%3Crect width='183' height='23'/%3E%3Crect x='137' width='23' height='160'/%3E%3Crect x='92' y='53' width='22' height='107'/%3E%3Crect y='53' width='69' height='23'/%3E%3Crect y='137' width='69' height='23'/%3E%3C/g%3E%3C/svg%3E");
}

/* --- 大きなロゴマークの透かし --- */
.p-about::before,
.p-reason::before,
.p-flow::before,
.p-worry::before {
  content: "";
  position: absolute;
  z-index: 0;
  aspect-ratio: 183 / 160;
  background: var(--mark-green) center / contain no-repeat;
  pointer-events: none;
}

.p-about::before {
  top: clamp(40px, 6vw, 90px);
  right: -4vw;
  width: min(44vw, 620px);
  opacity: .06;
}

.p-reason::before {
  bottom: -6%;
  left: -6vw;
  width: min(52vw, 720px);
  background-image: var(--mark-sand);
  opacity: .14;
}

.p-flow {
  position: relative;
  overflow: hidden;
}

.p-flow::before {
  top: 50%;
  right: -8vw;
  width: min(36vw, 480px);
  transform: translateY(-50%);
  opacity: .05;
}

.p-worry::before {
  top: -8%;
  right: -5vw;
  width: min(38vw, 520px);
  background-image: var(--mark-sand);
  opacity: .16;
}

.p-about .l-container,
.p-reason .l-container,
.p-flow .l-container,
.p-worry .l-container {
  z-index: 1;
}

/* --- 写真のうしろに、ずらした色ブロック --- */
.p-about__img,
.p-worry__img,
.p-case__img,
.p-reason__img {
  isolation: isolate;
  overflow: visible;
}

.p-about__img::before,
.p-worry__img::before,
.p-case__img::before,
.p-reason__img::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
}

.p-about__img::before {
  background: #e3f1ec;
  transform: translate(clamp(18px, 2.4vw, 36px), clamp(18px, 2.4vw, 36px));
}

.p-worry__img::before {
  background: #fff;
  transform: translate(calc(-1 * clamp(18px, 2.4vw, 36px)), calc(-1 * clamp(18px, 2.4vw, 36px)));
}

.p-case__img::before {
  background: #e9e4d6;
  transform: translate(calc(-1 * clamp(16px, 2vw, 30px)), clamp(16px, 2vw, 30px));
}

.p-reason__img::before {
  background: #dfeee9;
  transform: translate(clamp(16px, 2vw, 30px), calc(-1 * clamp(16px, 2vw, 30px)));
}

/* 色ブロックも写真と一緒に横から現れる */
html.js-anim .c-photo.js-reveal::before {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.2s cubic-bezier(.77, 0, .175, 1) calc(var(--rd, 0s) + .15s);
}

html.js-anim .c-photo.js-reveal.is-inview::before {
  clip-path: inset(0 0 0 0);
}

/* --- ひし形（四角を45°回転）の線の装飾 --- */
.p-case,
.p-service,
.p-about {
  position: relative;
}

.p-case::before,
.p-case::after,
.p-service::before,
.p-service::after,
.p-about::after {
  content: "";
  position: absolute;
  z-index: 0;
  border: 1px solid rgba(32, 173, 146, .22);
  transform: rotate(45deg);
  pointer-events: none;
}

.p-case::before {
  top: 9%;
  right: -120px;
  width: 360px;
  height: 360px;
}

.p-case::after {
  top: calc(9% + 70px);
  right: 10px;
  width: 120px;
  height: 120px;
  border-color: rgba(185, 171, 140, .45);
}

.p-service::before {
  top: -140px;
  left: -140px;
  width: 420px;
  height: 420px;
  background: rgba(255, 255, 255, .55);
  border-color: rgba(185, 171, 140, .35);
}

.p-service::after {
  bottom: 8%;
  right: -90px;
  width: 260px;
  height: 260px;
}

.p-about::after {
  bottom: 18%;
  left: -70px;
  width: 180px;
  height: 180px;
  border-color: rgba(185, 171, 140, .4);
}

.p-case .l-container,
.p-service .l-container {
  position: relative;
  z-index: 1;
}

/* --- 見出しの上に小さなロゴマーク --- */
.p-worry__question::before,
.c-contact__title::before {
  content: "";
  display: block;
  width: 30px;
  aspect-ratio: 183 / 160;
  margin-bottom: 18px;
  background: var(--mark-green) center / contain no-repeat;
}

.c-contact__title::before {
  margin: 0 auto 22px;
}

@media (max-width: 900px) {
  .p-case::before,
  .p-service::before {
    width: 240px;
    height: 240px;
  }

  .p-about::before,
  .p-worry::before {
    width: 70vw;
  }

  .p-about__img::before,
  .p-worry__img::before,
  .p-case__img::before,
  .p-reason__img::before {
    transform: translate(12px, 12px);
  }
}

/* 色ブロックをはっきりさせ、反対側に細い線の枠を重ねる */
.p-about__img::before { background: #cfe7de; transform: translate(clamp(22px, 3vw, 44px), clamp(22px, 3vw, 44px)); }
.p-worry__img::before { background: #fff; transform: translate(calc(-1 * clamp(22px, 3vw, 44px)), calc(-1 * clamp(22px, 3vw, 44px))); }
.p-case__img::before  { background: #e6dfcc; transform: translate(calc(-1 * clamp(20px, 2.6vw, 38px)), clamp(20px, 2.6vw, 38px)); }
.p-reason__img::before { background: #cfe7de; transform: translate(clamp(20px, 2.6vw, 38px), calc(-1 * clamp(20px, 2.6vw, 38px))); }

.p-about__img::after,
.p-worry__img::after,
.p-case__img::after,
.p-reason__img::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  border: 1px solid rgba(13, 25, 27, .28);
  pointer-events: none;
  transition: opacity 1s ease calc(var(--rd, 0s) + .6s);
}

.p-about__img::after  { transform: translate(calc(-1 * clamp(14px, 1.6vw, 22px)), calc(-1 * clamp(14px, 1.6vw, 22px))); }
.p-worry__img::after  { transform: translate(clamp(14px, 1.6vw, 22px), clamp(14px, 1.6vw, 22px)); border-color: rgba(185, 171, 140, .7); }
.p-case__img::after   { transform: translate(clamp(14px, 1.6vw, 22px), calc(-1 * clamp(14px, 1.6vw, 22px))); }
.p-reason__img::after { transform: translate(calc(-1 * clamp(14px, 1.6vw, 22px)), clamp(14px, 1.6vw, 22px)); border-color: rgba(185, 171, 140, .7); }

html.js-anim .c-photo.js-reveal::after { opacity: 0; }
html.js-anim .c-photo.js-reveal.is-inview::after { opacity: 1; }

@media (max-width: 900px) {
  .p-about__img::before,
  .p-worry__img::before,
  .p-case__img::before,
  .p-reason__img::before {
    transform: translate(14px, 14px);
  }

  .p-about__img::after,
  .p-worry__img::after,
  .p-case__img::after,
  .p-reason__img::after {
    transform: translate(-10px, -10px);
  }
}

/* スマホ：透かしは文字の邪魔にならないよう控えめに */
@media (max-width: 760px) {
  .p-about::before,
  .p-flow::before {
    top: auto;
    bottom: 2%;
    opacity: .035;
  }

  .p-worry::before,
  .p-reason::before {
    opacity: .08;
  }
}

/* 句読点だけが次の行に落ちないように */
.page-top {
  line-break: strict;
}

@supports (word-break: auto-phrase) {
  .page-top {
    word-break: auto-phrase;
  }
}

/* お悩みセクションの見出し上のマークは表示しない */
.p-worry__question::before {
  content: none;
}

/* 当所について（トップ）の太字段落：意味のまとまりごとに改行 */
.p-about__text--strong span {
  display: inline-block;
}

/* MISSION本文：見出しと同じ明朝で、濃色の帯の上でも浮かないように */
.p-mission__text {
  max-width: 36em;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 500;
  line-height: 2.2;
  letter-spacing: .06em;
  color: rgba(255, 255, 255, .92);
}

.p-mission__text span {
  display: inline-block;
}

/* MISSION：Aboutと同じ、大きく透ける斜体の英字（濃色の帯なので白を薄く） */
.p-mission__en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(64px, 11.5vw, 150px);
  line-height: .82;
  letter-spacing: -.01em;
  color: rgba(255, 255, 255, .08);
  pointer-events: none;
}

.p-mission__en + .p-mission__title {
  position: relative;
  margin-top: clamp(-22px, -2vw, -10px);
}

/* Missionと見出しの間を気持ち離す */
.p-mission__en + .p-mission__title {
  margin-top: clamp(6px, 1vw, 16px);
}

/* About・Service など大きな英字と見出しの間も、Missionと同じだけ気持ち離す */
.c-heading__en + .c-heading__title {
  margin-top: clamp(6px, 1vw, 16px);
}

/* 見出し下のリード文：明朝で濃さを合わせ、意味のまとまりで改行 */
.c-heading__lead {
  max-width: 36em;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 500;
  line-height: 2.2;
  letter-spacing: .06em;
  color: #1f2b2d;
}

.c-heading__lead span {
  display: inline-block;
}

/* ==========================================================================
   Service見出しの右側：写真＋サービス一覧（右の余白を埋める）
   ========================================================================== */

@media (min-width: 901px) {
  .p-service .c-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
    column-gap: clamp(40px, 6vw, 96px);
    align-items: start;
  }

  .p-service .c-heading > :not(.p-service__aside) {
    grid-column: 1;
  }

  .p-service__aside {
    grid-column: 2;
    grid-row: 1 / span 4;
    align-self: center;
  }
}

.p-service__aside {
  position: relative;
  padding-bottom: 40px;
}

.p-service__aside-img {
  aspect-ratio: 4 / 3;
  width: 88%;
  margin-left: auto;
  isolation: isolate;
  overflow: visible;
}

.p-service__aside-img::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: #e6dfcc;
  transform: translate(clamp(18px, 2.4vw, 34px), calc(-1 * clamp(18px, 2.4vw, 34px)));
  pointer-events: none;
}

html.js-anim .p-service__aside-img.js-reveal::before {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.2s cubic-bezier(.77, 0, .175, 1) calc(var(--rd, 0s) + .15s);
}

html.js-anim .p-service__aside-img.js-reveal.is-inview::before {
  clip-path: inset(0 0 0 0);
}

/* 写真の左下に重なる白いカード */
.p-service__index {
  position: relative;
  z-index: 2;
  width: min(360px, 70%);
  margin-top: calc(-1 * clamp(80px, 9vw, 140px));
  padding: 26px 28px 20px;
  background: #fff;
  box-shadow: 0 30px 60px -34px rgba(13, 25, 27, .4);
}

.p-service__index::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 28px;
  width: 44px;
  height: 2px;
  background: #20ad92;
}

.p-service__index-en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 15px;
  letter-spacing: .06em;
  color: #20ad92;
}

.p-service__index ol {
  margin-top: 8px;
}

.p-service__index li + li {
  border-top: 1px solid rgba(13, 25, 27, .08);
}

.p-service__index a {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 11px 0;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .06em;
  color: #0d191b;
  transition: color .3s, padding-left .4s cubic-bezier(.165, .84, .44, 1);
}

.p-service__index a span {
  font-family: Jost, sans-serif;
  font-size: 12px;
  letter-spacing: .08em;
  color: #20ad92;
}

.p-service__index a:hover {
  padding-left: 6px;
  color: #20ad92;
}

@media (max-width: 900px) {
  .p-service__aside {
    margin-top: 48px;
  }

  .p-service__aside-img {
    width: 92%;
  }

  .p-service__index {
    width: 86%;
    margin-top: -48px;
  }
}

@media (min-width: 901px) {
  .p-service .c-heading {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  }

  .p-service .c-heading__title {
    font-size: clamp(23px, 2.8vw, 38px);
    white-space: nowrap;
  }
}

/* ==========================================================================
   トップのサービスカード：文字を強く、ホバーで動きを
   ========================================================================== */

.p-service__card-title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(16px, 6.6cqw, 23px);
  font-weight: 700;
  letter-spacing: .06em;
  transition: color .4s;
}

.p-service__card-text {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 2.05;
  letter-spacing: .04em;
  color: #1f2b2d;
}

.p-service__card-en {
  font-weight: 500;
}

/* 大きな番号：斜体の英字にして緑をうっすら */
.p-service__card-num {
  top: 6px;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 96px;
  color: rgba(32, 173, 146, .13);
  transition: color .5s, transform .6s cubic-bezier(.165, .84, .44, 1);
}

/* 「全国オンライン対応可」はチェック付きの小さなラベルに */
.p-service__card-note {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.p-service__card-note::before {
  content: "";
  flex: none;
  width: 9px;
  height: 5px;
  margin-bottom: 2px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}

/* 詳しく見る（カード全体をリンクにする） */
.p-service__card-more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  align-self: flex-start;
  margin-top: 4px;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  color: #0d191b;
}

.p-service__card-text + .p-service__card-more {
  margin-top: auto;
}

.p-service__card-more::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
}

.p-service__card-more span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(13, 25, 27, .3);
  border-radius: 50%;
  font-family: Jost, sans-serif;
  transition: background-color .4s, border-color .4s, color .4s, transform .5s cubic-bezier(.165, .84, .44, 1);
}

/* カード上辺の緑のライン（ホバーで左から伸びる） */
.p-service__card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  height: 3px;
  background: #20ad92;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .6s cubic-bezier(.165, .84, .44, 1);
}

/* 写真に緑のベールがうっすらかかる */
.p-service__card-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(32, 173, 146, 0) 40%, rgba(13, 25, 27, .35) 100%);
  opacity: 0;
  transition: opacity .5s;
}

.p-service__card:hover::after {
  transform: scaleX(1);
}

.p-service__card:hover .p-service__card-img::after {
  opacity: 1;
}

.p-service__card:hover .p-service__card-title {
  color: #20ad92;
}

.p-service__card:hover .p-service__card-num {
  color: rgba(32, 173, 146, .35);
  transform: translateX(-8px);
}

.p-service__card:hover .p-service__card-more span {
  background: #20ad92;
  border-color: #20ad92;
  color: #fff;
  transform: translateX(6px);
}

.p-service__card:hover .p-service__card-img .c-cover {
  transform: scale(1.08);
}

@media (prefers-reduced-motion: reduce) {
  .p-service__card::after,
  .p-service__card-num,
  .p-service__card-more span {
    transition: none;
  }
}

.p-service__card-more:hover,
.p-service__card:hover .p-service__card-more {
  color: #20ad92;
}

/* ==========================================================================
   サービスメニュー（メニュー表のような見せ方）
   ========================================================================== */

.p-service__index {
  width: min(420px, 80%);
  padding: 34px 34px 26px;
  outline: 1px solid rgba(185, 171, 140, .55);
  outline-offset: -10px;
}

.p-service__index::before {
  left: 50%;
  margin-left: -22px;
}

.p-service__index-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin-bottom: 14px;
  text-align: center;
}

.p-service__index-en {
  font-size: 24px;
  line-height: 1.1;
}

.p-service__index-ja {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: "Shippori Mincho", serif;
  font-size: 11px;
  letter-spacing: .4em;
  color: #6b6555;
}

.p-service__index-ja::before,
.p-service__index-ja::after {
  content: "";
  width: 20px;
  height: 1px;
  background: rgba(185, 171, 140, .8);
}

.p-service__index ol {
  margin-top: 6px;
}

.p-service__index li + li {
  border-top: 0;
}

.p-service__index a {
  position: relative;
  display: grid;
  grid-template-columns: auto auto minmax(16px, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  padding: 13px 4px;
}

.p-service__index a:hover {
  padding-left: 4px;
}

.p-service__index-num {
  font-family: "Cormorant Garamond", serif !important;
  font-style: italic;
  font-size: 28px !important;
  line-height: 1;
  letter-spacing: 0 !important;
  color: #20ad92;
  transition: transform .45s cubic-bezier(.165, .84, .44, 1);
}

.p-service__index-name {
  font-family: "Shippori Mincho", serif;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: .06em;
  color: #0d191b;
  white-space: nowrap;
  transition: color .35s;
}

/* 点線のリーダー：ホバーで緑の線に */
.p-service__index-dots {
  position: relative;
  align-self: center;
  height: 1px;
  background-image: radial-gradient(circle, rgba(13, 25, 27, .35) 1px, transparent 1.2px);
  background-size: 6px 2px;
  background-repeat: repeat-x;
}

.p-service__index-dots::after {
  content: "";
  position: absolute;
  inset: -0.5px 0;
  background: #20ad92;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .55s cubic-bezier(.165, .84, .44, 1);
}

.p-service__index-tag {
  font-family: "Cormorant Garamond", serif !important;
  font-style: italic;
  font-size: 14px !important;
  letter-spacing: .04em !important;
  color: #8a7d5f !important;
  transition: color .35s;
}

.p-service__index a:hover .p-service__index-num {
  transform: translateX(4px);
}

.p-service__index a:hover .p-service__index-name,
.p-service__index a:hover .p-service__index-tag {
  color: #20ad92 !important;
}

.p-service__index a:hover .p-service__index-dots::after {
  transform: scaleX(1);
}

/* メニューから飛んできたカードを一瞬目立たせる */
.p-service__card {
  scroll-margin-top: 110px;
}

.p-service__card:target::after {
  transform: scaleX(1);
}

.p-service__card:target {
  animation: cardArrive 1.6s cubic-bezier(.22, .8, .25, 1) .3s;
}

@keyframes cardArrive {
  0%   { box-shadow: 0 0 0 0 rgba(32, 173, 146, .0), 0 38px 70px -46px rgba(13, 25, 27, .6); }
  30%  { box-shadow: 0 0 0 6px rgba(32, 173, 146, .35), 0 38px 70px -46px rgba(13, 25, 27, .6); }
  100% { box-shadow: 0 0 0 0 rgba(32, 173, 146, 0), 0 38px 70px -46px rgba(13, 25, 27, .6); }
}

@media (max-width: 600px) {
  .p-service__index {
    width: 92%;
    padding: 28px 22px 20px;
  }

  .p-service__index-name {
    font-size: 14px;
    white-space: normal;
  }

  .p-service__index-tag {
    display: none;
  }

  .p-service__index a {
    grid-template-columns: auto auto minmax(12px, 1fr);
  }
}

.p-service__index a span.p-service__index-name {
  font-family: "Shippori Mincho", serif;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: .06em;
  color: #0d191b;
}

.p-service__index a:hover span.p-service__index-name {
  color: #20ad92;
}

@media (max-width: 600px) {
  .p-service__index a span.p-service__index-name {
    font-size: 14px;
  }
}

/* グループにカードが1枚だけのとき：横並び（写真左・本文右）で間延びを防ぐ */
@media (min-width: 761px) {
  .p-service__cards > .p-service__card:only-child {
    flex-direction: row;
  }

  .p-service__cards > .p-service__card:only-child .p-service__card-img {
    width: 46%;
    height: auto;
    min-height: 300px;
  }

  .p-service__cards > .p-service__card:only-child .p-service__card-body {
    flex: 1;
    justify-content: center;
  }
}

/* ==========================================================================
   事例：SUPPORT → AFTER をわかりやすく、ホバーで動きを
   ========================================================================== */

.p-case__item {
  transition: box-shadow .5s cubic-bezier(.165, .84, .44, 1);
}

.p-case__item-title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 700;
  letter-spacing: .04em;
}

/* チェックは緑の丸の中に白いチェック */
.p-case__check {
  position: relative;
  flex: none;
  width: clamp(40px, 4vw, 52px);
  height: clamp(40px, 4vw, 52px);
  border-radius: 50%;
  background: #20ad92;
  font-size: 0;
  align-self: center;
}

.p-case__check::before {
  content: "";
  position: absolute;
  top: 44%;
  left: 50%;
  width: 40%;
  height: 20%;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: translate(-50%, -50%) rotate(-45deg);
}

.p-case__item-head {
  align-items: center;
}

.p-case__flow {
  gap: clamp(10px, 1.4vw, 18px);
}

.p-case__box {
  position: relative;
  z-index: 1;
  border-radius: 2px;
  transition:
    transform .5s cubic-bezier(.165, .84, .44, 1),
    box-shadow .5s cubic-bezier(.165, .84, .44, 1),
    border-color .4s,
    background-color .4s;
}

/* AFTER は最初から淡いミントで「結果」だとわかるように */
.p-case__box:last-child {
  background: #f0f8f5;
  border-color: rgba(32, 173, 146, .28);
}

.p-case__label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .28em;
}

.p-case__box-text {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(15px, 1.25vw, 16.5px);
  font-weight: 500;
  line-height: 2;
  letter-spacing: .04em;
  color: #1f2b2d;
}

.p-case__box-text--after {
  font-weight: 600;
  color: #0d191b;
}

/* 矢印：丸い枠の中の矢印。ホバーで緑に塗られて右へ動く */
.p-case__arrow {
  position: relative;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(32, 173, 146, .5);
  border-radius: 50%;
  background: #fff;
  font-size: 0;
  transition: background-color .4s, border-color .4s, transform .5s cubic-bezier(.165, .84, .44, 1);
}

.p-case__arrow::before {
  content: "→";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Jost, sans-serif;
  font-size: 18px;
  color: #20ad92;
  transition: color .4s;
}

/* ホバー：カード全体が少し浮き、各ボックスは乗せた方が拡大 */
.p-case__item:hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 2px 4px rgba(13, 25, 27, .05), 0 24px 40px -22px rgba(13, 25, 27, .45), 0 54px 90px -50px rgba(13, 25, 27, .65);
}

.p-case__item:hover .p-case__arrow {
  background: #20ad92;
  border-color: #20ad92;
  animation: caseArrow 1.2s cubic-bezier(.65, 0, .35, 1) infinite;
}

.p-case__item:hover .p-case__arrow::before {
  color: #fff;
}

.p-case__box:hover {
  z-index: 2;
  transform: scale(1.04);
  border-color: rgba(32, 173, 146, .6);
  box-shadow: 0 30px 50px -26px rgba(13, 25, 27, .4);
}

.p-case__box:last-child:hover {
  background: #e4f3ee;
}

@keyframes caseArrow {
  0%, 100% { transform: translateX(0); }
  50%      { transform: translateX(5px); }
}

/* スマホ：縦並びなので矢印は下向き */
@media (max-width: 860px) {
  .p-case__arrow {
    justify-self: center;
    transform: rotate(90deg);
  }

  .p-case__item:hover .p-case__arrow {
    animation: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-case__box,
  .p-case__arrow {
    transition: none;
  }

  .p-case__box:hover {
    transform: none;
  }

  .p-case__item:hover .p-case__arrow {
    animation: none;
  }
}

/* サービスページ：5つのセクションの背景（交互に色味を変える） */
.p-svc--04 {
  background: linear-gradient(180deg, #fff 0%, #f5f5f5 100%);
}

.p-svc--05 {
  background: linear-gradient(180deg, #fff 0%, #eef3f1 100%);
}

.p-svc--02,
.p-svc--03,
.p-svc--04,
.p-svc--05 {
  position: relative;
  overflow: hidden;
}

/* サブヒーローのリンクが5つになったので詰めて並べる */
.p-subhero__links {
  flex-wrap: wrap;
  gap: 10px;
}

/* 選ばれる理由の本文：見出しと同じ明朝で、濃さを合わせる */
.p-reason__text {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14.5px, 1.2vw, 16px);
  font-weight: 500;
  line-height: 2.05;
  letter-spacing: .04em;
  color: #1f2b2d;
}

/* ==========================================================================
   支援までの流れ：アニメーション
   ・線が左から緑で伸びる → 番号の丸が順番にポンと現れ、波紋が広がる → 文字がふわっと
   ・ホバーで丸が緑に塗られる
   ========================================================================== */

.p-flow::before {
  content: none; /* 05の文字の後ろに出ていた透かしの欠片を消す */
}

.p-flow__list {
  --flow-step: .42s; /* 1ステップごとの間隔 */
}

/* 緑の線（点線の上に重ねて、左から伸ばす） */
.p-flow__list::after {
  content: "";
  position: absolute;
  top: 40px;
  left: calc(10% + 4px);
  right: calc(10% + 4px);
  z-index: 0;
  height: 2px;
  margin-top: -.5px;
  background: linear-gradient(90deg, #20ad92, #58c9b1);
  transform: scaleX(0);
  transform-origin: left center;
}

.p-recruit__flow::after {
  left: calc(12.5% + 4px);
  right: calc(12.5% + 4px);
}

.p-flow__list.is-play::after {
  transform: scaleX(1);
  transition: transform calc(var(--flow-step) * (var(--fn, 5) - 1) + .2s) cubic-bezier(.45, 0, .55, 1) .2s;
}

.p-flow__num {
  transition: background-color .4s, color .4s, transform .5s cubic-bezier(.34, 1.56, .64, 1), box-shadow .4s;
}

/* 待機中は隠しておく（JSで .is-wait が付いたときだけ） */
.p-flow__list.is-wait .p-flow__num {
  opacity: 0;
  transform: scale(.4);
}

.p-flow__list.is-wait .p-flow__text {
  opacity: 0;
  transform: translateY(12px);
}

.p-flow__list.is-wait.is-play .p-flow__num {
  animation: flowPop .7s cubic-bezier(.34, 1.56, .64, 1) calc(.2s + var(--fi) * var(--flow-step)) forwards;
}

.p-flow__list.is-wait.is-play .p-flow__text {
  animation: flowText .8s cubic-bezier(.22, .8, .25, 1) calc(.45s + var(--fi) * var(--flow-step)) forwards;
}

/* 丸から広がる波紋 */
.p-flow__num::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  border: 2px solid #20ad92;
  opacity: 0;
  pointer-events: none;
}

.p-flow__list.is-wait.is-play .p-flow__num::after {
  animation: flowRipple 1s ease-out calc(.3s + var(--fi) * var(--flow-step));
}

@keyframes flowPop {
  0%   { opacity: 0; transform: scale(.4); background: #20ad92; color: #fff; }
  60%  { opacity: 1; background: #20ad92; color: #fff; }
  100% { opacity: 1; transform: scale(1); background: #fff; color: #20ad92; }
}

@keyframes flowText {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}

@keyframes flowRipple {
  0%   { opacity: .8; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.7); }
}

/* ホバー：丸が緑に塗られて少し大きく */
.p-flow__list:not(.is-wait) .p-flow__step:hover .p-flow__num {
  background: #20ad92;
  color: #fff;
  box-shadow: 0 10px 24px -10px rgba(32, 173, 146, .7);
}

.p-flow__list:not(.is-wait) .p-flow__step:hover .p-flow__text {
  color: #20ad92;
}

.p-flow__text {
  transition: color .3s;
}


/* スマホ（縦並び）：線は上から下へ伸びる */
@media (max-width: 900px) {
  .p-flow__list::after {
    top: 32px;
    bottom: 32px;
    left: 32px;
    right: auto;
    width: 2px;
    height: auto;
    margin: 0 0 0 -.5px;
    background: linear-gradient(180deg, #20ad92, #58c9b1);
    transform: scaleY(0);
    transform-origin: center top;
  }

  .p-flow__list.is-play::after {
    transform: scaleY(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .p-flow__list::after {
    transform: none;
  }
}

/* お問い合わせ：「Contact」とマークを大きくしてバランスを取る */
.p-top-contact .c-contact__inner > .c-en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(44px, 6vw, 84px);
  line-height: 1;
  letter-spacing: .02em;
  color: #20ad92;
}

.c-contact__title::before {
  width: clamp(44px, 4vw, 60px);
  margin-bottom: 26px;
}

/* フッターのロゴ：メニューバーと同じ組み（緑のマーク＋EntReaL＋行政書士事務所） */
.l-footer__logo {
  height: 36px;
}

.l-footer__inner a[aria-label*="トップページ"] {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
}

.l-footer__logo-sub {
  padding-left: 32%;
  font-family: "Shippori Mincho", serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .42em;
  white-space: nowrap;
  color: rgba(255, 255, 255, .92);
}

.l-footer__logo + .l-footer__office,
a[aria-label*="トップページ"] + .l-footer__office {
  margin-top: 16px;
}

/* ==========================================================================
   本文の文字を全体的にしっかりさせる（細いグレーのゴシックで浮かないように）
   ※トップのメインビジュアルの説明文は濱田さんの希望で今のまま
   ========================================================================== */

.c-contact__text,
.p-top-contact__guide-lead,
.p-top-contact__guide-list li,
.c-title-lead,
.p-svc__lead,
.p-svc__card-text,
.p-approach__text,
.p-partner__card-text,
.p-message__body p,
.p-faq__answer,
.p-recruit__list li,
.p-office__list dd {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 500;
  letter-spacing: .04em;
  color: #1f2b2d;
}

.c-contact__text,
.c-title-lead,
.p-svc__lead,
.p-svc__card-text,
.p-approach__text,
.p-partner__card-text,
.p-faq__answer {
  font-size: clamp(14.5px, 1.2vw, 16px);
}

.p-top-contact__guide-lead {
  font-weight: 700;
  color: #0d191b;
}

.p-top-contact__guide-list li {
  font-size: 15px;
}

/* 濃色の帯の上の本文は、明るい白で */
.p-plan__lead,
.p-plan__card-text,
.p-philosophy__text,
.p-recruit__list--light li {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 500;
  letter-spacing: .04em;
  color: rgba(255, 255, 255, .92);
}

.p-plan__lead,
.p-philosophy__text {
  font-size: clamp(14.5px, 1.2vw, 16px);
}

/* ==========================================================================
   トップのサービスカード：並びにリズムをつける
   ・01は横長のメインカード（写真左・本文右）
   ・02/03、04/05は右のカードを少し下げて段差をつける
   ・グラフはイラストなので、写真と同じ枠で全体が見えるように
   ========================================================================== */

@media (min-width: 901px) {
  .p-service__cards--main,
  .p-service__cards--sub {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: clamp(24px, 3vw, 40px);
  }

  .p-service__cards--main > .p-service__card:first-child {
    grid-column: 1 / -1;
    flex-direction: row;
  }

  .p-service__cards--main > .p-service__card:first-child .p-service__card-img {
    width: 52%;
    height: auto;
    min-height: 340px;
  }

  .p-service__cards--main > .p-service__card:first-child .p-service__card-body {
    flex: 1;
    justify-content: center;
  }

  /* 段差 */
  .p-service__cards--main > .p-service__card:nth-child(3),
  .p-service__cards--sub > .p-service__card:nth-child(2) {
    margin-top: clamp(40px, 5vw, 72px);
  }

  /* 写真の高さに変化を */
  .p-service__cards--main > .p-service__card:nth-child(2) .p-service__card-img,
  .p-service__cards--sub > .p-service__card:nth-child(1) .p-service__card-img {
    height: clamp(220px, 20vw, 280px);
  }

  .p-service__cards--sub {
    margin-bottom: clamp(40px, 5vw, 72px);
  }
}

/* SVGのグラフは切り取らず全体を見せる */
.p-service__card-img img[src$=".svg"] {
  object-fit: cover;
  object-position: center;
}

/* 資金調達のグラフは上のラベルが切れないように少し上寄せ */
.p-service__card-img img[src$="svc-chart-finance.svg"] {
  object-position: center 18%;
}

/* ==========================================================================
   下層ページの最初の画面（About・Service・Recruit）
   ・英字はトップのAboutと同じ、大きく透ける斜体
   ・説明文は明朝で明るく
   ・サービスページの5つのボタンは小さめにして左側にまとめる（写真に重ならない）
   ========================================================================== */

.p-subhero__inner > .c-en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(60px, 9vw, 130px);
  line-height: .82;
  letter-spacing: -.01em;
  color: rgba(255, 255, 255, .1);
}

.p-subhero__inner > .c-en + .p-subhero__title {
  position: relative;
  margin-top: clamp(6px, 1vw, 16px);
}

.p-subhero__lead {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-size: clamp(14.5px, 1.2vw, 16px);
  font-weight: 500;
  letter-spacing: .05em;
  color: rgba(255, 255, 255, .92);
}

.p-subhero__links {
  max-width: min(560px, 50%);
  gap: 8px;
}

.p-subhero__links a {
  gap: 8px;
  padding: 8px 15px;
  font-size: 12px;
  letter-spacing: .04em;
  background: rgba(13, 25, 27, .55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

@media (max-width: 900px) {
  .p-subhero__links {
    max-width: none;
  }
}

/* 下層ページの大見出しもトップと同じ明朝に */
.p-subhero__title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 600;
  letter-spacing: .08em;
}

/* ==========================================================================
   スポット料金表（サービスページ）
   ・01〜05のタブで切り替え、カード内は「業務名……料金」のメニュー表風
   ========================================================================== */

.p-price {
  background: linear-gradient(180deg, #fff 0%, #f6f4ef 100%);
  scroll-margin-top: 80px;
}

.p-price__en {
  font-size: clamp(42px, 7vw, 94px);
}

.p-price__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: clamp(32px, 4vw, 48px);
}

.p-price__tab {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  padding: 13px 22px;
  border: 1px solid rgba(13, 25, 27, .18);
  border-radius: 999px;
  background: #fff;
  font-family: "Shippori Mincho", serif;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .06em;
  color: #0d191b;
  cursor: pointer;
  transition: background-color .35s, color .35s, border-color .35s, box-shadow .35s;
}

.p-price__tab span {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 20px;
  color: #20ad92;
  transition: color .35s;
}

.p-price__tab:hover {
  border-color: #20ad92;
  color: #20ad92;
}

.p-price__tab[aria-selected="true"] {
  border-color: #0d191b;
  background: #0d191b;
  color: #fff;
  box-shadow: 0 14px 28px -18px rgba(13, 25, 27, .7);
}

.p-price__tab[aria-selected="true"] span {
  color: #7fd1bd;
}

.p-price__panels {
  margin-top: clamp(28px, 3.4vw, 40px);
}

/* JSなしでは全部表示。JSで切り替えるときは選択中だけ */
.p-price.is-tabbed .p-price__panel {
  display: none;
}

.p-price.is-tabbed .p-price__panel.is-active {
  display: block;
  animation: priceIn .6s cubic-bezier(.22, .8, .25, 1);
}

.p-price.is-tabbed .p-price__panel-head {
  display: none;
}

.p-price__panel + .p-price__panel {
  margin-top: 48px;
}

.p-price__panel-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 18px;
  font-family: "Shippori Mincho", serif;
  font-size: 20px;
  font-weight: 600;
}

.p-price__panel-head span {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 30px;
  color: #20ad92;
}

@keyframes priceIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

.p-price__cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.2vw, 28px);
  align-items: start;
}

.p-price__card {
  position: relative;
  padding: clamp(26px, 3vw, 38px) clamp(22px, 2.8vw, 36px) clamp(18px, 2vw, 26px);
  background: #fff;
  border: 1px solid rgba(13, 25, 27, .06);
  box-shadow: 0 30px 60px -44px rgba(13, 25, 27, .5);
}

.p-price__card::before {
  content: "";
  position: absolute;
  top: -1px;
  left: clamp(22px, 2.8vw, 36px);
  width: 44px;
  height: 2px;
  background: #20ad92;
}

.p-price__card-title {
  font-family: "Shippori Mincho", serif;
  font-size: clamp(17px, 1.5vw, 20px);
  font-weight: 700;
  letter-spacing: .06em;
  color: #0d191b;
}

.p-price__card-sub {
  margin-top: 6px;
  font-family: "Shippori Mincho", serif;
  font-size: 13px;
  letter-spacing: .04em;
  color: #6b6555;
}

.p-price__list {
  margin-top: 14px;
}

.p-price__list li {
  display: grid;
  grid-template-columns: auto minmax(14px, 1fr) auto;
  align-items: baseline;
  gap: 10px;
  padding: 10px 6px;
  border-radius: 4px;
  transition: background-color .3s;
}

.p-price__list li + li {
  border-top: 1px solid rgba(13, 25, 27, .05);
}

.p-price__list li:hover {
  background: #f0f8f5;
}

.p-price__item {
  font-family: "Shippori Mincho", serif;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .03em;
  color: #1f2b2d;
}

.p-price__dots {
  align-self: center;
  height: 1px;
  background-image: radial-gradient(circle, rgba(13, 25, 27, .3) 1px, transparent 1.2px);
  background-size: 6px 2px;
  background-repeat: repeat-x;
}

.p-price__val {
  white-space: nowrap;
  text-align: right;
}

.p-price__num {
  font-family: Jost, sans-serif;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: .02em;
  color: #0d191b;
}

.p-price__unit {
  margin-left: 2px;
  font-size: 12px;
  color: #56635f;
}

.p-price__text {
  font-family: "Shippori Mincho", serif;
  font-size: 13.5px;
  font-weight: 600;
  color: #20ad92;
}

.p-price__notes {
  margin-top: clamp(28px, 3vw, 40px);
  font-family: "Shippori Mincho", serif;
  font-size: 13px;
  line-height: 2;
  color: #56635f;
}

.p-price__btn {
  margin-top: clamp(32px, 4vw, 48px);
  text-align: center;
}

/* 料金案内（紺の帯）の「スポット料金表を見る」 */
.p-plan__spot-more {
  margin-top: 22px;
}

.c-btn-outline--light {
  border-color: rgba(255, 255, 255, .5);
  color: #fff;
}

.c-btn-outline--light:hover {
  color: #fff;
}

@media (max-width: 900px) {
  .p-price__cards {
    grid-template-columns: minmax(0, 1fr);
  }

  .p-price__tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-right: -20px;
    padding-bottom: 6px;
    scrollbar-width: none;
  }

  .p-price__tab {
    flex: none;
    padding: 11px 18px;
    font-size: 14px;
  }
}

@media (max-width: 600px) {
  .p-price__list li {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  .p-price__dots {
    display: none;
  }

  .p-price__item {
    font-size: 13.5px;
  }
}

/* ==========================================================================
   よくあるご質問：アコーディオン（質問を押すと答えがなめらかに開く）
   ========================================================================== */

.p-faq__item {
  display: block;
  padding: 0;
}

.p-faq__question {
  margin: 0;
}

.p-faq__btn {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(14px, 2vw, 26px);
  width: 100%;
  padding: clamp(22px, 2.6vw, 30px) clamp(8px, 1vw, 14px);
  border: 0;
  background: none;
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transition: background-color .35s;
}

.p-faq__btn:hover {
  background: #f3f8f6;
}

.p-faq__btn .p-faq__q {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #20ad92;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 22px;
  font-weight: 600;
  line-height: 1;
  color: #fff;
  transition: transform .5s cubic-bezier(.34, 1.56, .64, 1);
}

.p-faq__btn:hover .p-faq__q {
  transform: rotate(-8deg) scale(1.06);
}

.p-faq__qtext {
  font-family: "Shippori Mincho", serif;
  font-size: clamp(16px, 1.5vw, 19px);
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .05em;
  color: #0d191b;
  transition: color .3s;
}

.p-faq__qtext span {
  display: inline-block;
}

.p-faq__btn:hover .p-faq__qtext {
  color: #20ad92;
}

/* ＋ アイコン（開くと − に） */
.p-faq__icon {
  position: relative;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(13, 25, 27, .25);
  border-radius: 50%;
  transition: background-color .35s, border-color .35s, transform .5s cubic-bezier(.165, .84, .44, 1);
}

.p-faq__icon::before,
.p-faq__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 1.5px;
  margin: -.75px 0 0 -6px;
  background: #0d191b;
  transition: transform .45s cubic-bezier(.165, .84, .44, 1), background-color .35s;
}

.p-faq__icon::after {
  transform: rotate(90deg);
}

.p-faq__btn[aria-expanded="true"] .p-faq__icon {
  background: #0d191b;
  border-color: #0d191b;
  transform: rotate(180deg);
}

.p-faq__btn[aria-expanded="true"] .p-faq__icon::before,
.p-faq__btn[aria-expanded="true"] .p-faq__icon::after {
  background: #fff;
}

.p-faq__btn[aria-expanded="true"] .p-faq__icon::after {
  transform: rotate(0deg);
}

/* 答え：高さをなめらかに開閉 */
.p-faq__panel {
  display: grid;
  grid-template-rows: 1fr;
  transition: grid-template-rows .55s cubic-bezier(.22, .8, .25, 1);
}

.p-faq__panel-inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(14px, 2vw, 26px);
  min-height: 0;
  overflow: hidden;
  padding: 0 clamp(8px, 1vw, 14px) clamp(26px, 3vw, 34px);
  transition: opacity .45s, transform .55s cubic-bezier(.22, .8, .25, 1), padding .55s;
}

.p-faq__a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #20ad92;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 22px;
  font-weight: 600;
  color: #20ad92;
}

.p-faq__panel .p-faq__answer {
  margin-top: 8px;
}

.p-faq.is-accordion .p-faq__panel.is-closed {
  grid-template-rows: 0fr;
}

.p-faq.is-accordion .p-faq__panel.is-closed .p-faq__panel-inner {
  opacity: 0;
  transform: translateY(-8px);
  padding-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
  .p-faq__panel,
  .p-faq__panel-inner,
  .p-faq__icon,
  .p-faq__icon::before,
  .p-faq__icon::after {
    transition: none;
  }
}

/* 並んだカードは大きさをそろえる（段差・写真の高さ違いをやめる） */
@media (min-width: 901px) {
  .p-service__cards--main,
  .p-service__cards--sub {
    align-items: stretch;
  }

  .p-service__cards--main > .p-service__card:nth-child(3),
  .p-service__cards--sub > .p-service__card:nth-child(2) {
    margin-top: 0;
  }

  .p-service__cards--main > .p-service__card:not(:first-child) .p-service__card-img,
  .p-service__cards--sub > .p-service__card .p-service__card-img {
    height: clamp(220px, 19vw, 260px);
  }

  .p-service__cards--sub {
    margin-bottom: 0;
  }
}

/* ==========================================================================
   当所について：実績の数字（リールが回って確定 → 「全国」がポップ）
   ========================================================================== */

.p-record__num .c-count {
  display: inline-flex;
  margin: 0;
  font-family: Jost, sans-serif;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}

.c-reel {
  display: inline-block;
  height: 1.1em;
  overflow: hidden;
  line-height: 1.1;
}

.c-reel-strip {
  display: flex;
  flex-direction: column;
  transition: transform var(--reel-dur, 1s) cubic-bezier(.16, .84, .3, 1) var(--reel-delay, 0s);
}

.c-reel-strip > span {
  display: block;
  height: 1.1em;
}

.p-record__num .c-count span {
  margin: 0;
  font-size: inherit;
  font-family: inherit;
}

.p-record__unit {
  margin-left: 6px;
}

/* 全国オンライン対応可能 */
.p-record__num--text .c-pop {
  display: inline-block;
  margin: 0;
  font-family: "Shippori Mincho", serif;
  font-size: 1.35em;
  font-weight: 700;
  color: #20ad92;
  transform-origin: 50% 70%;
}

.p-record__num--text .c-pop-unit {
  display: inline-block;
  margin-left: 4px;
  font-family: "Shippori Mincho", serif;
  font-size: 1em;
  font-weight: 700;
  color: #0d191b;
}

html.js-anim .p-record__num--text.is-wait .c-pop,
html.js-anim .p-record__num--text.is-wait .c-pop-unit {
  opacity: 0;
}

html.js-anim .p-record__num--text.is-pop .c-pop {
  animation: statPop .6s cubic-bezier(.34, 1.56, .64, 1) forwards;
}

html.js-anim .p-record__num--text.is-pop .c-pop-unit {
  animation: statUnit .4s ease .3s forwards;
}

.p-record__label {
  font-family: "Shippori Mincho", serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
}

/* カード：ホバーで少し浮き、上辺に緑のライン */
.p-record__stat {
  position: relative;
  overflow: hidden;
  transition: transform .5s cubic-bezier(.165, .84, .44, 1), box-shadow .5s cubic-bezier(.165, .84, .44, 1);
}

.p-record__stat::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: #20ad92;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .6s cubic-bezier(.165, .84, .44, 1);
}

.p-record__stat:hover {
  transform: translateY(-6px);
  box-shadow: 0 2px 4px rgba(13, 25, 27, .06), 0 44px 80px -44px rgba(13, 25, 27, .55);
}

.p-record__stat:hover::after {
  transform: scaleX(1);
}

/* 実績まわりの文字をしっかり */
.p-record__unit {
  font-family: "Shippori Mincho", serif;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #0d191b;
}

.p-record__label {
  font-size: 14px;
  font-weight: 700;
  color: #178f78;
}

.p-record__types-title {
  font-family: "Shippori Mincho", serif;
  font-size: 15px;
  letter-spacing: .06em;
}

.p-record__types-list li {
  font-family: "Shippori Mincho", serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .03em;
  color: #1f2b2d;
}

/* ==========================================================================
   代表メッセージ：イラストの代表写真＋本文の2カラム
   ========================================================================== */

.p-message__grid {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  gap: clamp(36px, 6vw, 96px);
  align-items: start;
  margin-top: clamp(36px, 4.6vw, 64px);
}

.p-message__grid .p-message__body {
  margin-top: 0;
  max-width: none;
}

.p-message__figure {
  position: sticky;
  top: 110px;
  margin: 0;
}

.p-message__photo {
  position: relative;
  isolation: isolate;
  aspect-ratio: 800 / 1040;
}

.p-message__photo img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 30px 60px -36px rgba(13, 25, 27, .45);
}

/* うしろの色ブロック＋線の枠（トップの写真と同じ組み） */
.p-message__photo::before,
.p-message__photo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.p-message__photo::before {
  z-index: -1;
  background: #e6dfcc;
  transform: translate(clamp(18px, 2.4vw, 32px), clamp(18px, 2.4vw, 32px));
}

.p-message__photo::after {
  z-index: 2;
  border: 1px solid rgba(13, 25, 27, .28);
  transform: translate(calc(-1 * clamp(12px, 1.4vw, 18px)), calc(-1 * clamp(12px, 1.4vw, 18px)));
}

.p-message__caption {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: clamp(30px, 3.4vw, 44px);
}

.p-message__caption-en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 18px;
  letter-spacing: .06em;
  color: #20ad92;
}

.p-message__caption-name {
  font-family: "Shippori Mincho", serif;
  font-size: clamp(17px, 1.5vw, 20px);
  font-weight: 700;
  letter-spacing: .12em;
  color: #0d191b;
}

@media (max-width: 900px) {
  .p-message__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .p-message__figure {
    position: static;
    width: min(320px, 78%);
    margin: 0 auto;
  }

  .p-message__caption {
    align-items: center;
    text-align: center;
  }
}

/* ==========================================================================
   当所について：文字を強く＆余白に装飾
   ========================================================================== */

/* 小さな緑のラベル（Track record｜サポート実績 など）を読みやすく */
.c-title-label {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .2em;
}

.p-approach__title,
.p-partner__card-title {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 700;
  letter-spacing: .05em;
  color: #0d191b;
}

.p-partner__card-en {
  font-weight: 600;
}

.p-partner__card-note,
.p-partner__caution {
  font-family: "Shippori Mincho", serif;
  font-weight: 500;
  color: #3a4643;
}

.p-office__list dt {
  font-family: "Shippori Mincho", serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #0d191b;
}

.p-office__list dd {
  font-size: 15px;
}

.p-philosophy__catch {
  font-size: clamp(16px, 1.8vw, 20px);
  font-weight: 600;
  line-height: 2;
  color: #fff;
}

/* --- 写真のうしろに色ブロック＋線の枠（実績・連携体制の写真） --- */
.p-head__img {
  isolation: isolate;
  overflow: visible;
}

.p-head__img::before,
.p-head__img::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.p-head__img::before {
  z-index: -1;
  background: #dfeee9;
  transform: translate(clamp(18px, 2.4vw, 34px), clamp(18px, 2.4vw, 34px));
}

.p-head__img::after {
  z-index: 2;
  border: 1px solid rgba(13, 25, 27, .26);
  transform: translate(calc(-1 * clamp(12px, 1.4vw, 18px)), calc(-1 * clamp(12px, 1.4vw, 18px)));
}

.p-partner .p-head__img::before {
  background: #e6dfcc;
}

/* --- ロゴマークの透かし・ひし形の線で余白を埋める --- */
.p-record,
.p-approach,
.p-partner,
.p-office,
.p-philosophy {
  position: relative;
  overflow: hidden;
}

.p-office::before,
.p-approach::before,
.p-philosophy::before,
.p-partner::before {
  content: "";
  position: absolute;
  z-index: 0;
  aspect-ratio: 183 / 160;
  background: var(--mark-green) center / contain no-repeat;
  pointer-events: none;
}

.p-office::before {
  top: 12%;
  right: -6vw;
  width: min(38vw, 520px);
  opacity: .06;
}

.p-approach::before {
  bottom: -10%;
  left: -6vw;
  width: min(40vw, 540px);
  background-image: var(--mark-sand);
  opacity: .14;
}

.p-philosophy::before {
  top: 50%;
  right: -4vw;
  width: min(34vw, 460px);
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 183 160'%3E%3Cg fill='%23ffffff'%3E%3Crect width='183' height='23'/%3E%3Crect x='137' width='23' height='160'/%3E%3Crect x='92' y='53' width='22' height='107'/%3E%3Crect y='53' width='69' height='23'/%3E%3Crect y='137' width='69' height='23'/%3E%3C/g%3E%3C/svg%3E");
  opacity: .05;
}

.p-partner::before {
  bottom: 4%;
  right: -5vw;
  width: min(30vw, 400px);
  opacity: .05;
}

.p-office::after,
.p-record::after,
.p-approach::after {
  content: "";
  position: absolute;
  z-index: 0;
  border: 1px solid rgba(32, 173, 146, .22);
  transform: rotate(45deg);
  pointer-events: none;
}

.p-office::after {
  top: 22%;
  left: -110px;
  width: 300px;
  height: 300px;
  border-color: rgba(185, 171, 140, .45);
}

.p-record::after {
  bottom: 12%;
  right: -120px;
  width: 340px;
  height: 340px;
}

.p-approach::after {
  top: 10%;
  right: -80px;
  width: 220px;
  height: 220px;
}

.p-record .l-container,
.p-approach .l-container,
.p-partner .l-container,
.p-office__inner,
.p-philosophy__inner {
  position: relative;
  z-index: 1;
}

/* 事務所概要の表は白いカードに載せて、横の余白とのメリハリを */
.p-office__list {
  position: relative;
  padding: clamp(18px, 2.4vw, 30px) clamp(22px, 3vw, 44px);
  background: #fff;
  box-shadow: 0 30px 60px -44px rgba(13, 25, 27, .45);
}

@media (max-width: 760px) {
  .p-office::before,
  .p-partner::before {
    opacity: .035;
  }
}

/* ==========================================================================
   代表メッセージ：写真＋「Our promise」カード（代表の顔写真は使わない）
   ========================================================================== */
.p-message__photo {
  aspect-ratio: 646 / 840;
}

.p-message__promise {
  position: absolute;
  z-index: 3;
  left: calc(-1 * clamp(14px, 2vw, 28px));
  right: clamp(28px, 4vw, 56px);
  bottom: clamp(24px, 3vw, 40px);
  padding: clamp(20px, 2.2vw, 30px) clamp(22px, 2.4vw, 32px);
  background: rgba(13, 25, 27, .86);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: #fff;
  box-shadow: 0 24px 50px -24px rgba(13, 25, 27, .6);
}

.p-message__promise::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 46px;
  height: 3px;
  background: #20ad92;
}

.p-message__promise-en {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: clamp(20px, 1.8vw, 24px);
  letter-spacing: .04em;
  color: #7fd1bd;
}

.p-message__promise-list {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.p-message__promise-list li {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 9px 0;
  font-family: "Shippori Mincho", serif;
  font-size: clamp(16px, 1.45vw, 19px);
  font-weight: 700;
  letter-spacing: .1em;
  border-top: 1px solid rgba(255, 255, 255, .14);
}

.p-message__promise-list li span {
  font-family: "Jost", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .14em;
  color: #7fd1bd;
}

@media (max-width: 900px) {
  .p-message__promise {
    left: -12px;
    right: 18px;
  }
}

/* ==========================================================================
   プライバシーポリシー
   ========================================================================== */
.p-policy__inner {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 4px;
}

.p-policy__item + .p-policy__item {
  margin-top: clamp(36px, 4vw, 52px);
}

.p-policy__heading {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(13, 25, 27, .14);
  font-family: "Shippori Mincho", serif;
  font-size: clamp(18px, 1.8vw, 22px);
  font-weight: 700;
  letter-spacing: .06em;
  color: #0d191b;
}

.p-policy__num {
  font-family: "Jost", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .12em;
  color: #20ad92;
}

.p-policy__text {
  margin-top: 18px;
  font-family: "Shippori Mincho", serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 2.1;
  color: #1f2b2d;
}

.p-policy__text p + p,
.p-policy__text ul + p {
  margin-top: 12px;
}

.p-policy__text ul {
  margin: 12px 0 0;
  padding-left: 1.4em;
  list-style: disc;
}

.p-policy__text a {
  color: #1a8f78;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.p-policy__date {
  margin-top: clamp(48px, 5vw, 64px);
  font-family: "Shippori Mincho", serif;
  font-size: 14px;
  line-height: 2;
  text-align: right;
  color: #56635f;
}

.l-footer__legal {
  margin-top: 14px;
  font-size: 12px;
  letter-spacing: .06em;
}

.l-footer__legal a {
  color: rgba(255, 255, 255, .72);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .3s;
}

.l-footer__legal a:hover {
  color: #7fd1bd;
}

/* ==========================================================================
   404（ページが見つかりません）
   ========================================================================== */
.p-404 {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding: calc(clamp(56px, 8vw, 110px) + 76px) 28px clamp(72px, 9vw, 120px);
  background: #0d191b;
  color: #fff;
  overflow: hidden;
}

.p-404__inner {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.p-404__code {
  position: absolute;
  top: 50%;
  right: -1vw;
  transform: translateY(-58%);
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(160px, 28vw, 420px);
  line-height: 1;
  letter-spacing: -.02em;
  color: rgba(127, 209, 189, .1);
  pointer-events: none;
  user-select: none;
}

.p-404__title {
  position: relative;
  margin-top: clamp(20px, 2.6vw, 30px);
  font-family: "Shippori Mincho", serif;
  font-size: clamp(26px, 3.6vw, 44px);
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .03em;
}

.p-404__lead {
  position: relative;
  max-width: 34em;
  margin-top: clamp(22px, 2.8vw, 32px);
  font-family: "Shippori Mincho", serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 2.1;
  color: rgba(255, 255, 255, .86);
}

.p-404__btns {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 20px;
  margin-top: clamp(32px, 4vw, 48px);
}

.p-404 .p-404__btn-top {
  color: #fff;
  border-color: rgba(255, 255, 255, .5);
}

.p-404__links {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  margin-top: clamp(36px, 4.6vw, 56px);
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  max-width: 640px;
}

.p-404__links a {
  font-size: 14px;
  letter-spacing: .08em;
  color: rgba(255, 255, 255, .78);
  transition: color .3s;
}

.p-404__links a::before {
  content: "—";
  margin-right: 8px;
  color: #20ad92;
}

.p-404__links a:hover {
  color: #7fd1bd;
}