/* ===== ブランド変数：JTI風の余白・透明感・グリーン基調 ===== */
:root{
  --bg:#fbefb; /* 明るい白緑 */
  --paper:#ffffff;
  --main:#12a96f; /* 添付ロゴ寄せ：明るいグリーン */
  --main-dark:#087a59; /* 暗くなりすぎない深緑 */
  --main-soft:#e9f8ef;
  --accent:#8fd66a; /* 黄みのあるライム寄り */
  --accent-2:#caecc2;
  --sub:#f2fbf1;
  --line:#d9efdf;
  --text:#16392f;
  --text-sub:#567166;
  --white:#ffffff;
  --radius:18px;
  --radius-lg:26px;
  --shadow:0 18px 50px rgba(18,169,111,.13);
  --maxw:1120px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.95;
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,p,dl,dd{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}

.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:28px;}

/* ===== ボタン ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.65em;
  padding:13px 26px;border-radius:999px;font-weight:700;font-size:.95rem;
  transition:transform .18s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  white-space:nowrap;line-height:1.4;
}
.btn--lg{padding:16px 34px;font-size:1rem;}
.btn--primary{background:linear-gradient(135deg,#62c56f 0%,#12a96f 52%,#8fd66a 100%);color:var(--white);box-shadow:0 12px 28px rgba(18,169,111,.24);}
.btn--primary:hover{background:linear-gradient(135deg,#52bc68 0%,#0b9864 58%,#7ccb5c 100%);transform:translateY(-2px);}
.btn--ghost{background:var(--white);color:var(--main);border:1px solid var(--line);}
.btn--ghost:hover{background:var(--main-soft);border-color:var(--accent-2);}
.btn--outline{background:transparent;color:var(--white);border:1px solid rgba(255,255,255,.65);}
.btn--outline:hover{background:rgba(255,255,255,.13);}
.btn::after{content:"→";display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;font-size:.78rem;line-height:1;transition:transform .2s ease;}
.btn--primary::after{background:var(--white);color:var(--main);}
.btn--ghost::after{background:var(--main-soft);color:var(--main);}
.btn--outline::after{background:rgba(255,255,255,.22);color:var(--white);}
.btn:hover::after{transform:translateX(3px);}

/* ===== ヘッダー ===== */
.header{position:sticky;top:0;z-index:50;background:rgba(251,254,251,.84);backdrop-filter:blur(16px);border-bottom:1px solid rgba(0,122,77,.09);transition:background .3s ease, box-shadow .3s ease;}
.header.is-scrolled{background:rgba(251,254,251,.97);box-shadow:0 8px 28px rgba(18,169,111,.09);}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:70px;}
.logo{display:flex;align-items:center;gap:12px;font-weight:700;min-width:0;}
.logo__mark{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,#6cc56f 0%,#12a96f 55%,#8fd66a 100%);color:var(--white);font-size:.8rem;letter-spacing:.06em;box-shadow:0 10px 22px rgba(18,169,111,.22);}
.logo__text{font-size:.94rem;white-space:nowrap;}
.nav{display:flex;align-items:center;gap:24px;}
.nav a{font-size:.86rem;font-weight:700;color:var(--text-sub);transition:color .2s;}
.nav a:hover{color:var(--main);}
.nav__cta{background:linear-gradient(135deg,#62c56f 0%,#12a96f 58%,#8fd66a 100%);color:var(--white)!important;padding:8px 18px;border-radius:999px;}
.nav__toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
.nav__toggle span{display:block;width:24px;height:2px;background:var(--main);transition:.3s;}

/* ===== ヒーロー：写真カード＋大きな余白 ===== */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#fbfffb 0%,#f3fbf2 100%);padding:54px 0 88px;}
.hero::before{content:"";position:absolute;inset:auto -10% 26px -10%;height:170px;background:var(--white);transform:rotate(-3deg);transform-origin:center;z-index:0;}
.hero::after{content:"";position:absolute;right:-120px;top:70px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(143,214,106,.24),rgba(18,169,111,.06) 55%,transparent 72%);pointer-events:none;}
.hero__curve{position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:.85;pointer-events:none;}
.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:.88fr 1.12fr;gap:54px;align-items:center;}
.hero__body{padding-top:10px;}
.hero__lead{display:inline-flex;align-items:center;gap:10px;color:var(--main);font-weight:700;font-size:.86rem;letter-spacing:.08em;margin-bottom:18px;}
.hero__lead::before{content:"";width:34px;height:1px;background:var(--accent);}
.hero__title{font-size:clamp(2rem,4vw,3.35rem);font-weight:700;line-height:1.35;letter-spacing:.03em;margin-bottom:24px;color:var(--text);}
.hero__text{color:var(--text-sub);font-size:1.02rem;margin-bottom:30px;}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:24px;}
.hero__points{display:flex;flex-wrap:wrap;gap:10px 18px;}
.hero__points li{position:relative;padding:7px 12px 7px 32px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.72);font-size:.84rem;color:var(--text-sub);}
.hero__points li::before{content:"✓";position:absolute;left:13px;color:var(--main);font-weight:700;}
.hero__visual{position:relative;min-height:455px;}
.hero__photo{position:absolute;overflow:hidden;background:var(--sub);box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.8);}
.hero__photo img{width:100%;height:100%;object-fit:cover;filter:saturate(1.08) contrast(1.01) brightness(1.04);}
.hero__photo--large{left:0;top:0;width:69%;height:305px;border-radius:28px;}
.hero__photo--small{right:0;top:34px;width:38%;height:245px;border-radius:18px;}
.hero__photo--thin{right:8%;bottom:0;width:58%;height:160px;border-radius:18px;}
.hero__bigword{position:absolute;left:14%;bottom:92px;color:var(--main);font-size:clamp(2.2rem,5vw,4.8rem);font-weight:500;letter-spacing:.14em;opacity:.78;line-height:1;}

