/* =========================================================
   Light Summer — "陽だまり" design (original)
   cream base / sun orange / navy text / mint support
   ========================================================= */
:root {
  --cream: #fff8ec;
  --cream-2: #fdf0d9;
  --white: #fff;
  --orange: #ff8a1f;
  --orange-dk: #e8700a;
  --yellow: #ffc93c;
  --yellow-lt: #ffe7a3;
  --navy: #1e2a44;
  --navy-2: #2b3a5c;
  --ink-2: #56607a;
  --line: #f0e2c8;
  --mint: #e9f4ef;
  --mint-dk: #2f9e7a;
  --sky: #e8f1fb;
  --sky-dk: #3c7fd1;
  --pink-dk: #d9577a;
  --red: #e5483a;
  --r-lg: 3.2rem;
  --r-md: 2rem;
  --r-sm: 1.2rem;
  --shadow: 0 1rem 3rem rgba(160, 110, 40, .10);
  --shadow-sm: 0 .4rem 1.4rem rgba(160, 110, 40, .10);
  --ff: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --ff-head: var(--ff);  /* headings: Zen Kaku Gothic New (was Zen Maru Gothic; changed for a more corporate look) */
  --ff-en: "Outfit", var(--ff);
  --ease: cubic-bezier(.22, 1, .36, 1);
  --hd-h: 8.8rem;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 62.5%; scroll-behavior: smooth; scroll-padding-top: var(--hd-h); }
@media (min-width: 1025px) and (max-width: 1440px) { html { font-size: calc(100vw / 144); } }
body { margin: 0; background: var(--cream); color: var(--navy); font-family: var(--ff); font-weight: 500;
  font-size: 1.6rem; line-height: 1.9; letter-spacing: .04em; font-feature-settings: "palt"; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, ul, ol, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
picture { display: block; overflow: hidden; }
picture img { width: 100%; height: 100%; object-fit: cover; }
mark { background: linear-gradient(transparent 62%, var(--yellow-lt) 62%, var(--yellow-lt) 92%, transparent 92%); color: inherit; padding: 0 .1em; }
strong { font-weight: 700; }

.wrap { width: min(120rem, 100% - 8rem); margin-inline: auto; }
.wrap--narrow { width: min(88rem, 100% - 8rem); }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 1.2rem; padding: 1.4rem 2.6rem; border-radius: 9999px;
  font-family: var(--ff-head); font-weight: 700; font-size: 1.5rem; line-height: 1; letter-spacing: .06em; white-space: nowrap;
  transition: transform .35s var(--ease), box-shadow .35s, background-color .3s, color .3s; }
.btn:hover { transform: translateY(-.3rem); }
.btn--orange { background: var(--orange); color: var(--white); box-shadow: 0 .6rem 0 var(--orange-dk); }
.btn--orange:hover { box-shadow: 0 .9rem 0 var(--orange-dk); }
.btn--orange:active { transform: translateY(.3rem); box-shadow: 0 .2rem 0 var(--orange-dk); }
.btn--line { background: var(--white); color: var(--navy); box-shadow: inset 0 0 0 .2rem var(--navy); }
.btn--lg { padding: 2rem 3.6rem; font-size: 1.7rem; }
.btn--block { display: flex; width: 100%; }
.btn-arrow { position: relative; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--white); flex-shrink: 0; }
.btn-arrow::before { content: ""; position: absolute; inset: 0; margin: auto; width: .7rem; height: .7rem; transform: translateX(-.1rem) rotate(45deg);
  border-top: .2rem solid var(--orange); border-right: .2rem solid var(--orange); }

/* ---------- header (floating pill) ---------- */
.hd { position: fixed; top: 1.6rem; left: 0; right: 0; z-index: 100; pointer-events: none; }
.hd-inner { pointer-events: auto; display: flex; align-items: center; gap: 3.2rem; width: min(128rem, 100% - 3.2rem); margin: 0 auto;
  padding: 1rem 1rem 1rem 2.4rem; background: rgba(255, 255, 255, .88); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-radius: 9999px; box-shadow: var(--shadow-sm); }
.hd-logo { display: flex; align-items: center; gap: .8rem; }
.hd-logo img { width: 3.6rem; height: 3.6rem; }
.logo-txt { display: block; line-height: 1; white-space: nowrap; }
.logo-txt b { display: block; font-family: var(--ff-en); font-weight: 700; font-size: 2rem; letter-spacing: .14em; }
.logo-txt small { display: block; margin-top: .5rem; font-size: 1rem; font-weight: 700; letter-spacing: .2em; color: var(--ink-2); }
.hd-nav { margin-left: auto; }
.hd-nav ul { display: flex; gap: 3.2rem; }
.hd-nav a { font-size: 1.4rem; font-weight: 700; transition: color .3s; }
.hd-nav a:hover { color: var(--orange); }
.hd-cta { padding: 1.4rem 2rem 1.4rem 2.6rem; box-shadow: none; }
.hd-cta:hover { box-shadow: none; }
.hd-menu { display: none; }

/* ---------- section shells ---------- */
.sec { position: relative; padding: 14rem 0; }
.sec-head { margin-bottom: 6.4rem; }
.sec-head--center { text-align: center; }
.sec-en { display: inline-flex; align-items: center; gap: 1rem; font-family: var(--ff-en); font-weight: 700; font-size: 1.5rem;
  letter-spacing: .2em; text-transform: uppercase; color: var(--orange); }
.sec-en::before { content: ""; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 .4rem rgba(255, 201, 60, .3); }
.sec-ttl { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 4.4rem; line-height: 1.45; letter-spacing: .04em; }
.sec-lead { margin-top: 2.4rem; color: var(--ink-2); font-size: 1.6rem; }

.js .js-show { opacity: 0; transform: translateY(2.4rem); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.js .js-show.is-shown { opacity: 1; transform: none; }

/* =========================================================
   1. hero
   ========================================================= */
.hero { position: relative; padding: calc(var(--hd-h) + 7rem) 0 0; overflow: hidden; }
.hero-sun { position: absolute; right: -16rem; top: -18rem; width: 72rem; height: 72rem; border-radius: 50%;
  background: radial-gradient(circle, var(--yellow-lt) 0 40%, rgba(255, 231, 163, .5) 40% 58%, rgba(255, 231, 163, .22) 58% 76%, transparent 76%); }
.hero-inner { position: relative; display: grid; grid-template-columns: 1fr 50rem; gap: 6rem; align-items: center; }
.hero-label { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; font-weight: 700; font-size: 1.5rem; }
.hero-label span { padding: .4rem 1.2rem; border-radius: .8rem; background: var(--navy); color: var(--white); font-size: 1.3rem; line-height: 1.5; }
.hero-ttl { margin-top: 2.8rem; font-family: var(--ff-head); font-weight: 900; font-size: 6.4rem; line-height: 1.35; letter-spacing: .04em; }
.hero-txt { margin-top: 2.8rem; font-size: 1.7rem; color: var(--ink-2); }
.hero-btns { display: flex; flex-wrap: wrap; gap: 1.6rem; margin-top: 4rem; }
.hero-assure { display: flex; flex-wrap: wrap; gap: .6rem 2rem; margin-top: 2.4rem; font-size: 1.4rem; font-weight: 700; color: var(--ink-2); }
.hero-assure li::before { content: "✓"; margin-right: .5rem; color: var(--orange); }
.hero-visual { position: relative; }
.hero-photo { width: 50rem; height: 56rem; border-radius: 25rem 25rem var(--r-lg) var(--r-lg); box-shadow: var(--shadow); border: .8rem solid var(--white); }
.hero-points { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 8rem; margin-bottom: 0;
  background: var(--white); border-radius: var(--r-lg) var(--r-lg) 0 0; padding: 4rem 2rem; }
.hero-points li { text-align: center; line-height: 1.3; }
.hero-points li + li { border-left: .2rem dashed var(--line); }
.hero-points .ttl { font-size: 1.3rem; font-weight: 700; color: var(--orange); letter-spacing: .12em; }
.hero-points .val { margin-top: 1rem; font-family: var(--ff-head); font-weight: 700; font-size: 1.8rem; }
.hero-points .val b { margin: 0 .2rem; font-family: var(--ff-head); font-weight: 900; font-size: 3.4rem; }
.hero-points .note { margin-top: .8rem; font-size: 1.3rem; color: var(--ink-2); }

/* =========================================================
   2. worries
   ========================================================= */
.worries { background: var(--white); padding-top: 10rem; }
.worries-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3.2rem; }
.worries-card { background: var(--cream); border-radius: var(--r-md); overflow: hidden; }
.worries-card picture { height: 22rem; }
.worries-quote { position: relative; margin: 2.8rem 2.8rem 0; padding-left: 3.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 2rem; line-height: 1.5; }
.worries-quote::before { content: "“"; position: absolute; left: 0; top: -1.2rem; font-family: var(--ff-en); font-size: 6rem; line-height: 1; color: var(--orange); }
.worries-txt { margin: 1.6rem 2.8rem 3.2rem; font-size: 1.5rem; color: var(--ink-2); }

