/* ===========================================================
   KUNO original page design v3  (Service / Features / Recruit / About)
   NOTE: base site uses 62.5% root (1rem = 10px) — sizes tuned for that.
   Original layout & CSS. Brand pink #ff66cc. Spacious, large type.
   =========================================================== */
.kp-main{ color:#1c1c22; font-feature-settings:"palt"; -webkit-font-smoothing:antialiased;
  position:relative; background-color:#fdf2f8; transition:background-color 1.1s ease; overflow:hidden; }
.kp-main *{ box-sizing:border-box; }
.kp-hero, .kp-wrap{ position:relative; z-index:2; }

/* floating background objects */
.kp-shapes{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.kp-shape{ position:absolute; border-radius:26px; opacity:.5; will-change:transform; }
.kp-shape.s1{ width:16vw; height:16vw; max-width:240px; max-height:240px; background:#ffc7e6; top:15%; left:-3%; animation:kpFloat 11s ease-in-out infinite; }
.kp-shape.s2{ width:11vw; height:11vw; max-width:170px; max-height:170px; background:#bfe9d4; top:40%; right:-2%; animation:kpFloat2 14s ease-in-out infinite; }
.kp-shape.s3{ width:20vw; height:20vw; max-width:300px; max-height:300px; background:#ffe6c2; top:64%; left:5%; opacity:.42; animation:kpFloat 16s ease-in-out infinite reverse; }
.kp-shape.s4{ width:13vw; height:13vw; max-width:200px; max-height:200px; background:#cfe0ff; top:83%; right:8%; animation:kpFloat2 12s ease-in-out infinite; }
.kp-shape.s5{ width:9vw; height:9vw; max-width:130px; max-height:130px; background:#d8f0a8; top:28%; left:44%; opacity:.4; animation:kpFloat 13s ease-in-out infinite; }
@keyframes kpFloat{ 0%,100%{ transform:translate(0,0) rotate(0deg); } 50%{ transform:translate(0,-42px) rotate(7deg); } }
@keyframes kpFloat2{ 0%,100%{ transform:translate(0,0) rotate(0deg); } 50%{ transform:translate(26px,-30px) rotate(-6deg); } }
/* SP — make floating background shapes peek visibly from the edges around the FV-下 text area */
@media(max-width:767px){
  .kp-shape{ opacity:.5; }
  .kp-shape.s1{ width:42vw; height:42vw; max-width:200px; max-height:200px; top:18%; left:-18%; }
  .kp-shape.s2{ width:34vw; height:34vw; max-width:170px; max-height:170px; top:35%; right:-15%; }
  .kp-shape.s3{ width:46vw; height:46vw; max-width:220px; max-height:220px; top:60%; left:-22%; opacity:.42; }
  .kp-shape.s4{ width:38vw; height:38vw; max-width:190px; max-height:190px; top:82%; right:-16%; }
  .kp-shape.s5{ width:24vw; height:24vw; max-width:120px; max-height:120px; top:48%; left:62%; opacity:.4; }
}

/* Service: depth — soft color block behind photo + overlapping ghost number */
.kp-svc__figwrap{ position:relative; }
.kp-svc__figwrap::before{ content:""; position:absolute; width:56%; height:62%; border-radius:20px; background:#ffd0ea; z-index:0; }
.kp-svc:nth-of-type(odd) .kp-svc__figwrap::before{ right:-28px; bottom:-28px; }
.kp-svc:nth-of-type(even) .kp-svc__figwrap::before{ left:-28px; bottom:-28px; }
.kp-svc__fig{ position:relative; z-index:1; }
.kp-svc__ghost{ position:relative; z-index:1; }

/* Features: staggered offset grid (dynamic photo layout) — uses margin so it won't fight the transform reveal */
@media(min-width:901px){
  .kp-grid--stagger{ align-items:start; }
  .kp-grid--stagger > *:nth-child(3n+2){ margin-top:54px; }
  .kp-grid--stagger > *:nth-child(3n){ margin-top:108px; }
}

/* ---------- Hero ---------- */
.kp-hero{ position:relative; min-height:86vh; display:flex; align-items:flex-end; overflow:hidden;
  background-size:cover; background-position:center; }
.kp-hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(20,2,12,.30) 45%, rgba(20,2,12,.78) 100%); }
.kp-hero__inner{ position:relative; z-index:1; max-width:1320px; margin:0 auto; width:100%;
  padding:0 7vw 6.5rem; color:#fff; }
.kp-hero__en{ display:inline-block; color:#ff9bdb; font-weight:700; letter-spacing:.3em; font-size:1.4rem;
  margin:0 0 1.6rem; padding-bottom:.8rem; border-bottom:2px solid rgba(255,155,219,.65); }
.kp-hero__ttl{ font-size:clamp(3rem,5.8vw,5.8rem); line-height:1.18; margin:0; font-weight:800;
  letter-spacing:.01em; text-shadow:0 4px 36px rgba(0,0,0,.35); }
.kp-scrollcue{ position:absolute; right:6vw; bottom:2.6rem; z-index:1; color:#fff; font-size:1.1rem;
  letter-spacing:.25em; writing-mode:vertical-rl; opacity:.85; }
.kp-scrollcue::after{ content:""; display:block; width:1px; height:52px; margin:1rem auto 0; background:#fff;
  animation:kpCue 1.8s ease-in-out infinite; transform-origin:top; }
@keyframes kpCue{ 0%{transform:scaleY(0)} 45%{transform:scaleY(1)} 100%{transform:scaleY(0); transform-origin:bottom} }

/* ---------- Layout shell ----------
   Shared content box: identical rectangle for EVERY section so the catch copy,
   photo row, section headings and image/text rows all line up on the same
   left/right edges and width. width:min() gives a fixed 1320 content area on
   wide screens with a 7vw gutter that only kicks in once the viewport narrows. */
.kp-wrap{ width:min(1320px, calc(100% - 14vw)); margin:0 auto; padding:9rem 0; }
.kp-lead{ font-size:1.95rem; line-height:2.1; color:#3a3a40; max-width:900px; margin:0 0 6.5rem; font-weight:500; }
.kp-sechead{ margin:0 0 3.6rem; }
.kp-sec-en{ color:#ff66cc; font-weight:700; letter-spacing:.2em; font-size:1.4rem; margin:0 0 .8rem; }
.kp-sec-ttl{ font-size:3.4rem; line-height:1.3; margin:0; font-weight:800; }
.kp-divider{ height:1px; background:linear-gradient(90deg,#ff66cc 0%, #ffd9ee 40%, transparent 100%); margin:7rem 0; border:0; }

/* ---------- Service: editorial alternating rows ---------- */
.kp-svc{ display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center; margin-bottom:9.5rem; }
.kp-svc__fig{ margin:0; overflow:hidden; border-radius:20px; box-shadow:0 30px 70px rgba(0,0,0,.16); }
.kp-svc:nth-of-type(even) .kp-svc__fig{ order:2; }
.kp-svc__fig img{ width:100%; height:500px; object-fit:cover; display:block; transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
.kp-svc:hover .kp-svc__fig img{ transform:scale(1.06); }
.kp-svc__ghost{ font-size:9rem; font-weight:800; line-height:.82; color:#ffd9ee; letter-spacing:-.03em; margin:0 0 .6rem; }
.kp-svc__en{ color:#ff66cc; font-weight:700; letter-spacing:.16em; font-size:1.5rem; }
.kp-svc__ttl{ font-size:3.2rem; font-weight:800; margin:.6rem 0 1.8rem; line-height:1.24; }
.kp-txt{ font-size:1.75rem; line-height:2.05; color:#4a4a52; margin:0; }
.kp-list{ list-style:none; margin:2.2rem 0 0; padding:0; }
.kp-list li{ position:relative; padding:1.05rem 0 1.05rem 2.4rem; line-height:1.7; border-bottom:1px solid #efedf0; font-size:1.62rem; }
.kp-list li::before{ content:""; position:absolute; left:0; top:1.7rem; width:12px; height:12px; border-radius:50%;
  background:#ff66cc; box-shadow:0 0 0 4px #ffe1f2; }

/* ---------- Cards (features / offices) ---------- */
.kp-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); gap:3rem; }
.kp-card{ position:relative; background:#fff; border-radius:20px; overflow:hidden;
  box-shadow:0 14px 44px rgba(0,0,0,.08); transition:transform .55s cubic-bezier(.2,.8,.2,1), box-shadow .55s; }
.kp-card:hover{ transform:translateY(-12px); box-shadow:0 34px 64px rgba(214,72,158,.20); }
.kp-card__fig{ margin:0; height:264px; overflow:hidden; }
.kp-card__fig img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s cubic-bezier(.2,.8,.2,1); }
.kp-card:hover .kp-card__fig img{ transform:scale(1.08); }
.kp-card__no{ position:absolute; top:1.4rem; left:1.4rem; width:4.4rem; height:4.4rem; border-radius:50%;
  background:#ff66cc; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800;
  font-size:1.7rem; box-shadow:0 8px 20px rgba(214,72,158,.45); }
.kp-card__body{ padding:2.4rem 2.4rem 2.7rem; }
.kp-card__en{ color:#ff66cc; font-weight:700; font-size:1.3rem; letter-spacing:.1em; }
.kp-card__ttl{ font-size:2.2rem; font-weight:800; margin:.6rem 0 1.1rem; line-height:1.4; }
.kp-card__txt{ font-size:1.62rem; line-height:1.95; color:#56565e; margin:0; }

/* ---------- Job / info tables ---------- */
.kp-job{ border-radius:20px; overflow:hidden; background:#fff; box-shadow:0 14px 44px rgba(0,0,0,.08); margin-bottom:4rem; }
.kp-job__head{ display:flex; align-items:center; gap:1.4rem; padding:2rem 2.6rem;
  background:linear-gradient(90deg,#fff,#fff6fc); border-bottom:2px solid #ffe1f2; flex-wrap:wrap; }
.kp-badge{ font-size:1.3rem; font-weight:700; padding:.5rem 1.4rem; border-radius:999px; color:#fff; background:#ff66cc; }
.kp-badge--off{ background:#c2c2c2; }
.kp-job__ttl{ font-size:2.4rem; font-weight:800; margin:0; }
.kp-table{ width:100%; border-collapse:collapse; font-size:1.6rem; }
.kp-table th{ text-align:left; padding:1.3rem 1.9rem; background:#fdf2f8; width:26%;
  border-bottom:1px solid #f4e2ef; font-weight:700; vertical-align:top; white-space:nowrap; }
.kp-table td{ padding:1.3rem 1.9rem; border-bottom:1px solid #f4e2ef; line-height:1.85; }
.kp-table tr:last-child th, .kp-table tr:last-child td{ border-bottom:0; }
.kp-note{ font-size:1.55rem; color:#555; line-height:2.05; background:#fdf2f8; padding:2rem 2.3rem; border-radius:16px; margin:2.2rem 0 0; }
.kp-note a{ color:#d6489e; font-weight:700; }

/* Defensive: keep all content text dark even if a leftover page theme (e.g.
   page-special.css .special-main{color:var(--color-txt2)}) tries to force white. */
.kp-main .kp-job__ttl, .kp-main .kp-table th{ color:#1c1c22; }
.kp-main .kp-table td{ color:#3a3a40; }
.kp-main .kp-note{ color:#555; }
.kp-main .kp-svc__ttl, .kp-main .kp-card__ttl, .kp-main .kp-sec-ttl{ color:#1c1c22; }
.kp-main .kp-txt, .kp-main .kp-card__txt, .kp-main .kp-list li{ color:#4a4a52; }

/* ---------- Scroll reveal (transform-only: opacity always 1 → content can NEVER be hidden) ---------- */
/* ===========================================================
   Scroll-triggered reveal animations
   Targets: .kp-anim (existing) and common section blocks
   Trigger: JS adds .is-shown when element enters viewport
   =========================================================== */
.kp-anim,
.kp-sechead,
.kp-job,
.kp-svc,
.kp-card,
.kp-fleet,
.kp-table,
.kp-note,
.kp-lead,
.kp-strip,
.kp-fleet__head,
.kp-svc__anchor,
.contact-tel,
.contact-form,
.home-recruit__inner > *,
.home-news__header,
.home-news__list,
.home-news__list .p-card{
  opacity:0;
  transform:translateY(56px) scale(.95);
  filter:blur(4px);
  transition:
    opacity 1.05s cubic-bezier(.2,.85,.25,1),
    transform 1.05s cubic-bezier(.18,.78,.32,1.06),
    filter .8s cubic-bezier(.2,.85,.25,1);
  will-change:opacity,transform,filter;
}
.kp-anim.is-shown,
.kp-sechead.is-shown,
.kp-job.is-shown,
.kp-svc.is-shown,
.kp-card.is-shown,
.kp-fleet.is-shown,
.kp-table.is-shown,
.kp-note.is-shown,
.kp-lead.is-shown,
.kp-strip.is-shown,
.kp-fleet__head.is-shown,
.kp-svc__anchor.is-shown,
.contact-tel.is-shown,
.contact-form.is-shown,
.home-recruit__inner.is-shown > *,
.home-news__header.is-shown,
.home-news__list.is-shown,
.home-news__list .p-card.is-shown{
  opacity:1;
  transform:translateY(0) scale(1);
  filter:blur(0);
}
/* Staggered delays — stronger spacing for a more cinematic cascade */
.kp-anim.d1, [class*="kp-anim"].d1{ transition-delay:.15s; }
.kp-anim.d2, [class*="kp-anim"].d2{ transition-delay:.30s; }
.kp-anim.d3, [class*="kp-anim"].d3{ transition-delay:.45s; }
.kp-anim.d4, [class*="kp-anim"].d4{ transition-delay:.60s; }
.home-recruit__inner.is-shown > *:nth-child(1){ transition-delay:0s; }
.home-recruit__inner.is-shown > *:nth-child(2){ transition-delay:.22s; }
.home-recruit__inner.is-shown > *:nth-child(3){ transition-delay:.42s; }
.home-recruit__inner.is-shown > *:nth-child(4){ transition-delay:.62s; }
.home-news__list .p-card:nth-child(1){ transition-delay:.08s; }
.home-news__list .p-card:nth-child(2){ transition-delay:.22s; }
.home-news__list .p-card:nth-child(3){ transition-delay:.36s; }
.home-news__list .p-card:nth-child(4){ transition-delay:.50s; }

.reveal{ opacity:1 !important; }

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .kp-svc{ grid-template-columns:1fr; gap:2.4rem; margin-bottom:6rem; }
  .kp-svc:nth-of-type(even) .kp-svc__fig{ order:0; }
  .kp-svc__fig img{ height:300px; }
  .kp-svc__ghost{ font-size:6rem; }
  .kp-svc__ttl{ font-size:2.6rem; }
}
@media(max-width:767px){
  .kp-hero{ min-height:56vh; }
  .kp-hero__ttl{ font-size:2.8rem; }
  .kp-wrap{ padding:5rem 0; }
  .kp-lead{ font-size:1.6rem; margin-bottom:4rem; }
  .kp-sec-ttl{ font-size:2.5rem; }
  .kp-job__head{ padding:1.4rem 1.5rem; }
  .kp-job__ttl{ font-size:1.9rem; }
  .kp-table th, .kp-table td{ padding:1rem 1.1rem; font-size:1.45rem; }
  .kp-table th{ white-space:normal; }
  .kp-scrollcue{ display:none; }
  /* Stack th/td vertically on mobile (title on top, content below) */
  .kp-table:not(.kp-table--equipment) tr{ display:block; padding:0; margin-bottom:1.6rem; border-bottom:1px solid #f4e2ef; }
  .kp-table:not(.kp-table--equipment) tr:last-child{ border-bottom:0; margin-bottom:0; }
  .kp-table:not(.kp-table--equipment) th,
  .kp-table:not(.kp-table--equipment) td{ display:block; width:100%; padding:1rem 1.2rem; border-bottom:0; }
  .kp-table:not(.kp-table--equipment) th{ background:#fdf2f8; font-weight:700; border-radius:.6rem .6rem 0 0; }
  .kp-table:not(.kp-table--equipment) td{ background:#fff; border-radius:0 0 .6rem .6rem; padding-top:.6rem; }
  /* Equipment table: keep horizontal but adjust column widths */
  .kp-table--equipment th{ width:62%; padding:1rem .8rem 1rem 1.1rem; font-size:1.4rem; white-space:normal; }
  .kp-table--equipment td{ width:38%; padding:1rem 1.1rem; font-size:1.4rem; text-align:right; font-weight:700; }
}

/* ===== Full-bleed feature sections (large, screen-filling, alternating) ===== */
.kp-feature{ position:relative; min-height:92vh; display:flex; align-items:center; overflow:hidden;
  background-size:cover; background-position:center; }
.kp-feature::after{ content:""; position:absolute; inset:0; }
.kp-feature--left::after{ background:linear-gradient(90deg, rgba(22,4,15,.78) 0%, rgba(22,4,15,.40) 48%, rgba(22,4,15,.05) 100%); }
.kp-feature--right::after{ background:linear-gradient(270deg, rgba(22,4,15,.78) 0%, rgba(22,4,15,.40) 48%, rgba(22,4,15,.05) 100%); }
.kp-feature__inner{ position:relative; z-index:2; max-width:1320px; margin:0 auto; width:100%; padding:0 7vw; }
.kp-feature__box{ max-width:600px; color:#fff; }
.kp-feature--right .kp-feature__box{ margin-left:auto; }
.kp-feature__no{ font-size:6rem; font-weight:800; line-height:.85; color:rgba(255,255,255,.30); letter-spacing:-.02em; }
.kp-feature__en{ display:inline-block; color:#ffaee0; font-weight:700; letter-spacing:.2em; font-size:1.4rem; margin:.6rem 0 1.1rem; }
.kp-feature__ttl{ font-size:clamp(2.6rem,4.4vw,4.2rem); font-weight:800; line-height:1.24; margin:0 0 1.7rem; text-shadow:0 3px 30px rgba(0,0,0,.4); }
.kp-feature__txt{ font-size:1.72rem; line-height:2.05; color:rgba(255,255,255,.93); margin:0; }
.kp-feature__bar{ display:inline-block; margin-top:2rem; padding:.4rem 0; border-bottom:2px solid #ff66cc; color:#ffaee0; font-weight:700; letter-spacing:.08em; font-size:1.4rem; text-decoration:none; transition:color .4s, border-color .4s; }
a.kp-feature__bar:hover{ color:#fff; border-color:#fff; }
.kp-feature--full{ min-height:100vh; }
/* wide text box variant for rhythm */
.kp-feature__box--wide{ max-width:720px; }
@media(max-width:767px){
  .kp-feature{ min-height:74vh; }
  .kp-feature--full{ min-height:88vh; }
  .kp-feature__no{ font-size:4rem; }
  .kp-feature__ttl{ font-size:2.3rem; }
  .kp-feature__txt{ font-size:1.5rem; }
}
/* compact intro band */
.kp-intro{ max-width:1280px; margin:0 auto; padding:7rem 7vw 5rem; position:relative; z-index:2; }

/* ===== Catch copy band: 2 columns, text only, animated background ===== */
.kp-catch{ position:relative; overflow:hidden; min-height:80vh; display:flex; align-items:center; padding:15rem 0 6rem; }
.kp-catch__bg{ position:absolute; inset:-15%; z-index:0; pointer-events:none;
  background:
    radial-gradient(38% 48% at 18% 28%, #ffcde9 0%, rgba(255,205,233,0) 60%),
    radial-gradient(42% 52% at 82% 68%, #ffe6c4 0%, rgba(255,230,196,0) 60%),
    radial-gradient(46% 56% at 62% 16%, #cfe6ff 0%, rgba(207,230,255,0) 58%),
    radial-gradient(50% 60% at 28% 84%, #c9f0dc 0%, rgba(201,240,220,0) 58%);
  background-size:180% 180%; animation:kpDrift 22s ease-in-out infinite; filter:blur(8px); }
@keyframes kpDrift{ 0%,100%{ background-position:0% 0%; } 50%{ background-position:100% 100%; } }
.kp-catch__inner{ position:relative; z-index:2; width:min(1320px, calc(100% - 14vw)); margin:0 auto;
  display:grid; grid-template-columns:1.15fr .85fr; gap:5.5rem; align-items:center; }
.kp-catch__en{ display:inline-block; color:#ff66cc; font-weight:700; letter-spacing:.3em; font-size:1.5rem;
  margin:0 0 2.2rem; padding-bottom:.9rem; border-bottom:2px solid #ffb6e2; }
.kp-catch__ttl{ font-size:clamp(3rem,5.2vw,5.6rem); font-weight:800; line-height:1.2; margin:0 0 2.6rem; letter-spacing:.01em; color:#1c1c22; }
.kp-catch__ttl em{ font-style:normal; font-weight:inherit; color:#ff66cc; }
.kp-catch__ttl strong{ font-weight:inherit; color:#ff66cc; }
.kp-sec-ttl em, .home-message__title em, h1 em, h2 em, h3 em{ font-weight:inherit; font-style:normal; }
.kp-catch__lead{ font-size:1.95rem; line-height:2.15; color:#46464e; max-width:760px; margin:0; font-weight:500; }
@media(max-width:900px){ .kp-catch{ padding:11rem 0 3.5rem; min-height:auto; }
  .kp-catch__inner{ grid-template-columns:1fr; gap:2.8rem; }
  .kp-catch__ttl{ font-size:2.6rem; line-height:1.4; } .kp-catch__lead{ font-size:1.5rem; } }
@media(max-width:767px){
  /* Hide FV background photo on mobile (text-only FV for readability) */
  .kp-catch--photo .kp-catch__bg{ display:none !important; }
  .kp-catch--photo .kp-catch__overlay{ display:none !important; }
  .kp-catch--photo{ background:linear-gradient(155deg,#ffe7f5 0%,#ffd2ec 52%,#ffbfe3 100%); }
  .kp-catch--photo .kp-catch__inner{
    width:auto; max-width:none; margin:0 5vw; padding-right:5vw;
  }
  .kp-catch--photo .kp-catch__text{ max-width:none; }
  /* SP FV titles — match FEATURES (.kp-chero) size on all pages */
  .kp-catch__ttl{ font-size:clamp(2.6rem,6.8vw,3.4rem); line-height:1.3; font-weight:800; word-break:keep-all; overflow-wrap:break-word; }
  .kp-chero__ttl{ font-size:clamp(2.6rem,6.8vw,3.4rem); line-height:1.3; word-break:keep-all; overflow-wrap:break-word; }
  /* Section headings — Japanese word-break for natural line breaks */
  .kp-sec-ttl, .kp-svc__ttl, .kp-card__ttl, .kp-job__ttl, .kp-chap__ttl, .kp-fleet__ttl{
    word-break:keep-all; overflow-wrap:break-word; line-height:1.45;
  }
  .kp-svc__ttl{ font-size:2.2rem; }
  .kp-sec-ttl{ font-size:2.3rem; }
  .kp-catch__lead, .kp-chero__lead{ font-size:1.55rem; line-height:2; }
  /* FEATURES FV — strengthen overlay so lead text is readable over the car photo */
  .kp-chero{
    background:
      linear-gradient(180deg, rgba(253,242,248,.55) 0%, rgba(253,242,248,.85) 60%, rgba(253,242,248,.95) 100%),
      url('features_fv.png') center/cover no-repeat,
      linear-gradient(155deg,#ffe7f5 0%, #ffd2ec 52%, #ffbfe3 100%);
  }
  .kp-chero::before{
    content:""; position:absolute; inset:0; z-index:1;
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
    background:rgba(253,242,248,.25);
    pointer-events:none;
  }
}

/* ===== Photo row (auto-scrolling marquee strip) ===== */
.kp-strip{ position:relative; z-index:2; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%); }
.kp-strip__track{ display:flex; gap:2.2rem; width:max-content; padding:3rem 1.1rem 4rem; animation:kpMarquee 42s linear infinite; }
.kp-strip:hover .kp-strip__track{ animation-play-state:paused; }
.kp-strip__item{ flex:0 0 auto; width:clamp(280px,30vw,460px); height:clamp(210px,32vh,330px);
  border-radius:18px; overflow:hidden; box-shadow:0 20px 46px rgba(0,0,0,.14); }
.kp-strip__item:nth-child(even){ transform:translateY(34px); }
.kp-strip__item img{ width:100%; height:100%; object-fit:cover; display:block; }
@keyframes kpMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ===== Strengths: reliable alternating editorial rows (image truly flips L/R) ===== */
.kp-svcs .kp-svc:nth-child(even) .kp-svc__figwrap{ order:2; }
.kp-svcs .kp-svc:nth-child(even) .kp-svc__figwrap::before{ left:auto; right:-28px; }
.kp-svcs .kp-svc:nth-child(odd) .kp-svc__figwrap::before{ left:-28px; right:auto; }
@media(max-width:900px){ .kp-svcs .kp-svc:nth-child(even) .kp-svc__figwrap{ order:0; } }

/* ===========================================================
   Features page v2 — pink, full-screen chapters
   (partner network + motorsports as the two main contents)
   =========================================================== */
.projects-main{ background:#fde6f4; }      /* overall pink */
.projects-main .kp-shapes{ z-index:0; }

/* full-screen pink hero chapter */
.kp-chero{ position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden;
  padding-bottom:14rem;
  background:
    linear-gradient(90deg, rgba(253,242,248,.95) 0%, rgba(253,242,248,.88) 30%, rgba(253,242,248,.55) 52%, rgba(253,242,248,0) 72%),
    url('features_fv.png') center/cover no-repeat,
    linear-gradient(155deg,#ffe7f5 0%, #ffd2ec 52%, #ffbfe3 100%); }
/* FEATURES FV bottom — left-bottom diagonal shape divider matching next section bg */
.kp-chero::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px;
  height:10rem; background:#ffeef8;
  clip-path:polygon(0 100%, 100% 0, 100% 100%);
  z-index:3; pointer-events:none;
}
@media(max-width:767px){
  .kp-chero{ padding-bottom:9rem; }
  .kp-chero::after{ height:6rem; }
}
.kp-chero__inner{ position:relative; z-index:2; width:min(1320px, calc(100% - 14vw)); margin:0 auto; }
.kp-chero__en{ display:inline-block; color:#d6489e; font-weight:700; letter-spacing:.32em; font-size:1.5rem;
  margin:0 0 2.2rem; padding-bottom:.9rem; border-bottom:2px solid #ff8fce; }
.kp-chero__ttl{ font-size:clamp(3.6rem,6.2vw,7rem); font-weight:800; line-height:1.18; margin:0 0 2.6rem;
  letter-spacing:.01em; color:#3a1028; }
.kp-chero__ttl em{ font-style:normal; color:#ff3aae; }
.kp-chero__lead{ font-size:1.95rem; line-height:2.15; color:#6a2a4f; max-width:760px; margin:0; font-weight:500; }
.kp-chero__idx{ display:flex; gap:3.4rem; margin-top:5rem; flex-wrap:wrap; }
.kp-chero__idx a{ display:flex; align-items:baseline; gap:1.1rem; text-decoration:none; color:#3a1028; }
.kp-chero__idx .n{ font-size:3.4rem; font-weight:800; color:#ff66cc; line-height:1; }
.kp-chero__idx .t{ font-size:1.85rem; font-weight:700; border-bottom:2px solid transparent; transition:border-color .4s; }
.kp-chero__idx a:hover .t{ border-color:#ff66cc; }

/* generic full-screen chapter */
.kp-chap{ position:relative; z-index:2; min-height:100vh; padding:13rem 0; display:flex; align-items:center; }
.kp-chap__wrap{ width:min(1320px, calc(100% - 14vw)); margin:0 auto; width:min(1320px, calc(100% - 14vw)); }
.kp-chap--partner{ background:#ffeef8; }
.kp-chap__head{ margin:0 0 4rem; }
.kp-chap__no{ font-size:7rem; font-weight:800; color:rgba(255,102,204,.32); line-height:.8; letter-spacing:-.02em; }
.kp-chap__en{ color:#d6489e; font-weight:700; letter-spacing:.2em; font-size:1.45rem; margin:1rem 0 .6rem; }
.kp-chap__ttl{ font-size:clamp(2.8rem,4.4vw,4.4rem); font-weight:800; line-height:1.24; margin:0; color:#3a1028; }

/* partner: sticky intro + scrolling table */
.kp-partner{ display:grid; grid-template-columns:.82fr 1.18fr; gap:5rem; align-items:start; }
.kp-partner__intro{ position:sticky; top:14vh; align-self:start; }
.kp-bignum{ font-size:10rem; font-weight:800; color:#ff3aae; line-height:.86; letter-spacing:-.03em; }
.kp-bignum small{ font-size:3rem; margin-left:.4rem; }
.kp-partner__lead{ font-size:1.7rem; line-height:2.05; color:#6a2a4f; margin:1.8rem 0 0; max-width:34rem; }
.kp-cats{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:2.4rem; max-width:34rem; }
.kp-cat{ font-size:1.25rem; font-weight:700; padding:.45rem 1.15rem; border-radius:999px; color:#fff; white-space:nowrap; }
.kp-cat--ins{ background:#3f8ae0; }      /* 保険 */
.kp-cat--bp{ background:#ff66cc; }        /* 板金塗装 */
.kp-cat--mnt{ background:#36b389; }       /* 車両整備 */
.kp-cat--whl{ background:#f08a3c; }       /* ホイールリペア */
.kp-cat--dnt{ background:#9069d6; }       /* デントリペア */
.kp-cat--gls{ background:#2bb6c4; }       /* ガラス交換 */
.kp-ptable{ width:100%; border-collapse:collapse; font-size:1.5rem; background:#fff;
  border-radius:18px; overflow:hidden; box-shadow:0 18px 48px rgba(214,72,158,.14); }
.kp-ptable thead th{ background:#ff66cc; color:#fff; text-align:left; padding:1.5rem 1.8rem; font-weight:700;
  letter-spacing:.04em; font-size:1.45rem; position:sticky; top:0; }
.kp-ptable td{ padding:1.35rem 1.8rem; border-bottom:1px solid #f6e2ef; color:#3a3a40; line-height:1.6; vertical-align:middle; }
.kp-ptable tbody tr:nth-child(even){ background:#fff7fc; }
.kp-ptable tbody tr:hover{ background:#ffeef8; }
.kp-ptable tbody tr:last-child td{ border-bottom:0; }
.kp-ptable .name{ font-weight:700; color:#1c1c22; }
.kp-ptable td:last-child{ width:1%; white-space:nowrap; }

/* motorsports: full-screen pink with big visual */
.kp-chap--moto{ background:linear-gradient(205deg,#ffd9ee 0%, #ffbfe3 60%, #ff9fd4 100%); }
.kp-moto{ display:grid; grid-template-columns:1.05fr .95fr; gap:6rem; align-items:center; }
.kp-moto__fig{ position:relative; margin:0; border-radius:24px; overflow:hidden;
  box-shadow:0 40px 90px rgba(120,18,72,.30); aspect-ratio:4/3; }
.kp-moto__fig img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.2s cubic-bezier(.2,.8,.2,1); }
.kp-moto__fig:hover img{ transform:scale(1.06); }
.kp-moto__ttl{ font-size:clamp(3rem,5vw,5.2rem); font-weight:800; line-height:1.22; margin:.4rem 0 2rem; color:#3a1028; }
.kp-moto__txt{ font-size:1.78rem; line-height:2.1; color:#5e2545; margin:0 0 2.4rem; }
.kp-moto__pts{ list-style:none; margin:0; padding:0; }
.kp-moto__pts li{ position:relative; padding:1.1rem 0 1.1rem 2.6rem; font-size:1.62rem; color:#4a2038;
  border-bottom:1px solid rgba(214,72,158,.22); }
.kp-moto__pts li::before{ content:""; position:absolute; left:0; top:1.7rem; width:13px; height:13px;
  border-radius:50%; background:#ff3aae; box-shadow:0 0 0 4px rgba(255,58,174,.22); }

@media(max-width:900px){
  .kp-chap{ padding:8rem 0; min-height:auto; }
  .kp-partner{ grid-template-columns:1fr; gap:2.6rem; }
  .kp-partner__intro{ position:static; }
  .kp-bignum{ font-size:7rem; }
  .kp-moto{ grid-template-columns:1fr; gap:2.6rem; }
  .kp-chero{ min-height:90vh; }
}
@media(max-width:767px){
  .kp-ptable{ font-size:1.32rem; }
  .kp-ptable thead th, .kp-ptable td{ padding:1rem 1.1rem; }
  .kp-ptable td:nth-child(2){ display:none; }   /* hide address column on phones */
}

/* ===========================================================
   v3 additions — history timeline, motorsports spec, forms
   =========================================================== */
/* History / 沿革 timeline */
.kp-timeline{ list-style:none; margin:0; padding:0; }
.kp-timeline li{ position:relative; display:grid; grid-template-columns:11rem 1fr; gap:2.8rem; padding:1.5rem 0; align-items:baseline; }
.kp-timeline li::before{ content:""; position:absolute; left:11rem; top:0; bottom:0; width:2px; background:#ffcce8; }
.kp-timeline li:first-child::before{ top:1.9rem; }
.kp-timeline li:last-child::before{ bottom:auto; height:1.9rem; }
.kp-timeline li::after{ content:""; position:absolute; left:11rem; top:1.7rem; width:14px; height:14px; border-radius:50%;
  background:#ff66cc; box-shadow:0 0 0 4px #ffe1f2; transform:translateX(-6px); }
.kp-timeline .yr{ font-weight:800; color:#ff66cc; font-size:1.62rem; text-align:right; white-space:nowrap; }
.kp-timeline .ev{ font-size:1.62rem; color:#3a3a40; line-height:1.75; padding-left:2.4rem; }
@media(max-width:767px){
  .kp-timeline li{ grid-template-columns:1fr; gap:.2rem; padding-left:2.4rem; }
  .kp-timeline li::before{ left:0; } .kp-timeline li::after{ left:0; }
  .kp-timeline .yr{ text-align:left; }
}

/* Motorsports spec sheet */
.kp-spec{ width:100%; border-collapse:collapse; font-size:1.55rem; background:rgba(255,255,255,.78);
  border-radius:18px; overflow:hidden; box-shadow:0 18px 48px rgba(120,18,72,.16); }
.kp-spec th{ text-align:left; padding:1.25rem 1.8rem; width:36%; background:rgba(255,255,255,.45);
  color:#7a2a55; font-weight:700; border-bottom:1px solid rgba(214,72,158,.16); vertical-align:top; white-space:nowrap; }
.kp-spec td{ padding:1.25rem 1.8rem; border-bottom:1px solid rgba(214,72,158,.16); color:#3a1028; font-weight:600; }
.kp-spec tr:last-child th, .kp-spec tr:last-child td{ border-bottom:0; }
.kp-spec--moto{ grid-column:1 / -1; }

/* Forms (様式集) */
.kp-forms{ display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr)); gap:2rem; }
.kp-form{ display:flex; align-items:center; gap:1.7rem; background:#fff; border:1px solid #ffe1f2; border-radius:16px;
  padding:2.1rem 2.3rem; text-decoration:none; color:#1c1c22;
  box-shadow:0 12px 36px rgba(0,0,0,.07); transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s; }
.kp-form:hover{ transform:translateY(-8px); box-shadow:0 28px 56px rgba(214,72,158,.20); }
.kp-form__ico{ flex:0 0 auto; width:5.4rem; height:5.4rem; border-radius:14px; background:#ffeef8; color:#ff66cc;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1.45rem; letter-spacing:.04em; }
.kp-form__body{ flex:1 1 auto; min-width:0; }
.kp-form__ttl{ font-size:1.85rem; font-weight:700; margin:0 0 .3rem; }
.kp-form__meta{ font-size:1.3rem; color:#9a6a82; margin:0; }
.kp-form__arrow{ flex:0 0 auto; color:#ff66cc; font-size:2rem; }
.kp-formcat{ margin:0 0 2.4rem; }
.kp-formcat__ttl{ font-size:2rem; font-weight:800; color:#1c1c22; margin:0 0 2rem; padding-left:1.3rem;
  border-left:5px solid #ff66cc; line-height:1.3; }
.kp-formnote{ font-size:1.5rem; color:#666; line-height:2; background:#fff7fc; border-radius:14px; padding:1.8rem 2.2rem; margin-top:4rem; }
.kp-card__addr{ font-size:1.4rem; color:#8a6a7a; margin:1.1rem 0 0; padding-top:1.1rem; border-top:1px solid #f4e2ef; line-height:1.6; }
.kp-legend{ display:flex; flex-wrap:wrap; gap:.7rem; margin:0 0 2.4rem; }

/* ===== News list ===== */
.kp-news{ display:flex; flex-direction:column; gap:0; border-top:1px solid #f4e2ef; }
.kp-news__item{ display:grid; grid-template-columns:18rem 1fr; gap:3rem; padding:2.6rem 0; align-items:start; border-bottom:1px solid #f4e2ef; transition:background-color .4s; }
.kp-news__item:hover{ background:#fff7fc; }
.kp-news__meta{ display:flex; flex-direction:column; gap:.8rem; padding-top:.4rem; }
.kp-news__meta time{ font-size:1.4rem; color:#9a6a82; font-weight:700; letter-spacing:.04em; }
.kp-news__cat{ display:inline-block; align-self:flex-start; font-size:1.2rem; font-weight:700; padding:.4rem 1.2rem; border-radius:999px; background:#ffeef8; color:#d6489e; letter-spacing:.04em; }
.kp-news__ttl{ font-size:2rem; font-weight:800; margin:0 0 .9rem; color:#1c1c22; line-height:1.45; }
.kp-news__body{ font-size:1.55rem; color:#56565e; line-height:2; margin:0; grid-column:2; }
@media(max-width:767px){
  .kp-news__item{ grid-template-columns:1fr; gap:.8rem; padding:2rem 0; }
  .kp-news__ttl{ font-size:1.7rem; }
  .kp-news__body{ font-size:1.45rem; grid-column:1; }
}

/* ===========================================================
   Header text override for inner (kp-main) pages
   The base theme assumes a dark hero behind the sticky header
   and uses white nav text. My inner pages have a light pink catch,
   so force dark text only on pages that contain .kp-main.
   The home page (.home-main) keeps the original white text.
   =========================================================== */
body:has(.kp-main) .l-header .c-anchor-txt__real,
body:has(.kp-main) .l-header .c-anchor-txt__clone,
body:has(.kp-main) .l-sitemap .c-anchor-txt__real,
body:has(.kp-main) .l-sitemap .c-anchor-txt__clone{
  color:#1c1c22 !important;
}
body:has(.kp-main) .l-header__button > div > span{ background-color:#1c1c22 !important; }
/* current-page chip stays pink-on-pink-tint */
body:has(.kp-main) .l-header a.is-current .c-anchor-txt__real,
body:has(.kp-main) .l-header a.is-current .c-anchor-txt__clone{
  color:#d6489e !important;
}

/* ===========================================================
   Global font: Zen Kaku Gothic via Adobe Fonts / Typekit (kit hdc1jeb)
   Applied site-wide. Falls back to system Japanese sans-serif until loaded.
   =========================================================== */
html, body, input, textarea, select, button{
  font-family: "zen-kaku-gothic-new", "Zen Kaku Gothic New",
               "Hiragino Sans", "Hiragino Kaku Gothic ProN",
               "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif !important;
}


/* Sitemap (mobile drawer): show child items as nested list */
.l-sitemap__main li.has-dropdown > .dropdown{
  list-style:none; margin:1.2rem 0 .4rem 1.4rem; padding:0;
  border-left:2px solid #ffd9ee;
}
.l-sitemap__main li.has-dropdown > .dropdown li{ list-style:none; margin:.4rem 0; }
.l-sitemap__main li.has-dropdown > .dropdown a{
  display:block; padding:1.2rem 1.4rem; text-decoration:none; font-size:1.55rem; line-height:1.5;
}

/* ===========================================================
   Header nav dropdown — Service shows 4 child pages on hover
   (display:none guarantees hidden; transitions sacrificed for reliability)
   =========================================================== */
.l-header__nav li.has-dropdown{ position:relative; }
.l-header__nav li.has-dropdown > ul.dropdown{
  display:none !important;
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  background:#fff; padding:1.2rem 0; border-radius:14px; min-width:24rem; list-style:none; margin:0;
  box-shadow:0 18px 44px rgba(214,72,158,.22), 0 4px 12px rgba(0,0,0,.06);
  z-index:1000; border:1px solid #ffe1f2;
}
.l-header__nav li.has-dropdown:hover > ul.dropdown,
.l-header__nav li.has-dropdown:focus-within > ul.dropdown{
  display:block !important;
}
.l-header__nav li.has-dropdown::after{
  content:""; position:absolute; top:100%; left:0; right:0; height:14px;
}
.l-header__nav ul.dropdown li{ list-style:none; display:block; margin:0; }
.l-header__nav ul.dropdown a{
  display:block !important; padding:1rem 2.2rem; text-decoration:none; color:#1c1c22 !important;
  font-size:1.4rem; font-weight:600; white-space:nowrap; letter-spacing:.02em;
  transition:background-color .2s ease, color .2s ease;
}
.l-header__nav ul.dropdown a:hover{ background:#ffeef8; color:#d6489e !important; }
.l-header__nav ul.dropdown a .c-anchor-txt__real,
.l-header__nav ul.dropdown a .c-anchor-txt__clone{ color:#1c1c22 !important; }
/* Sitemap drawer: show as nested list (always expanded in the mobile drawer) */
.l-sitemap__main li.has-dropdown > ul.dropdown{
  list-style:none; margin:1.2rem 0 .4rem 1.4rem; padding:0;
  border-left:2px solid #ffd9ee;
}
.l-sitemap__main li.has-dropdown > ul.dropdown li{ list-style:none; display:block; margin:.4rem 0; }
.l-sitemap__main li.has-dropdown > ul.dropdown a{
  display:block; padding:1.2rem 1.4rem; text-decoration:none; font-size:1.55rem; line-height:1.5;
}

/* ===========================================================
   Footer nav: Service dropdown (mirrors header behaviour)
   Default: children hidden, shown only on hover/focus
   =========================================================== */
.l-footer__nav .l-footer__nav__main li.has-dropdown{ position:relative; }
.l-footer__nav .l-footer__nav__main li.has-dropdown > ul.dropdown{
  display:none !important;
  position:absolute; left:50%; bottom:100%; transform:translateX(-50%);
  background:#fff; padding:1.2rem 0; border-radius:14px; min-width:24rem;
  list-style:none; margin:0 0 1rem 0;
  box-shadow:0 18px 44px rgba(214,72,158,.22), 0 4px 12px rgba(0,0,0,.06);
  z-index:1000; border:1px solid #ffe1f2;
}
.l-footer__nav .l-footer__nav__main li.has-dropdown:hover > ul.dropdown,
.l-footer__nav .l-footer__nav__main li.has-dropdown:focus-within > ul.dropdown{
  display:block !important;
}
.l-footer__nav .l-footer__nav__main li.has-dropdown::before{
  content:""; position:absolute; bottom:100%; left:0; right:0; height:14px;
}
.l-footer__nav .l-footer__nav__main ul.dropdown li{ list-style:none; display:block; margin:0; }
.l-footer__nav .l-footer__nav__main ul.dropdown a{
  display:block !important; padding:1rem 2.2rem; text-decoration:none; color:#1c1c22 !important;
  font-size:1.4rem; font-weight:700; white-space:nowrap; letter-spacing:.02em;
  transition:background-color .2s ease, color .2s ease;
}
.l-footer__nav .l-footer__nav__main ul.dropdown a:hover{ background:#ffeef8; color:#d6489e !important; }

/* ===========================================================
   Header / Footer nav English labels — UPPERCASE + bold
   Section English titles also UPPERCASE + bold
   =========================================================== */
.l-header__nav .c-anchor-txt__real,
.l-header__nav .c-anchor-txt__clone,
.l-footer__nav .c-anchor-txt__real,
.l-footer__nav .c-anchor-txt__clone,
.l-sitemap__main .c-anchor-txt__real,
.l-sitemap__main .c-anchor-txt__clone{
  text-transform:uppercase !important;
  font-weight:900 !important;
  letter-spacing:.04em;
}
.c-title__en,
.kp-catch__en{
  text-transform:uppercase !important;
  font-weight:900 !important;
}

/* ===========================================================
   CONTACT page — unified inner-page styling
   =========================================================== */
.kp-main .contact-tel{ margin:0 0 3rem; padding:4rem 4.5rem; background:#fff; border-radius:2rem; box-shadow:0 6px 24px rgba(214,72,158,.08); overflow:hidden; }
.kp-main .contact-tel .c-flex4{ display:flex !important; flex-direction:row; gap:3rem; align-items:center; width:100%; }
.kp-main .contact-tel .c-flex4__side{ flex:0 0 auto; width:auto !important; max-width:none !important; min-width:0; }
.kp-main .contact-tel .c-flex4__main{ flex:1 1 auto; min-width:0; }
.kp-main .contact-tel header{ margin:0; }
.kp-main .contact-tel header .c-title2{ font-size:1.75rem; font-weight:800; color:#1c1c22; margin:0; line-height:1.4; padding-left:1.3rem; border-left:5px solid #ff66cc; white-space:nowrap; }
.kp-main .contact-tel__num{ font-size:3.2rem; font-weight:900; color:#d6489e; margin:0 0 1rem; line-height:1; letter-spacing:.02em; word-break:break-all; }
.kp-main .contact-tel__num a{ color:inherit; text-decoration:none; }
.kp-main .contact-tel__small{ font-size:1.4rem; color:#666; line-height:1.7; }
.kp-main .contact-form{ margin:5rem 0 0; padding:5rem; background:#fff; border-radius:2rem; box-shadow:0 6px 24px rgba(214,72,158,.08); overflow:hidden; }
.kp-main .contact-form *, .kp-main .contact-form *::before, .kp-main .contact-form *::after{ box-sizing:border-box; }
.kp-main .contact-form form{ width:100%; max-width:100%; }
.kp-main .contact-form .p-form__cell{ margin:0 !important; width:100%; max-width:100%; }
/* Reset common.min.css fixed widths (39% / 61%) and gap so our grid controls layout cleanly */
.kp-main .contact-form .c-flex4__side,
.kp-main .contact-form .p-form__cell .c-flex4__side{
  width:100% !important; max-width:none !important; min-width:0 !important;
  padding:0 !important; margin:0 !important;
}
.kp-main .contact-form .c-flex4__main,
.kp-main .contact-form .p-form__cell .c-flex4__main{
  width:100% !important; max-width:none !important; min-width:0 !important;
  padding:0 !important; margin:0 !important;
}
.kp-main .contact-form .p-form__control{ width:100%; max-width:100%; min-width:0; }
.kp-main .contact-form header .c-title2{ font-size:2.6rem; font-weight:800; color:#1c1c22; margin:0 0 3rem; padding-left:1.3rem; border-left:5px solid #ff66cc; line-height:1.4; }
/* 2-column grid: fixed label column on the left + flexible input column on the right.
   minmax(0,1fr) lets the input column shrink without overflowing the form card. */
.kp-main .contact-form .p-form__cell{
  display:grid;
  grid-template-columns: 16rem minmax(0, 1fr);
  gap:2.4rem;
  padding:2rem 0;
  border-bottom:1px solid #f4e2ef;
  align-items:start;
}
.kp-main .contact-form .p-form__cell:last-of-type{ border-bottom:none; }
.kp-main .contact-form .p-form__cell dt,
.kp-main .contact-form .p-form__cell .c-flex4__side{
  display:flex; align-items:center; min-height:auto;
  padding-top:1.2rem !important; font-size:1.55rem; font-weight:700; color:#1c1c22;
  word-break:keep-all; white-space:nowrap; line-height:1.4;
}
.kp-main .p-form__cell dt sup{ color:#ff66cc; font-size:1.4rem; }
.kp-main .p-form__txtbox{ width:100%; padding:1.4rem 1.6rem; font-size:1.55rem; border:1.5px solid #e8d5e0; border-radius:1rem; background:#fdf8fb; transition:border-color .2s ease,background-color .2s ease; box-sizing:border-box; font-family:inherit; }
.kp-main .p-form__txtbox:focus{ outline:none; border-color:#ff66cc; background:#fff; }
.kp-main textarea.p-form__txtbox{ resize:vertical; min-height:14rem; line-height:1.7; }
.kp-main .p-form__button{ margin-top:2.6rem; display:flex; justify-content:center; }
.kp-main .p-form__check a,
.kp-main .p-form__check button{ display:inline-block; padding:1.6rem 6rem; background:#1c1c22; color:#fff !important; border:0; border-radius:999px; text-decoration:none; font-weight:700; font-size:1.6rem; letter-spacing:.05em; transition:transform .2s ease, background-color .2s ease; font-family:inherit; cursor:pointer; }
.kp-main .p-form__check a:hover,
.kp-main .p-form__check button:hover{ transform:translateY(-2px); background:#000; }
.kp-main .p-form__check button:disabled{ opacity:.55; cursor:wait; transform:none; }
.kp-main .p-form__button.is-recaptcha-disabled .p-form__check a{ opacity:.4; cursor:not-allowed; pointer-events:none; }
.kp-main .p-form__status{ margin:2rem 0 0; padding:1.4rem 1.8rem; font-size:1.5rem; line-height:1.7; border-radius:1rem; min-height:0; text-align:center; }
.kp-main .p-form__status:empty{ display:none; }
.kp-main .p-form__status.is-error{ background:#fff0f6; color:#c01863; border:1px solid #ffc7df; }
.kp-main .p-form__status.is-success{ background:#eefbf4; color:#1b8050; border:1px solid #bde6cf; }
.kp-main .p-form__recaptcha{ margin:2rem 0; }
@media(max-width:767px){
  .kp-main .contact-tel, .kp-main .contact-form{ padding:3rem 2rem; }
  .kp-main .contact-tel .c-flex4{ display:flex !important; flex-direction:column !important; gap:1.5rem; align-items:stretch; }
  .kp-main .contact-tel .c-flex4__side{ width:100% !important; }
  .kp-main .contact-tel header .c-title2{ font-size:1.5rem !important; white-space:normal !important; padding-left:1.1rem; }
  .kp-main .contact-tel__num{ font-size:2.6rem !important; word-break:keep-all; }
  .kp-main .contact-tel__small{ font-size:1.3rem; word-break:keep-all; }
  /* SP — stack label above input (single column) */
  .kp-main .contact-form .p-form__cell{ grid-template-columns:1fr; gap:.8rem; padding:1.6rem 0; }
  .kp-main .contact-form .p-form__cell dt,
  .kp-main .contact-form .p-form__cell .c-flex4__side{
    padding-top:0 !important; white-space:normal !important;
  }
}

/* ===========================================================
   CONTACT FORM — hard reset overrides (insurance against
   previous broken rules in cached v17 CSS)
   =========================================================== */
/* Ensure submit button is always clickable — the original site's
   component-form.js may add .is-recaptcha-disabled which sets pointer-events:none.
   Our inline JS validates reCAPTCHA before submitting, so we don't need that block. */
.contact-main .contact-form .p-form__button,
.contact-main .contact-form .p-form__button.is-recaptcha-disabled{
  opacity:1 !important;
  pointer-events:auto !important;
}
.contact-main .contact-form .p-form__button.is-recaptcha-disabled .p-form__check button,
.contact-main .contact-form .p-form__button.is-recaptcha-disabled .p-form__check a{
  opacity:1 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}
/* CRITICAL: common.min.css gives .c-inner width:var(--contents) = 100vw - 4rem,
   which is wider than .contact-form's padding-box. Without this override, the
   form's right edge gets clipped by overflow:hidden, hiding the input's right
   border / border-radius. Force inner wrappers to fill parent instead. */
.contact-main .contact-form .c-inner,
.contact-main .contact-form .contact-form__inner,
.contact-main .contact-form .contact-form__form,
.contact-main .contact-tel .c-inner,
.contact-main .contact-tel > .c-flex4.c-inner{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
.contact-main .contact-form .p-form__cell.c-flex4{
  display:grid !important;
  grid-template-columns: 16rem minmax(0, 1fr) !important;
  gap:2.4rem !important;
  width:100% !important;
  max-width:100% !important;
  padding:2rem 0 !important;
  border-bottom:1px solid #f4e2ef !important;
  align-items:start !important;
}
.contact-main .contact-form .p-form__cell.c-flex4 > .c-flex4__side{
  width:100% !important; max-width:none !important; min-width:0 !important;
  flex:none !important; padding:0 !important; margin:0 !important;
  white-space:nowrap !important;
}
.contact-main .contact-form .p-form__cell.c-flex4 > .c-flex4__main{
  width:100% !important; max-width:none !important; min-width:0 !important;
  flex:none !important; padding:0 !important; margin:0 !important;
}
.contact-main .contact-form .p-form__cell.c-flex4 .p-form__control{
  width:100% !important; max-width:100% !important;
}
.contact-main .contact-form .p-form__cell.c-flex4 .p-form__txtbox{
  width:100% !important; max-width:100% !important; box-sizing:border-box !important;
}
@media(max-width:767px){
  .contact-main .contact-form .p-form__cell.c-flex4{
    grid-template-columns: 1fr !important;
    gap:.8rem !important;
    padding:1.6rem 0 !important;
  }
  .contact-main .contact-form .p-form__cell.c-flex4 > .c-flex4__side{
    white-space:normal !important;
  }
}

/* ===========================================================
   SERVICE landing — service card detail button
   =========================================================== */
.kp-svc__anchor{
  margin:3rem 0 0;
  display:flex;
}
.kp-svc__anchor a{
  display:inline-flex;align-items:center;gap:1.4rem;
  padding:1.4rem 3rem;
  background:#1c1c22;color:#fff !important;
  border-radius:999px;text-decoration:none;
  font-weight:700;font-size:1.45rem;letter-spacing:.04em;
  transition:transform .25s ease,background-color .25s ease;
}
.kp-svc__anchor a:hover{transform:translateY(-2px);background:#000;}
.kp-svc__anchor a .c-arrow svg path{fill:#fff;}

/* ===========================================================
   Arrow icon — show only ONE arrow (hide JS-cloned duplicates)
   =========================================================== */
.c-arrow > span ~ span,
.c-arrow > span > svg ~ svg,
.c-arrow2 > span ~ span,
.c-arrow2 > span > svg ~ svg{
  display:none !important;
}

/* ===========================================================
   About page — hero with background photo + left-only text
   =========================================================== */
.kp-catch.kp-catch--photo{ overflow:hidden; }
.kp-catch--photo .kp-catch__bg{
  inset:0;
  background:url('about_fv.png') center/cover no-repeat;
  filter:none; animation:none;
  z-index:0;
}
.kp-catch--photo .kp-catch__overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg,
    rgba(253,242,248,.95) 0%,
    rgba(253,242,248,.92) 30%,
    rgba(253,242,248,.65) 55%,
    rgba(253,242,248,.15) 78%,
    rgba(253,242,248,0) 100%);
}
.kp-catch--photo .kp-catch__inner{
  display:block;
  width:min(1320px, calc(100% - 14vw));
  max-width:none;
  margin:0 auto;
  position:relative; z-index:2;
}
.kp-catch--photo .kp-catch__text{
  max-width:72rem;
}
.kp-catch--photo .kp-catch__text{
  display:flex; flex-direction:column; gap:3rem;
}
.kp-catch--photo .kp-catch__lead{ max-width:55rem; }
/* SERVICE page variant uses its own photo */
.kp-catch--service .kp-catch__bg{
  background:url('service_fv.png') center/cover no-repeat;
}
.kp-catch--service .kp-catch__overlay{
  background:linear-gradient(90deg,
    rgba(255,229,243,.95) 0%,
    rgba(255,229,243,.88) 30%,
    rgba(255,229,243,.55) 52%,
    rgba(255,229,243,0) 72%);
}
/* SERVICE FV background — smaller, anchored to bottom-right so face is visible */
.kp-catch--service .kp-catch__bg{
  background:url('service_fv.png') right bottom/72% auto no-repeat;
  background-color:#ffe5f3;
}
/* RECRUIT page variant uses its own photo */
.kp-catch--recruit .kp-catch__bg{
  background:url('recruit_fv.png') center/cover no-repeat;
}
.kp-catch--recruit .kp-catch__overlay{
  background:linear-gradient(90deg,
    rgba(253,242,248,.95) 0%,
    rgba(253,242,248,.88) 30%,
    rgba(253,242,248,.55) 52%,
    rgba(253,242,248,0) 72%);
}
/* RECRUIT FV bottom — left-bottom diagonal shape divider; color matches next section bg */
.kp-catch--recruit{ padding-bottom:14rem; }
.kp-catch--recruit::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px;
  height:10rem; background:#fdeef6;
  clip-path:polygon(0 100%, 100% 0, 100% 100%);
  z-index:3; pointer-events:none;
}
@media(max-width:767px){
  .kp-catch--recruit{ padding-bottom:9rem; }
  .kp-catch--recruit::after{ height:6rem; }
}

/* ===========================================================
   FLOW (STEP) styling — sub-pages
   =========================================================== */
.kp-table th .kp-step__num{
  display:block;
  font-size:1.2rem;
  font-weight:800;
  letter-spacing:.18em;
  color:#ff66cc;
  margin-bottom:1.4rem;
  line-height:1;
}
.kp-table th .kp-step__ttl{
  display:block;
  font-size:1.6rem;
  font-weight:700;
  color:#1c1c22;
  line-height:1.45;
}

/* ===========================================================
   Footer phone — bold
   =========================================================== */
.l-footer__tel,
.l-footer__tel a{
  font-weight:900 !important;
}

/* ===========================================================
   Section heading car icon — inner pages (kp-catch__en / kp-sec-en)
   =========================================================== */
.kp-catch__en,
.kp-sec-en,
.kp-fleet__en{
  display:inline-flex !important;
  align-items:center;
  gap:.8rem;
}
/* Mix the two icons: kp-catch__en uses car (front), kp-sec-en uses truck (side), kp-fleet__en uses car */
.kp-catch__en::before{
  content:"";
  display:inline-block;
  width:2.2rem;height:2rem;
  background:url('icon_car.svg') center/contain no-repeat;
  flex-shrink:0;
}
.kp-sec-en::before{
  content:"";
  display:inline-block;
  width:2.4rem;height:1.6rem;
  background:url('icon_truck.svg') center/contain no-repeat;
  flex-shrink:0;
}
.kp-fleet__en::before{
  content:"";
  display:inline-block;
  width:2.2rem;height:2rem;
  background:url('icon_car.svg') center/contain no-repeat;
  flex-shrink:0;
}

/* TOP page section labels (SERVICE / NEWS / RECRUIT) — also get an icon */
.home-projects .c-title__en,
.home-news .c-title__en{
  position:relative !important;
  padding-left:1.1em !important;
}
.home-projects .c-title__en::before,
.home-news .c-title__en::before{
  content:"" !important;
  position:absolute !important;
  left:0; top:.18em;
  width:.85em;
  height:.85em;
  background:url('icon_car.svg') center/contain no-repeat !important;
}
.home-recruit__label{
  display:inline-flex !important;
  align-items:center;
  gap:1rem;
}
.home-recruit__label::before{
  content:"" !important;
  display:inline-block;
  width:1.6rem;
  height:1.4rem;
  background:url('icon_car.svg') center/contain no-repeat !important;
  flex-shrink:0;
}
@media(max-width:900px){
  .kp-catch--photo .kp-catch__overlay{
    background:linear-gradient(180deg,
      rgba(253,242,248,.96) 0%,
      rgba(253,242,248,.92) 55%,
      rgba(253,242,248,.78) 100%);
  }
  .kp-catch--photo .kp-catch__inner{
    max-width:none; margin:0 5vw; padding-right:5vw;
  }
}

/* ===========================================================
   Rentacar page — Fleet lineup carousel (auto-scroll, no JS)
   =========================================================== */
.kp-fleet{
  position:relative; margin:4rem 0 5rem; padding:0;
}
.kp-fleet__head{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:.8rem; padding:0 0 2rem; max-width:120rem; margin:0 auto;
}
.kp-fleet__en{
  font-size:1.4rem; font-weight:800; letter-spacing:.3em;
  color:#d6489e; margin:0; text-transform:uppercase;
}
.kp-fleet__ttl{
  font-size:2.4rem; font-weight:800; color:#1c1c22;
  margin:0; letter-spacing:.04em;
  border-left:5px solid #ff66cc; padding-left:1.3rem; line-height:1.4;
}
.kp-fleet__viewport{
  position:relative; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.kp-fleet__track{
  display:flex; align-items:stretch; gap:2rem;
  width:max-content; padding:1rem 1rem 2rem;
  animation:kp-fleet-loop 45s linear infinite;
  will-change:transform;
}
.kp-fleet__viewport:hover .kp-fleet__track{animation-play-state:paused;}
@keyframes kp-fleet-loop{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
.kp-fleet__card{
  flex:0 0 auto; width:30rem; margin:0;
  background:#fff; border-radius:1.4rem; overflow:hidden;
  border:1px solid #f4e2ef;
  box-shadow:0 10px 26px rgba(214,72,158,.10);
  display:flex; flex-direction:column;
}
.kp-fleet__card img{
  width:100%; height:18rem; object-fit:cover; display:block;
  background:#f7f7f8;
}
.kp-fleet__card figcaption{
  display:block; text-align:center; padding:1rem 1rem 1.4rem;
  font-size:1.5rem; font-weight:700; color:#1c1c22; letter-spacing:.04em;
}
@media(max-width:767px){
  .kp-fleet{ margin:2rem 0 3rem; }
  .kp-fleet__ttl{ font-size:1.9rem; }
  .kp-fleet__card{ width:22rem; }
  .kp-fleet__card img{ height:13rem; }
  .kp-fleet__card figcaption{ font-size:1.35rem; padding:.8rem 1rem 1.2rem; }
}