/* ===== 帯 ===== */
.band{background:var(--white);padding:46px 0;text-align:left;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.band__text{max-width:820px;margin-inline:auto;color:var(--main-dark);font-size:1.16rem;font-weight:700;line-height:2.05;}

/* ===== セクション共通 ===== */
.section{padding:86px 0;background:var(--bg);}
.section--alt{background:var(--sub);}
.section__head{max-width:760px;margin:0 0 46px;}
.section__head{text-align:left;}
.section__eyebrow{display:block;color:var(--main);font-weight:700;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:9px;font-family:Georgia,serif;}
.section__eyebrow::before{content:none;}
.section__title{font-size:clamp(1.65rem,2.8vw,2.35rem);font-weight:700;line-height:1.45;letter-spacing:.04em;margin-bottom:12px;}
.section__desc{color:var(--text-sub);}

/* ===== カード ===== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.card{position:relative;display:flex;flex-direction:column;min-height:330px;background:var(--white);border-radius:var(--radius);padding:30px 26px 28px;box-shadow:none;border:1px solid var(--line);overflow:hidden;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:7px;background:linear-gradient(90deg,#12a96f 0%,#62c56f 55%,#8fd66a 100%);}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--accent-2);}
.card__ico{display:grid;place-items:center;width:54px;height:54px;background:var(--main-soft);border-radius:16px;font-size:1.55rem;margin-bottom:20px;}
.card__title{font-size:1.22rem;font-weight:700;margin-bottom:12px;color:var(--main-dark);}
.card__text{color:var(--text-sub);font-size:.94rem;line-height:1.9;}
.card__more{display:inline-flex;align-items:center;gap:.35em;margin-top:auto;padding-top:22px;color:var(--main);font-weight:700;font-size:.9rem;}
.card:hover .card__more{gap:.7em;}

/* ===== 選ばれる理由 ===== */
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.reason{position:relative;background:var(--white);border-radius:16px;padding:28px 24px;border:1px solid var(--line);transition:background .25s ease, color .25s ease, transform .2s ease;}
.reason:hover{background:var(--main);transform:translateY(-5px);}
.reason__num{display:block;color:var(--accent);font-weight:700;font-size:.82rem;letter-spacing:.16em;margin-bottom:14px;}
.reason__title{font-size:1.12rem;font-weight:700;margin-bottom:10px;color:var(--main-dark);}
.reason__text{color:var(--text-sub);font-size:.92rem;line-height:1.85;}
.reason:hover .reason__num,.reason:hover .reason__title{color:var(--white);}
.reason:hover .reason__text{color:rgba(255,255,255,.92);}

/* ===== 流れ ===== */
.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:step;}
.flow__step{position:relative;background:var(--white);border-radius:var(--radius);padding:34px 26px 30px;border:1px solid var(--line);}
.flow__step:not(:last-child)::after{content:"";position:absolute;right:-16px;top:50%;width:28px;height:1px;background:var(--accent-2);}
.flow__num{display:grid;place-items:center;width:46px;height:46px;margin:0 0 18px;background:linear-gradient(135deg,#62c56f 0%,#12a96f 58%,#8fd66a 100%);color:var(--white);border-radius:50%;font-size:1.15rem;font-weight:700;}
.flow__title{font-size:1.12rem;font-weight:700;margin-bottom:10px;}
.flow__text{color:var(--text-sub);font-size:.92rem;}

/* ===== 料金 ===== */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch;}
.plan{position:relative;display:flex;flex-direction:column;background:var(--white);border-radius:var(--radius-lg);padding:34px 28px;border:1px solid var(--line);box-shadow:none;}
.plan--featured{border:2px solid var(--main);box-shadow:var(--shadow);}
.plan__badge{position:absolute;top:18px;right:22px;background:linear-gradient(135deg,#62c56f 0%,#12a96f 58%,#8fd66a 100%);color:var(--white);font-size:.78rem;font-weight:700;padding:4px 14px;border-radius:999px;}
.plan__name{font-size:1.22rem;font-weight:700;color:var(--main-dark);margin-bottom:8px;padding-right:54px;}
.plan__for{color:var(--text-sub);font-size:.88rem;margin-bottom:18px;min-height:2.8em;}
.plan__price{font-size:1.42rem;font-weight:700;color:var(--main);padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line);}
.plan__from{font-size:.84rem;font-weight:500;color:var(--text-sub);margin-right:8px;}
.plan__list{display:flex;flex-direction:column;gap:9px;margin-bottom:26px;flex-grow:1;}
.plan__list li{position:relative;padding-left:24px;font-size:.92rem;color:var(--text-sub);}
.plan__list li::before{content:"✓";position:absolute;left:0;top:0;color:var(--main);font-weight:700;}
.plan__btn{width:100%;}
.plans__note{text-align:left;color:var(--text-sub);font-size:.88rem;margin-top:28px;}

/* ===== About ===== */
.about{display:grid;grid-template-columns:.92fr 1.08fr;gap:50px;align-items:start;}
.about__text{color:var(--text-sub);margin-bottom:18px;}
.about .section__title{text-align:left;margin-top:6px;}
.info{background:var(--white);border-radius:var(--radius-lg);padding:10px 28px;border:1px solid var(--line);}
.info__row{display:flex;gap:18px;padding:17px 0;border-bottom:1px solid var(--line);}
.info__row:last-child{border-bottom:none;}
.info__row dt{flex:0 0 92px;font-weight:700;color:var(--main-dark);font-size:.9rem;}
.info__row dd{color:var(--text-sub);font-size:.93rem;}
.office-gallery{position:relative;margin-top:52px;width:100%;aspect-ratio:16/6;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--sub);}
.office-gallery__slide{position:absolute;inset:0;margin:0;opacity:0;animation:officeFade 18s infinite;}
.office-gallery__slide img{width:100%;height:100%;object-fit:cover;display:block;}
.office-gallery__slide:nth-child(1){animation-delay:0s;}
.office-gallery__slide:nth-child(2){animation-delay:6s;}
.office-gallery__slide:nth-child(3){animation-delay:12s;}
@keyframes officeFade{0%{opacity:0;}4%{opacity:1;}30%{opacity:1;}36%{opacity:0;}100%{opacity:0;}}
.office-gallery__note{position:absolute;right:14px;bottom:12px;z-index:2;background:rgba(24,53,42,.55);color:#fff;font-size:.75rem;padding:5px 12px;border-radius:999px;}
@media (prefers-reduced-motion: reduce){.office-gallery__slide{animation:none;}.office-gallery__slide:nth-child(1){opacity:1;}}

/* ===== 代表挨拶 ===== */
.greeting{display:grid;grid-template-columns:280px 1fr;gap:48px;align-items:start;}
.greeting__person{text-align:center;background:var(--white);border-radius:var(--radius-lg);padding:34px 24px;border:1px solid var(--line);position:sticky;top:96px;}
.greeting__photo{display:grid;place-items:center;width:120px;height:120px;margin:0 auto 18px;border-radius:50%;background:var(--main-soft);color:var(--main);font-weight:700;font-size:1.1rem;border:1px solid var(--accent-2);}
.greeting__role{font-size:.84rem;color:var(--text-sub);margin-bottom:4px;}
.greeting__name{font-size:1.18rem;font-weight:700;color:var(--main-dark);}
.greeting__body .section__title{text-align:left;margin-bottom:22px;}
.greeting__text{color:var(--text-sub);margin-bottom:16px;}
.greeting__sign{margin-top:24px;font-weight:700;color:var(--main-dark);text-align:right;}

/* ===== CTA / Footer ===== */
.cta{background:linear-gradient(135deg,#62c56f 0%,#12a96f 52%,#8fd66a 100%);color:var(--white);padding:78px 0;text-align:center;}
.cta__title{font-size:1.86rem;font-weight:700;margin-bottom:18px;}
.cta__text{margin-bottom:32px;opacity:.95;}
.cta__actions{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;}
.cta__note{margin-top:22px;font-size:.88rem;opacity:.85;}
.footer{background:#eef5f0;color:var(--text-sub);padding:54px 0;border-top:1px solid var(--line);}
.footer__inner{display:grid;grid-template-columns:1fr 2fr;gap:28px;align-items:start;}
.footer__brand{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--main-dark);}
.footer__nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 20px;}
.footer__nav a{font-size:.86rem;color:var(--text-sub);transition:color .2s;}
.footer__nav a:hover{color:var(--main);}
.footer__copy{grid-column:1/-1;font-size:.78rem;opacity:.75;border-top:1px solid var(--line);padding-top:18px;}

.floating-cta{position:fixed;right:22px;bottom:22px;z-index:60;display:inline-flex;align-items:center;gap:.5em;background:linear-gradient(135deg,#62c56f 0%,#12a96f 58%,#8fd66a 100%);color:var(--white);font-weight:700;font-size:.92rem;padding:13px 22px;border-radius:999px;box-shadow:0 10px 30px rgba(0,122,77,.34);transition:transform .2s ease,background .2s ease;}
.floating-cta::before{content:"💬";font-size:1.05em;}
.floating-cta:hover{background:var(--main-dark);transform:translateY(-3px);}

/* ===== 下層ページ ===== */
.breadcrumb{padding:24px 0 0;font-size:.82rem;color:var(--text-sub);}
.breadcrumb a{color:var(--main);}
.breadcrumb a:hover{text-decoration:underline;}
.breadcrumb__sep{margin:0 8px;color:var(--accent);}
.article{max-width:820px;margin-inline:auto;padding:50px 0 88px;}
.article__eyebrow{display:block;color:var(--main);font-weight:700;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:10px;font-family:Georgia,serif;}
.article__eyebrow::before{content:none;}
.article__title{font-size:clamp(1.8rem,3vw,2.55rem);font-weight:700;line-height:1.45;margin-bottom:20px;letter-spacing:.04em;}
.article__lead{color:var(--text-sub);font-size:1.05rem;margin-bottom:8px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px 26px;}
.article h2{font-size:1.48rem;font-weight:700;color:var(--main-dark);line-height:1.5;margin:52px 0 16px;padding-left:16px;border-left:4px solid var(--main);}
.article h3{font-size:1.15rem;font-weight:700;color:var(--main-dark);margin:32px 0 12px;}
.article p{margin-bottom:18px;}
.article__list{display:flex;flex-direction:column;gap:10px;margin:0 0 18px;}
.article__list li{position:relative;padding:12px 16px 12px 42px;color:var(--text-sub);background:var(--white);border:1px solid var(--line);border-radius:14px;}
.article__list li::before{content:"✓";position:absolute;left:18px;top:12px;color:var(--main);font-weight:700;}
.placeholder{background:var(--main-soft);border:1px dashed var(--accent-2);border-radius:var(--radius);padding:18px 22px;margin:24px 0;color:var(--text-sub);font-size:.9rem;}
.placeholder strong{color:var(--main-dark);}

@media (max-width:980px){
  .nav{gap:18px;}.nav a{font-size:.82rem;}
  .hero__inner{grid-template-columns:1fr;gap:36px;}
  .hero__visual{min-height:390px;max-width:680px;width:100%;margin-inline:auto;}
  .cards,.reasons,.flow{grid-template-columns:repeat(2,1fr);}
  .plans{grid-template-columns:1fr;max-width:520px;}
  .plan__for{min-height:0;}
  .about{grid-template-columns:1fr;}
  .greeting{grid-template-columns:1fr;gap:32px;}
  .greeting__person{position:static;max-width:280px;margin-inline:auto;}
  .footer__inner{grid-template-columns:1fr;}
}

@media (max-width:900px){
  .nav{position:fixed;top:70px;left:0;right:0;flex-direction:column;gap:0;align-items:stretch;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(0,92,60,.1);max-height:0;overflow:hidden;transition:max-height .3s ease;}
  .nav.is-open{max-height:480px;}
  .nav a{width:100%;padding:15px 24px;border-top:1px solid var(--line);}
  .nav__cta{margin:14px 24px;text-align:center;}
  .nav__toggle{display:flex;}
  .nav__toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav__toggle.is-open span:nth-child(2){opacity:0;}
  .nav__toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}

@media (max-width:640px){
  .container{padding-inline:20px;}.logo__text{display:none;}
  .hero{padding:42px 0 62px;}.hero::before{height:120px;bottom:10px;}
  .hero__visual{min-height:300px;}.hero__photo--large{width:78%;height:205px;border-radius:22px;}.hero__photo--small{width:43%;height:155px;top:28px;}.hero__photo--thin{width:66%;height:115px;}.hero__bigword{bottom:68px;font-size:2.1rem;}
  .section{padding:58px 0;}.cards,.reasons,.flow{grid-template-columns:1fr;}.flow__step:not(:last-child)::after{display:none;}
  .btn{width:100%;}.hero__actions,.cta__actions{flex-direction:column;}.hero__points{flex-direction:column;align-items:flex-start;gap:8px;}
  .info__row{flex-direction:column;gap:4px;}.info__row dt{flex-basis:auto;}
  .office-gallery{aspect-ratio:16/10;}.footer__nav{grid-template-columns:1fr 1fr;}
  .floating-cta{right:14px;bottom:14px;padding:12px 18px;font-size:.84rem;}
}

/* ===== 仕上げアニメーション：静的サイトのまま上品に動かす ===== */
@keyframes softFadeUp{
  from{opacity:0;transform:translateY(24px);filter:blur(6px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}
@keyframes softFadeRight{
  from{opacity:0;transform:translateX(-22px);filter:blur(5px);}
  to{opacity:1;transform:translateX(0);filter:blur(0);}
}
@keyframes photoFloat{
  0%,100%{transform:translateY(0) scale(1);}
  50%{transform:translateY(-10px) scale(1.012);}
}
@keyframes photoZoom{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.045);}
}
@keyframes lineDraw{
  from{stroke-dashoffset:1800;}
  to{stroke-dashoffset:0;}
}
@keyframes pulseGlow{
  0%,100%{box-shadow:0 10px 26px rgba(0,122,77,.20);}
  50%{box-shadow:0 14px 34px rgba(0,122,77,.34);}
}
@keyframes arrowNudge{
  0%,100%{transform:translateX(0);}
  50%{transform:translateX(4px);}
}

/* 初回表示：ヒーローを作り込んだ印象に */
.hero__lead{animation:softFadeRight .75s ease both .08s;}
.hero__title{animation:softFadeUp .8s ease both .18s;}
.hero__text{animation:softFadeUp .8s ease both .30s;}
.hero__actions{animation:softFadeUp .8s ease both .42s;}
.hero__points{animation:softFadeUp .8s ease both .54s;}
.hero__bigword{animation:softFadeUp .9s ease both .38s;}
.hero__curve path{stroke-dasharray:1800;stroke-dashoffset:1800;animation:lineDraw 1.8s cubic-bezier(.22,1,.36,1) both .35s;}
.hero__photo{will-change:transform;}
.hero__photo--large{animation:softFadeUp .9s ease both .16s, photoFloat 8s ease-in-out infinite 1.2s;}
.hero__photo--small{animation:softFadeUp .9s ease both .34s, photoFloat 9s ease-in-out infinite 1.6s;}
.hero__photo--thin{animation:softFadeUp .9s ease both .52s, photoFloat 10s ease-in-out infinite 1.8s;}
.hero__photo img{animation:photoZoom 14s ease-in-out infinite;will-change:transform;}

/* スクロール表示 */
.js-enabled .js-reveal{opacity:0;transform:translateY(28px);filter:blur(6px);transition:opacity .75s ease,transform .75s ease,filter .75s ease;will-change:opacity,transform,filter;}
.js-enabled .js-reveal.is-visible{opacity:1;transform:translateY(0);filter:blur(0);}
.js-enabled .js-reveal[data-reveal="left"]{transform:translateX(-28px);}
.js-enabled .js-reveal[data-reveal="right"]{transform:translateX(28px);}
.js-enabled .js-reveal[data-reveal="left"].is-visible,
.js-enabled .js-reveal[data-reveal="right"].is-visible{transform:translateX(0);}
.js-enabled .js-reveal[data-reveal="scale"]{transform:translateY(18px) scale(.96);}
.js-enabled .js-reveal[data-reveal="scale"].is-visible{transform:translateY(0) scale(1);}

/* カード群は順番に出す */
.js-enabled .cards .card:nth-child(1),
.js-enabled .reasons .reason:nth-child(1),
.js-enabled .flow .flow__step:nth-child(1),
.js-enabled .plans .plan:nth-child(1){transition-delay:.04s;}
.js-enabled .cards .card:nth-child(2),
.js-enabled .reasons .reason:nth-child(2),
.js-enabled .flow .flow__step:nth-child(2),
.js-enabled .plans .plan:nth-child(2){transition-delay:.12s;}
.js-enabled .cards .card:nth-child(3),
.js-enabled .reasons .reason:nth-child(3),
.js-enabled .flow .flow__step:nth-child(3),
.js-enabled .plans .plan:nth-child(3){transition-delay:.20s;}
.js-enabled .reasons .reason:nth-child(4){transition-delay:.08s;}
.js-enabled .reasons .reason:nth-child(5){transition-delay:.16s;}
.js-enabled .reasons .reason:nth-child(6){transition-delay:.24s;}

/* ホバーの質感を少し上げる */
.card,.plan,.reason,.flow__step,.info,.greeting__person,.article__lead,.article__list li{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease,color .22s ease;}
.plan:hover,.flow__step:hover,.article__list li:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--accent-2);}
.info:hover,.greeting__person:hover{box-shadow:var(--shadow);}
.btn:hover::after,.card:hover .card__more span{animation:arrowNudge .55s ease both;}
.floating-cta{animation:pulseGlow 4.2s ease-in-out infinite;}

/* スライドショーも少しリッチに */
.office-gallery__slide img{animation:officeImageZoom 18s ease-in-out infinite;}
@keyframes officeImageZoom{
  0%{transform:scale(1);}
  30%{transform:scale(1.055);}
  36%{transform:scale(1.055);}
  100%{transform:scale(1);}
}

/* 下層ページの読み始めにも動きを付ける */
.breadcrumb{animation:softFadeRight .65s ease both .06s;}
.article__eyebrow{animation:softFadeRight .65s ease both .12s;}
.article__title{animation:softFadeUp .75s ease both .20s;}
.article__lead{animation:softFadeUp .75s ease both .32s;}

/* 動きを減らす設定の人には停止 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important;}
  .js-enabled .js-reveal{opacity:1!important;transform:none!important;filter:none!important;}
}

/* =========================================================
   追加改善版：実写写真・明るいグリーン・上品な動き
   ========================================================= */
:root{
  --bg:#fbfffb;
  --brand-grad:linear-gradient(135deg,#31c879 0%,#0fb486 48%,#9be15d 100%);
  --brand-grad-soft:linear-gradient(135deg,rgba(49,200,121,.18) 0%,rgba(15,180,134,.16) 48%,rgba(155,225,93,.22) 100%);
  --main:#0fb486;
  --main-dark:#006f58;
  --accent:#9be15d;
  --accent-2:#b7efd7;
  --line:#cceadd;
  --shadow:0 22px 60px rgba(15,180,134,.16);
}

body{background:linear-gradient(180deg,#ffffff 0%,#f8fffa 42%,#f3fbf2 100%);}

.logo__mark,.nav__cta,.btn--primary,.cta,.floating-cta,.plan__badge,.flow__num{background:var(--brand-grad)!important;}
.header{background:rgba(255,255,255,.72);backdrop-filter:blur(14px);}
.header.is-scrolled{background:rgba(255,255,255,.94);}

/* トップ：添付動画寄せ。大きなグリーン面から写真が浮き上がる印象 */
.hero{
  min-height:calc(100vh - 70px);
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 78% 22%,rgba(155,225,93,.38) 0 9%,transparent 24%),
    radial-gradient(circle at 88% 68%,rgba(15,180,134,.22) 0 8%,transparent 24%),
    linear-gradient(160deg,#ffffff 0%,#f1fff6 38%,#1fc779 38%,#0eb486 100%);
  padding:62px 0 104px;
}
.hero::before{
  content:"";
  position:absolute;
  inset:auto -8% -68px -8%;
  height:210px;
  background:#fff;
  transform:rotate(-3.2deg);
  z-index:0;
}
.hero::after{
  content:"";
  position:absolute;
  right:-110px;
  top:130px;
  width:520px;
  height:520px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.46),rgba(155,225,93,.16) 42%,transparent 70%);
  animation:breathingBlob 7.5s ease-in-out infinite;
}
.hero__curve{opacity:.92;mix-blend-mode:screen;}
.hero__curve path{stroke:#ffffff;stroke-width:3;}
.hero__inner{grid-template-columns:.9fr 1.1fr;}
.hero__body{position:relative;z-index:3;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.85);border-radius:32px;padding:40px 42px;box-shadow:0 28px 80px rgba(0,111,88,.14);backdrop-filter:blur(12px);}
.hero__lead,.hero__title{color:#004d3e;}
.hero__text{color:#496a60;}
.hero__points li{background:rgba(255,255,255,.78);border-color:rgba(183,239,215,.9);}
.hero__visual{position:relative;min-height:520px;}
.hero__photo{position:absolute;overflow:hidden;background:#fff;box-shadow:0 28px 80px rgba(0,111,88,.22);border:8px solid rgba(255,255,255,.92);margin:0;}
.hero__photo img{width:100%;height:100%;object-fit:cover;filter:saturate(1.06) brightness(1.06) contrast(1.02);}
.hero__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,111,88,.12));pointer-events:none;}
.hero__photo--large{left:0;top:20px;width:70%;height:330px;border-radius:34px;}
.hero__photo--small{right:0;top:76px;width:40%;height:245px;border-radius:26px;}
.hero__photo--thin{right:10%;bottom:28px;width:60%;height:168px;border-radius:26px;}
.hero__bigword{position:absolute;left:6%;bottom:8px;color:rgba(255,255,255,.72);font-size:clamp(2.4rem,5.5vw,5.3rem);font-weight:700;letter-spacing:.16em;line-height:1;text-shadow:0 10px 30px rgba(0,111,88,.12);}

/* 画像1：共感セクション。青緑〜ライム背景＋ぼかし円の明滅 */
.band{
  position:relative;
  overflow:hidden;
  background:var(--brand-grad);
  color:#fff;
  padding:72px 0;
  border-top:1px solid rgba(15,180,134,.25);
  border-bottom:1px solid rgba(15,180,134,.25);
}
.band::before,.band::after{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  border-radius:50%;
  filter:blur(18px);
  background:radial-gradient(circle,rgba(255,255,255,.42),rgba(155,225,93,.18) 44%,transparent 70%);
  animation:breathingBlob 6.8s ease-in-out infinite;
}
.band::before{left:6%;top:-150px;}
.band::after{right:10%;bottom:-190px;animation-delay:2s;}
.band .container{position:relative;z-index:1;}
.band__text{color:#fff;text-shadow:0 8px 24px rgba(0,111,88,.16);}

/* 画像2：サービスカードの背面に実写写真、ホバーで浮き上がり＋写真拡大 */
.cards{gap:28px;}
.card{
  isolation:isolate;
  min-height:390px;
  padding:170px 28px 28px;
  border-radius:26px;
  border:1px solid rgba(204,234,221,.95);
  background:#fff;
  box-shadow:0 14px 44px rgba(15,180,134,.08);
}
.card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:148px;
  background-size:cover;
  background-position:center;
  transform:scale(1);
  transition:transform .75s cubic-bezier(.22,1,.36,1),filter .3s ease;
  z-index:-2;
}
.card::after{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:148px;
  background:linear-gradient(180deg,rgba(0,111,88,.05),rgba(0,111,88,.28));
  z-index:-1;
}
.card--payroll::before{background-image:url("assets/photos/service-pay.png");}
.card--soumu::before{background-image:url("assets/photos/service-backoffice.png");}
.card--roumu::before{background-image:url("assets/photos/service-labor.png");}
.card:hover{transform:translateY(-12px);box-shadow:0 28px 70px rgba(15,180,134,.18);border-color:var(--accent-2);}
.card:hover::before{transform:scale(1.08);filter:saturate(1.12) brightness(1.06);}
.card__ico{
  position:absolute;
  left:26px;
  top:110px;
  width:auto;
  min-width:74px;
  height:42px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:var(--main-dark);
  font-size:.72rem;
  letter-spacing:.08em;
  font-weight:800;
  box-shadow:0 10px 26px rgba(0,111,88,.12);
}

/* 画像3：理由カードはホバーで青緑〜ライムグラデーション */
.section{position:relative;overflow:hidden;}
.section::after{
  content:"";
  position:absolute;
  left:-5%;right:-5%;top:18px;
  height:64px;
  opacity:.22;
  pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0,55 C180,5 330,85 510,35 C720,-20 880,115 1080,45 C1240,-10 1340,20 1440,5' fill='none' stroke='%230fb486' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  animation:waveDrift 9s ease-in-out infinite;
}
.reason{border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 12px 34px rgba(15,180,134,.06);}
.reason:hover{background:var(--brand-grad)!important;transform:translateY(-8px);box-shadow:0 26px 64px rgba(15,180,134,.2);}
.reason:hover .reason__num,.reason:hover .reason__title,.reason:hover .reason__text{color:#fff;}

/* 画像4：流れカードは4pxグラデーション枠 */
.flow__step{
  border:4px solid transparent!important;
  background:linear-gradient(#fff,#fff) padding-box,var(--brand-grad) border-box;
  border-radius:26px;
  box-shadow:0 12px 34px rgba(15,180,134,.06);
}
.flow__step:not(:last-child)::after{height:2px;background:linear-gradient(90deg,#0fb486,#9be15d);}
.flow__step:hover{transform:translateY(-8px);box-shadow:0 26px 64px rgba(15,180,134,.18);}

/* 実写感を増やす：代表・事務所 */
.greeting__photo{
  width:168px;height:168px;border-radius:36px;
  background:url("assets/photos/hero-office.jpg") center/cover no-repeat;
  color:transparent;border:6px solid #fff;box-shadow:0 18px 50px rgba(15,180,134,.15);
}
.office-gallery{border-radius:32px;box-shadow:0 24px 70px rgba(15,180,134,.14);}
.office-gallery__slide img{filter:saturate(1.05) brightness(1.05);}

/* 下層ページ：実写背景の見出し感 */
.article__lead{position:relative;overflow:hidden;border-radius:28px;background:#fff;}
.article__lead::after{content:"";position:absolute;right:-40px;bottom:-40px;width:170px;height:170px;border-radius:50%;background:var(--brand-grad-soft);animation:breathingBlob 7s ease-in-out infinite;}
.article h2{border-left:0;padding-left:0;}
.article h2::before{content:"";display:inline-block;width:36px;height:4px;border-radius:999px;background:var(--brand-grad);vertical-align:middle;margin-right:12px;}

@keyframes breathingBlob{
  0%,100%{opacity:.62;transform:scale(1);}
  50%{opacity:1;transform:scale(1.16);}
}
@keyframes waveDrift{
  0%,100%{transform:translateX(0) translateY(0);}
  50%{transform:translateX(38px) translateY(8px);}
}

/* スクロール時は下から上に止まる動きへ統一 */
.js-enabled .js-reveal,
.js-enabled .js-reveal[data-reveal="left"],
.js-enabled .js-reveal[data-reveal="right"],
.js-enabled .js-reveal[data-reveal="scale"]{
  opacity:0;
  transform:translateY(42px) scale(.985);
  filter:blur(7px);
  transition:opacity .82s cubic-bezier(.22,1,.36,1),transform .82s cubic-bezier(.22,1,.36,1),filter .82s ease;
}
.js-enabled .js-reveal.is-visible,
.js-enabled .js-reveal[data-reveal="left"].is-visible,
.js-enabled .js-reveal[data-reveal="right"].is-visible,
.js-enabled .js-reveal[data-reveal="scale"].is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
  filter:blur(0);
}

@media (max-width:980px){
  .hero{min-height:auto;background:linear-gradient(160deg,#ffffff 0%,#f1fff6 42%,#1fc779 42%,#0eb486 100%);}
  .hero__body{padding:32px 28px;}
}
@media (max-width:640px){
  .hero{padding:34px 0 76px;background:linear-gradient(170deg,#fff 0%,#f3fff7 52%,#1fc779 52%,#0eb486 100%);}
  .hero__body{border-radius:24px;padding:26px 22px;}
  .hero__visual{min-height:330px;}
  .hero__photo--large{width:82%;height:210px;}
  .hero__photo--small{width:48%;height:150px;right:0;top:36px;}
  .hero__photo--thin{width:70%;height:118px;right:5%;bottom:28px;}
  .hero__bigword{font-size:2rem;bottom:0;}
  .card{min-height:360px;padding-top:160px;}
}

/* =========================================================
   FINAL REQUEST PATCH：日本人実写写真＋リッチモーション強化
   ========================================================= */
:root{
  --brand-grad:linear-gradient(135deg,#45c681 0%,#0fb795 48%,#a8e05f 100%);
  --brand-grad-soft:linear-gradient(135deg,rgba(69,198,129,.18) 0%,rgba(15,183,149,.15) 48%,rgba(168,224,95,.20) 100%);
  --main:#0fb795;
  --main-dark:#006f58;
  --accent:#a8e05f;
  --accent-2:#c5f2d4;
  --line:#cfeee1;
}

/* 1. トップヒーロー：大きな円形グラデーション＋写真カード切り替え */
.hero{
  overflow:hidden;
  background:
    radial-gradient(circle at 69% 46%,rgba(255,255,255,.62) 0 12%,transparent 23%),
    linear-gradient(160deg,#ffffff 0%,#f2fff8 34%,#3fca82 34%,#0fb795 65%,#a8e05f 100%)!important;
}
.hero::after{
  right:5%;
  top:50%;
  width:min(62vw,740px);
  height:min(62vw,740px);
  transform:translateY(-50%);
  background:radial-gradient(circle,rgba(168,224,95,.88) 0%,rgba(15,183,149,.74) 43%,rgba(69,198,129,.22) 67%,transparent 72%)!important;
  filter:blur(.5px);
  animation:heroCircleGrow 9s cubic-bezier(.22,1,.36,1) infinite!important;
  z-index:0;
}
.hero__inner{position:relative;z-index:2;}
.hero__body{
  animation:heroPanelIn .9s cubic-bezier(.22,1,.36,1) both .08s;
}
.hero__lead{animation:lineUp .72s cubic-bezier(.22,1,.36,1) both .18s!important;}
.hero__title{overflow:hidden;}
.hero__title span{
  display:block;
  opacity:0;
  transform:translateY(32px);
  animation:lineUp .82s cubic-bezier(.22,1,.36,1) both;
}
.hero__title span:nth-child(1){animation-delay:.30s;}
.hero__title span:nth-child(2){animation-delay:.46s;}
.hero__text{animation:lineUp .78s cubic-bezier(.22,1,.36,1) both .62s!important;}
.hero__actions{animation:lineUp .78s cubic-bezier(.22,1,.36,1) both .84s!important;}
.hero__points{animation:lineUp .78s cubic-bezier(.22,1,.36,1) both 1.02s!important;}
.hero__visual::before{
  content:"";
  position:absolute;
  inset:4% -6% 2% 2%;
  border-radius:999px;
  background:radial-gradient(circle,rgba(255,255,255,.55),rgba(168,224,95,.32) 36%,rgba(15,183,149,.20) 60%,transparent 72%);
  filter:blur(12px);
  animation:visualBreath 8s ease-in-out infinite;
  z-index:0;
}
.hero__photo{
  z-index:1;
  border:9px solid rgba(255,255,255,.95);
  box-shadow:0 34px 90px rgba(0,111,88,.28),0 10px 26px rgba(255,255,255,.24) inset;
}
.hero__photo--large{animation:cardFadeZoom 12s ease-in-out infinite 0s, heroPhotoIn .9s cubic-bezier(.22,1,.36,1) both .32s!important;}
.hero__photo--small{animation:cardFadeZoom 12s ease-in-out infinite 3.8s, heroPhotoIn .9s cubic-bezier(.22,1,.36,1) both .54s!important;}
.hero__photo--thin{animation:cardFadeZoom 12s ease-in-out infinite 7.6s, heroPhotoIn .9s cubic-bezier(.22,1,.36,1) both .76s!important;}
.hero__photo img{animation:kenBurns 15s ease-in-out infinite!important;}
.hero__bigword{animation:lineUp .9s cubic-bezier(.22,1,.36,1) both 1.02s!important;}

/* 右の丸アイコンは削除。代わりにSCROLL表示 */
.scroll-guide{
  position:fixed;
  right:26px;
  top:50%;
  transform:translateY(-50%);
  z-index:45;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  color:#00735f;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.18em;
  writing-mode:vertical-rl;
  text-decoration:none;
}
.scroll-guide i{
  display:block;
  width:2px;
  height:72px;
  border-radius:999px;
  background:linear-gradient(180deg,#0fb795,#a8e05f);
  position:relative;
  overflow:hidden;
}
.scroll-guide i::after{
  content:"";
  position:absolute;
  left:0;top:-35%;
  width:100%;height:35%;
  background:#fff;
  box-shadow:0 0 12px rgba(255,255,255,.9);
  animation:scrollLine 1.8s ease-in-out infinite;
}

/* 2. 共感セクション：呼吸するグラデーション背景 */
.band{
  min-height:250px;
  display:flex;
  align-items:center;
  background:linear-gradient(120deg,rgba(69,198,129,.92),rgba(15,183,149,.96) 48%,rgba(168,224,95,.92))!important;
}
.band__text{
  font-size:clamp(1.18rem,2.2vw,1.65rem)!important;
  font-weight:800!important;
  letter-spacing:.04em;
  line-height:2.05!important;
}
.band__text::before,.band__text::after{
  content:"“";
  font-family:Georgia,serif;
  font-size:2.5em;
  line-height:0;
  opacity:.38;
  vertical-align:-.32em;
}
.band__text::after{content:"”";vertical-align:-.48em;}

/* 3. サービスカード：日本人実写写真背景＋ホバー拡大 */
.card--payroll::before{background-image:url("assets/photos/service-pay.png")!important;background-position:center;}
.card--soumu::before{background-image:url("assets/photos/service-backoffice.png")!important;background-position:center;}
.card--roumu::before{background-image:url("assets/photos/service-labor.png")!important;background-position:center;}
.card::before{height:165px!important;filter:saturate(1.04) brightness(.88) blur(.2px);}
.card::after{height:165px!important;background:linear-gradient(180deg,rgba(0,111,88,.12),rgba(0,111,88,.38))!important;}
.card{padding-top:190px!important;overflow:hidden;}
.card:hover::before{transform:scale(1.12)!important;filter:saturate(1.10) brightness(1.02) blur(0);}

/* 4. 選ばれる理由：ホバー時グラデーション＋波形 */
.reason{overflow:hidden;position:relative;}
.reason::after{
  content:"";
  position:absolute;
  inset:auto -20% 16px -20%;
  height:70px;
  opacity:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 100' preserveAspectRatio='none'%3E%3Cpath d='M0 60 C130 10 240 95 380 46 C520 0 625 100 800 34' fill='none' stroke='rgba(255,255,255,.6)' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  transform:translateX(-20px);
  transition:opacity .28s ease;
  animation:reasonWave 5s ease-in-out infinite;
  pointer-events:none;
}
.reason:hover::after{opacity:1;}
.reason__num{font-size:2rem!important;line-height:1;}
.reason:hover .reason__num{transform:scale(1.16);}

/* 5. 流れ：4pxグラデーション枠＋波形接続 */
.flow{position:relative;}
.flow::before{
  content:"";
  position:absolute;
  left:9%;right:9%;top:50%;height:84px;
  transform:translateY(-50%);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 120' preserveAspectRatio='none'%3E%3Cpath d='M0 62 C125 18 230 102 350 58 C485 10 575 108 710 58 C835 13 910 78 1000 48' fill='none' stroke='%230fb795' stroke-width='4' stroke-linecap='round' stroke-dasharray='14 18'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  opacity:.28;
  animation:flowWave 7.2s ease-in-out infinite;
  pointer-events:none;
}
.flow__step{position:relative;z-index:1;}
.flow__step:not(:last-child)::after{display:none!important;}
.flow__step{border:4px solid transparent!important;background:linear-gradient(#fff,#fff) padding-box,var(--brand-grad) border-box!important;}

/* 既存フローティングは少し控えめに */
.floating-cta{right:24px;bottom:24px;}

@keyframes heroCircleGrow{
  0%,100%{opacity:.82;transform:translateY(-50%) scale(.92);}
  48%{opacity:1;transform:translateY(-50%) scale(1.08);}
}
@keyframes visualBreath{
  0%,100%{opacity:.55;transform:scale(.94) translateY(0);}
  50%{opacity:1;transform:scale(1.06) translateY(-10px);}
}
@keyframes lineUp{
  from{opacity:0;transform:translateY(30px);filter:blur(8px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}
@keyframes heroPanelIn{
  from{opacity:0;transform:translateY(28px) scale(.98);filter:blur(10px);}
  to{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
}
@keyframes heroPhotoIn{
  from{opacity:0;transform:translateY(44px) scale(.94) rotate(-1deg);filter:blur(10px);}
  to{opacity:1;transform:translateY(0) scale(1) rotate(0);filter:blur(0);}
}
@keyframes cardFadeZoom{
  0%,8%{opacity:.45;filter:saturate(.96) brightness(.92);}
  18%,42%{opacity:1;filter:saturate(1.08) brightness(1.06);}
  55%,100%{opacity:.58;filter:saturate(.98) brightness(.96);}
}
@keyframes kenBurns{
  0%,100%{transform:scale(1.02) translate(0,0);}
  50%{transform:scale(1.10) translate(-1.5%,1.2%);}
}
@keyframes scrollLine{
  0%{top:-35%;opacity:0;}
  25%{opacity:1;}
  100%{top:105%;opacity:0;}
}
@keyframes reasonWave{
  0%,100%{transform:translateX(-24px);}
  50%{transform:translateX(24px);}
}
@keyframes flowWave{
  0%,100%{transform:translateY(-50%) translateX(-12px);}
  50%{transform:translateY(-50%) translateX(24px);}
}

@media (max-width:980px){
  .scroll-guide{display:none;}
  .hero::after{width:560px;height:560px;right:-130px;top:58%;}
  .hero__title span{display:inline;}
}
@media (max-width:640px){
  .hero::after{width:420px;height:420px;right:-180px;top:50%;}
  .hero__title span{display:inline;}
  .band{min-height:220px;padding:48px 0;}
  .flow::before{display:none;}
}
.greeting__photo{background:url("assets/photos/hero-office.jpg") center/cover no-repeat!important;}

/* ===== 追加修正：各セクション上部の波線をゆっくり波打たせる ===== */
.section{
  position:relative;
  overflow:hidden;
}
.section > .container{
  position:relative;
  z-index:1;
}
.section::before,
.section::after{
  content:"";
  position:absolute;
  left:-12%;
  right:-12%;
  top:18px;
  height:82px;
  pointer-events:none;
  z-index:0;
  transform-origin:center;
  will-change:transform,opacity,background-position;
}
.section::before{
  opacity:.26;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 100' preserveAspectRatio='none'%3E%3Cpath d='M0,52 C190,8 350,84 540,44 C735,2 900,92 1110,46 C1290,8 1440,36 1600,20' fill='none' stroke='%230fb795' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") 0 50%/115% 100% no-repeat;
  animation:sectionWaveBreath 16s ease-in-out infinite;
}
.section::after{
  top:26px;
  opacity:.15;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 100' preserveAspectRatio='none'%3E%3Cpath d='M0,38 C210,76 340,18 520,50 C735,88 880,12 1090,52 C1280,88 1420,22 1600,44' fill='none' stroke='%23a8e05f' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") 100% 50%/120% 100% no-repeat;
  animation:sectionWaveBreathAlt 21s ease-in-out infinite;
}
@keyframes sectionWaveBreath{
  0%,100%{transform:translateX(-18px) translateY(0) scaleY(1);opacity:.20;background-position:0 50%;}
  35%{transform:translateX(18px) translateY(5px) scaleY(1.28);opacity:.34;background-position:45% 50%;}
  70%{transform:translateX(42px) translateY(-4px) scaleY(.82);opacity:.25;background-position:90% 50%;}
}
@keyframes sectionWaveBreathAlt{
  0%,100%{transform:translateX(30px) translateY(2px) scaleY(.9);opacity:.12;background-position:100% 50%;}
  45%{transform:translateX(-22px) translateY(-5px) scaleY(1.22);opacity:.22;background-position:40% 50%;}
  75%{transform:translateX(-48px) translateY(4px) scaleY(.78);opacity:.16;background-position:0 50%;}
}
@media (prefers-reduced-motion: reduce){
  .section::before,
  .section::after{animation:none!important;}
}

/* ===== 修正：セクション上部の波線は、画面表示時だけ波打って停止 ===== */
.section::after{
  animation:none!important;
  transform:translateX(0) translateY(0) scaleY(1);
  transform-origin:center center;
  will-change:transform,opacity;
}
.js-enabled .section::after{
  opacity:.12;
  transform:translateX(-72px) translateY(10px) scaleY(.72);
}
.js-enabled .section.wave-play::after{
  animation:waveOnceOnView 2.35s cubic-bezier(.22,1,.36,1) both!important;
}
@keyframes waveOnceOnView{
  0%{
    opacity:0;
    transform:translateX(-96px) translateY(12px) scaleY(.68);
  }
  22%{
    opacity:.26;
    transform:translateX(-48px) translateY(-8px) scaleY(1.34);
  }
  46%{
    opacity:.24;
    transform:translateX(34px) translateY(7px) scaleY(.78);
  }
  68%{
    opacity:.24;
    transform:translateX(-18px) translateY(-4px) scaleY(1.16);
  }
  84%{
    opacity:.23;
    transform:translateX(8px) translateY(2px) scaleY(.96);
  }
  100%{
    opacity:.22;
    transform:translateX(0) translateY(0) scaleY(1);
  }
}
@media (prefers-reduced-motion: reduce){
  .js-enabled .section::after,
  .js-enabled .section.wave-play::after{
    animation:none!important;
    opacity:.22;
    transform:translateX(0) translateY(0) scaleY(1);
  }
}

/* ===== 呼吸感調整：ホバーをゆっくり、波線の最後のカクつき対策 ===== */
.btn,
.nav a,
.nav__cta,
.card,
.plan,
.reason,
.flow__step,
.info,
.greeting__person,
.floating-cta{
  transition-duration:.95s!important;
  transition-timing-function:cubic-bezier(.16,1,.3,1)!important;
}
.btn::after,
.card__more,
.card__more span,
.reason__num,
.reason__title,
.reason__text,
.plan__btn,
.article__list li{
  transition-duration:.9s!important;
  transition-timing-function:cubic-bezier(.16,1,.3,1)!important;
}
.card::before{
  transition:transform 1.65s cubic-bezier(.16,1,.3,1),filter 1.25s ease!important;
}
.card::after{
  transition:opacity 1.2s ease!important;
}
.card:hover{
  transform:translateY(-9px)!important;
}
.card:hover::before{
  transform:scale(1.08)!important;
}
.plan:hover,
.flow__step:hover,
.article__list li:hover{
  transform:translateY(-5px)!important;
}
.floating-cta:hover,
.btn:hover{
  transform:translateY(-2px)!important;
}

/* 理由カード：グラデーションを背景の即時切替ではなく、ゆっくり重ねて表示 */
.reason{
  background:#fff!important;
  isolation:isolate;
  overflow:hidden;
  transition:transform 1s cubic-bezier(.16,1,.3,1),box-shadow 1.15s ease,border-color 1s ease!important;
}
.reason::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--brand-grad);
  opacity:0;
  z-index:0;
  transition:opacity 1.15s cubic-bezier(.16,1,.3,1)!important;
  pointer-events:none;
}
.reason:hover{
  background:#fff!important;
  transform:translateY(-5px)!important;
  box-shadow:0 22px 58px rgba(15,180,134,.16)!important;
}
.reason:hover::before{opacity:1;}
.reason > *{position:relative;z-index:2;}
.reason::after{z-index:1;transition:opacity 1.05s ease!important;}
.reason:hover .reason__num{transform:scale(1.08)!important;}

.section::before,
.section::after{display:none!important;}

.section__head{position:relative!important;}
.title-wave-svg{
  display:block;
  width:min(760px,100%);
  height:46px;
  margin:2px 0 0;
  overflow:visible;
  opacity:.82;
  pointer-events:none;
}
.section__head .section__title + .title-wave-svg{margin-top:-2px;}
.title-wave-path{
  fill:none;
  stroke:url(#titleWaveGradient);
  stroke-width:3.2;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 5px 12px rgba(0,190,150,.16));
}
.title-wave-soft{
  fill:none;
  stroke:#a7f36a;
  stroke-width:1.8;
  stroke-linecap:round;
  opacity:.32;
  vector-effect:non-scaling-stroke;
}
@media (max-width:640px){
  .title-wave-svg{height:34px;margin-top:0;}
}

/* 理由カード内の白ラインは本文にかぶせず、番号下あたりに移動 */
.reason::after{
  inset:78px 20px auto 20px!important;
  height:34px!important;
  background-size:100% 100%!important;
  opacity:0;
  transform:translateX(-10px)!important;
}
.reason:hover::after{opacity:.72!important;}
.reason__num{margin-bottom:22px!important;}

/* 「相談無料」タグ：主張は弱め */
.flow__tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:-6px 0 16px;
  padding:5px 13px;
  border-radius:999px;
  background:rgba(15,180,134,.10);
  color:#00825f;
  border:1px solid rgba(15,180,134,.20);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.04em;
}

/* ホバー全体をさらに落ち着いた呼吸感へ */
.btn,
.nav a,
.nav__cta,
.card,
.plan,
.reason,
.flow__step,
.info,
.greeting__person,
.floating-cta{
  transition-duration:1.25s!important;
  transition-timing-function:cubic-bezier(.19,1,.22,1)!important;
}
.card::before{
  transition:transform 2.2s cubic-bezier(.19,1,.22,1),filter 1.8s ease!important;
}
.reason::before{
  transition:opacity 1.55s cubic-bezier(.19,1,.22,1)!important;
}
.reason::after{
  animation:none!important;
  transition:opacity 1.35s ease,transform 1.35s cubic-bezier(.19,1,.22,1)!important;
}
.card:hover,
.reason:hover,
.flow__step:hover,
.plan:hover{
  transition-duration:1.35s!important;
}


/* ===== 最終修正：タイトル下ラインを幅100％にし、余白内で長く見せる ===== */
.section__head{
  max-width:none!important;
  width:100%!important;
}
.title-wave-svg{
  width:100%!important;
  max-width:none!important;
  height:48px!important;
  margin-top:4px!important;
}
@media (max-width:640px){
  .title-wave-svg{height:36px!important;}
}


/* =========================================================
   HERO FINAL REFINEMENT：見切れ防止・白枠削除・ゆっくり順番表示
   ========================================================= */
.hero{
  min-height:0!important;
  height:auto!important;
  padding:34px 0 54px!important;
  background:
    linear-gradient(162deg,rgba(255,255,255,.98) 0%,rgba(244,255,249,.96) 37%,rgba(63,202,130,.96) 37%,rgba(15,183,149,.98) 68%,rgba(168,224,95,.94) 100%)!important;
}
.hero::before{
  height:130px!important;
  bottom:8px!important;
  background:rgba(255,255,255,.92)!important;
  opacity:.88!important;
}
/* 背面の白ライン：角度は維持、主張だけ弱める */
.hero__curve{
  opacity:.42!important;
  mix-blend-mode:screen!important;
}
.hero__curve path{
  stroke:rgba(255,255,255,.62)!important;
  stroke-width:2.2!important;
}
/* 呼吸する大きめの円形ぼかし 1 */
.hero::after{
  right:10%!important;
  top:49%!important;
  width:min(48vw,560px)!important;
  height:min(48vw,560px)!important;
  background:radial-gradient(circle,rgba(168,224,95,.54) 0%,rgba(15,183,149,.34) 42%,rgba(69,198,129,.12) 65%,transparent 74%)!important;
  filter:blur(22px)!important;
  animation:heroBreathOrbA 7.6s ease-in-out infinite!important;
  z-index:0!important;
}
.hero__inner{
  grid-template-columns:.82fr 1.18fr!important;
  gap:44px!important;
  min-height:520px!important;
  align-items:center!important;
}
/* テキスト背景白枠を削除 */
.hero__body{
  background:transparent!important;
  border:none!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  padding:0 0 0 0!important;
  animation:none!important;
}
.hero__lead,
.hero__title,
.hero__text{
  text-shadow:0 1px 0 rgba(255,255,255,.38);
}
.hero__title{
  font-size:clamp(2.15rem,3.45vw,3.25rem)!important;
  line-height:1.48!important;
  margin-bottom:20px!important;
}
.hero__text{
  font-size:.98rem!important;
  line-height:1.9!important;
  margin-bottom:24px!important;
}
.hero__actions{margin-bottom:18px!important;}
.hero__points li{
  background:rgba(255,255,255,.62)!important;
  border-color:rgba(197,242,212,.86)!important;
  backdrop-filter:blur(8px);
}
/* ボタンは背景に沈まないよう白縁と影を追加 */
.hero .btn--primary{
  border:1px solid rgba(255,255,255,.62)!important;
  box-shadow:0 16px 34px rgba(0,111,88,.25),0 0 0 4px rgba(255,255,255,.18)!important;
}
.hero .btn--ghost{
  background:rgba(255,255,255,.88)!important;
  border-color:rgba(255,255,255,.76)!important;
  box-shadow:0 12px 28px rgba(0,111,88,.11)!important;
}
/* 上から順番にゆっくり表示 */
.hero__lead{opacity:0;animation:heroLineFromTop 1.05s cubic-bezier(.16,1,.3,1) both .25s!important;}
.hero__title span{opacity:0;transform:translateY(-22px);animation:heroLineFromTop 1.08s cubic-bezier(.16,1,.3,1) both!important;}
.hero__title span:nth-child(1){animation-delay:.62s!important;}
.hero__title span:nth-child(2){animation-delay:.94s!important;}
.hero__text{opacity:0;animation:heroLineFromTop 1.08s cubic-bezier(.16,1,.3,1) both 1.28s!important;}
.hero__actions{opacity:0;animation:heroLineFromTop 1.08s cubic-bezier(.16,1,.3,1) both 1.62s!important;}
.hero__points{opacity:0;animation:heroLineFromTop 1.08s cubic-bezier(.16,1,.3,1) both 1.92s!important;}
/* 写真エリア：白枠なし、1枚ずつ大きくゆっくり切替 */
.hero__visual{
  min-height:405px!important;
  position:relative!important;
  overflow:visible!important;
}
/* 呼吸する大きめの円形ぼかし 2 */
.hero__visual::before{
  content:""!important;
  position:absolute!important;
  right:2%!important;
  top:8%!important;
  width:470px!important;
  height:470px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(255,255,255,.38),rgba(168,224,95,.26) 34%,rgba(15,183,149,.18) 56%,transparent 73%)!important;
  filter:blur(24px)!important;
  animation:heroBreathOrbB 9.2s ease-in-out infinite!important;
  z-index:0!important;
  inset:auto!important;
}
.hero__visual::after{
  content:"";
  position:absolute;
  left:4%;bottom:2%;
  width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.30),rgba(15,183,149,.17) 48%,transparent 74%);
  filter:blur(26px);
  animation:heroBreathOrbC 10.5s ease-in-out infinite;
  pointer-events:none;
  z-index:0;
}
.hero__photo,
.hero__photo--large,
.hero__photo--small,
.hero__photo--thin{
  left:8%!important;
  right:auto!important;
  top:44px!important;
  bottom:auto!important;
  width:82%!important;
  height:330px!important;
  border-radius:34px!important;
  border:none!important;
  box-shadow:0 36px 90px rgba(0,111,88,.26)!important;
  background:transparent!important;
  z-index:2!important;
  opacity:0;
  overflow:hidden!important;
  transform:translateY(18px) scale(.985);
  animation:heroPhotoCrossFade 9s ease-in-out infinite!important;
}
.hero__photo--large{animation-delay:-0.72s!important;}
.hero__photo--small{animation-delay:2.28s!important;}
.hero__photo--thin{animation-delay:5.28s!important;}
.hero__photo::after{
  background:linear-gradient(180deg,rgba(255,255,255,.03) 35%,rgba(0,111,88,.18))!important;
}
.hero__photo img{
  width:100%;height:100%;object-fit:cover!important;
  animation:heroSlowKenBurns 18s ease-in-out infinite!important;
  filter:saturate(1.08) brightness(1.06) contrast(1.02)!important;
}
/* YAHABA SHAROSHIを前面へ。主張控えめ＋作り込み感 */
.hero__bigword{
  left:2%!important;
  right:0!important;
  bottom:18px!important;
  z-index:4!important;
  color:rgba(255,255,255,.58)!important;
  font-size:clamp(1.75rem,4.2vw,4rem)!important;
  font-weight:800!important;
  letter-spacing:.18em!important;
  opacity:0!important;
  text-shadow:0 18px 42px rgba(0,111,88,.28)!important;
  animation:heroBigwordIn 1.6s cubic-bezier(.16,1,.3,1) both 2.2s, heroBigwordBreath 6.8s ease-in-out infinite 3.8s!important;
  pointer-events:none;
}
.scroll-guide{right:24px!important;}
@keyframes heroLineFromTop{
  from{opacity:0;transform:translateY(-24px);filter:blur(8px);}
  to{opacity:1;transform:translateY(0);filter:blur(0);}
}
@keyframes heroPhotoCrossFade{
  0%{opacity:0;transform:translateY(24px) scale(.985);filter:blur(8px);}
  8%{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
  29%{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}
  39%{opacity:0;transform:translateY(-12px) scale(1.015);filter:blur(6px);}
  100%{opacity:0;transform:translateY(-12px) scale(1.015);filter:blur(6px);}
}
@keyframes heroSlowKenBurns{
  0%{transform:scale(1.03) translateX(0);}
  50%{transform:scale(1.10) translateX(-1.2%);}
  100%{transform:scale(1.03) translateX(0);}
}
@keyframes heroBigwordIn{
  from{opacity:0;letter-spacing:.28em;transform:translateY(22px);filter:blur(10px);}
  to{opacity:1;letter-spacing:.18em;transform:translateY(0);filter:blur(0);}
}
@keyframes heroBigwordBreath{
  0%,100%{opacity:.46;transform:translateY(0);}
  50%{opacity:.66;transform:translateY(-4px);}
}
@keyframes heroBreathOrbA{
  0%,100%{opacity:.46;transform:translateY(-50%) scale(.92);}
  50%{opacity:.9;transform:translateY(-50%) scale(1.08);}
}
@keyframes heroBreathOrbB{
  0%,100%{opacity:.28;transform:scale(.86) translate(0,0);}
  50%{opacity:.82;transform:scale(1.08) translate(-10px,8px);}
}
@keyframes heroBreathOrbC{
  0%,100%{opacity:.20;transform:scale(.9);}
  50%{opacity:.62;transform:scale(1.14);}
}
@media (max-width:980px){
  .hero{padding:34px 0 58px!important;background:linear-gradient(166deg,#ffffff 0%,#f3fff7 45%,#1fc779 45%,#0eb486 100%)!important;}
  .hero__inner{grid-template-columns:1fr!important;min-height:0!important;gap:30px!important;}
  .hero__visual{min-height:360px!important;}
  .hero__photo,.hero__photo--large,.hero__photo--small,.hero__photo--thin{left:0!important;width:100%!important;height:300px!important;top:20px!important;}
  .hero__bigword{left:0!important;bottom:8px!important;}
}
@media (max-width:640px){
  .hero{padding:28px 0 46px!important;}
  .hero__title{font-size:2rem!important;line-height:1.44!important;}
  .hero__visual{min-height:285px!important;}
  .hero__photo,.hero__photo--large,.hero__photo--small,.hero__photo--thin{height:235px!important;border-radius:24px!important;}
  .hero__bigword{font-size:1.48rem!important;letter-spacing:.12em!important;}
}

/* =========================================================
   HERO USER FIX 2026-06-20：低め・淡め・ゆっくり呼吸・2行見出し
   ========================================================= */
.hero{
  padding:24px 0 34px!important;
  background:
    linear-gradient(162deg,
      rgba(255,255,255,.99) 0%,
      rgba(246,255,249,.98) 38%,
      rgba(101,213,151,.78) 38%,
      rgba(36,189,155,.76) 72%,
      rgba(180,230,110,.70) 100%)!important;
}
.hero::before{
  height:96px!important;
  bottom:-16px!important;
  background:rgba(255,255,255,.78)!important;
  opacity:.72!important;
}
.hero__curve{opacity:.24!important;}
.hero__curve path{stroke:rgba(255,255,255,.54)!important;stroke-width:1.8!important;}
.hero::after{
  width:min(42vw,450px)!important;
  height:min(42vw,450px)!important;
  opacity:.55!important;
}
.hero__inner{
  grid-template-columns:minmax(0,.56fr) minmax(0,.44fr)!important;
  gap:34px!important;
  min-height:438px!important;
  align-items:center!important;
}
.hero__body{max-width:620px!important;}
.hero__lead{margin-bottom:12px!important;font-size:.82rem!important;}
.hero__title{
  font-size:clamp(2.1rem,3.1vw,3rem)!important;
  line-height:1.32!important;
  letter-spacing:.02em!important;
  margin-bottom:16px!important;
  overflow:visible!important;
}
.hero__title span{display:block!important;white-space:nowrap!important;}
.hero__text{
  font-size:.92rem!important;
  line-height:1.72!important;
  margin-bottom:18px!important;
  max-width:560px!important;
}
.hero__text span{display:block;opacity:0;transform:translateY(-18px);}
.hero__actions{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  gap:14px!important;
  align-items:center!important;
  margin-bottom:14px!important;
}
.hero .btn{
  width:auto!important;
  min-width:205px!important;
  padding:13px 25px!important;
  transition:transform .75s cubic-bezier(.16,1,.3,1), box-shadow .75s cubic-bezier(.16,1,.3,1), background .75s ease!important;
}
.hero .btn--primary{
  background:linear-gradient(135deg,#009b7a 0%,#7fda66 100%)!important;
  color:#fff!important;
  border:2px solid rgba(255,255,255,.95)!important;
  box-shadow:0 16px 36px rgba(0,111,88,.24),0 0 0 5px rgba(255,255,255,.22)!important;
}
.hero .btn--primary::after{background:rgba(255,255,255,.96)!important;color:#009b7a!important;}
.hero .btn--ghost{
  background:rgba(255,255,255,.96)!important;
  color:#009b7a!important;
  border:1px solid rgba(255,255,255,.9)!important;
  box-shadow:0 12px 28px rgba(0,111,88,.10)!important;
}
.hero .btn--ghost::after{background:#e9fff5!important;color:#009b7a!important;}
.hero__points{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  gap:8px 18px!important;
  align-items:center!important;
}
.hero__points li{
  padding:0 0 0 22px!important;
  border:none!important;
  border-radius:0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  color:rgba(0,77,62,.78)!important;
  font-size:.82rem!important;
  font-weight:600!important;
}
.hero__points li::before{left:0!important;color:#00a982!important;}
.hero__visual{min-height:318px!important;}
.hero__visual::before{
  width:360px!important;
  height:360px!important;
  top:-4%!important;
  right:0!important;
  opacity:.55!important;
}
.hero__visual::after{
  width:260px!important;
  height:260px!important;
  opacity:.45!important;
}
.hero__photo,
.hero__photo--large,
.hero__photo--small,
.hero__photo--thin{
  left:0!important;
  top:30px!important;
  width:100%!important;
  height:278px!important;
  border-radius:28px!important;
  box-shadow:0 26px 70px rgba(0,111,88,.20)!important;
}
.hero__bigword{
  bottom:0!important;
  left:-2%!important;
  font-size:clamp(1.45rem,3vw,3.2rem)!important;
  color:rgba(255,255,255,.50)!important;
}
/* 既存の速い出現を上書き：上から順番に、ゆっくり呼吸するように */
.hero__lead{opacity:0;animation:heroBreatheDown 1.75s cubic-bezier(.16,1,.3,1) both .28s!important;}
.hero__title span{opacity:0;transform:translateY(-34px);animation:heroBreatheDown 1.85s cubic-bezier(.16,1,.3,1) both!important;}
.hero__title span:nth-child(1){animation-delay:.78s!important;}
.hero__title span:nth-child(2){animation-delay:1.18s!important;}
.hero__text{opacity:1!important;animation:none!important;}
.hero__text span:nth-child(1){animation:heroBreatheDown 1.7s cubic-bezier(.16,1,.3,1) both 1.58s!important;}
.hero__text span:nth-child(2){animation:heroBreatheDown 1.7s cubic-bezier(.16,1,.3,1) both 1.88s!important;}
.hero__text span:nth-child(3){animation:heroBreatheDown 1.7s cubic-bezier(.16,1,.3,1) both 2.18s!important;}
.hero__text span:nth-child(4){animation:heroBreatheDown 1.7s cubic-bezier(.16,1,.3,1) both 2.48s!important;}
.hero__actions{opacity:0;animation:heroBreatheDown 1.65s cubic-bezier(.16,1,.3,1) both 2.82s!important;}
.hero__points{opacity:0;animation:heroBreatheDown 1.65s cubic-bezier(.16,1,.3,1) both 3.12s!important;}
@keyframes heroBreatheDown{
  0%{opacity:0;transform:translateY(-34px);filter:blur(12px);}
  62%{opacity:1;transform:translateY(3px);filter:blur(1px);}
  100%{opacity:1;transform:translateY(0);filter:blur(0);}
}
@media (max-width:980px){
  .hero{padding:26px 0 38px!important;background:linear-gradient(166deg,rgba(255,255,255,.99) 0%,rgba(246,255,249,.98) 48%,rgba(90,211,147,.78) 48%,rgba(25,185,153,.76) 100%)!important;}
  .hero__inner{grid-template-columns:1fr!important;min-height:0!important;gap:22px!important;}
  .hero__body{max-width:none!important;}
  .hero__title{font-size:clamp(2rem,7vw,3rem)!important;}
  .hero__title span{white-space:normal!important;}
  .hero__visual{min-height:265px!important;}
  .hero__photo,.hero__photo--large,.hero__photo--small,.hero__photo--thin{height:235px!important;top:10px!important;}
  .hero__actions{flex-wrap:wrap!important;}
}
@media (max-width:640px){
  .hero{padding:24px 0 34px!important;}
  .hero__title{font-size:1.86rem!important;line-height:1.36!important;}
  .hero__actions{flex-direction:column!important;align-items:stretch!important;}
  .hero .btn{width:100%!important;min-width:0!important;}
  .hero__points{gap:7px 12px!important;}
  .hero__visual{min-height:228px!important;}
  .hero__photo,.hero__photo--large,.hero__photo--small,.hero__photo--thin{height:205px!important;border-radius:22px!important;}
}

/* =========================================================
   USER FIX：代表感を弱めて写真のみ／理由カードの波線位置修正
   ========================================================= */
.greeting__person.greeting__photoOnly{
  background:transparent!important;
  border:none!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
  text-align:left!important;
  overflow:visible!important;
}
.greeting__photoOnly img{
  width:100%!important;
  height:360px!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  border:none!important;
  border-radius:28px!important;
  box-shadow:0 18px 46px rgba(0,111,88,.10)!important;
  filter:saturate(.96) brightness(1.04) contrast(.98)!important;
  opacity:.88!important;
}
/* 旧代表写真・役職テキストの見え方を完全に無効化 */
.greeting__photo,
.greeting__role,
.greeting__name{display:none!important;}

/* 理由カード内の白ライン：タイトルにかぶせず、タイトル下へ */
.reason::after{
  inset:148px 28px auto 28px!important;
  height:30px!important;
  opacity:0!important;
  transform:translateX(0)!important;
  z-index:1!important;
}
.reason:hover::after{
  opacity:.56!important;
}
.reason__title{
  margin-bottom:28px!important;
}
.reason__text{
  position:relative!important;
  z-index:2!important;
}

@media (max-width:900px){
  .greeting__person.greeting__photoOnly{
    max-width:520px!important;
    margin-inline:auto!important;
  }
  .greeting__photoOnly img{height:280px!important;}
}
@media (max-width:640px){
  .greeting__photoOnly img{height:220px!important;border-radius:22px!important;}
  .reason::after{inset:132px 24px auto 24px!important;}
}

/* =========================================================
   USER FIX：ヒーロー白背景化／About写真削除／REASONライン削除
   ========================================================= */
.hero{
  min-height:0!important;
  padding:26px 0 32px!important;
  background:
    radial-gradient(circle at 72% 18%,rgba(168,224,95,.11) 0 0,transparent 26%),
    radial-gradient(circle at 18% 74%,rgba(15,183,149,.08) 0 0,transparent 28%),
    linear-gradient(180deg,#ffffff 0%,#fbfffb 100%)!important;
  color:#004d3e!important;
}
.hero::before{
  content:""!important;
  position:absolute!important;
  left:-10%!important;
  right:-10%!important;
  top:55%!important;
  bottom:auto!important;
  height:190px!important;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 220' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' x2='1' y1='0' y2='0'%3E%3Cstop offset='0' stop-color='%230fb795' stop-opacity='.22'/%3E%3Cstop offset='.55' stop-color='%2345c681' stop-opacity='.34'/%3E%3Cstop offset='1' stop-color='%23a8e05f' stop-opacity='.28'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 150 C260 62 420 205 660 110 C900 18 1070 160 1320 78 C1460 32 1530 44 1600 22' fill='none' stroke='url(%23g)' stroke-width='8' stroke-linecap='round'/%3E%3Cpath d='M0 166 C260 78 420 218 660 126 C900 38 1070 174 1320 94 C1460 48 1530 60 1600 38' fill='none' stroke='%23a8e05f' stroke-opacity='.18' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat!important;
  transform:rotate(-10deg)!important;
  opacity:1!important;
  z-index:0!important;
  pointer-events:none!important;
}
.hero::after{
  content:""!important;
  position:absolute!important;
  right:4%!important;
  top:22%!important;
  width:min(34vw,420px)!important;
  height:min(34vw,420px)!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(168,224,95,.18),rgba(15,183,149,.10) 46%,transparent 72%)!important;
  filter:blur(26px)!important;
  animation:heroPaleOrbOne 7.8s ease-in-out infinite!important;
  z-index:0!important;
  pointer-events:none!important;
}
.hero__curve{
  opacity:.65!important;
  mix-blend-mode:normal!important;
  transform:rotate(-5deg) scaleX(1.08)!important;
}
.hero__curve path{
  stroke:url(#heroLineGrad)!important;
  stroke-width:3.2!important;
  opacity:.42!important;
}
.hero__inner{
  grid-template-columns:minmax(0,.58fr) minmax(0,.42fr)!important;
  min-height:420px!important;
  gap:36px!important;
  position:relative!important;
  z-index:2!important;
}
.hero__lead,
.hero__title,
.hero__text{
  text-shadow:none!important;
  color:#004d3e!important;
}
.hero__title{
  font-size:clamp(2.0rem,3vw,2.85rem)!important;
  line-height:1.32!important;
  margin-bottom:14px!important;
}
.hero__text{
  color:#4d6c61!important;
  max-width:620px!important;
  margin-bottom:17px!important;
}
.hero__body{max-width:680px!important;}
.hero__visual{
  min-height:295px!important;
}
.hero__visual::before{
  content:""!important;
  position:absolute!important;
  left:-8%!important;
  top:42%!important;
  width:320px!important;
  height:320px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(15,183,149,.12),rgba(168,224,95,.08) 48%,transparent 74%)!important;
  filter:blur(24px)!important;
  animation:heroPaleOrbTwo 9.4s ease-in-out infinite!important;
  z-index:0!important;
  pointer-events:none!important;
  inset:auto!important;
}
.hero__visual::after{display:none!important;}
.hero__photo,
.hero__photo--large,
.hero__photo--small,
.hero__photo--thin{
  height:260px!important;
  top:18px!important;
  box-shadow:0 22px 54px rgba(0,111,88,.12)!important;
}
.hero__bigword{
  color:rgba(15,183,149,.16)!important;
  text-shadow:none!important;
  z-index:3!important;
}
.hero .btn--primary{
  background:linear-gradient(135deg,#00a982 0%,#7edc6b 100%)!important;
  border:2px solid rgba(255,255,255,.98)!important;
  color:#fff!important;
  box-shadow:0 14px 32px rgba(0,111,88,.18),0 0 0 4px rgba(15,183,149,.08)!important;
}
.hero .btn--ghost{
  background:#ffffff!important;
  color:#00876e!important;
  border:1.5px solid rgba(15,183,149,.28)!important;
  box-shadow:0 10px 24px rgba(0,111,88,.08)!important;
}
.hero__points li{
  color:#426c61!important;
  font-weight:600!important;
}
@keyframes heroPaleOrbOne{
  0%,100%{opacity:.18;transform:scale(.92) translate(0,0);}
  50%{opacity:.62;transform:scale(1.12) translate(-10px,8px);}
}
@keyframes heroPaleOrbTwo{
  0%,100%{opacity:.16;transform:scale(.88) translate(0,0);}
  50%{opacity:.56;transform:scale(1.16) translate(14px,-8px);}
}

/* About Us内の写真・スライドは不要 */
#about .office-gallery{display:none!important;}
#about{padding-bottom:64px!important;}

/* REASONカード内の白い波線は不要 */
.reason::after{display:none!important;content:none!important;}
.reason__title{margin-bottom:10px!important;}
.reason__num{margin-bottom:14px!important;}

@media (max-width:980px){
  .hero{
    background:linear-gradient(180deg,#ffffff 0%,#fbfffb 100%)!important;
    padding:24px 0 32px!important;
  }
  .hero::before{top:58%!important;height:150px!important;transform:rotate(-8deg)!important;}
  .hero__inner{grid-template-columns:1fr!important;min-height:0!important;gap:20px!important;}
  .hero__visual{min-height:255px!important;}
  .hero__photo,.hero__photo--large,.hero__photo--small,.hero__photo--thin{height:225px!important;}
}
@media (max-width:640px){
  .hero__title span{white-space:normal!important;}
  .hero__actions{flex-direction:column!important;}
  .hero::before{top:62%!important;height:120px!important;}
  .hero__visual{min-height:218px!important;}
  .hero__photo,.hero__photo--large,.hero__photo--small,.hero__photo--thin{height:198px!important;}
}

/* === 2026-06-20追加修正：ヒーロー説明・About登録情報・CTA電話モーダル === */
.hero__text{
  opacity:0!important;
  animation:heroTextBlockBreath 1.35s cubic-bezier(.16,1,.3,1) both 1.45s!important;
}
.hero__text span{
  display:inline!important;
  opacity:1!important;
  transform:none!important;
  animation:none!important;
}
@keyframes heroTextBlockBreath{
  0%{opacity:0;transform:translateY(-18px);filter:blur(5px);}
  100%{opacity:1;transform:translateY(0);filter:blur(0);}
}
.about{
  grid-template-columns:1fr!important;
}
.btn--white{
  background:#fff!important;
  color:#008767!important;
  border:1.5px solid rgba(255,255,255,.8)!important;
  box-shadow:0 12px 28px rgba(0,80,58,.14)!important;
}
.btn--white::after{background:rgba(0,169,143,.10)!important;color:#008767!important;}
.phone-modal{
  position:fixed;
  inset:0;
  z-index:999;
  display:grid;
  place-items:center;
  padding:24px;
  opacity:0;
  pointer-events:none;
  transition:opacity .38s ease;
}
.phone-modal.is-open{
  opacity:1;
  pointer-events:auto;
}
.phone-modal__overlay{
  position:absolute;
  inset:0;
  background:rgba(10,35,29,.38);
  backdrop-filter:blur(8px);
}
.phone-modal__dialog{
  position:relative;
  width:min(460px,100%);
  border-radius:28px;
  padding:36px 30px 32px;
  text-align:center;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(241,255,249,.96));
  border:1px solid rgba(0,169,143,.22);
  box-shadow:0 28px 80px rgba(0,95,68,.22);
  transform:translateY(14px) scale(.98);
  transition:transform .48s cubic-bezier(.16,1,.3,1);
}
.phone-modal.is-open .phone-modal__dialog{transform:translateY(0) scale(1);}
.phone-modal__close{
  position:absolute;
  top:14px;
  right:16px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:rgba(0,169,143,.10);
  color:#007a5b;
  font-size:1.4rem;
  cursor:pointer;
}
.phone-modal__eyebrow{
  color:#00a98f;
  font-weight:700;
  letter-spacing:.16em;
  font-size:.78rem;
  margin-bottom:8px;
}
.phone-modal__title{
  color:#143f35;
  font-size:1.25rem;
  margin:0 0 18px;
}
.phone-modal__number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:18px 20px;
  border-radius:999px;
  background:linear-gradient(135deg,#00a98f 0%,#35d39a 58%,#9be15d 100%);
  color:#fff;
  font-size:1.8rem;
  font-weight:800;
  letter-spacing:.04em;
  box-shadow:0 16px 36px rgba(0,169,143,.24);
}
.phone-modal__note{
  color:#4f695f;
  font-size:.92rem;
  line-height:1.8;
  margin-top:18px;
}
@media (max-width:640px){
  .about__registry{padding:22px 16px;}
  .phone-modal__number{font-size:1.35rem;}
}


/* === 2026-06-20 修正：トップ説明文をまとめて復活表示 === */
.hero__text{
  display:block!important;
  visibility:visible!important;
  opacity:0!important;
  color:#4d6c61!important;
  max-width:620px!important;
  margin:0 0 17px!important;
  font-size:.96rem!important;
  line-height:1.9!important;
  transform:translateY(14px)!important;
  filter:blur(5px)!important;
  animation:heroTextReturnSoft 1.55s cubic-bezier(.16,1,.3,1) both 1.28s!important;
}
.hero__text br{display:block!important;}
.hero__text span{
  display:inline!important;
  opacity:1!important;
  transform:none!important;
  filter:none!important;
  animation:none!important;
}
@keyframes heroTextReturnSoft{
  0%{opacity:0;transform:translateY(14px);filter:blur(5px);}
  100%{opacity:1;transform:translateY(0);filter:blur(0);}
}

/* ===== ヒーロー：タイトル下の追加メッセージを上から順に「ふわっと」表示 ===== */
.hero__message{margin:0 0 10px;color:#4d6b61;font-size:1rem;line-height:1.52;}
.hero__msgline{margin:0;animation:softFadeUp .85s ease both;}
.hero__msgline--gap{margin-top:.5em;}
.hero__body .hero__title{margin-bottom:14px!important;}
.hero__message .hero__msgline:nth-child(1){animation-delay:.34s;}
.hero__message .hero__msgline:nth-child(2){animation-delay:.46s;}
.hero__message .hero__msgline:nth-child(3){animation-delay:.58s;}
.hero__message .hero__msgline:nth-child(4){animation-delay:.70s;}
.hero__message .hero__msgline:nth-child(5){animation-delay:.86s;}
.hero__message .hero__msgline:nth-child(6){animation-delay:.98s;}
/* メッセージの後にボタン・特長が続くよう登場順を後ろへ */
.hero__body .hero__actions{animation-delay:1.12s!important;}
.hero__body .hero__points{animation-delay:1.24s!important;}

/* ===== お知らせ（News）セクション ===== */
.news{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
  padding:46px 52px;
  display:grid;
  grid-template-columns:300px 1fr;
  gap:48px;
  align-items:start;
  position:relative;
  z-index:1;
}
.news__head{position:relative;}
.news__title{font-size:1.8rem;font-weight:700;line-height:1.45;color:var(--text);margin:0 0 14px;}
.news__desc{color:var(--text-sub);font-size:.96rem;line-height:1.85;margin:0 0 16px;}
.news__wave{display:block;width:150px;height:16px;margin:0 0 26px;opacity:.85;}
.news__list{margin:0;padding:0;list-style:none;}
.news__item{margin:0;}
.news__entry{
  display:block;
  padding:20px 10px;
  border-bottom:1px solid var(--line);
}
.news__item:first-child .news__entry{padding-top:2px;}
.news__item:last-child .news__entry{border-bottom:none;}
.news__meta{display:flex;align-items:center;gap:14px;margin-bottom:9px;}
.news__date{font-size:.84rem;font-weight:700;letter-spacing:.04em;color:var(--text-sub);}
.news__tag{
  font-size:.72rem;font-weight:700;line-height:1;
  padding:5px 12px;border-radius:999px;white-space:nowrap;
}
.news__tag--info{background:var(--main-soft);color:var(--main-dark);}
.news__tag--roumu{background:#e2f4ea;color:#0d7a55;}
.news__tag--josei{background:#eef7dc;color:#5f7d1b;}
.news__body{display:block;}
.news__headline{font-size:1.04rem;font-weight:700;color:var(--text);line-height:1.55;margin:0 0 7px;}
.news__text{max-width:660px;color:var(--text-sub);font-size:.9rem;line-height:1.75;margin:0;}

@media (max-width:900px){
  .news{grid-template-columns:1fr;gap:28px;padding:40px 34px;}
}
@media (max-width:640px){
  .news{padding:28px 20px;border-radius:20px;}
  .news__title{font-size:1.42rem;}
  .news__entry{padding:18px 4px;}
}


/* === お問い合わせフォーム（モーダル） === */
.contact-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:24px;
  opacity:0;
  pointer-events:none;
  transition:opacity .38s ease;
}
.contact-modal.is-open{
  opacity:1;
  pointer-events:auto;
}
.contact-modal__overlay{
  position:absolute;
  inset:0;
  background:rgba(10,35,29,.38);
  backdrop-filter:blur(8px);
}
.contact-modal__dialog{
  position:relative;
  width:min(520px,100%);
  max-height:calc(100vh - 48px);
  overflow-y:auto;
  border-radius:28px;
  padding:38px 32px 32px;
  text-align:left;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(241,255,249,.97));
  border:1px solid rgba(0,169,143,.22);
  box-shadow:0 28px 80px rgba(0,95,68,.22);
  transform:translateY(14px) scale(.98);
  transition:transform .48s cubic-bezier(.16,1,.3,1);
}
.contact-modal.is-open .contact-modal__dialog{transform:translateY(0) scale(1);}
.contact-modal__close{
  position:absolute;
  top:14px;
  right:16px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:rgba(0,169,143,.10);
  color:#007a5b;
  font-size:1.4rem;
  cursor:pointer;
}
.contact-modal__eyebrow{
  color:#00a98f;
  font-weight:700;
  letter-spacing:.16em;
  font-size:.78rem;
  margin-bottom:8px;
}
.contact-modal__title{
  color:#143f35;
  font-size:1.35rem;
  margin:0 0 10px;
}
.contact-modal__lead{
  color:#4f695f;
  font-size:.92rem;
  line-height:1.8;
  margin:0 0 22px;
}
.contact-form__row{
  margin-bottom:16px;
}
.contact-form__label{
  display:block;
  color:#143f35;
  font-weight:700;
  font-size:.9rem;
  margin-bottom:6px;
}
.contact-form__req,
.contact-form__opt{
  display:inline-block;
  margin-left:6px;
  padding:1px 8px;
  border-radius:999px;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.04em;
  vertical-align:middle;
}
.contact-form__req{
  background:rgba(0,169,143,.12);
  color:#007a5b;
}
.contact-form__opt{
  background:rgba(79,105,95,.12);
  color:#4f695f;
}
.contact-form__input{
  width:100%;
  padding:13px 15px;
  border:1px solid rgba(0,169,143,.28);
  border-radius:14px;
  background:rgba(255,255,255,.85);
  color:#143f35;
  font-size:1rem;
  font-family:inherit;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.contact-form__input:focus{
  outline:0;
  border-color:#00a98f;
  box-shadow:0 0 0 3px rgba(0,169,143,.16);
}
.contact-form__textarea{
  resize:vertical;
  min-height:118px;
  line-height:1.7;
}
.contact-form__hp{position:absolute;left:-9999px;}
.contact-form__submit{
  width:100%;
  margin-top:4px;
  border:0;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,#00a98f 0%,#35d39a 58%,#9be15d 100%);
  box-shadow:0 16px 36px rgba(0,169,143,.24);
}
.contact-form__status{
  margin:14px 0 0;
  font-size:.92rem;
  line-height:1.7;
  min-height:1.2em;
}
.contact-form__status.is-sending{color:#4f695f;}
.contact-form__status.is-ok{color:#007a5b;font-weight:700;}
.contact-form__status.is-error{color:#c0392b;font-weight:700;}
.contact-form__note{
  margin:14px 0 0;
  color:#7a8c84;
  font-size:.78rem;
  line-height:1.7;
}
@media (max-width:640px){
  .contact-modal__dialog{padding:32px 20px 26px;border-radius:22px;}
  .contact-modal__title{font-size:1.2rem;}
}


/* === 2026-06-24 スマホ：タイトルの泣き別れ調整（PC表示には影響しません） === */
@media (max-width:640px){
  /* ヒーロー：1フレーズ＝1行に収め、末尾文字が落ちないように */
  .hero__title{
    font-size:1.62rem!important;
    line-height:1.5!important;
    letter-spacing:.01em!important;
  }
  .hero__title span{
    display:block!important;
    white-space:normal!important;
  }
  /* セクション見出し：短い見出しは1行に。長い見出しは均等2行に */
  .section__title{
    font-size:1.35rem!important;
    line-height:1.55!important;
    letter-spacing:.01em!important;
    text-wrap:balance;
  }
  /* CTA見出し：均等2行で末尾文字の孤立を防ぐ */
  .cta__title{
    font-size:1.6rem!important;
    line-height:1.5!important;
    letter-spacing:.01em!important;
    text-wrap:balance;
  }
  /* 記事の大見出しは括弧前などの自然な改行を維持（balanceでカタカナ語が割れるのを防ぐ） */
  .article__title{letter-spacing:.01em!important;}
  /* 記事の中見出し：均等割りで末尾文字の孤立を防ぐ */
  .article h2,
  .article h3{
    letter-spacing:.01em!important;
    text-wrap:balance;
  }
  .article h2{font-size:1.42rem!important;line-height:1.55!important;}
  /* モーダル見出し */
  .phone-modal__title,
  .contact-modal__title{
    letter-spacing:.01em!important;
    text-wrap:balance;
  }
}

/* === Payroll service LP === */
:is(.payroll-page,.roumu-page,.soumu-page) .article{
  max-width:900px;
}
:is(.payroll-page,.roumu-page,.soumu-page) .article__title{
  max-width:760px;
}
:is(.payroll-page,.roumu-page,.soumu-page) .article__lead{
  margin-bottom:30px;
  padding:34px clamp(24px,4vw,42px);
}
:is(.payroll-page,.roumu-page,.soumu-page) .article__lead::after{
  right:-70px;
  bottom:-80px;
  width:230px;
  height:230px;
  pointer-events:none;
}
.payroll-hero__copy{
  position:relative;
  z-index:1;
  max-width:690px;
  margin-bottom:12px!important;
}
.payroll-hero__actions{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:14px 22px;
  margin-top:26px;
}
.payroll-hero__area{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:18px 0 0!important;
  color:var(--main-dark);
  font-size:.83rem;
  font-weight:700;
}
.payroll-hero__area::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--main);
  box-shadow:0 0 0 5px rgba(18,169,111,.12);
}
.payroll-text-link,
.payroll-inline-link a{
  color:var(--main-dark);
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:var(--accent-2);
  text-decoration-thickness:2px;
  text-underline-offset:5px;
}
.payroll-text-link:hover,
.payroll-inline-link a:hover{
  color:var(--main);
  text-decoration-color:var(--main);
}
.payroll-text-link:focus-visible,
.payroll-inline-link a:focus-visible,
.payroll-toc a:focus-visible,
.payroll-faq summary:focus-visible{
  outline:3px solid rgba(18,169,111,.32);
  outline-offset:4px;
  border-radius:4px;
}
.payroll-toc{
  margin:0 0 58px;
  padding:22px 26px 24px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.78);
}
.payroll-toc__title{
  margin:0 0 12px!important;
  color:var(--main-dark);
  font-size:.9rem;
  font-weight:700;
}
.payroll-toc__list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 28px;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:payroll-toc;
}
.payroll-toc__list li{
  counter-increment:payroll-toc;
}
.payroll-toc__list a{
  display:flex;
  gap:10px;
  color:var(--text-sub);
  font-size:.9rem;
  line-height:1.65;
}
.payroll-toc__list a::before{
  content:counter(payroll-toc,decimal-leading-zero);
  flex:none;
  color:var(--main);
  font-family:Georgia,serif;
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.06em;
}
.payroll-toc__list a:hover{
  color:var(--main-dark);
}
.payroll-section{
  scroll-margin-top:100px;
}
.payroll-section__kicker{
  margin:54px 0 -38px!important;
  color:var(--main);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.08em;
}
.payroll-problem-list{
  margin-bottom:24px;
}
.payroll-benefits{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.payroll-benefit{
  padding:24px 22px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--white);
}
.payroll-benefit__label{
  display:inline-block;
  margin:0 0 8px!important;
  padding:3px 10px;
  border-radius:999px;
  background:var(--main-soft);
  color:var(--main-dark);
  font-size:.76rem;
  font-weight:700;
}
:is(.payroll-page,.roumu-page,.soumu-page) .payroll-benefit h3{
  margin:0 0 12px;
  font-size:1.05rem;
  line-height:1.6;
}
.payroll-benefit p:last-child,
.payroll-service p,
.payroll-strength p{
  margin:0!important;
  color:var(--text-sub);
  font-size:.9rem;
  line-height:1.85;
}
.payroll-services{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:0;
  margin:26px 0 20px;
}
.payroll-services::before{
  content:"";
  position:absolute;
  top:33px;
  bottom:33px;
  left:31px;
  width:2px;
  background:linear-gradient(180deg,var(--main),var(--accent));
}
.payroll-service{
  position:relative;
  display:grid;
  grid-template-columns:64px 1fr;
  gap:20px;
  padding:20px 0;
}
.payroll-service__num{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border:6px solid var(--bg);
  border-radius:50%;
  background:var(--main);
  color:var(--white);
  font-family:Georgia,serif;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.05em;
}
:is(.payroll-page,.roumu-page,.soumu-page) .payroll-service h3{
  margin:4px 0 6px;
}
.payroll-note{
  padding:14px 18px;
  border-radius:12px;
  background:var(--main-soft);
  color:var(--text-sub);
  font-size:.86rem;
}
.payroll-strengths{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  overflow:hidden;
  margin-top:24px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--line);
}
.payroll-strength{
  padding:28px 24px;
  background:var(--white);
}
:is(.payroll-page,.roumu-page,.soumu-page) .payroll-strength h3{
  margin:0 0 12px;
  font-size:1.04rem;
  line-height:1.6;
}
.payroll-inline-link{
  margin-top:18px!important;
  text-align:right;
  font-size:.9rem;
}
.payroll-flow{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin:28px 0 0;
  padding:0;
  list-style:none;
}
.payroll-flow__item{
  position:relative;
  padding:0 24px;
  text-align:center;
}
.payroll-flow__item:not(:last-child)::after{
  content:"";
  position:absolute;
  top:25px;
  right:-18px;
  width:36px;
  height:8px;
  border-top:2px solid var(--accent);
  border-radius:50%;
  transform:rotate(4deg);
}
.payroll-flow__num{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  margin:0 auto 16px;
  border-radius:50%;
  background:var(--main-soft);
  color:var(--main-dark);
  font-family:Georgia,serif;
  font-size:1.1rem;
  font-weight:700;
}
:is(.payroll-page,.roumu-page,.soumu-page) .payroll-flow h3{
  margin:0 0 10px;
  font-size:1rem;
}
.payroll-flow p{
  margin:0!important;
  color:var(--text-sub);
  font-size:.86rem;
  line-height:1.8;
}
.payroll-price{
  display:grid;
  grid-template-columns:minmax(190px,.8fr) 1.6fr auto;
  align-items:center;
  gap:28px;
  margin-top:24px;
  padding:28px 30px;
  border:1px solid var(--accent-2);
  border-radius:20px;
  background:linear-gradient(135deg,var(--white),var(--main-soft));
}
.payroll-price p{
  margin:0!important;
}
.payroll-price__label{
  color:var(--main-dark);
  font-weight:700;
}
.payroll-price__value{
  color:var(--main);
  font-size:1.35rem;
  font-weight:700;
}
.payroll-price__value span{
  margin-right:7px;
  color:var(--text-sub);
  font-size:.75rem;
  font-weight:500;
}
.payroll-faq__items{
  margin-top:24px;
  border-top:1px solid var(--line);
}
.payroll-faq details{
  border-bottom:1px solid var(--line);
}
.payroll-faq summary{
  position:relative;
  padding:20px 48px 20px 42px;
  color:var(--main-dark);
  font-weight:700;
  line-height:1.65;
  cursor:pointer;
  list-style:none;
}
.payroll-faq summary::-webkit-details-marker{
  display:none;
}
.payroll-faq summary::before{
  content:"Q";
  position:absolute;
  top:20px;
  left:8px;
  color:var(--main);
  font-family:Georgia,serif;
  font-size:1.05rem;
}
.payroll-faq summary::after{
  content:"＋";
  position:absolute;
  top:19px;
  right:10px;
  color:var(--main);
  font-size:1.15rem;
  transition:transform .2s ease;
}
.payroll-faq details[open] summary::after{
  transform:rotate(45deg);
}
.payroll-faq details p{
  margin:0 42px 20px!important;
  color:var(--text-sub);
}
.payroll-mini-cta{
  position:relative;
  overflow:hidden;
  margin-top:68px;
  padding:42px clamp(24px,5vw,50px);
  border-radius:26px;
  background:linear-gradient(135deg,#087a59,#12a96f 58%,#8fd66a);
  color:var(--white);
  text-align:center;
}
.payroll-mini-cta::before{
  content:"";
  position:absolute;
  top:-70px;
  right:-35px;
  width:200px;
  height:200px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
}
.payroll-mini-cta__eyebrow{
  position:relative;
  margin:0 0 8px!important;
  font-family:Georgia,serif;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  opacity:.86;
}
:is(.payroll-page,.roumu-page,.soumu-page) .article .payroll-mini-cta h2{
  position:relative;
  margin:0 0 12px;
  padding:0;
  color:var(--white);
  font-size:clamp(1.35rem,2.7vw,1.8rem);
}
:is(.payroll-page,.roumu-page,.soumu-page) .article .payroll-mini-cta h2::before{
  display:none;
}
.payroll-mini-cta > p:not(.payroll-mini-cta__eyebrow){
  position:relative;
  margin-bottom:22px;
}
.payroll-mini-cta .btn{
  position:relative;
  border:1px solid rgba(255,255,255,.7);
  background:var(--white)!important;
  color:var(--main-dark);
}

@media (max-width:800px){
  .payroll-benefits,
  .payroll-strengths{
    grid-template-columns:1fr;
  }
  .payroll-flow{
    grid-template-columns:1fr;
    gap:24px;
  }
  .payroll-flow__item{
    display:grid;
    grid-template-columns:52px 1fr;
    gap:18px;
    padding:0;
    text-align:left;
  }
  .payroll-flow__num{
    margin:0;
  }
  .payroll-flow__item:not(:last-child)::after{
    top:49px;
    right:auto;
    bottom:-28px;
    left:25px;
    width:2px;
    height:32px;
    border:0;
    background:var(--accent);
    transform:none;
  }
  .payroll-price{
    grid-template-columns:1fr;
    gap:14px;
  }
}

@media (max-width:640px){
  :is(.payroll-page,.roumu-page,.soumu-page) .article{
    padding-top:38px;
  }
  :is(.payroll-page,.roumu-page,.soumu-page) .article__lead{
    padding:26px 20px;
    border-radius:20px;
  }
  .payroll-hero__actions{
    align-items:stretch;
    flex-direction:column;
  }
  .payroll-hero__actions .btn{
    width:100%;
  }
  .payroll-toc{
    padding:20px;
  }
  .payroll-toc__list{
    grid-template-columns:1fr;
  }
  .payroll-section__kicker{
    margin-top:46px!important;
    margin-bottom:-34px!important;
    line-height:1.7;
  }
  .payroll-service{
    grid-template-columns:52px 1fr;
    gap:14px;
  }
  .payroll-service__num{
    width:52px;
    height:52px;
    border-width:5px;
  }
  .payroll-services::before{
    top:28px;
    bottom:28px;
    left:25px;
  }
  .payroll-price{
    padding:24px 20px;
  }
  .payroll-faq summary{
    padding-left:34px;
    padding-right:38px;
  }
  .payroll-faq summary::before{
    left:2px;
  }
  .payroll-faq details p{
    margin-right:8px!important;
    margin-left:34px!important;
  }
  .payroll-mini-cta{
    margin-top:54px;
    padding:34px 20px;
    border-radius:20px;
  }
}

@media (prefers-reduced-motion:reduce){
  .payroll-faq summary::after{
    transition:none;
  }
}

/* 個人情報保護方針・お問い合わせ前の確認 */
.privacy-policy{max-width:820px;margin:0 auto;padding:28px 0 80px;overflow-wrap:anywhere;}
.privacy-policy__eyebrow{color:var(--main-dark);font-size:.85rem;font-weight:700;letter-spacing:.08em;}
.privacy-policy h1{font-size:clamp(1.6rem,4.8vw,2.5rem);line-height:1.5;margin:10px 0 26px;}
.privacy-policy__intro{font-size:1.02rem;}
.privacy-policy section{margin-top:36px;}
.privacy-policy h2{font-size:clamp(1.1rem,3.5vw,1.35rem);line-height:1.65;padding-bottom:10px;margin-bottom:16px;border-bottom:1px solid var(--line);}
.privacy-policy p + p{margin-top:14px;}
.privacy-policy ul{list-style:disc;padding-left:1.4em;margin:16px 0;}
.privacy-policy li + li{margin-top:10px;}
.privacy-policy a:not(.btn),.contact-form__privacy a{text-decoration:underline;text-underline-offset:.2em;color:var(--main-dark);}
.privacy-policy__notice{padding:18px 22px;border-left:3px solid var(--main);background:var(--sub);}
.privacy-policy__details > div{display:grid;grid-template-columns:6em 1fr;gap:18px;padding:12px 0;border-bottom:1px solid var(--line);}
.privacy-policy__details dt{font-weight:700;}
.privacy-policy__date{margin:36px 0 24px;color:var(--text-sub);font-size:.9rem;}
.contact-form__privacy{margin:8px 0 22px;font-size:.85rem;line-height:1.85;color:var(--text);}
.contact-form__privacy p + p{margin-top:8px;}
.contact-form__consent{display:flex;align-items:flex-start;gap:10px;margin-top:16px;cursor:pointer;}
.contact-form__consent input{flex:none;width:20px;height:20px;margin:3px 0 0;accent-color:var(--main-dark);}
.contact-form__consent input:focus-visible,.contact-form__privacy a:focus-visible,.privacy-policy a:focus-visible{outline:3px solid var(--main-dark);outline-offset:4px;}
@media(max-width:480px){
  .privacy-policy__details > div{grid-template-columns:1fr;gap:4px;}
  .privacy-policy{padding-bottom:48px;}
}
/* 2026-09-10 実ロゴ。画像の縦横比と原画を保持 */
.office-logo{display:block;flex:none;width:48px;height:50px;object-fit:contain;}
.portrait-break,.portrait-only{display:none;}

/* スマートフォン縦長表示だけの調整 */
@media (max-width:640px) and (orientation:portrait){
  .portrait-break{display:block;}
  .portrait-only{display:inline;}
  .portrait-hide{display:none;}
  .header .logo{gap:8px;}
  .header .office-logo{width:40px;height:42px;}
  .header .logo__text{display:block;font-size:clamp(.72rem,3.1vw,.86rem);line-height:1.5;white-space:nowrap;}
  .footer__brand{align-items:center;line-height:1.65;}
  .hero__body{display:flex;flex-direction:column;}
  .hero__body .hero__lead{order:0;}
  .hero__body .hero__title{
    order:1;font-size:clamp(1.85rem,8.2vw,2.25rem)!important;
    line-height:1.48!important;letter-spacing:.015em!important;
    overflow:visible;margin-bottom:22px!important;
  }
  .hero__body .hero__title > span{
    display:block!important;white-space:nowrap!important;
    opacity:1;transform:none;
    animation:portrait-title-in .85s cubic-bezier(.16,1,.3,1) both!important;
  }
  .hero__body .hero__title > span:nth-child(2){
    color:var(--main-dark);
    text-decoration:underline;text-decoration-color:var(--accent-2);
    text-decoration-thickness:.12em;text-underline-offset:.15em;
    animation-delay:.18s!important;
  }
  .hero__body .hero__message{order:2;margin-bottom:18px;}
  .hero__message .hero__msgline:nth-child(5),
  .hero__message .hero__msgline:nth-child(6){
    display:inline!important;opacity:1!important;transform:none!important;animation:none!important;
  }
  .hero__message .hero__msgline:nth-child(5)::before{content:"";display:block;margin-top:12px;}
  .hero__body .hero__points{order:3;margin-bottom:20px!important;animation-delay:.35s!important;}
  .hero__body .hero__actions{order:4;margin:0!important;gap:12px!important;animation-delay:.45s!important;}
  .hero__actions .btn{width:100%!important;justify-content:space-between;}
  .news__desc br{display:none;}
  #reasons .section__title,#plans .section__title,#about .section__title{text-wrap:initial;}
  #about .about{gap:12px!important;row-gap:12px!important;}
  #about .about__body{margin-bottom:0!important;padding-bottom:0!important;}
  #about .about__text:last-child{margin-bottom:0!important;}
  #about .about__info{margin-top:0!important;padding-top:0!important;}
  #about .info{margin-top:0!important;}
  .greeting__sign{font-size:clamp(.8rem,3.45vw,1rem);line-height:1.85;}
}
@keyframes portrait-title-in{
  from{opacity:0;transform:translateY(12px);}
  to{opacity:1;transform:translateY(0);}
}
@media (max-width:640px) and (orientation:portrait) and (prefers-reduced-motion:reduce){
  .hero__body .hero__title,.hero__body .hero__title > span,
  .hero__body .hero__actions,.hero__body .hero__points,
  .hero__message .hero__msgline{
    animation:none!important;opacity:1!important;transform:none!important;
  }
}
@media (max-width:640px) and (orientation:portrait){
  .floating-cta.hero-in-view{opacity:0!important;visibility:hidden;pointer-events:none;}
}
/* トップ画像：入口 → 事務所内 → 外観。3秒間隔、ぼかしながらフェード。 */
.hero .hero__photo{
  animation:heroPhotoSoftFade 9s linear infinite!important;
  transform:none!important;
  will-change:opacity,filter;
}
.hero .hero__photo--large{animation-delay:-.75s!important;}
.hero .hero__photo--small{animation-delay:2.25s!important;}
.hero .hero__photo--thin{animation-delay:5.25s!important;}
.hero .hero__photo img{animation:none!important;transform:none!important;}
@keyframes heroPhotoSoftFade{
  0%{opacity:0;filter:blur(8px);}
  8.333%,33.333%{opacity:1;filter:blur(0);}
  41.667%,100%{opacity:0;filter:blur(8px);}
}

/* MESSAGE：相談風景の二人を中心に拡大表示 */
.greeting__person.greeting__photoOnly{overflow:hidden!important;border-radius:28px!important;}
.greeting__photoOnly img{object-position:48% 40%!important;transform:scale(1.25);transform-origin:48% 38%;opacity:1!important;}
@media(max-width:640px){.greeting__person.greeting__photoOnly{border-radius:22px!important;}}

/* メールでの相談・コピー可能な宛先 */
.contact-email{max-width:620px;margin:26px auto 0;text-align:center;line-height:1.8;}
.contact-email__address{display:block;margin:6px 0 12px;font-size:clamp(1rem,4.5vw,1.35rem);font-weight:700;text-decoration:underline;text-underline-offset:4px;user-select:text;overflow-wrap:anywhere;}
.contact-email__copy{padding:9px 18px;border:1px solid currentColor;border-radius:999px;background:transparent;color:inherit;font:inherit;cursor:pointer;}
.contact-email__copy:focus-visible{outline:3px solid currentColor;outline-offset:4px;}
.contact-email__status{min-height:1.8em;font-size:.86rem;margin-top:6px;}
.contact-email__note{font-size:.83rem;margin-top:8px;line-height:1.8;}
.contact-email__note a{text-decoration:underline;}
/* 2026-10-26: 料金を一時非表示。将来の再掲載用にHTMLは保持。 */
[data-pricing-hidden][hidden]{display:none!important;}
.cta__estimate{margin:18px 0 24px;line-height:1.9;}
/* 古い複数の登場アニメーションを解除し、上から順に表示する。 */
.hero .hero__body, .hero .hero__body > *, .hero .hero__body .hero__lead span,
.hero .hero__body .hero__title > span, .hero .hero__body .hero__msgline,
.hero .hero__body .hero__points li, .hero .hero__body .hero__actions .btn{
  animation:none!important;opacity:1!important;transform:none!important;filter:none!important;
}
.hero .hero__body .hero__lead,
.hero .hero__body .hero__title > span,
.hero .hero__body .hero__msgline,
.hero .hero__body .hero__actions,
.hero .hero__body .hero__points{
  animation:none!important;
}
.hero .hero__body .hero__lead{--hero-delay:0s;margin-bottom:22px!important;}
.hero .hero__body .hero__title{margin-bottom:24px!important;}
.hero .hero__body .hero__title > span:nth-child(1){--hero-delay:.2s;}
.hero .hero__body .hero__title > span:nth-child(2){--hero-delay:.4s;}
.hero .hero__body .hero__message{line-height:1.85!important;margin-bottom:24px!important;}
.hero .hero__body .hero__msgline:nth-child(1){--hero-delay:.65s;}
.hero .hero__body .hero__msgline:nth-child(2){--hero-delay:.8s;}
.hero .hero__body .hero__msgline:nth-child(3){--hero-delay:.95s;}
.hero .hero__body .hero__msgline:nth-child(4){--hero-delay:1.1s;}
.hero .hero__body .hero__msgline:nth-child(5){--hero-delay:1.3s;margin-top:16px;}
.hero .hero__body .hero__msgline:nth-child(6){--hero-delay:1.45s;}
.hero .hero__body .hero__actions{--hero-delay:1.65s;margin-bottom:22px!important;}
.hero .hero__body .hero__points{--hero-delay:1.85s;}
@keyframes heroOrderedReveal{from{opacity:0;}to{opacity:1;}}
@media(max-width:640px) and (orientation:portrait){
  .hero .hero__body .hero__points{--hero-delay:1.65s;margin-bottom:22px!important;}
  .hero .hero__body .hero__actions{--hero-delay:1.85s;}
}
/* OSの動作軽減設定でも写真は循環。位置移動やズームは行わない。 */
.hero .hero__visual .hero__photo{
  animation:none!important;transform:none!important;opacity:0!important;filter:blur(8px)!important;
  transition:opacity .75s ease,filter .75s ease!important;pointer-events:none;
}
.hero .hero__visual .hero__photo.is-active{opacity:1!important;filter:blur(0)!important;}
.hero .hero__visual .hero__photo img{animation:none!important;transform:none!important;}

.hero .hero__body .hero-reveal-item:not(.is-revealed){animation:none!important;opacity:0!important;transition:none!important;}
.hero .hero__body .hero-reveal-item.is-revealed{opacity:1!important;transition:opacity .55s ease!important;}