/* band */
.band { background: var(--orange); color: var(--white); overflow: hidden; }
.band-inner { position: relative; display: flex; align-items: center; justify-content: center; gap: 2.4rem; min-height: 14rem; }
.band-inner::before { content: ""; width: 5.6rem; height: 5.6rem; flex-shrink: 0; background: url("../img/logo-mark.svg") center / contain no-repeat; filter: brightness(0) invert(1); }
.band-txt { font-family: var(--ff-head); font-weight: 900; font-size: 3.6rem; letter-spacing: .06em; line-height: 1.4; }
.band-txt b { color: var(--yellow-lt); }
.nw { display: inline-block; }  /* keep a phrase on one line when wrapping */

/* =========================================================
   3. reasons
   ========================================================= */
.reasons { background: var(--cream); }
.reasons .wrap { display: grid; grid-template-columns: 34rem 1fr; gap: 6.4rem; align-items: start; }
.reasons .sec-head { position: sticky; top: calc(var(--hd-h) + 4rem); margin-bottom: 0; }
.reasons-list { display: grid; grid-template-columns: 1fr 1fr; gap: 2.4rem; }
.reasons-item { position: relative; padding: 3.6rem 3.2rem 3.2rem; background: var(--white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.reasons-item .num { display: inline-block; font-family: var(--ff-en); font-weight: 800; font-size: 4.4rem; line-height: 1; color: var(--yellow);
  -webkit-text-stroke: .1rem var(--orange); }
.reasons-item h3 { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 2rem; line-height: 1.5; }
.reasons-item p { margin-top: 1.2rem; font-size: 1.5rem; color: var(--ink-2); }
.reasons-item p strong { color: var(--navy); background: linear-gradient(transparent 65%, var(--yellow-lt) 65%); }

/* =========================================================
   4. flow
   ========================================================= */
.flow { background: var(--mint); }
.flow .sec-en { color: var(--mint-dk); }
.flow .sec-en::before { background: var(--mint-dk); box-shadow: 0 0 0 .4rem rgba(47, 158, 122, .2); }
.flow-list { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.4rem; counter-reset: flow; }
.flow-list::before { content: ""; position: absolute; left: 6%; right: 6%; top: 2.4rem; border-top: .3rem dotted var(--mint-dk); opacity: .5; }
.flow-item { position: relative; text-align: center; }
.flow-step { position: relative; z-index: 1; display: inline-flex; align-items: baseline; gap: .4rem; padding: .8rem 2rem; border-radius: 9999px;
  background: var(--mint-dk); color: var(--white); font-family: var(--ff-en); font-weight: 700; font-size: 1.3rem; letter-spacing: .12em; line-height: 1.4; }
.flow-step b { font-size: 2rem; }
.flow-item picture { height: 18rem; margin-top: 2.4rem; border-radius: var(--r-md); border: .6rem solid var(--white); }
.flow-item h3 { margin-top: 2rem; font-family: var(--ff-head); font-weight: 900; font-size: 2.2rem; line-height: 1.4; }
.flow-item p { margin-top: 1rem; font-size: 1.45rem; color: var(--ink-2); text-align: left; }

/* =========================================================
   5. service (navy)
   ========================================================= */
.service { background: var(--navy); color: var(--white); border-radius: 6.4rem 6.4rem 0 0; margin-top: -4rem; }
.service .sec-lead { color: rgba(255, 255, 255, .75); }
.service mark { background: linear-gradient(transparent 62%, rgba(255, 138, 31, .55) 62%, rgba(255, 138, 31, .55) 92%, transparent 92%); }
.service-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 4rem; margin-bottom: 6.4rem; }
.service-head .sec-head { margin-bottom: 0; }
.service-head .sec-lead { margin-top: 0; text-align: right; }
.service-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.service-item { padding: 3.2rem; border-radius: var(--r-md); background: var(--navy-2); border: 1px solid rgba(255, 255, 255, .08);
  transition: transform .35s var(--ease), background-color .3s; }
.service-item:hover { transform: translateY(-.4rem); background: #33446a; }
.service-item .ico { display: flex; align-items: center; justify-content: center; width: 5.2rem; height: 5.2rem; margin-bottom: 2rem; border-radius: 1.4rem; background: rgba(255, 255, 255, .08); color: var(--yellow); }
.service-item .ico svg, .quality-item .ico svg { width: 2.8rem; height: 2.8rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.service-item .tag { display: inline-block; padding: .3rem 1.2rem; border-radius: .6rem; background: var(--orange); color: var(--white);
  font-size: 1.2rem; font-weight: 700; line-height: 1.6; }
.service-item .tag--b { background: var(--yellow); color: var(--navy); }
.service-item .tag--c { background: #7fd1b0; color: var(--navy); }
.service-item .tag--d { background: #9db7e8; color: var(--navy); }
.service-item h3 { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 2.2rem; line-height: 1.4; }
.service-item p { margin-top: 1rem; font-size: 1.45rem; color: rgba(255, 255, 255, .72); }
.tools { margin-top: 4.8rem; padding: 3.6rem 4rem; border-radius: var(--r-md); background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); }
.tools-ttl { font-family: var(--ff-head); font-weight: 700; font-size: 1.8rem; }
.tools-body { display: grid; gap: 1.6rem; margin-top: 2rem; }
.tools-row { display: grid; grid-template-columns: 10rem 1fr; align-items: start; gap: 2rem; }
.tools-cat { padding-top: .5rem; font-size: 1.3rem; font-weight: 700; color: var(--yellow); }
.tools-row ul { display: flex; flex-wrap: wrap; gap: .8rem; }
.tools-row li { padding: .5rem 1.4rem; border-radius: 9999px; background: rgba(255, 255, 255, .1); font-size: 1.35rem; font-weight: 500; line-height: 1.6; }
.tools-note { margin-top: 2rem; font-size: 1.2rem; color: rgba(255, 255, 255, .55); }
.service-note { margin-top: 3.2rem; font-size: 1.3rem; color: rgba(255, 255, 255, .6); }

/* =========================================================
   4. compare
   ========================================================= */
.compare { background: var(--white); }
.compare-hint { display: none; }
.compare-scroll { overflow-x: auto; padding-top: .4rem; }
.compare-table { width: 100%; min-width: 96rem; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.compare-table th, .compare-table td { padding: 2.2rem 2.4rem; border-bottom: 1px solid var(--line); font-size: 1.45rem; line-height: 1.6; text-align: center; vertical-align: middle; }
.compare-table thead th { padding: 2.4rem; border-bottom: 0; font-family: var(--ff-head); font-weight: 900; font-size: 1.8rem; background: var(--cream); }
.compare-table thead th:last-child { border-radius: 0 var(--r-md) 0 0; }
.sec-ttl mark { display: inline-block; }  /* keep the highlighted phrase on one line */
.compare-table thead td { width: 20rem; border-bottom: 0; }
.compare-table tbody th { font-family: var(--ff-head); font-weight: 700; font-size: 1.6rem; text-align: left; }
.compare-table td { color: var(--ink-2); }
.compare-table .mk { display: block; margin-bottom: .4rem; font-style: normal; font-weight: 700; font-size: 2.8rem; line-height: 1.2; color: #c4bba9; }
.compare-table .mk--ok { color: var(--mint-dk); }
.compare-table .mk--best { color: var(--orange); }
.compare-table .is-us { background: #fff6e6; color: var(--navy); font-weight: 700; border-left: .3rem solid var(--orange); border-right: .3rem solid var(--orange); }
.compare-table thead .is-us { display: table-cell; background: var(--orange); color: var(--white); border-radius: var(--r-md) var(--r-md) 0 0; font-size: 2rem; }
.compare-table thead .is-us img { display: inline-block; width: 2.8rem; height: 2.8rem; margin: -.4rem .8rem 0 0; vertical-align: middle; filter: brightness(0) invert(1); }
.compare-table tbody tr:last-child .is-us { border-bottom: .3rem solid var(--orange); border-radius: 0 0 var(--r-md) var(--r-md); }
.compare-note { margin-top: 2.4rem; text-align: center; font-size: 1.3rem; color: var(--ink-2); }

/* =========================================================
   quality / information management
   ========================================================= */
.quality { background: var(--cream); }
.quality-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.quality-item { padding: 3.6rem 2.8rem 3.2rem; background: var(--white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); text-align: center; }
.quality-item .ico { display: inline-flex; align-items: center; justify-content: center; width: 6.4rem; height: 6.4rem; border-radius: 50%; background: var(--yellow-lt); color: var(--orange-dk); }
.quality-item h3 { margin-top: 2rem; font-family: var(--ff-head); font-weight: 700; font-size: 1.9rem; line-height: 1.5; }
.quality-item p { margin-top: 1.2rem; font-size: 1.45rem; line-height: 1.8; color: var(--ink-2); text-align: left; }

/* =========================================================
   model cases
   ========================================================= */
.cases { background: var(--cream); padding-top: 18rem; }
.case-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4rem; }
.case-card { display: flex; flex-direction: column; padding: 3.2rem; background: var(--white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.case-head { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; padding-bottom: 1.6rem; border-bottom: 1px solid var(--line); }
.case-no { font-family: var(--ff-en); font-weight: 700; font-size: 1.3rem; letter-spacing: .14em; color: var(--orange); text-transform: uppercase; }
.case-meta { text-align: right; font-size: 1.25rem; line-height: 1.5; color: var(--ink-2); }
.case-meta b { display: block; font-size: 1.5rem; color: var(--navy); }
.case-issue { position: relative; margin-top: 2rem; padding-left: 2.8rem; font-family: var(--ff-head); font-weight: 700; font-size: 1.8rem; line-height: 1.6; }
.case-issue::before { content: "“"; position: absolute; left: 0; top: -.6rem; font-family: var(--ff-en); font-size: 4.4rem; line-height: 1; color: var(--orange); }
.case-body { display: grid; gap: 1.6rem; margin: 2.4rem 0 0; }
.case-body dt { font-size: 1.2rem; font-weight: 700; letter-spacing: .08em; color: var(--orange-dk); }
.case-body dd { margin: .6rem 0 0; font-size: 1.45rem; line-height: 1.8; }
.case-chips { display: flex; flex-wrap: wrap; gap: .6rem; }
.case-chips li { padding: .3rem 1.2rem; border-radius: .6rem; background: var(--cream); font-size: 1.3rem; font-weight: 700; line-height: 1.6; }
.case-note { margin-top: 2.4rem; text-align: center; font-size: 1.3rem; color: var(--ink-2); }

/* =========================================================
   mid CTA (sits on the navy/white seam)
   ========================================================= */
.cta { position: relative; background: linear-gradient(var(--cream) 50%, var(--white) 50%); }
.cta-box { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 4rem; padding: 5.6rem 6.4rem;
  border-radius: var(--r-lg); background: var(--orange); color: var(--white); overflow: hidden; box-shadow: var(--shadow); }
.cta-box::before { content: ""; position: absolute; right: -10rem; top: -14rem; width: 40rem; height: 40rem; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 201, 60, .55) 0 38%, rgba(255, 201, 60, .25) 38% 60%, transparent 60%); pointer-events: none; }
.cta-copy, .cta-box .btn { position: relative; }
.cta-en { font-family: var(--ff-en); font-weight: 700; font-size: 1.4rem; letter-spacing: .2em; text-transform: uppercase; color: var(--yellow-lt); }
.cta-ttl { margin-top: 1rem; font-family: var(--ff-head); font-weight: 900; font-size: 3.2rem; line-height: 1.5; }
.cta-points { display: flex; flex-wrap: wrap; gap: .8rem 2.4rem; margin-top: 2rem; font-size: 1.5rem; font-weight: 700; }
.cta-points li::before { content: "✓"; margin-right: .6rem; color: var(--yellow-lt); }
.btn--white { background: var(--white); color: var(--orange-dk); box-shadow: 0 .6rem 0 rgba(140, 60, 0, .35); }
.btn--white:hover { box-shadow: 0 .9rem 0 rgba(140, 60, 0, .35); }
.btn--white .btn-arrow { background: var(--orange); }
.btn--white .btn-arrow::before { border-color: var(--white); }

/* =========================================================
   7. price
   ========================================================= */
.price { background: var(--white); }
.price-inner { display: grid; grid-template-columns: 1fr 48rem; gap: 8rem; align-items: center; }
.price-rules { display: grid; gap: 1.2rem; }
.price-rules li { display: grid; grid-template-columns: 14rem 1fr; align-items: center; gap: 2rem; padding: 2rem 2.4rem; background: var(--cream); border-radius: var(--r-sm); }
.price-rules b { font-family: var(--ff-head); font-weight: 900; font-size: 1.7rem; color: var(--orange); }
.price-rules span { font-size: 1.5rem; line-height: 1.7; }
.price-card { position: relative; padding: 5.6rem 4.8rem 4rem; border-radius: var(--r-lg); background: var(--cream); border: .3rem solid var(--orange); text-align: center; }
.price-card-badge { position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); padding: .8rem 2.4rem; border-radius: 9999px;
  background: var(--navy); color: var(--white); font-family: var(--ff-head); font-weight: 700; font-size: 1.4rem; line-height: 1.4; white-space: nowrap; }
.price-card-ttl { font-family: var(--ff-head); font-weight: 900; font-size: 2.8rem; line-height: 1.3; }
.price-card-label { margin-top: .6rem; font-size: 1.4rem; color: var(--ink-2); }
.price-card-quote { margin-top: 2.4rem; font-family: var(--ff-head); font-weight: 700; font-size: 1.8rem; line-height: 1.5; color: var(--navy); }
.price-card-quote b { display: inline-block; margin-top: .4rem; font-weight: 900; font-size: 3.6rem; color: var(--orange); }
.price-card-tax { margin-top: .8rem; font-size: 1.3rem; color: var(--ink-2); }
.price-card-list { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 1.6rem; margin: 3.2rem 0; text-align: left; }
.price-card-list li { position: relative; padding-left: 2.4rem; font-size: 1.45rem; line-height: 1.6; }
.price-card-list li::before { content: ""; position: absolute; left: 0; top: .45em; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--yellow); }
.price-card-sub { margin-top: 2rem; font-size: 1.3rem; color: var(--ink-2); }

/* =========================================================
   8. faq
   ========================================================= */
.faq { background: var(--sky); }
.faq .sec-en { color: var(--sky-dk); }
.faq .sec-en::before { background: var(--sky-dk); box-shadow: 0 0 0 .4rem rgba(60, 127, 209, .2); }
.faq-list { display: grid; gap: 1.6rem; }
.faq-item { background: var(--white); border-radius: var(--r-md); box-shadow: 0 .2rem 0 rgba(60, 127, 209, .12); }
.faq-item summary { display: flex; align-items: center; gap: 2rem; padding: 2.4rem 2.8rem; list-style: none; cursor: pointer; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item b { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 4rem; height: 4rem; border-radius: 50%;
  background: var(--sky-dk); color: var(--white); font-family: var(--ff-en); font-weight: 700; font-size: 1.8rem; line-height: 1; }
.faq-item summary span { flex: 1; font-family: var(--ff-head); font-weight: 700; font-size: 1.7rem; line-height: 1.6; }
.faq-item summary i { position: relative; flex-shrink: 0; width: 2.4rem; height: 2.4rem; }
.faq-item summary i::before, .faq-item summary i::after { content: ""; position: absolute; inset: 0; margin: auto; width: 1.6rem; height: .3rem; border-radius: 9999px; background: var(--sky-dk); transition: transform .3s; }
.faq-item summary i::after { transform: rotate(90deg); }
.faq-item[open] summary i::after { transform: rotate(0); }
.faq-a { display: flex; gap: 2rem; padding: 0 2.8rem 2.8rem; }
.faq-a b { background: var(--orange); }
.faq-a p { padding-top: .5rem; font-size: 1.5rem; color: var(--ink-2); }

/* =========================================================
   9. message
   ========================================================= */
.message { background: var(--cream); overflow: hidden; text-align: center; }
.message-sun { position: absolute; left: 50%; top: 6rem; width: 64rem; height: 64rem; transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(circle, var(--yellow-lt) 0 35%, rgba(255, 231, 163, .45) 35% 55%, rgba(255, 231, 163, .18) 55% 75%, transparent 75%); }
.message-inner { position: relative; }
.message-ttl { margin-top: 2.4rem; font-family: var(--ff-head); font-weight: 900; font-size: 5.6rem; line-height: 1.45; letter-spacing: .06em; }
.message-txt { margin-top: 4rem; font-size: 1.7rem; line-height: 2.1; }
.message-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4rem; margin-top: 8rem; }
.message-photos picture { height: 24rem; border-radius: var(--r-md); }
.message-photos picture:nth-child(2) { transform: translateY(4rem); }

/* =========================================================
   10. contact
   ========================================================= */
.contact { background: var(--white); }
.contact-inner { display: grid; grid-template-columns: 1fr 56rem; gap: 8rem; align-items: start; }
.contact-steps { display: grid; gap: 1.6rem; }
.contact-steps li { display: flex; align-items: center; gap: 2rem; }
.contact-steps b { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 5.6rem; height: 5.6rem; border-radius: 50%;
  background: var(--yellow); font-family: var(--ff-en); font-weight: 800; font-size: 2.2rem; }
.contact-steps .ttl { font-family: var(--ff-head); font-weight: 900; font-size: 1.9rem; line-height: 1.4; }
.contact-steps .txt { font-size: 1.4rem; color: var(--ink-2); line-height: 1.6; }
.contact-form { display: grid; gap: 2.4rem; padding: 4.8rem; background: var(--cream); border-radius: var(--r-lg); }
.field label { display: flex; align-items: center; gap: .8rem; font-weight: 700; font-size: 1.5rem; line-height: 1.4; }
.field label em { padding: .2rem .8rem; border-radius: .4rem; background: var(--red); color: var(--white); font-style: normal; font-size: 1.1rem; }
.field input, .field textarea { display: block; width: 100%; margin-top: 1rem; padding: 1.4rem 1.6rem; font: inherit; font-size: 1.6rem; color: var(--navy);
  background: var(--white); border: .2rem solid var(--line); border-radius: var(--r-sm); transition: border-color .2s; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--orange); }
.field textarea { height: 16rem; resize: vertical; }
.field ::placeholder { color: #b3ab9c; }
.field-topics { margin: 0; padding: 0; border: 0; min-width: 0; }
.field-topics legend { padding: 0; font-weight: 700; font-size: 1.5rem; line-height: 1.4; }
.field-topics legend small { margin-left: .4rem; font-size: 1.3rem; font-weight: 500; color: var(--ink-2); }
.topics { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1rem; }
.topics label { position: relative; cursor: pointer; }
.topics input { position: absolute; opacity: 0; }
.topics span { display: block; padding: .8rem 1.8rem; border-radius: 9999px; background: var(--white); border: .2rem solid var(--line); font-size: 1.4rem; font-weight: 700; line-height: 1.4; transition: background-color .2s, border-color .2s, color .2s; }
.topics input:checked + span { background: var(--orange); border-color: var(--orange); color: var(--white); }
.topics input:focus-visible + span, .field-check input:focus-visible + i { outline: .2rem solid var(--navy); outline-offset: .2rem; }
.field.is-error input { border-color: var(--red); }
.field-check.is-error i { border-color: var(--red); }
.form-msg { padding: 1.6rem 2rem; border-radius: var(--r-sm); font-size: 1.4rem; font-weight: 700; line-height: 1.6; text-align: center; }
.form-msg.is-error { background: #fdecea; color: var(--red); }
.form-msg.is-sending { background: var(--white); color: var(--ink-2); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-form { position: relative; }
.contact-form button:disabled { opacity: .6; cursor: wait; transform: none; }
.form-msg.is-ok { background: var(--mint); color: var(--mint-dk); }
.field-check { position: relative; display: flex; align-items: center; justify-content: center; gap: 1rem; font-size: 1.5rem; cursor: pointer; }
.field-check input { position: absolute; opacity: 0; }
.field-check i { width: 2rem; height: 2rem; border: .2rem solid var(--line); border-radius: .5rem; background: var(--white); }
.field-check input:checked + i { background: var(--orange); border-color: var(--orange); }
.field-check a { color: var(--orange-dk); text-decoration: underline; }

/* =========================================================
   footer
   ========================================================= */
.ft { padding: 8rem 0 4rem; background: var(--navy); color: var(--white); }
.ft-inner { display: flex; justify-content: space-between; gap: 6rem; }
.ft-logo { display: flex; align-items: center; gap: 1rem; }
.ft-logo img { width: 4.4rem; height: 4.4rem; }
.ft-logo .logo-txt b { font-size: 2.4rem; }
.ft-logo .logo-txt small { margin-top: .7rem; font-size: 1.1rem; color: rgba(255, 255, 255, .6); }
.ft-txt { margin-top: 2rem; font-size: 1.4rem; color: rgba(255, 255, 255, .7); }
.ft-nav { display: flex; gap: 8rem; }
.ft-nav ul { display: grid; grid-template-columns: auto auto; gap: 1.4rem 4rem; align-content: start; }
.ft-nav a { font-size: 1.4rem; transition: color .3s; }
.ft-nav a:hover { color: var(--yellow); }
.ft-sub { grid-template-columns: auto !important; }
.ft-sub a { color: rgba(255, 255, 255, .65); font-size: 1.3rem; }
.ft-copy { margin-top: 6.4rem; padding-top: 2.4rem; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 1.2rem; color: rgba(255, 255, 255, .55); }

/* =========================================================
   column (top section / list page / article)
   ========================================================= */
.column-top, .column-index { background: var(--white); }
.col-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3.2rem; }
.col-card { display: block; height: 100%; background: var(--white); border-radius: var(--r-md); overflow: hidden; box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s; }
.col-card:hover { transform: translateY(-.4rem); box-shadow: var(--shadow); }
.col-card picture { aspect-ratio: 3 / 2; }
.col-card picture img { transition: transform .6s var(--ease); }
.col-card:hover picture img { transform: scale(1.04); }
.col-card-body { padding: 2.4rem 2.4rem 2.8rem; }
.col-card h3 { margin-top: 1.2rem; font-family: var(--ff-head); font-weight: 900; font-size: 1.8rem; line-height: 1.6; }
.col-meta { display: flex; align-items: center; gap: 1.2rem; font-family: var(--ff-en); font-size: 1.3rem; line-height: 1.4; color: var(--ink-2); }
.col-cat { padding: .3rem 1rem; border-radius: .6rem; background: var(--yellow-lt); color: var(--navy); font-family: var(--ff); font-weight: 700; font-size: 1.2rem; }
.column-more { margin-top: 5.6rem; text-align: center; }

.page-head { position: relative; padding: calc(var(--hd-h) + 8rem) 0 8rem; background: var(--cream); overflow: hidden; }
.page-head .wrap { position: relative; }
.crumb { display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: 2.8rem; font-size: 1.25rem; line-height: 1.6; color: var(--ink-2); }
.crumb li + li::before { content: "›"; margin-right: .8rem; }
.crumb a { text-decoration: underline; text-underline-offset: .3em; }

.article { background: var(--white); padding-bottom: 12rem; }
.article-head { padding-top: calc(var(--hd-h) + 6rem); background: linear-gradient(var(--cream) 62%, var(--white) 62%); }
.article-wrap { width: min(80rem, 100% - 8rem); margin-inline: auto; }
.article-ttl { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 3.6rem; line-height: 1.5; }
.article-thumb { margin-top: 4rem; aspect-ratio: 3 / 2; border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.article-lead { margin-top: 4.8rem; font-size: 1.7rem; line-height: 2.1; }
.toc { margin-top: 4.8rem; padding: 3.2rem 4rem; background: var(--cream); border-radius: var(--r-md); }
.toc-ttl { font-family: var(--ff-head); font-weight: 900; font-size: 1.8rem; }
.toc ol { display: grid; gap: .6rem; margin-top: 1.2rem; counter-reset: toc; }
.toc li { position: relative; padding-left: 3.2rem; font-size: 1.5rem; line-height: 1.7; counter-increment: toc; }
.toc li::before { content: counter(toc, decimal-leading-zero); position: absolute; left: 0; font-family: var(--ff-en); font-weight: 700; color: var(--orange); }
.toc a:hover { color: var(--orange); text-decoration: underline; }
.article-body h2 { margin-top: 7.2rem; padding: 1.4rem 0 1.4rem 2.4rem; border-left: .6rem solid var(--orange); background: linear-gradient(90deg, var(--cream), rgba(255, 248, 236, 0));
  font-family: var(--ff-head); font-weight: 900; font-size: 2.6rem; line-height: 1.5; }
.article-body h3 { margin-top: 4.8rem; padding-bottom: .8rem; border-bottom: .2rem dashed var(--line); font-family: var(--ff-head); font-weight: 900; font-size: 2rem; line-height: 1.5; }
.article-body p { margin-top: 2.4rem; font-size: 1.65rem; line-height: 2.1; }
.article-body b { background: linear-gradient(transparent 65%, var(--yellow-lt) 65%); }
.article ul.dots, .article ul.check { display: grid; gap: 1rem; margin-top: 2.4rem; }
.article ul.dots li, .article ul.check li { position: relative; padding-left: 2.8rem; font-size: 1.6rem; line-height: 1.85; }
.article ul.dots li::before { content: ""; position: absolute; left: .4rem; top: .7em; width: 1rem; height: 1rem; border-radius: 50%; background: var(--yellow); }
.article ul.check li::before { content: "\2713"; position: absolute; left: 0; top: 0; font-weight: 700; color: var(--orange); }
.article-body .box { margin-top: 3.2rem; padding: 2.8rem 3.2rem; border-radius: var(--r-md); background: var(--mint); }
.article-body .box-ttl { margin-top: 0; font-family: var(--ff-head); font-weight: 900; font-size: 1.6rem; color: var(--mint-dk); }
.article-body .box p:not(.box-ttl) { margin-top: .8rem; font-size: 1.5rem; line-height: 1.9; }
.article-sum { margin-top: 7.2rem; padding: 4rem; border-radius: var(--r-md); border: .3rem solid var(--yellow); background: #fffbf0; scroll-margin-top: var(--hd-h); }
.article-sum h2 { font-family: var(--ff-head); font-weight: 900; font-size: 2.2rem; }
.article-author { display: flex; align-items: center; gap: 2rem; margin-top: 4.8rem; padding: 2.8rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.article-author img { width: 5.6rem; height: 5.6rem; flex-shrink: 0; }
.article-author .name { font-family: var(--ff-head); font-weight: 900; font-size: 1.6rem; }
.article-author .txt { margin-top: .4rem; font-size: 1.35rem; line-height: 1.8; color: var(--ink-2); }
.article-cta { margin-top: 6.4rem; flex-direction: column; align-items: flex-start; }
.related { background: var(--cream); }

/* =========================================================
   news / company / policy pages
   ========================================================= */
.info { background: var(--cream); padding: 11rem 0; }
.info-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 8rem; align-items: start; }
.info-ttl { margin-top: 1.2rem; font-family: var(--ff-head); font-weight: 900; font-size: 2.8rem; line-height: 1.4; }
.news-list, .company-list { margin: 3.2rem 0 0; border-top: 1px solid var(--line); }
.news-list li { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 1.6rem; padding: 2rem 0; border-bottom: 1px solid var(--line); }
.news-list time { font-family: var(--ff-en); font-size: 1.4rem; color: var(--ink-2); }
.news-cat { padding: .2rem 1rem; border-radius: .6rem; background: var(--white); border: 1px solid var(--line); font-size: 1.2rem; font-weight: 700; line-height: 1.6; white-space: nowrap; }
.news-list p { font-size: 1.5rem; line-height: 1.7; }
.news-list a { text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: .3em; transition: color .3s; }
.news-list a:hover { color: var(--orange-dk); }
.company-list > div { display: grid; grid-template-columns: 11rem 1fr; gap: 2rem; padding: 2rem 0; border-bottom: 1px solid var(--line); font-size: 1.5rem; line-height: 1.8; }
.company-list dt { font-weight: 700; }
.company-list dd { margin: 0; }
.page-head--sm { padding-bottom: 6rem; }

/* privacy policy (article / paragraph / item numbering like legal documents) */
.law { padding: 8rem 0 12rem; background: var(--cream); }
.law-doc { width: min(96rem, 100% - 8rem); margin: 0 auto; padding: 7.2rem 8rem; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-md); }
.law-doc p, .law-doc li { font-size: 1.55rem; line-height: 2; }
.law-preamble { text-indent: 1em; }
.law-toc { margin-top: 4.8rem; padding: 3.2rem 4rem; background: var(--cream); border-radius: var(--r-sm); }
.law-toc-ttl { font-weight: 700; font-size: 1.6rem; }
.law-toc ol { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem 4rem; margin-top: 1.2rem; }
.law-toc li { font-size: 1.4rem; line-height: 1.8; }
.law-toc a:hover { color: var(--orange-dk); text-decoration: underline; }
.law-art { margin-top: 5.6rem; scroll-margin-top: calc(var(--hd-h) + 2rem); }
.law-art h2 { display: flex; align-items: baseline; gap: 1.6rem; padding-bottom: 1.2rem; border-bottom: 1px solid var(--navy); font-size: 1.9rem; font-weight: 700; line-height: 1.5; }
.law-art h2 span { flex-shrink: 0; color: var(--orange-dk); }
.law-body, .law-paras { margin-top: 2rem; }
.law-paras { counter-reset: para; display: grid; gap: 1.2rem; }
.law-paras > li { position: relative; padding-left: 2.4rem; counter-increment: para; }
.law-paras > li::before { content: counter(para); position: absolute; left: 0; top: 0; font-family: var(--ff-en); font-weight: 700; font-size: 1.55rem; line-height: 2; }
.law-items { counter-reset: item; display: grid; gap: .4rem; margin-top: .8rem; }
.law-items > li { position: relative; padding-left: 4rem; counter-increment: item; }
.law-items > li::before { content: "（" counter(item) "）"; position: absolute; left: 0; top: 0; }
.law-contact { margin: 2.4rem 0 0; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
.law-contact > div { display: grid; grid-template-columns: 14rem 1fr; }
.law-contact > div + div { border-top: 1px solid var(--line); }
.law-contact dt { padding: 1.4rem 2rem; background: var(--cream); font-weight: 700; font-size: 1.45rem; }
.law-contact dd { margin: 0; padding: 1.4rem 2rem; font-size: 1.45rem; }
.law-sign { margin-top: 6.4rem; text-align: right; }
.law-sign p { font-size: 1.5rem; line-height: 1.9; }
.law-sign .name { font-weight: 700; }

/* =========================================================
   tablet / SP
   ========================================================= */
@media (max-width: 1024px) {
  .hd-nav { display: none; }
  .hd-cta { margin-left: auto; }
  .hd-menu { display: flex; flex-direction: column; justify-content: center; gap: .5rem; width: 4rem; height: 4rem; border-radius: 50%; background: var(--cream); }
  .hd-menu i { display: block; width: 1.8rem; height: .2rem; margin: 0 auto; background: var(--navy); border-radius: 9999px; transition: transform .3s, opacity .3s; }
  .hd-menu[aria-expanded="true"] i:nth-child(1) { transform: translateY(.7rem) rotate(45deg); }
  .hd-menu[aria-expanded="true"] i:nth-child(2) { opacity: 0; }
  .hd-menu[aria-expanded="true"] i:nth-child(3) { transform: translateY(-.7rem) rotate(-45deg); }
  .hd-nav { position: fixed; left: 1rem; right: 1rem; top: calc(var(--hd-h) + .6rem); margin: 0; padding: 1.6rem 2.4rem; border-radius: var(--r-md);
    background: var(--white); box-shadow: var(--shadow); }
  .hd-nav.is-open { display: block; }
  .hd-nav ul { flex-direction: column; gap: 0; }
  .hd-nav li + li { border-top: 1px solid var(--line); }
  .hd-nav a { display: block; padding: 1.4rem 0; font-size: 1.5rem; }
  .hero-inner { grid-template-columns: 1fr 40rem; gap: 4rem; }
  .hero-photo { width: 40rem; height: 46rem; }
  .reasons .wrap { grid-template-columns: 1fr; }
  .reasons .sec-head { position: static; }
  .flow-list { grid-template-columns: repeat(2, 1fr); row-gap: 4rem; }
  .flow-list::before { display: none; }
  .cta-box { flex-direction: column; align-items: flex-start; }
  .col-list { grid-template-columns: repeat(2, 1fr); }
  .quality-list { grid-template-columns: repeat(2, 1fr); }
  .case-list { grid-template-columns: 1fr; max-width: 64rem; margin: 0 auto; }
  .info-inner { grid-template-columns: 1fr; gap: 5.6rem; }
  .price-inner, .contact-inner { grid-template-columns: 1fr; gap: 5.6rem; }
  .price-card { max-width: 56rem; margin: 0 auto; width: 100%; }
}

@media (max-width: 767px) {
  :root { --hd-h: 7.2rem; }
  body { font-size: 1.5rem; }
  .wrap, .wrap--narrow { width: calc(100% - 4rem); }
  .sec { padding: 8.8rem 0; }
  .sec-head { margin-bottom: 4rem; }
  .sec-ttl { font-size: 2.8rem; }
  .sec-lead { font-size: 1.45rem; }
  .sec-lead br { display: none; }

  .hd { top: 1rem; }
  .hd-inner { width: calc(100% - 2rem); gap: 1rem; padding: .8rem .8rem .8rem 1.6rem; }
  .hd-logo img { width: 3rem; height: 3rem; }
  .hd-logo .logo-txt b { font-size: 1.5rem; letter-spacing: .1em; }
  .hd-logo .logo-txt small { margin-top: .4rem; font-size: .85rem; letter-spacing: .12em; }
  .hd-cta { padding: 1.1rem 1.4rem; font-size: 1.2rem; }
  .hd-cta .btn-arrow { display: none; }

  .hero { padding-top: calc(var(--hd-h) + 4rem); }
  .hero-sun { width: 40rem; height: 40rem; right: -14rem; top: -8rem; }
  .hero-inner { grid-template-columns: 1fr; gap: 4.8rem; }
  .hero-label { font-size: 1.3rem; }
  .hero-ttl { font-size: 3.6rem; margin-top: 2rem; }
  .hero-txt { font-size: 1.45rem; }
  .hero-txt br { display: none; }
  .hero-btns { margin-top: 3.2rem; }
  .hero-btns .btn { width: 100%; }
  .hero-visual { width: 80%; margin: 0 auto; }
  .hero-photo { width: 100%; height: 34rem; border-width: .6rem; }
  .hero-points { grid-template-columns: 1fr; margin-top: 6rem; padding: 1.6rem 2rem; width: 100%; border-radius: var(--r-md) var(--r-md) 0 0; }
  .hero-points li { padding: 2rem 0; }
  .hero-points li + li { border-left: 0; border-top: .2rem dashed var(--line); }

  .worries { padding-top: 6.4rem; }
  .worries-list { grid-template-columns: 1fr; gap: 2rem; }
  .worries-card picture { height: 18rem; }
  .worries-quote { font-size: 1.8rem; }

  .band-inner { flex-direction: column; gap: 1.2rem; min-height: 0; padding: 4rem 0; }
  .band-txt { font-size: 2.2rem; text-align: center; }
  
  .reasons-list { grid-template-columns: 1fr; gap: 1.6rem; }
  .reasons-item { padding: 2.8rem 2.4rem; }
  .reasons-item .num { font-size: 3.6rem; }
  .reasons-item h3 { font-size: 1.8rem; }

  .flow-list { grid-template-columns: 1fr; }
  .flow-item picture { height: 18rem; }

  .service { border-radius: 4rem 4rem 0 0; }
  .service-head { flex-direction: column; align-items: flex-start; gap: 2rem; margin-bottom: 4rem; }
  .service-head .sec-lead { text-align: left; }
  .service-list { grid-template-columns: 1fr; gap: 1.2rem; }
  .service-item { padding: 2.4rem; }
  .service-item h3 { font-size: 1.9rem; }

  .compare-hint { display: block; margin-bottom: 1rem; text-align: right; font-size: 1.2rem; color: var(--ink-2); }
  .compare-table { min-width: 60rem; }
  .compare-table th, .compare-table td { padding: 1.6rem 1.2rem; font-size: 1.3rem; }
  .compare-table thead th { padding: 1.6rem 1rem; font-size: 1.45rem; }
  .compare-table thead td { width: 11rem; }
  .compare-table tbody th { font-size: 1.35rem; }
  .compare-table .mk { font-size: 2.2rem; }
  .compare-table thead .is-us { font-size: 1.6rem; }
  .compare-table thead .is-us img { width: 2.2rem; height: 2.2rem; margin-right: .4rem; }

  .cta-box { padding: 4rem 2.4rem; gap: 2.8rem; }
  .cta-ttl { font-size: 2.2rem; }
  .cta-ttl br { display: none; }
  .cta-points { flex-direction: column; font-size: 1.4rem; }
  .cta-box .btn { width: 100%; }
  .hero-assure { font-size: 1.3rem; gap: .4rem 1.4rem; }

  .col-list { grid-template-columns: 1fr; gap: 2rem; }
  .quality-list { grid-template-columns: 1fr; gap: 1.2rem; }
  .quality-item { display: grid; grid-template-columns: 5.2rem 1fr; gap: .4rem 1.6rem; padding: 2.4rem 2rem; text-align: left; }
  .quality-item .ico { grid-row: span 2; width: 5.2rem; height: 5.2rem; }
  .quality-item h3 { margin-top: 0; font-size: 1.7rem; }
  .quality-item p { margin-top: 0; font-size: 1.35rem; }
  .cases { padding-top: 10rem; }
  .case-card { padding: 2.4rem 2rem; }
  .case-issue { font-size: 1.6rem; }
  .tools { padding: 2.4rem 2rem; }
  .tools-row { grid-template-columns: 1fr; gap: .8rem; }
  .tools-cat { padding-top: 0; }
  .tools-row li { font-size: 1.25rem; }
  .col-card h3 { font-size: 1.6rem; }
  .page-head { padding: calc(var(--hd-h) + 4.8rem) 0 5.6rem; }
  .article { padding-bottom: 8rem; }
  .article-head { padding-top: calc(var(--hd-h) + 4rem); }
  .article-wrap { width: calc(100% - 4rem); }
  .article-ttl { font-size: 2.4rem; }
  .article-thumb { margin-top: 2.8rem; }
  .article-lead { margin-top: 3.2rem; font-size: 1.5rem; }
  .toc { padding: 2.4rem; }
  .toc li { font-size: 1.4rem; }
  .article-body h2 { margin-top: 5.6rem; font-size: 2rem; padding-left: 1.6rem; }
  .article-body h3 { font-size: 1.7rem; }
  .article-body p, .article ul.dots li, .article ul.check li { font-size: 1.5rem; }
  .article-body .box { padding: 2.4rem 2rem; }
  .article-sum { padding: 2.8rem 2rem; }
  .article-author { align-items: flex-start; }
  .info { padding: 8rem 0; }
  .info-ttl { font-size: 2.4rem; }
  .news-list li { grid-template-columns: auto 1fr; gap: .6rem 1.2rem; padding: 1.6rem 0; }
  .news-list li p { grid-column: 1 / -1; font-size: 1.4rem; }
  .news-cat { justify-self: start; }
  .company-list > div { grid-template-columns: 1fr; gap: .2rem; padding: 1.6rem 0; font-size: 1.4rem; }
  .company-list dt { color: var(--ink-2); font-size: 1.3rem; }
  .law { padding: 4rem 0 8rem; }
  .law-doc { width: calc(100% - 2.4rem); padding: 3.6rem 2rem; }
  .law-doc p, .law-doc li { font-size: 1.4rem; line-height: 1.9; }
  .law-toc { padding: 2.4rem 2rem; }
  .law-toc ol { grid-template-columns: 1fr; }
  .law-toc li { font-size: 1.3rem; }
  .law-art { margin-top: 4.4rem; }
  .law-art h2 { gap: 1rem; font-size: 1.6rem; }
  .law-paras > li::before { font-size: 1.4rem; line-height: 1.9; }
  .law-items > li { padding-left: 3.4rem; }
  .law-contact > div { grid-template-columns: 1fr; }
  .law-contact dt { padding: 1rem 1.6rem; }
  .law-contact dd { padding: 1rem 1.6rem; }

  .price-rules li { grid-template-columns: 1fr; gap: .4rem; padding: 1.6rem 2rem; }
  .price-card { padding: 4.8rem 2.4rem 3.2rem; }
  .price-card-list { grid-template-columns: 1fr; }
  .price-card-quote b { font-size: 3rem; }

  .faq-item summary { gap: 1.2rem; padding: 2rem; }
  .faq-item b { width: 3.2rem; height: 3.2rem; font-size: 1.5rem; }
  .faq-item summary span { font-size: 1.5rem; }
  .faq-a { gap: 1.2rem; padding: 0 2rem 2.4rem; }
  .faq-a p { font-size: 1.4rem; }

  .message-sun { width: 40rem; height: 40rem; }
  .message-ttl { font-size: 3.2rem; }
  .message-txt { font-size: 1.45rem; text-align: left; }
  .message-txt br { display: none; }
  .message-photos { grid-template-columns: 1fr 1fr; gap: 1.2rem; margin-top: 4.8rem; }
  .message-photos picture { height: 14rem; }
  .message-photos picture:nth-child(2) { transform: none; }
  .message-photos picture:nth-child(3) { grid-column: 1 / -1; }

  .contact-form { padding: 2.8rem 2rem; }
  
  .ft { padding: 5.6rem 0 3.2rem; }
  .ft-inner { flex-direction: column; gap: 4rem; }
  .ft-nav { flex-direction: column; gap: 3.2rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js-show { opacity: 1; transform: none; }
}

/* =========================================================
   recruit (lab/recruit/ — generated by tools/build_pages.py)
   ========================================================= */
.rc { background: var(--white); }
.rc .dots, .rc .check { display: grid; gap: .8rem; margin-top: 1.4rem; }
.rc .dots li, .rc .check li { position: relative; padding-left: 2.8rem; font-size: 1.6rem; line-height: 1.85; }
.rc .dots li::before { content: ""; position: absolute; left: .4rem; top: .7em; width: 1rem; height: 1rem; border-radius: 50%; background: var(--yellow); }
.rc .check li::before { content: "\2713"; position: absolute; left: 0; top: 0; font-weight: 700; color: var(--orange); }
.rc-note { margin-top: 2rem; font-size: 1.35rem; line-height: 1.8; color: var(--ink-2); }
.rc-cat { display: inline-block; padding: .3rem 1.2rem; border-radius: .6rem; background: var(--navy); color: var(--white); font-weight: 700; font-size: 1.25rem; line-height: 1.6; }
.rc-tags { display: flex; flex-wrap: wrap; gap: .8rem; }
.rc-tags li { padding: .4rem 1.4rem; border-radius: .6rem; background: var(--white); border: .15rem solid var(--line); font-weight: 700; font-size: 1.3rem; line-height: 1.6; }
.pc { display: inline; }

/* index: hero */
.rc-hero { position: relative; padding: calc(var(--hd-h) + 5.6rem) 0 8rem; background: var(--navy); color: var(--white); overflow: hidden; }
.rc-hero .hero-sun, .rc-job-head .hero-sun { display: none; }  /* yellow rings turn muddy on navy */
.rc-hero, .rc-job-head { background: radial-gradient(circle at 88% 0%, rgba(255, 138, 31, .22), rgba(255, 138, 31, 0) 42%), var(--navy); }
.rc-hero .crumb, .rc-job-head .crumb { color: rgba(255, 255, 255, .7); }
.rc-hero mark, .rc-jobs mark { background: linear-gradient(transparent 62%, rgba(255, 138, 31, .6) 62%, rgba(255, 138, 31, .6) 92%, transparent 92%); }
.rc-watermark { position: absolute; left: -.06em; bottom: -.2em; margin: 0; font-family: var(--ff-en); font-weight: 800; font-size: 22rem; line-height: 1; letter-spacing: .02em;
  color: transparent; -webkit-text-stroke: .15rem rgba(255, 255, 255, .09); white-space: nowrap; pointer-events: none; user-select: none; }
.rc-job-head .rc-watermark { left: auto; right: -.04em; font-size: 18rem; }
.rc-hero-inner { position: relative; display: grid; grid-template-columns: 1fr 48rem; gap: 6rem; align-items: center; }
.rc-hero-en { font-family: var(--ff-en); font-weight: 800; font-size: 1.6rem; letter-spacing: .3em; text-transform: uppercase; color: var(--yellow); }
.rc-hero-ttl { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 5.6rem; line-height: 1.4; letter-spacing: .04em; }
.rc-hero-ttl mark { display: inline-block; }
.rc-hero-txt { margin-top: 2.8rem; font-size: 1.7rem; line-height: 2; color: rgba(255, 255, 255, .78); }
.rc-hero-photo { width: 48rem; height: 56rem; border-radius: 24rem 24rem var(--r-lg) var(--r-lg); border: .8rem solid rgba(255, 255, 255, .12); box-shadow: 0 2rem 5rem rgba(0, 0, 0, .25); }
.rc-facts { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); margin: 7.2rem 0 0; padding: 3.2rem 0; background: var(--white); color: var(--navy); border-radius: var(--r-lg); box-shadow: var(--shadow); }
.rc-facts > div { display: grid; grid-template-columns: 5.2rem 1fr; gap: .2rem 1.6rem; align-items: center; padding: .4rem 3.2rem; }
.rc-facts > div + div { border-left: .2rem dashed var(--line); }
.rc-facts .ico { grid-row: span 2; display: inline-flex; align-items: center; justify-content: center; width: 5.2rem; height: 5.2rem; border-radius: 50%; background: var(--yellow-lt); color: var(--orange-dk); }
.rc-facts svg { width: 2.6rem; height: 2.6rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rc-facts dt { font-size: 1.25rem; font-weight: 700; color: var(--orange-dk); letter-spacing: .12em; line-height: 1.4; }
.rc-facts dd { margin: 0; font-family: var(--ff-head); font-weight: 900; font-size: 1.9rem; line-height: 1.45; }
.rc-facts small { display: block; font-family: var(--ff); font-weight: 500; font-size: 1.2rem; color: var(--ink-2); }
.rc-msg-photo { margin-top: 4rem; aspect-ratio: 3 / 2; border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.rc-card { overflow: hidden; }
.rc-card-photo { aspect-ratio: 3 / 2; }
.rc-card-photo img { transition: transform .6s var(--ease); }
.rc-card:hover .rc-card-photo img { transform: scale(1.04); }
.rc-card-body { display: flex; flex-direction: column; flex: 1; padding: 3.2rem 3.6rem 3.6rem; }
.rc-job-head-inner { display: grid; grid-template-columns: 1fr 46rem; gap: 6rem; align-items: center; }
.rc-job-photo { aspect-ratio: 3 / 2; border-radius: var(--r-md); box-shadow: 0 2rem 5rem rgba(0, 0, 0, .25); }

/* index: message */
.rc-msg-inner { display: grid; grid-template-columns: 40rem 1fr; gap: 8rem; align-items: start; }
.rc-msg-head .sec-ttl { font-size: 4rem; }
.rc-msg-body p { font-size: 1.7rem; line-height: 2.15; }
.rc-msg-body p + p { margin-top: 2.4rem; }
.rc-msg-body .rc-msg-sign { margin-top: 4rem; padding-top: 2.4rem; border-top: 1px solid var(--line); font-weight: 700; font-size: 1.5rem; text-align: right; }

/* index: workstyle + benefits */
.rc-work { background: var(--cream); }
.rc-work-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.rc-work-item { padding: 4rem 2.8rem 3.6rem; background: var(--white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.rc-work-item .ico, .rc-points .num { display: inline-flex; align-items: center; justify-content: center; width: 6.4rem; height: 6.4rem; border-radius: 50%; background: var(--yellow-lt); color: var(--orange-dk); }
.rc-work-item svg { width: 3rem; height: 3rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rc-work-item h3 { margin-top: 2.4rem; font-family: var(--ff-head); font-weight: 900; font-size: 2rem; line-height: 1.5; }
.rc-work-item p { margin-top: 1.2rem; font-size: 1.45rem; line-height: 1.85; color: var(--ink-2); }
.rc-benefits { display: grid; grid-template-columns: 20rem 1fr; gap: 3.2rem; align-items: center; margin-top: 4rem; padding: 3.6rem 4.8rem; background: var(--white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.rc-benefits-ttl { font-family: var(--ff-head); font-weight: 900; font-size: 2rem; }
.rc-benefits .rc-note { margin-top: 1.4rem; }
.rc-benefits ul { display: flex; flex-wrap: wrap; gap: 1rem; }
.rc-benefits li { padding: .6rem 1.6rem; border-radius: .8rem; background: var(--cream); font-weight: 700; font-size: 1.4rem; line-height: 1.6; }
.rc-benefits li::before { content: "\2713"; margin-right: .6rem; color: var(--orange); }

/* index: job cards */
.rc-jobs { background: var(--navy); color: var(--white); border-radius: 6.4rem 6.4rem 0 0; }
.rc-jobs .sec-en { color: var(--yellow); }
.rc-jobs .sec-lead { color: rgba(255, 255, 255, .75); }
.rc-card-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3.2rem; }
.rc-card { display: flex; flex-direction: column; height: 100%; padding: 0; background: var(--white); color: var(--navy); border: .2rem solid transparent; border-radius: var(--r-md);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.rc-card:hover { transform: translateY(-.4rem); box-shadow: var(--shadow); border-color: var(--orange); }
.rc-card-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.rc-card-en { font-family: var(--ff-en); font-weight: 700; font-size: 1.2rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2); }
.rc-card h3 { margin-top: 2.4rem; font-family: var(--ff-head); font-weight: 900; font-size: 2.6rem; line-height: 1.4; }
.rc-card-txt { margin-top: 1.4rem; font-size: 1.5rem; line-height: 1.85; color: var(--ink-2); }
.rc-card-meta { margin: 2.4rem 0 0; border-top: 1px solid var(--line); }
.rc-card-meta > div { display: grid; grid-template-columns: 7.2rem 1fr; gap: 1.2rem; padding: 1.2rem 0; border-bottom: 1px solid var(--line); font-size: 1.4rem; line-height: 1.6; }
.rc-card-meta dt { font-weight: 700; color: var(--ink-2); }
.rc-card-meta dd { margin: 0; font-weight: 700; }
.rc-card-more { display: inline-flex; align-items: center; gap: 1rem; margin-top: auto; padding-top: 2.8rem; font-weight: 700; font-size: 1.5rem; color: var(--orange-dk); }
.rc-card-more .btn-arrow, .rc-others-list .btn-arrow { background: var(--orange); }
.rc-card-more .btn-arrow::before, .rc-others-list .btn-arrow::before { border-color: var(--white); }

/* selection steps (index + job pages) */
.rc-flow { background: var(--mint); }
.rc-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.6rem; }
.rc-steps li { position: relative; padding: 3.2rem 2.4rem 2.8rem; background: var(--white); border-radius: var(--r-md); text-align: center; }
.rc-steps li + li::before { content: ""; position: absolute; left: -1.3rem; top: 50%; width: 1rem; height: 1rem; border-top: .25rem solid var(--mint-dk); border-right: .25rem solid var(--mint-dk); transform: translateY(-50%) rotate(45deg); }
.rc-steps b { display: inline-flex; align-items: center; justify-content: center; width: 4.4rem; height: 4.4rem; border-radius: 50%; background: var(--mint-dk); color: var(--white); font-family: var(--ff-en); font-size: 1.8rem; }
.rc-steps .ttl { margin-top: 1.4rem; font-family: var(--ff-head); font-weight: 900; font-size: 1.8rem; line-height: 1.5; }
.rc-steps .txt { margin-top: .8rem; font-size: 1.35rem; line-height: 1.8; color: var(--ink-2); }
.rc-flow .rc-note { text-align: center; }
.rc-job .rc-steps li { background: var(--mint); }
.rc-entry { padding: 0 0 12rem; background: var(--sky); }
.rc-faq { padding-bottom: 10rem; }

/* job page */
.rc-job-head { position: relative; padding: calc(var(--hd-h) + 5.6rem) 0 7.2rem; background: var(--navy); color: var(--white); overflow: hidden; }
.rc-job-head .wrap { position: relative; }
.rc-job-en { font-family: var(--ff-en); font-weight: 800; font-size: 1.4rem; letter-spacing: .3em; text-transform: uppercase; color: var(--yellow); }
.rc-job-ttl { margin-top: 1.2rem; font-family: var(--ff-head); font-weight: 900; font-size: 4.8rem; line-height: 1.4; }
.rc-job-catch { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 700; font-size: 2rem; line-height: 1.7; }
.rc-job-head .rc-tags { margin-top: 2.8rem; }
.rc-job-head .rc-tags li { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .25); color: var(--white); }
.rc-job { display: grid; grid-template-columns: minmax(0, 1fr) 34rem; gap: 6.4rem; align-items: start; padding: 8rem 0 12rem; }
.rc-sec + .rc-sec { margin-top: 8rem; }
.rc-sec h2 { display: flex; align-items: baseline; gap: 1.6rem; padding-bottom: 1.6rem; border-bottom: .2rem solid var(--navy); font-family: var(--ff-head); font-weight: 900; font-size: 2.8rem; line-height: 1.4; }
.rc-sec { scroll-margin-top: calc(var(--hd-h) + 2rem); }
.rc-sec h2 span { font-family: var(--ff-en); font-weight: 800; font-size: 1.6rem; color: var(--orange); letter-spacing: .08em; }
.rc-lead { margin-top: 2.8rem; font-size: 1.65rem; line-height: 2.1; }
.rc-sub { margin-top: 3.2rem; font-weight: 700; font-size: 1.5rem; color: var(--orange-dk); }
.rc-sub::before { content: ""; display: inline-block; width: 1.6rem; height: .3rem; margin-right: .8rem; vertical-align: middle; border-radius: 9999px; background: var(--orange); }
.rc-points { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 3.2rem; }
.rc-points li { padding: 3.2rem; background: var(--cream); border-radius: var(--r-md); }
.rc-points .num { width: 4.8rem; height: 4.8rem; font-family: var(--ff-en); font-weight: 800; font-size: 1.6rem; background: var(--white); }
.rc-points h3 { margin-top: 1.6rem; font-family: var(--ff-head); font-weight: 900; font-size: 1.9rem; line-height: 1.5; }
.rc-points p { margin-top: 1rem; font-size: 1.5rem; line-height: 1.9; color: var(--ink-2); }
.rc-req { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; }
.rc-terms { margin: 3.2rem 0 0; border-top: 1px solid var(--line); }
.rc-terms > div { display: grid; grid-template-columns: 16rem 1fr; border-bottom: 1px solid var(--line); }
.rc-terms dt { padding: 2rem 2.4rem; background: var(--cream); font-weight: 700; font-size: 1.5rem; line-height: 1.8; }
.rc-terms dd { margin: 0; padding: 2rem 2.4rem; font-size: 1.5rem; line-height: 1.9; }
.rc-job .rc-steps { grid-template-columns: repeat(2, 1fr); margin-top: 3.2rem; }
.rc-job .rc-steps li + li::before { display: none; }
.rc-apply .contact-form { margin-top: 3.2rem; }
.field select { display: block; width: 100%; margin-top: 1rem; padding: 1.4rem 4rem 1.4rem 1.6rem; font: inherit; font-size: 1.6rem; color: var(--navy); appearance: none;
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231e2a44' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 1.4rem center / 1.8rem;
  border: .2rem solid var(--line); border-radius: var(--r-sm); }
.field select:focus { outline: none; border-color: var(--orange); }
.field.is-error select { border-color: var(--red); }
.rc-side { position: sticky; top: calc(var(--hd-h) + 2.4rem); grid-column: 2; grid-row: 1; }
.rc-job-main { grid-column: 1; grid-row: 1; }
.rc-side-card { padding: 3.2rem 3.2rem 3.6rem; background: var(--white); border-radius: var(--r-md); border-top: .6rem solid var(--orange); box-shadow: var(--shadow); }
.rc-side-en { font-family: var(--ff-en); font-weight: 700; font-size: 1.2rem; letter-spacing: .2em; text-transform: uppercase; color: var(--orange); }
.rc-side-ttl { margin-top: .6rem; font-family: var(--ff-head); font-weight: 900; font-size: 2.2rem; line-height: 1.4; }
.rc-side-card dl { margin: 2rem 0 2.8rem; border-top: 1px solid var(--line); }
.rc-side-card dl > div { display: grid; grid-template-columns: 7.2rem 1fr; gap: 1rem; padding: 1.2rem 0; border-bottom: 1px solid var(--line); font-size: 1.4rem; line-height: 1.6; }
.rc-side-card dt { color: var(--ink-2); font-weight: 700; }
.rc-side-card dd { margin: 0; font-weight: 700; }
.rc-others { background: var(--cream); }
.rc-others-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.4rem; width: min(88rem, 100%); margin-inline: auto; }
.rc-others-list a { display: flex; align-items: center; gap: 1.6rem; padding: 3.2rem 3.6rem; background: var(--white); border-radius: var(--r-md); box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s; }
.rc-others-list a:hover { transform: translateY(-.4rem); box-shadow: var(--shadow); }
.rc-others-list b { flex: 1; font-family: var(--ff-head); font-weight: 900; font-size: 2rem; line-height: 1.4; }

@media (max-width: 1024px) {
  .rc-hero-inner { grid-template-columns: 1fr 36rem; gap: 4rem; }
  .rc-hero-photo { width: 36rem; height: 44rem; }
  .rc-facts { grid-template-columns: repeat(2, 1fr); row-gap: 2.4rem; }
  .rc-facts > div:nth-child(3) { border-left: 0; }
  .rc-job-head-inner { grid-template-columns: 1fr 36rem; gap: 4rem; }
  .rc-msg-photo { max-width: 64rem; }
  .rc-hero-ttl { font-size: 4.4rem; }
  .rc-msg-inner { grid-template-columns: 1fr; gap: 3.2rem; }
  .rc-work-list { grid-template-columns: repeat(2, 1fr); }
  .rc-card-list { grid-template-columns: 1fr; width: min(64rem, 100%); margin-inline: auto; }
  .rc-job { grid-template-columns: 1fr; gap: 4.8rem; padding-top: 4.8rem; }
  .rc-side, .rc-job-main { grid-column: auto; grid-row: auto; }
  .rc-side { position: static; }
}
@media (max-width: 767px) {
  .pc { display: none; }
  .rc .dots li, .rc .check li { font-size: 1.5rem; }
  .rc-hero { padding: calc(var(--hd-h) + 3.2rem) 0 6.4rem; }
  .rc-hero-inner { grid-template-columns: 1fr; gap: 4rem; }
  .rc-hero-ttl { font-size: 3.2rem; }
  .rc-watermark { font-size: 9rem; }
  .rc-job-head .rc-watermark { font-size: 8rem; }
  .rc-jobs { border-radius: 3.2rem 3.2rem 0 0; }
  .rc-hero-txt { font-size: 1.5rem; }
  .rc-hero .btn { width: 100%; }
  .rc-hero-photo { width: 100%; height: 34rem; border-width: .6rem; border-radius: 17rem 17rem var(--r-lg) var(--r-lg); }
  .rc-facts { grid-template-columns: 1fr; row-gap: 0; margin-top: 4.8rem; padding: .8rem 2rem; border-radius: var(--r-md); }
  .rc-facts > div { padding: 1.6rem 0; grid-template-columns: 4.8rem 1fr; gap: 0 1.4rem; }
  .rc-facts > div + div { border-left: 0; border-top: .2rem dashed var(--line); }
  .rc-facts .ico { width: 4.8rem; height: 4.8rem; }
  .rc-facts dd { font-size: 1.8rem; }
  .rc-msg-head .sec-ttl { font-size: 2.8rem; }
  .rc-msg-body p { font-size: 1.5rem; line-height: 2; }
  .rc-work-list { grid-template-columns: 1fr; gap: 1.6rem; }
  .rc-work-item { display: grid; grid-template-columns: 5.6rem 1fr; gap: .4rem 1.6rem; padding: 2.4rem 2rem; }
  .rc-work-item .ico { grid-row: span 2; width: 5.6rem; height: 5.6rem; }
  .rc-work-item h3 { margin-top: 0; font-size: 1.7rem; }
  .rc-work-item p { margin-top: 0; font-size: 1.4rem; }
  .rc-benefits { grid-template-columns: 1fr; gap: 1.6rem; padding: 2.8rem 2rem; }
  .rc-benefits li { font-size: 1.3rem; }
  .rc-card-body { padding: 2.4rem 2.4rem 2.8rem; }
  .rc-job-head-inner { grid-template-columns: 1fr; gap: 3.2rem; }
  .rc-card h3 { font-size: 2.2rem; }
  .rc-steps { grid-template-columns: 1fr; gap: 2rem; }
  .rc-steps li { display: grid; grid-template-columns: 4.4rem 1fr; gap: 1.6rem; align-items: center; padding: 2rem; text-align: left; }
  .rc-steps li + li::before { left: 50%; top: -1.6rem; transform: translateX(-50%) rotate(135deg); }
  .rc-steps .ttl { margin-top: 0; font-size: 1.6rem; }
  .rc-steps .txt { margin-top: .2rem; }
  .rc-job .rc-steps { grid-template-columns: 1fr; }
  .rc-entry { padding-bottom: 8rem; }
  .rc-job-head { padding: calc(var(--hd-h) + 3.2rem) 0 4.8rem; }
  .rc-job-ttl { font-size: 3rem; }
  .rc-job-catch { font-size: 1.6rem; }
  .rc-tags li { font-size: 1.2rem; padding: .3rem 1.2rem; }
  .rc-job { width: calc(100% - 4rem); padding-bottom: 8rem; }
  .rc-sec + .rc-sec { margin-top: 6.4rem; }
  .rc-sec h2 { font-size: 2.2rem; gap: 1.2rem; }
  .rc-lead { font-size: 1.5rem; }
  .rc-points, .rc-req { grid-template-columns: 1fr; gap: 1.6rem; }
  .rc-req { gap: 0; }
  .rc-points li { padding: 2.4rem 2rem; }
  .rc-terms > div { grid-template-columns: 1fr; }
  .rc-terms dt { padding: 1.2rem 1.6rem; font-size: 1.4rem; }
  .rc-terms dd { padding: 1.4rem 1.6rem 1.8rem; font-size: 1.4rem; }
  .rc-side-card { padding: 2.8rem 2.4rem; }
  .rc-others-list { grid-template-columns: 1fr; gap: 1.6rem; }
  .rc-others-list a { padding: 2.4rem 2rem; }
  .rc-others-list b { font-size: 1.7rem; }
}
