* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --primary: #c8341e;
  --primary-dark: #a02817;
  --accent: #d99a3b;
  --ink: #1a1f2e;
  --ink-2: #4a5160;
  --ink-3: #8089a0;
  --line: #e3e6eb;
  --bg: #fafaf7;
  --bg-2: #f3f1ec;
  --r: 3px;
}
body { font-family: 'Noto Sans JP', 'Hiragino Sans', 'Yu Gothic', 'Meiryo', sans-serif; color: var(--ink); background: #fff; line-height: 1.8; -webkit-font-smoothing: antialiased; font-feature-settings: "palt"; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

/* SVGアイコン */
.icon { display: inline-flex; align-items: center; justify-content: center; }
.icon svg { display: block; width: 100%; height: 100%; }
.icon-16 { width: 16px; height: 16px; }
.icon-20 { width: 20px; height: 20px; }
.icon-24 { width: 24px; height: 24px; }
.icon-32 { width: 32px; height: 32px; }
.icon-40 { width: 40px; height: 40px; }
.icon-48 { width: 48px; height: 48px; }

/* 営業ステータスバー */
.status-bar { background: var(--ink); color: #fff; font-size: 12px; font-family: 'Noto Sans JP', sans-serif; letter-spacing: 0.04em; }
.status-bar-inner { max-width: 1280px; margin: 0 auto; padding: 10px 24px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.status-indicator { display: flex; align-items: center; gap: 12px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.status-dot.open { background: #4ade80; box-shadow: 0 0 0 0 rgba(74,222,128,0.7); animation: pulse 2s infinite; }
.status-dot.closed { background: #94a3b8; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(74,222,128,0.7); } 70% { box-shadow: 0 0 0 8px rgba(74,222,128,0); } 100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); } }
.status-label { font-weight: 600; letter-spacing: 0.05em; }
.status-detail { color: rgba(255,255,255,0.65); margin-left: 6px; }
.status-contact { display: flex; gap: 20px; align-items: center; }
.status-contact span { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,0.85); }

/* Header */
.header { position: sticky; top: 0; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); z-index: 100; border-bottom: 1px solid var(--line); }
.header-inner { max-width: 1280px; margin: 0 auto; padding: 16px 24px; display: flex; justify-content: space-between; align-items: center; }
.logo { display: flex; align-items: center; gap: 16px; text-decoration: none; }
.logo-img { height: 52px; width: auto; }
.logo-divider { width: 1px; height: 32px; background: var(--line); }
.logo-tagline { font-size: 13px; color: var(--ink-2); letter-spacing: 0.15em; line-height: 1.5; }
.logo-tagline small { display: block; font-size: 10px; color: var(--primary); letter-spacing: 0.2em; margin-bottom: 2px; font-family: 'Noto Sans JP', sans-serif; font-weight: 500; }
.nav { display: flex; gap: 36px; align-items: center; font-family: 'Noto Sans JP', sans-serif; }
.nav > a { text-decoration: none; color: var(--ink); font-size: 14px; font-weight: 500; transition: color 0.2s; letter-spacing: 0.05em; }
.nav > a:hover { color: var(--primary); }
.nav-tel { display: inline-flex; align-items: center; gap: 8px; background: var(--ink); color: #fff !important; padding: 12px 22px; border-radius: var(--r); font-weight: 600; }
.nav-tel:hover { background: var(--primary); }

/* Hero */
.hero { background: var(--bg); position: relative; overflow: hidden; }
.hero-slider { position: relative; width: 100%; height: 640px; overflow: hidden; }
.hero-video-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(10,15,28,0.80) 0%, rgba(10,15,28,0.45) 55%, rgba(10,15,28,0.18) 100%); display: flex; align-items: center; }
.hero-content { max-width: 1280px; margin: 0 auto; padding: 0 48px; color: #fff; width: 100%; }
.hero-eyebrow { display: inline-flex; align-items: center; gap: 12px; font-family: 'Noto Sans JP', sans-serif; font-size: 12px; letter-spacing: 0.12em; color: var(--accent); margin-bottom: 32px; }
.hero-eyebrow::before { content: ''; display: inline-block; width: 40px; height: 1px; background: var(--accent); }
.hero-title { font-size: 60px; font-weight: 700; line-height: 1.4; margin-bottom: 28px; letter-spacing: 0.02em; }
.hero-title .accent { color: var(--accent); }
.hero-subtitle { font-family: 'Noto Sans JP', sans-serif; font-size: 16px; line-height: 2; margin-bottom: 40px; max-width: 520px; color: rgba(255,255,255,0.85); font-weight: 400; }
.hero-buttons { display: flex; gap: 16px; flex-wrap: wrap; font-family: 'Noto Sans JP', sans-serif; }
.btn-primary { background: var(--primary); color: #fff; padding: 18px 36px; border: none; border-radius: var(--r); font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 12px; transition: background 0.2s; letter-spacing: 0.05em; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-secondary { background: transparent; color: #fff; padding: 18px 36px; border: 1px solid rgba(255,255,255,0.4); border-radius: var(--r); font-size: 15px; font-weight: 500; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 12px; transition: all 0.2s; letter-spacing: 0.05em; }
.btn-secondary:hover { background: rgba(255,255,255,0.1); border-color: #fff; }
.hero-dots { display: none; }
.hero-dot { display: none; }

.hero-counter { display: none; }
.hero-counter strong { color: #fff; font-size: 14px; }

/* Section common */
.section { padding: 120px 24px; max-width: 1280px; margin: 0 auto; }
.section-eyebrow { display: inline-flex; align-items: center; gap: 12px; font-family: 'Noto Sans JP', sans-serif; color: var(--primary); font-size: 12px; font-weight: 500; letter-spacing: 0.12em; margin-bottom: 20px; }
.section-eyebrow::before { content: ''; display: inline-block; width: 32px; height: 1px; background: var(--primary); }
.section-title { font-size: 38px; font-weight: 700; color: var(--ink); margin-bottom: 24px; line-height: 1.5; letter-spacing: 0.02em; }
.section-subtitle { font-family: 'Noto Sans JP', sans-serif; font-size: 15px; color: var(--ink-2); line-height: 2; max-width: 680px; margin-bottom: 80px; }
.section-center { text-align: center; }
.section-center .section-subtitle { margin-left: auto; margin-right: auto; }
.section-center .section-eyebrow::before { display: none; }
.section-center .section-eyebrow::after { content: ''; display: inline-block; width: 32px; height: 1px; background: var(--primary); margin-left: 0; }

/* 信頼の数字 */
.trust-bar { background: var(--bg-2); padding: 60px 24px; }
.trust-inner { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 48px; }
.trust-item { text-align: center; }
.trust-num { font-size: 48px; font-weight: 700; color: var(--primary); line-height: 1; margin-bottom: 12px; letter-spacing: 0; }
.trust-num small { font-size: 18px; font-weight: 400; margin-left: 4px; color: var(--ink-2); }
.trust-label { font-family: 'Noto Sans JP', sans-serif; font-size: 13px; color: var(--ink-2); letter-spacing: 0.15em; }

/* Services */
.services { background: #fff; }
.feature-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.feature-card { background: #fff; padding: 48px 36px; transition: background 0.3s; cursor: pointer; }
.feature-card:hover { background: var(--bg); }
.feature-num { font-family: 'Noto Sans JP', sans-serif; font-size: 12px; color: var(--primary); letter-spacing: 0.25em; margin-bottom: 24px; font-weight: 500; }
.feature-icon-wrap { width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; color: var(--primary); margin-bottom: 28px; border: 1px solid var(--line); border-radius: var(--r); }
.feature-title { font-size: 21px; font-weight: 700; color: var(--ink); margin-bottom: 16px; line-height: 1.5; letter-spacing: 0.02em; }
.feature-desc { font-family: 'Noto Sans JP', sans-serif; font-size: 14px; color: var(--ink-2); line-height: 2; font-weight: 400; }
.feature-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 24px; font-family: 'Noto Sans JP', sans-serif; font-size: 13px; color: var(--primary); font-weight: 500; letter-spacing: 0.1em; }

/* About */
.about { background: var(--bg); padding: 120px 0; position: relative; }
.about-inner { max-width: 1280px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 5fr 6fr; gap: 80px; align-items: center; }
.about-img { border-radius: var(--r); overflow: hidden; position: relative; }
.about-img img { width: 100%; height: 560px; object-fit: cover; }
.about-img-caption { position: absolute; bottom: 24px; left: 24px; background: #fff; padding: 16px 24px; border-radius: var(--r); font-family: 'Noto Sans JP', sans-serif; font-size: 12px; letter-spacing: 0.2em; color: var(--ink-2); }
.about-content h2 { font-size: 34px; font-weight: 700; color: var(--ink); margin-bottom: 32px; line-height: 1.6; letter-spacing: 0.02em; }
.about-content p { font-family: 'Noto Sans JP', sans-serif; font-size: 15px; color: var(--ink-2); line-height: 2.2; margin-bottom: 20px; }
.about-promises { margin-top: 40px; display: grid; gap: 16px; }
.promise-item { display: flex; gap: 20px; align-items: flex-start; padding: 24px; background: #fff; border-left: 2px solid var(--primary); border-radius: var(--r); }
.promise-num { font-family: 'Noto Sans JP', sans-serif; font-size: 11px; color: var(--primary); letter-spacing: 0.2em; flex-shrink: 0; padding-top: 4px; }
.promise-title { font-size: 17px; font-weight: 600; color: var(--ink); margin-bottom: 8px; letter-spacing: 0.05em; }
.promise-desc { font-family: 'Noto Sans JP', sans-serif; font-size: 13px; color: var(--ink-2); line-height: 1.9; }

/* AI Estimate */
.estimate-section { background: var(--ink); color: #fff; padding: 120px 0; position: relative; }
.estimate-section .section-title { color: #fff; }
.estimate-section .section-subtitle { color: rgba(255,255,255,0.7); }
.estimate-section .section-eyebrow { color: var(--accent); }
.estimate-section .section-eyebrow::before, .estimate-section .section-eyebrow::after { background: var(--accent); }
.estimate-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.estimate-form { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--r); padding: 48px; }
.estimate-form h3 { font-size: 20px; font-weight: 700; margin-bottom: 12px; letter-spacing: 0.02em; }
.estimate-form .form-note { font-family: 'Noto Sans JP', sans-serif; font-size: 12px; color: rgba(255,255,255,0.5); margin-bottom: 36px; }
.form-group { margin-bottom: 24px; font-family: 'Noto Sans JP', sans-serif; }
.form-label { display: block; font-size: 12px; font-weight: 500; color: rgba(255,255,255,0.7); margin-bottom: 10px; letter-spacing: 0.1em; }
.form-input, .form-select { width: 100%; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--r); padding: 14px 16px; color: #fff; font-size: 14px; font-family: inherit; transition: border-color 0.2s; }
.form-input:focus, .form-select:focus { outline: none; border-color: var(--accent); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.estimate-btn { width: 100%; background: var(--primary); color: #fff; border: none; padding: 18px; border-radius: var(--r); font-size: 14px; font-weight: 600; cursor: pointer; margin-top: 16px; transition: background 0.2s; letter-spacing: 0.1em; font-family: 'Noto Sans JP', sans-serif; display: inline-flex; align-items: center; justify-content: center; gap: 12px; }
.estimate-btn:hover { background: var(--primary-dark); }
.estimate-btn:disabled { opacity: 0.6; cursor: wait; }
.estimate-result { background: rgba(255,255,255,0.03); border: 1px solid rgba(217,154,59,0.3); border-radius: var(--r); padding: 48px; }
.estimate-result h3 { font-size: 20px; font-weight: 700; color: var(--accent); margin-bottom: 28px; letter-spacing: 0.02em; }
.result-placeholder { text-align: center; padding: 60px 20px; color: rgba(255,255,255,0.4); font-family: 'Noto Sans JP', sans-serif; }
.result-placeholder .icon { color: var(--accent); margin-bottom: 20px; }
.result-content { background: rgba(255,255,255,0.04); border-left: 2px solid var(--accent); border-radius: var(--r); padding: 28px; font-family: 'Noto Sans JP', sans-serif; font-size: 14px; line-height: 2; white-space: pre-wrap; color: rgba(255,255,255,0.9); max-height: 420px; overflow-y: auto; }

/* Company info */
.company-info { background: #fff; padding: 120px 0; }
.company-grid { max-width: 1280px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.company-card { background: var(--bg); border-radius: var(--r); padding: 48px; }
.company-card h3 { font-size: 19px; font-weight: 700; margin-bottom: 32px; color: var(--ink); padding-bottom: 16px; border-bottom: 1px solid var(--line); letter-spacing: 0.04em; display: inline-flex; align-items: center; gap: 12px; }
.company-card h3 .icon { color: var(--primary); }
.info-row { display: grid; grid-template-columns: 140px 1fr; gap: 24px; padding: 14px 0; border-bottom: 1px solid var(--line); font-family: 'Noto Sans JP', sans-serif; }
.info-row:last-child { border-bottom: none; }
.info-label { font-weight: 500; color: var(--ink-3); font-size: 13px; letter-spacing: 0.1em; }
.info-value { color: var(--ink); font-size: 14px; line-height: 1.9; }
.offices { display: grid; gap: 20px; }
.office-item { background: #fff; padding: 24px; border-radius: var(--r); border-left: 2px solid var(--primary); font-family: 'Noto Sans JP', sans-serif; }
.office-name { font-weight: 600; color: var(--ink); margin-bottom: 12px; font-size: 15px; display: inline-flex; align-items: center; gap: 10px; letter-spacing: 0.05em; }
.office-name .icon { color: var(--primary); }
.office-details { font-size: 13px; color: var(--ink-2); line-height: 2; }
a.office-link { display: block; text-decoration: none; transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease; }
a.office-link:hover { box-shadow: 0 14px 32px rgba(26,31,46,.14); transform: translateY(-3px); border-left-color: var(--accent); }
a.office-link img { transition: filter .3s ease; }
a.office-link:hover img { filter: brightness(1.04) saturate(1.05); }
.office-more { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; font-size: 13px; font-weight: 600; color: var(--primary); letter-spacing: 0.04em; }
a.office-link:hover .office-more { color: var(--accent); }

/* Certifications */
.certs { background: var(--bg); padding: 120px 24px; }
.certs-inner { max-width: 1280px; margin: 0 auto; }
.certs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 64px; }
.cert-card { background: #fff; padding: 48px 36px; border-radius: var(--r); text-align: center; border: 1px solid var(--line); transition: border-color 0.3s; }
.cert-card:hover { border-color: var(--primary); }
.cert-icon { width: 72px; height: 72px; border: 1px solid var(--primary); border-radius: var(--r); display: inline-flex; align-items: center; justify-content: center; color: var(--primary); margin-bottom: 28px; }
.cert-title { font-size: 17px; font-weight: 700; color: var(--ink); margin-bottom: 12px; letter-spacing: 0.02em; }
.cert-desc { font-family: 'Noto Sans JP', sans-serif; font-size: 13px; color: var(--ink-2); line-height: 1.9; }

/* CTA */
.cta-section { background: linear-gradient(180deg, var(--bg-2) 0%, #fff 100%); padding: 120px 24px; text-align: center; }
.cta-inner { max-width: 720px; margin: 0 auto; }
.cta-title { font-size: 34px; font-weight: 700; color: var(--ink); margin-bottom: 24px; line-height: 1.6; letter-spacing: 0.02em; }
.cta-text { font-family: 'Noto Sans JP', sans-serif; font-size: 15px; color: var(--ink-2); line-height: 2; margin-bottom: 48px; }
.cta-buttons { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; font-family: 'Noto Sans JP', sans-serif; }
.cta-buttons .btn-primary { padding: 22px 48px; font-size: 16px; }
.cta-tel { display: inline-flex; align-items: center; gap: 12px; padding: 22px 36px; border: 1px solid var(--line); border-radius: var(--r); color: var(--ink); text-decoration: none; font-weight: 500; }
.cta-tel:hover { border-color: var(--primary); color: var(--primary); }
.cta-tel strong { font-size: 22px; font-weight: 600; }

/* Footer */
.footer { background: var(--ink); color: #fff; padding: 80px 24px 32px; }
.footer-inner { max-width: 1280px; margin: 0 auto; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 64px; }
.footer-col h4 { font-family: 'Noto Sans JP', sans-serif; font-size: 12px; font-weight: 500; margin-bottom: 20px; color: var(--accent); letter-spacing: 0.25em; }
.footer-col ul { list-style: none; font-family: 'Noto Sans JP', sans-serif; }
.footer-col li { margin-bottom: 10px; font-size: 13px; color: rgba(255,255,255,0.6); }
.footer-col a { color: rgba(255,255,255,0.6); text-decoration: none; transition: color 0.2s; }
.footer-col a:hover { color: var(--accent); }
.footer-brand img { height: 56px; width: auto; filter: brightness(0) invert(1); margin-bottom: 20px; }
.footer-desc { font-family: 'Noto Sans JP', sans-serif; font-size: 13px; color: rgba(255,255,255,0.5); line-height: 2; }
.footer-bottom { padding-top: 32px; border-top: 1px solid rgba(255,255,255,0.1); text-align: center; font-size: 11px; color: rgba(255,255,255,0.4); font-family: 'Noto Sans JP', sans-serif; letter-spacing: 0.15em; }

/* Floating Action Buttons */
/* 固定縦長バナー */
.side-banners { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 98; display: flex; flex-direction: column; gap: 10px; }
.side-banner {
  writing-mode: horizontal-tb; text-orientation: initial;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 13px 11px 13px 13px; cursor: pointer; text-decoration: none;
  position: relative; overflow: hidden;
  border-left: 4px solid var(--accent);
  border-radius: 12px 0 0 12px;
  box-shadow: -5px 7px 24px rgba(26,31,46,0.32);
  transition: transform 0.32s cubic-bezier(.2,.85,.25,1), box-shadow 0.32s, padding 0.32s, background 0.32s;
}
.side-banner-corp  { background: linear-gradient(135deg, #2b3654 0%, #1a1f2e 100%); color:#fff; }
.side-banner-indiv { background: linear-gradient(135deg, #e84b2c 0%, #c8341e 100%); color:#fff; }
/* 光沢スイープ（定期的にキラッと光る） */
.side-banner::before {
  content:''; position:absolute; top:-40%; left:-70%; width:45%; height:180%;
  background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,0.5) 50%, transparent 100%);
  transform: skewX(-18deg); pointer-events:none; z-index:3;
  animation: sb-sheen 4.5s ease-in-out infinite;
}
.side-banner-indiv::before { animation-delay: 2.2s; }
@keyframes sb-sheen { 0%,68% { left:-70%; } 84%,100% { left:170%; } }
/* クリック誘導の矢印（左へゆらゆら） */
.side-banner::after {
  content:''; position:absolute; left:9px; top:50%; width:7px; height:7px;
  border-left:2px solid rgba(255,255,255,0.92); border-bottom:2px solid rgba(255,255,255,0.92);
  transform: translateY(-50%) rotate(45deg); z-index:4; pointer-events:none;
  animation: sb-bob 1.3s ease-in-out infinite;
}
@keyframes sb-bob { 0%,100% { left:9px; } 50% { left:3px; } }
/* ホバーで飛び出す */
.side-banner:hover {
  transform: translateX(-12px);
  box-shadow: -10px 12px 34px rgba(200,52,30,0.45);
  padding-right: 22px;
}
.side-banner-corp:hover  { background: linear-gradient(135deg, #c8341e 0%, #a02817 100%); }
.side-banner-indiv:hover { background: linear-gradient(135deg, #ff5b3d 0%, #d63a22 100%); }
.side-banner-label { font-size: 13px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.1; white-space: nowrap; text-align: center; position: relative; z-index: 2; }
.side-banner-sub { font-size: 9px; letter-spacing: 0.12em; opacity: 0.82; text-align: center; position: relative; z-index: 2; font-weight: 500; }
.side-banner-icon { position: relative; z-index: 2; width: 19px; height: 19px; opacity: 0.95; }
.side-banner-icon svg { width: 19px; height: 19px; }
/* 動きを控えたい利用者へ配慮 */
@media (prefers-reduced-motion: reduce) { .side-banner::before, .side-banner::after { animation: none; } }
/* スマホでは非表示 */
@media (max-width: 768px) { .side-banners { display: none; } }

.fab-container { position: fixed; bottom: 24px; right: 112px; display: flex; flex-direction: column; gap: 12px; z-index: 99; }
.fab { width: 52px; height: 52px; border-radius: var(--r); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.3s; box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
.fab-top { background: #fff; color: var(--ink); border: 1px solid var(--line); opacity: 0; pointer-events: none; transform: translateY(20px); }
.fab-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.fab-top:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.fab-chat {
  background: transparent;
  color: #fff;
  width: 72px;
  height: 72px;
  padding: 0;
  overflow: hidden;
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
}
.fab-chat video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 50%;
}
.fab-chat:hover { background: var(--primary-dark); }

/* Chat */
.chat-panel { position: fixed; bottom: 24px; right: 24px; width: 400px; height: 580px; background: #fff; border-radius: var(--r); box-shadow: 0 20px 60px rgba(0,0,0,0.18); display: none; flex-direction: column; z-index: 100; overflow: hidden; border: 1px solid var(--line); }
.chat-panel.open { display: flex; }
.chat-header { background: var(--ink); color: #fff; padding: 20px 24px; display: flex; justify-content: space-between; align-items: center; }
.chat-header-info h4 { font-size: 14px; font-weight: 500; margin-bottom: 2px; letter-spacing: 0.05em; }
.chat-header-info p { font-family: 'Noto Sans JP', sans-serif; font-size: 11px; opacity: 0.6; letter-spacing: 0.1em; }
.chat-close { background: none; border: none; color: #fff; cursor: pointer; padding: 4px; opacity: 0.7; transition: opacity 0.2s; }
.chat-close:hover { opacity: 1; }
.chat-messages { flex: 1; padding: 20px; overflow-y: auto; background: var(--bg); font-family: 'Noto Sans JP', sans-serif; }
.chat-msg { margin-bottom: 16px; display: flex; }
.chat-msg.user { justify-content: flex-end; }
.chat-msg-bubble { max-width: 80%; padding: 12px 16px; border-radius: var(--r); font-size: 13px; line-height: 1.8; white-space: pre-wrap; }
.chat-msg.user .chat-msg-bubble { background: var(--primary); color: #fff; }
.chat-msg.bot .chat-msg-bubble { background: #fff; color: var(--ink); border: 1px solid var(--line); }
/* 返答内のURL・ページ・電話番号は押せるようにしているので、リンクだと分かる見た目にする */
.chat-msg-bubble a { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; word-break: break-all; }
.chat-msg-bubble a:hover { text-decoration: none; }
.chat-msg.user .chat-msg-bubble a { color: #fff; }
.chat-input-area { padding: 16px; background: #fff; border-top: 1px solid var(--line); display: flex; gap: 8px; }
.chat-input { flex: 1; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--r); font-size: 13px; font-family: 'Noto Sans JP', sans-serif; outline: none; }
.chat-input:focus { border-color: var(--primary); }
.chat-send { background: var(--primary); color: #fff; border: none; padding: 0 18px; border-radius: var(--r); font-weight: 500; cursor: pointer; font-size: 13px; font-family: 'Noto Sans JP', sans-serif; display: inline-flex; align-items: center; gap: 6px; }
.chat-send:hover { background: var(--primary-dark); }
.chat-send:disabled { opacity: 0.5; cursor: wait; }
.typing { display: inline-flex; gap: 4px; align-items: center; padding: 8px 0; }
.typing span { width: 6px; height: 6px; background: var(--primary); border-radius: 50%; animation: typing 1.4s infinite; }
.typing span:nth-child(2) { animation-delay: 0.2s; }
.typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typing { 0%, 60%, 100% { transform: translateY(0); opacity: 0.4; } 30% { transform: translateY(-6px); opacity: 1; } }

/* ハンバーガーメニュー */
.menu-btn { display: none; background: none; border: none; padding: 10px; cursor: pointer; color: var(--ink); z-index: 110; }
.menu-btn svg { width: 28px; height: 28px; }
.mobile-menu { position: fixed; top: 0; right: -100%; width: 100%; max-width: 360px; height: 100vh; background: #fff; z-index: 105; transition: right 0.3s ease; box-shadow: -8px 0 32px rgba(0,0,0,0.15); display: flex; flex-direction: column; }
.mobile-menu.open { right: 0; }
.mobile-menu-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 104; opacity: 0; pointer-events: none; transition: opacity 0.3s; }
.mobile-menu-overlay.open { opacity: 1; pointer-events: auto; }
.mobile-menu-header { padding: 20px 24px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; }
.mobile-menu-header img { height: 40px; }
.mobile-menu-close { background: none; border: none; padding: 8px; cursor: pointer; color: var(--ink); }
.mobile-menu-nav { flex: 1; overflow-y: auto; padding: 16px 0; }
.mobile-menu-nav a { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; text-decoration: none; color: var(--ink); font-size: 16px; font-weight: 600; border-bottom: 1px solid var(--line); transition: background 0.2s; }
.mobile-menu-nav a:hover { background: var(--bg); color: var(--primary); }
.mobile-menu-nav a .icon { color: var(--ink-3); }
.mobile-menu-cta { padding: 20px 24px; background: var(--bg); border-top: 1px solid var(--line); }
.mobile-menu-cta a { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 16px; background: var(--primary); color: #fff; border-radius: var(--r); text-decoration: none; font-weight: 700; font-size: 15px; margin-bottom: 8px; }
.mobile-menu-cta a:last-child { background: var(--ink); margin-bottom: 0; }
.mobile-menu-info { padding: 16px 24px; font-size: 12px; color: var(--ink-3); text-align: center; line-height: 1.8; }
body.menu-open { overflow: hidden; }

/* サービスバナーセクション */
.services { background: #fff; }
.svc-section { padding: 120px 0; }
.svc-section:nth-child(even) { background: #f7f8fc; }
.svc-banner { max-width: 1280px; margin: 0 auto; padding: 0 48px; display: grid; grid-template-columns: 5fr 6fr; gap: 0; align-items: center; min-height: 480px; }
.svc-banner.reverse { grid-template-columns: 6fr 5fr; }
.svc-banner.reverse .svc-content { order: 2; }
.svc-banner.reverse .svc-img { order: 1; }
.svc-content { padding-right: 64px; }
.svc-banner.reverse .svc-content { padding-right: 0; padding-left: 64px; }
.svc-eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.svc-eyebrow-badge { background: var(--ink); color: #fff; font-family: 'Noto Sans JP', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 0.15em; padding: 5px 12px; }
.svc-eyebrow-line { flex: 1; height: 1px; width: 80px; background: var(--line); }
.svc-eyebrow-num { font-family: 'Noto Sans JP', sans-serif; font-size: 28px; font-weight: 300; color: var(--ink-3); letter-spacing: 0; }
.svc-title { font-size: 42px; font-weight: 700; color: var(--ink); margin-bottom: 16px; line-height: 1.3; letter-spacing: 0.02em; }
.svc-title-line { width: 40px; height: 3px; background: var(--primary); margin-bottom: 28px; }
.svc-desc { font-family: 'Noto Sans JP', sans-serif; font-size: 15px; color: var(--ink-2); line-height: 2.2; margin-bottom: 36px; }
.svc-btn { display: inline-flex; align-items: center; gap: 16px; background: var(--ink); color: #fff; padding: 18px 40px; font-family: 'Noto Sans JP', sans-serif; font-size: 14px; font-weight: 600; letter-spacing: 0.1em; text-decoration: none; transition: background 0.2s; border-radius: var(--r); }
.svc-btn:hover { background: var(--primary); }
.svc-btn svg { width: 14px; height: 14px; }
.svc-img { position: relative; border-radius: var(--r); overflow: hidden; }
.svc-img img { width: 100%; height: 420px; object-fit: cover; display: block; }
.svc-badge { position: absolute; bottom: 28px; right: 28px; background: #fff; border: 2px solid var(--accent); border-radius: 50%; width: 110px; height: 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.12); }
.svc-badge-main { font-family: 'Noto Sans JP', sans-serif; font-size: 18px; font-weight: 700; color: var(--primary); line-height: 1.2; }
.svc-badge-sub { font-family: 'Noto Sans JP', sans-serif; font-size: 10px; color: var(--ink-2); letter-spacing: 0.05em; margin-top: 4px; }
/* サービス特徴フッター */
.svc-features { background: #f0f4f8; border-top: 1px solid var(--line); }
.svc-features-inner { max-width: 1280px; margin: 0 auto; padding: 0 48px; display: grid; }
.svc-features-inner.cols4 { grid-template-columns: repeat(4, 1fr); }
.svc-features-inner.cols3 { grid-template-columns: repeat(3, 1fr); }
.svc-feature-item { display: flex; align-items: center; gap: 16px; padding: 24px 0; border-right: 1px solid var(--line); padding-right: 24px; padding-left: 24px; }
.svc-feature-item:first-child { padding-left: 0; }
.svc-feature-item:last-child { border-right: none; }
.svc-feature-icon { width: 48px; height: 48px; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--ink); border: 1px solid var(--line); }
.svc-feature-icon svg { width: 22px; height: 22px; }
.svc-feature-text strong { display: block; font-family: 'Noto Sans JP', sans-serif; font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 3px; }
.svc-feature-text span { font-family: 'Noto Sans JP', sans-serif; font-size: 12px; color: var(--ink-3); line-height: 1.5; }

/* タブレット・スマホ対応 */
@media (max-width: 1024px) {
  .svc-banner, .svc-banner.reverse { grid-template-columns: 1fr; gap: 40px; padding: 0 24px; }
  .svc-banner.reverse .svc-content { order: 1; }
  .svc-banner.reverse .svc-img { order: 2; }
  .svc-content, .svc-banner.reverse .svc-content { padding: 0; }
  .svc-title { font-size: 32px; }
  .svc-img img { height: 320px; }
  .svc-features-inner { padding: 0 24px; }
  .svc-features-inner.cols4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .svc-section { padding: 64px 0 0; }
  .svc-banner { padding: 0 16px; gap: 28px; }
  .svc-title { font-size: 26px; }
  .svc-desc { font-size: 14px; line-height: 2; }
  .svc-img img { height: 240px; }
  .svc-badge { width: 88px; height: 88px; bottom: 16px; right: 16px; }
  .svc-badge-main { font-size: 14px; }
  .svc-features-inner { padding: 0 16px; }
  .svc-features-inner.cols4, .svc-features-inner.cols3 { grid-template-columns: repeat(2, 1fr); }
  .svc-feature-item { padding: 18px 12px; gap: 10px; }
  .svc-feature-icon { width: 40px; height: 40px; }
  .svc-feature-icon svg { width: 18px; height: 18px; }
  .svc-feature-text strong { font-size: 12px; }
  .svc-feature-text span { font-size: 11px; }
}

/* サービスグリッド */
.svc-grid-wrap { max-width: 100%; }
.svc-grid-header { text-align: center; padding: 100px 24px 48px; max-width: 1280px; margin: 0 auto; }
.svc-grid-header .section-eyebrow { display: inline-flex; justify-content: center; }
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: #e3e6eb; }
.svc-grid-item { display: block; overflow: hidden; line-height: 0; }
.svc-grid-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease, opacity 0.3s; display: block; }
.svc-grid-item:hover img { transform: scale(1.03); opacity: 0.92; }

@media (max-width: 768px) {
  .svc-grid { grid-template-columns: 1fr; gap: 1px; }
  .svc-grid-header { padding: 64px 16px 32px; }
  .svc-grid-header .section-title { font-size: 22px; }
  .svc-grid-header .section-subtitle { font-size: 13px; margin-bottom: 0; }
}

/* ========== タブレット (1024px以下) ========== */
@media (max-width: 1024px) {
  .header-inner { padding: 14px 20px; }
  .nav { gap: 24px; }
  .nav > a { font-size: 13px; }
  .hero-content { padding: 0 32px; }
  .hero-title { font-size: 48px; }
  .section { padding: 80px 20px; }
  .section-title { font-size: 32px; }
  .feature-row { grid-template-columns: repeat(2, 1fr); }
  .about-inner { gap: 48px; padding: 0 20px; }
  .about-content h2 { font-size: 28px; }
  .estimate-grid { gap: 24px; padding: 0 20px; }
  .estimate-form, .estimate-result, .company-card { padding: 32px; }
  .certs-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .trust-inner { gap: 24px; padding: 0 20px; }
  .trust-num { font-size: 40px; }
  .footer-grid { gap: 32px; padding: 0 4px; }
}

/* ========== スマホ (768px以下) ========== */
@media (max-width: 768px) {
  /* ナビゲーション */
  .nav { display: none; }
  .menu-btn { display: block; }
  .nav-tel { display: none; }

  /* ヘッダー */
  .header-inner { padding: 12px 16px; }
  .logo { gap: 12px; }
  .logo-img { height: 40px; }
  .logo-divider { display: none; }
  .logo-tagline { display: none; }

  /* 営業ステータスバー */
  .status-bar { font-size: 11px; }
  .status-bar-inner { padding: 8px 16px; flex-direction: column; align-items: flex-start; gap: 4px; }
  .status-contact { display: none; }
  .status-detail { display: none; }

  /* ヒーロー */
  .hero-slider { height: 480px; }
  .hero-video-bg { height: 100%; }
  .hero-overlay { background: linear-gradient(180deg, rgba(15,20,32,0.5) 0%, rgba(15,20,32,0.75) 100%); }
  .hero-content { padding: 0 20px; }
  .hero-eyebrow { font-size: 10px; letter-spacing: 0.1em; margin-bottom: 20px; }
  .hero-eyebrow::before { width: 24px; }
  .hero-title { font-size: 30px; line-height: 1.4; margin-bottom: 20px; }
  .hero-subtitle { font-size: 14px; line-height: 1.9; margin-bottom: 28px; }
  .hero-buttons { flex-direction: column; gap: 12px; }
  .hero-buttons a { width: 100%; justify-content: center; padding: 16px; font-size: 14px; }
  .hero-dots { bottom: 20px; }
  .hero-counter { display: none; }

  /* 信頼バー */
  .trust-bar { padding: 40px 16px; }
  .trust-inner { grid-template-columns: repeat(2, 1fr) !important; gap: 32px 16px !important; }
  .trust-num { font-size: 36px; }
  .trust-num small { font-size: 14px; }
  .trust-label { font-size: 11px; letter-spacing: 0.1em; }

  /* セクション共通 */
  .section { padding: 64px 16px; }
  .section-eyebrow { font-size: 11px; letter-spacing: 0.1em; margin-bottom: 16px; }
  .section-title { font-size: 24px; line-height: 1.5; }
  .section-subtitle { font-size: 14px; line-height: 1.9; margin-bottom: 40px; }

  /* サービス */
  .feature-row { grid-template-columns: 1fr !important; gap: 1px !important; background: var(--line); }
  .feature-card { padding: 32px 24px; }
  .feature-num { font-size: 11px; margin-bottom: 16px; }
  .feature-icon-wrap { width: 48px; height: 48px; margin-bottom: 20px; }
  .feature-title { font-size: 19px; margin-bottom: 12px; }
  .feature-desc { font-size: 13px; line-height: 1.9; }
  .feature-link { font-size: 12px; margin-top: 16px; }

  /* About */
  .about { padding: 64px 0; }
  .about-inner { grid-template-columns: 1fr !important; gap: 32px !important; padding: 0 16px; }
  .about-img img { height: 280px; }
  .about-img-caption { font-size: 10px; padding: 10px 16px; bottom: 16px; left: 16px; }
  .about-content h2 { font-size: 24px; margin-bottom: 20px; }
  .about-content p { font-size: 14px; line-height: 1.9; margin-bottom: 16px; }
  .about-promises { margin-top: 28px; gap: 12px; }
  .promise-item { padding: 18px; gap: 14px; }
  .promise-num { font-size: 10px; }
  .promise-title { font-size: 15px; }
  .promise-desc { font-size: 12px; line-height: 1.7; }

  /* AI見積もり */
  .estimate-section { padding: 64px 0; }
  .estimate-grid { grid-template-columns: 1fr !important; gap: 16px !important; padding: 0 16px; }
  .estimate-form, .estimate-result { padding: 24px; }
  .estimate-form h3, .estimate-result h3 { font-size: 17px; }
  .form-row { grid-template-columns: 1fr !important; gap: 0 !important; }
  .form-input, .form-select { font-size: 16px; padding: 14px 14px; } /* iOSズーム防止 */
  .form-label { font-size: 11px; }
  .estimate-btn { padding: 16px; font-size: 14px; }
  .result-content { padding: 20px; font-size: 13px; max-height: 320px; }

  /* 会社情報 */
  .company-info { padding: 64px 16px; }
  .company-grid { grid-template-columns: 1fr !important; gap: 16px !important; padding: 0; }
  .company-card { padding: 24px; }
  .company-card h3 { font-size: 16px; margin-bottom: 20px; padding-bottom: 12px; }
  .info-row { grid-template-columns: 100px 1fr; gap: 12px; padding: 10px 0; }
  .info-label { font-size: 11px; }
  .info-value { font-size: 13px; line-height: 1.7; }
  .office-item { padding: 18px; }
  .office-name { font-size: 14px; margin-bottom: 8px; }
  .office-details { font-size: 12px; line-height: 1.8; }

  /* 認証 */
  .certs { padding: 64px 16px; }
  .certs-grid { grid-template-columns: 1fr !important; gap: 12px !important; margin-top: 40px; }
  .cert-card { padding: 28px 24px; }
  .cert-icon { width: 56px; height: 56px; margin-bottom: 20px; }
  .cert-title { font-size: 16px; }
  .cert-desc { font-size: 12px; }

  /* CTA */
  .cta-section { padding: 64px 16px; }
  .cta-title { font-size: 24px; margin-bottom: 20px; }
  .cta-text { font-size: 13px; line-height: 1.9; margin-bottom: 32px; }
  .cta-buttons { flex-direction: column; gap: 12px; }
  .cta-buttons .btn-primary, .cta-tel { width: 100%; justify-content: center; padding: 18px 24px; }
  .cta-tel strong { font-size: 18px; }

  /* フッター */
  .footer { padding: 56px 20px 24px; }
  .footer-grid { grid-template-columns: 1fr !important; gap: 32px !important; margin-bottom: 40px; }
  .footer-col h4 { margin-bottom: 14px; }
  .footer-col li { font-size: 13px; margin-bottom: 8px; }
  .footer-brand img { height: 44px; }
  .footer-bottom { font-size: 10px; letter-spacing: 0.1em; }

  /* FAB */
  .fab-container { bottom: 16px; right: 16px; gap: 10px; }
  .fab { width: 48px; height: 48px; }
  .fab-chat { width: 64px; height: 64px; }

  /* チャット */
  .chat-panel { width: calc(100% - 16px); right: 8px; bottom: 8px; height: calc(100vh - 80px); height: calc(100dvh - 80px); max-height: 640px; }
  .chat-header { padding: 16px 20px; }
  .chat-header-info h4 { font-size: 13px; }
  .chat-header-info p { font-size: 10px; }
  .chat-messages { padding: 16px; }
  .chat-msg-bubble { max-width: 85%; font-size: 13px; }
  .chat-input-area { padding: 12px 12px calc(12px + env(safe-area-inset-bottom)); gap: 10px; align-items: flex-end; }
  .chat-input { font-size: 16px; min-height: 48px; } /* iOSズーム防止＋タップしやすい高さ */
  .chat-send { min-width: 78px; min-height: 48px; padding: 0 18px; font-size: 15px; flex: 0 0 auto; } /* 押しやすい送信ボタン */
}

/* ========== 小型スマホ (480px以下) ========== */
@media (max-width: 480px) {
  .hero-slider { height: 440px; }
  .hero-title { font-size: 26px; }
  .hero-subtitle { font-size: 13px; }
  .section-title { font-size: 22px; }
  .cta-title, .about-content h2 { font-size: 22px; }
  .trust-num { font-size: 32px; }
  .trust-num small { font-size: 12px; }
  .feature-title { font-size: 18px; }
  .about-img img { height: 240px; }
  .info-row { grid-template-columns: 90px 1fr; }
}
/* ============================================================
   SUBPAGE COMPONENTS  (appended after base style.css)
   ============================================================ */

/* --- Page hero (sub page header band) --- */
.page-hero { position: relative; background: var(--ink); color: #fff; padding: 88px 24px 64px; overflow: hidden; }
.page-hero::before { content: ''; position: absolute; inset: 0; background:
  radial-gradient(circle at 85% 20%, rgba(200,52,30,0.28), transparent 45%),
  radial-gradient(circle at 10% 90%, rgba(217,154,59,0.18), transparent 50%); }
.page-hero-inner { position: relative; max-width: 1280px; margin: 0 auto; }
.page-hero .eyebrow { font-family:'Noto Sans JP',sans-serif; font-size: 12px; letter-spacing: 0.12em; color: var(--accent); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.page-hero .eyebrow::before { content:''; width: 28px; height: 1px; background: var(--accent); }
.page-hero h1 { font-size: 40px; font-weight: 700; line-height: 1.4; letter-spacing: 0.02em; }
.page-hero p.sub { font-family:'Noto Sans JP',sans-serif; margin-top: 18px; color: rgba(255,255,255,0.78); font-size: 15px; line-height: 2; max-width: 760px; }

/* --- Breadcrumb --- */
.breadcrumb { background: var(--bg-2); border-bottom: 1px solid var(--line); }
.breadcrumb ol { max-width: 1280px; margin: 0 auto; padding: 14px 24px; display: flex; flex-wrap: wrap; gap: 8px; list-style: none; font-family:'Noto Sans JP',sans-serif; font-size: 12px; color: var(--ink-3); }
.breadcrumb a { color: var(--ink-2); text-decoration: none; }
.breadcrumb a:hover { color: var(--primary); }
.breadcrumb li + li::before { content: '/'; margin-right: 8px; color: var(--ink-3); }

/* --- Content container --- */
.content { max-width: 1100px; margin: 0 auto; padding: 80px 24px; }
.content.narrow { max-width: 880px; }
.block { margin-bottom: 72px; }
.block:last-child { margin-bottom: 0; }
.block-head { margin-bottom: 32px; }
.block-head .eyebrow { font-family:'Noto Sans JP',sans-serif; color: var(--primary); font-size: 12px; font-weight: 500; letter-spacing: 0.12em; display: block; margin-bottom: 12px; }
.block-head h2 { font-size: 28px; font-weight: 700; line-height: 1.5; letter-spacing: 0.02em; position: relative; padding-left: 18px; }
.block-head h2::before { content:''; position: absolute; left: 0; top: 6px; bottom: 6px; width: 4px; background: var(--primary); border-radius: 2px; }
.lead { font-family:'Noto Sans JP',sans-serif; font-size: 15px; color: var(--ink-2); line-height: 2.1; margin-bottom: 20px; }
.prose p { font-family:'Noto Sans JP',sans-serif; font-size: 15px; color: var(--ink-2); line-height: 2.1; margin-bottom: 18px; }
.prose h3 { font-size: 19px; font-weight: 700; margin: 36px 0 16px; color: var(--ink); }
.prose ul { list-style: none; margin: 16px 0; }
.prose ul li { font-family:'Noto Sans JP',sans-serif; font-size: 15px; color: var(--ink-2); line-height: 1.9; padding-left: 24px; position: relative; margin-bottom: 8px; }
.prose ul li::before { content:''; position: absolute; left: 4px; top: 13px; width: 8px; height: 8px; background: var(--accent); border-radius: 50%; }

/* --- In-page tab / sub nav --- */
.subnav { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,0.94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.subnav-inner { max-width: 1280px; margin: 0 auto; padding: 0 12px; display: flex; gap: 4px; overflow-x: auto; }
.subnav a { white-space: nowrap; padding: 16px 18px; font-family:'Noto Sans JP',sans-serif; font-size: 13px; font-weight: 500; color: var(--ink-2); text-decoration: none; border-bottom: 2px solid transparent; transition: all 0.2s; }
.subnav a:hover, .subnav a.active { color: var(--primary); border-bottom-color: var(--primary); }

/* --- Spec table (会社概要) --- */
.spec-table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--line); font-family:'Noto Sans JP',sans-serif; }
.spec-table th, .spec-table td { text-align: left; padding: 18px 20px; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.9; vertical-align: top; }
.spec-table th { width: 30%; background: var(--bg-2); font-weight: 600; color: var(--ink); }
.spec-table td { color: var(--ink-2); }
@media (max-width: 768px){ .spec-table th, .spec-table td { display: block; width: 100%; } .spec-table th { border-bottom: none; padding-bottom: 4px; } .spec-table td { padding-top: 4px; } }

/* --- Office / location cards --- */
.office-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.office-card { border: 1px solid var(--line); border-radius: var(--r); padding: 28px; background: #fff; }
.office-card .badge { display: inline-block; font-family:'Noto Sans JP',sans-serif; font-size: 11px; letter-spacing: 0.15em; color: #fff; background: var(--primary); padding: 4px 12px; border-radius: 2px; margin-bottom: 14px; }
.office-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 10px; }
.office-card p { font-family:'Noto Sans JP',sans-serif; font-size: 13px; color: var(--ink-2); line-height: 1.9; }
@media (max-width: 860px){ .office-grid { grid-template-columns: 1fr; } }

/* --- Service detail block --- */
.svc-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; margin-bottom: 32px; }
.svc-detail .img { min-height: 280px; background: var(--bg-2); }
.svc-detail .img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.svc-detail .txt { padding: 40px; }
.svc-detail .txt .no { font-family:'Noto Sans JP',sans-serif; font-size: 12px; letter-spacing: 0.25em; color: var(--primary); margin-bottom: 12px; }
.svc-detail .txt h3 { font-size: 24px; font-weight: 700; margin-bottom: 18px; }
.svc-detail:nth-child(even) .img { order: 2; }
@media (max-width: 820px){ .svc-detail, .svc-detail:nth-child(even){ grid-template-columns: 1fr; } .svc-detail .img { order: 0 !important; min-height: 200px; } }

/* --- Merit / step grid --- */
.merit-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.merit-card { padding: 32px 28px; border: 1px solid var(--line); border-radius: var(--r); background: #fff; }
.merit-card .num { font-family:'Noto Sans JP',sans-serif; font-size: 12px; letter-spacing: 0.2em; color: var(--primary); margin-bottom: 16px; }
.merit-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 12px; line-height: 1.5; }
.merit-card p { font-family:'Noto Sans JP',sans-serif; font-size: 14px; color: var(--ink-2); line-height: 1.9; }
@media (max-width: 860px){ .merit-grid { grid-template-columns: 1fr; } }

/* --- Flow steps --- */
.flow { counter-reset: step; }
.flow-step { display: flex; gap: 24px; align-items: flex-start; padding: 28px 0; border-bottom: 1px dashed var(--line); }
.flow-step::before { counter-increment: step; content: counter(step); flex-shrink: 0; width: 48px; height: 48px; border-radius: 50%; background: var(--primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 18px; }
.flow-step h3 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.flow-step p { font-family:'Noto Sans JP',sans-serif; font-size: 14px; color: var(--ink-2); line-height: 1.9; }

/* --- Price table --- */
.price-table { width: 100%; border-collapse: collapse; font-family:'Noto Sans JP',sans-serif; margin: 12px 0; }
.price-table th { background: var(--ink); color: #fff; font-size: 13px; font-weight: 600; padding: 14px 16px; text-align: left; }
.price-table td { padding: 14px 16px; border-bottom: 1px solid var(--line); font-size: 14px; color: var(--ink-2); line-height: 1.8; vertical-align: top; }
.price-table td.price { white-space: nowrap; font-weight: 700; color: var(--primary); text-align: right; }
.price-note { font-family:'Noto Sans JP',sans-serif; font-size: 12px; color: var(--ink-3); line-height: 1.9; margin-top: 12px; }

/* --- Area columns --- */
.area-wrap { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.area-item { border: 1px solid var(--line); border-radius: var(--r); padding: 20px 24px; }
.area-item h4 { font-size: 15px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.area-item p { font-family:'Noto Sans JP',sans-serif; font-size: 13px; color: var(--ink-2); line-height: 1.9; }
@media (max-width: 700px){ .area-wrap { grid-template-columns: 1fr; } }

/* --- FAQ accordion --- */
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q { width: 100%; text-align: left; background: none; border: none; cursor: pointer; padding: 22px 44px 22px 16px; font-family:'Noto Sans JP',sans-serif; font-size: 15px; font-weight: 600; color: var(--ink); position: relative; line-height: 1.6; }
.faq-q::before { content: 'Q'; color: var(--primary); font-weight: 700; margin-right: 12px; }
.faq-q::after { content: '+'; position: absolute; right: 16px; top: 22px; font-size: 22px; color: var(--primary); transition: transform 0.2s; }
.faq-item.open .faq-q::after { transform: rotate(45deg); }
.faq-a { display: none; padding: 0 16px 24px 40px; font-family:'Noto Sans JP',sans-serif; font-size: 14px; color: var(--ink-2); line-height: 2; }
.faq-item.open .faq-a { display: block; }

/* --- Recruit job cards --- */
.job-card { border: 1px solid var(--line); border-radius: var(--r); padding: 32px; margin-bottom: 20px; background: #fff; }
.job-card h3 { font-size: 20px; font-weight: 700; margin-bottom: 6px; }
.job-card .tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 20px; }
.job-card .tags span { font-family:'Noto Sans JP',sans-serif; font-size: 12px; background: var(--bg-2); color: var(--ink-2); padding: 5px 12px; border-radius: 100px; }
.job-spec { width: 100%; border-collapse: collapse; font-family:'Noto Sans JP',sans-serif; }
.job-spec th, .job-spec td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); font-size: 13px; vertical-align: top; }
.job-spec th { width: 28%; color: var(--ink); font-weight: 600; background: var(--bg-2); }
.job-spec td { color: var(--ink-2); line-height: 1.8; }

/* --- News list --- */
.news-list { border-top: 1px solid var(--line); }
.news-row { display: flex; gap: 24px; padding: 24px 8px; border-bottom: 1px solid var(--line); align-items: baseline; text-decoration: none; transition: background 0.15s; }
.news-row:hover { background: var(--bg-2); }
.news-row time { font-family:'Noto Sans JP',sans-serif; font-size: 13px; color: var(--ink-3); flex-shrink: 0; width: 110px; }
.news-row .cat { font-family:'Noto Sans JP',sans-serif; font-size: 11px; letter-spacing: 0.1em; color: #fff; background: var(--primary); padding: 3px 12px; border-radius: 2px; flex-shrink: 0; align-self: center; }
.news-row .ttl { font-family:'Noto Sans JP',sans-serif; font-size: 15px; color: var(--ink); line-height: 1.6; }
@media (max-width: 640px){ .news-row { flex-wrap: wrap; gap: 8px 16px; } }

/* --- Contact form --- */
.cform { display: grid; gap: 24px; }
.cform .field label { display: block; font-family:'Noto Sans JP',sans-serif; font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.cform .req { font-size: 10px; color: #fff; background: var(--primary); padding: 2px 8px; border-radius: 2px; margin-left: 8px; vertical-align: middle; }
.cform .opt { font-size: 10px; color: var(--ink-2); background: var(--bg-2); padding: 2px 8px; border-radius: 2px; margin-left: 8px; vertical-align: middle; }
.cform input, .cform select, .cform textarea { width: 100%; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r); font-family:'Noto Sans JP',sans-serif; font-size: 15px; color: var(--ink); background: #fff; transition: border-color 0.2s; }
.cform input:focus, .cform select:focus, .cform textarea:focus { outline: none; border-color: var(--primary); }
.cform .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 640px){ .cform .row2 { grid-template-columns: 1fr; } }
.cform .submit { background: var(--primary); color: #fff; border: none; padding: 18px; border-radius: var(--r); font-size: 16px; font-weight: 600; cursor: pointer; letter-spacing: 0.05em; }
.cform .submit:hover { background: var(--primary-dark); }
.privacy-note { font-family:'Noto Sans JP',sans-serif; font-size: 12px; color: var(--ink-3); line-height: 1.9; background: var(--bg-2); padding: 20px; border-radius: var(--r); }

/* --- Mega menu (desktop dropdown) --- */
.nav .has-mega { position: relative; }
.nav .mega { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: 0 16px 40px rgba(26,31,46,0.12); padding: 16px; min-width: 220px; opacity: 0; visibility: hidden; transition: all 0.2s; }
.nav .has-mega:hover .mega { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav .mega a { display: block; padding: 10px 14px; font-size: 13px; color: var(--ink-2); border-radius: 2px; white-space: nowrap; }
.nav .mega a:hover { background: var(--bg-2); color: var(--primary); }
.nav .caret { font-size: 9px; margin-left: 4px; vertical-align: middle; }
@media (max-width: 980px){ .nav .mega { display: none; } }

/* mobile submenu */
.mm-group { margin: 6px 0; }
.mm-group > span { display: block; font-family:'Noto Sans JP',sans-serif; font-size: 11px; letter-spacing: 0.15em; color: var(--ink-3); padding: 12px 0 6px; }
.mm-sub a { padding-left: 16px !important; font-size: 14px !important; }

/* ===== リニューアル実写フォト ===== */
.page-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.page-hero::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(26,31,46,.72),rgba(26,31,46,.84));}
.page-hero::before{z-index:2;}
.page-hero-inner{z-index:3;}

/* サービスグリッド：写真＋テキストオーバーレイ */
.svc-grid-item{position:relative;aspect-ratio:4/3;line-height:normal;}
.svc-grid-item img{width:100%;height:100%;object-fit:cover;}
.svc-grid-item .svc-cap{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:26px;background:linear-gradient(to top,rgba(26,31,46,.85) 0%,rgba(26,31,46,.28) 55%,rgba(26,31,46,0) 100%);color:#fff;transition:background .35s;}
.svc-grid-item:hover .svc-cap{background:linear-gradient(to top,rgba(200,52,30,.86) 0%,rgba(26,31,46,.32) 60%,rgba(26,31,46,0) 100%);}
.svc-grid-item .svc-no{font-family:'Noto Sans JP',sans-serif;font-size:12px;letter-spacing:.22em;color:var(--accent);margin-bottom:8px;}
.svc-grid-item:hover .svc-no{color:#fff;}
.svc-grid-item .svc-name{font-size:20px;font-weight:700;letter-spacing:.02em;line-height:1.45;}
.svc-grid-item .svc-arrow{font-family:'Noto Sans JP',sans-serif;font-size:12px;letter-spacing:.1em;margin-top:10px;opacity:.85;}

/* セクション内 写真ブロック */
.section-photo{margin:36px 0 0;border-radius:var(--r);overflow:hidden;position:relative;}
.section-photo img{width:100%;height:auto;display:block;}
.section-photo.tall img{height:440px;object-fit:cover;}
.photo-cap{position:absolute;bottom:16px;left:16px;background:#fff;padding:10px 18px;border-radius:var(--r);font-family:'Noto Sans JP',sans-serif;font-size:11px;letter-spacing:.18em;color:var(--ink-2);}
.photo-duo{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:36px 0 0;}
.photo-duo img{width:100%;height:320px;object-fit:cover;border-radius:var(--r);display:block;}
.certs-photo{max-width:1100px;margin:56px auto 0;border-radius:var(--r);overflow:hidden;box-shadow:0 18px 48px rgba(26,31,46,.16);}
.certs-photo img{width:100%;height:auto;display:block;}
@media(max-width:860px){.photo-duo{grid-template-columns:1fr;}.photo-duo img{height:240px;}.section-photo.tall img{height:280px;}.svc-grid-item .svc-name{font-size:17px;}.svc-grid-item .svc-cap{padding:20px;}}

/* ===== 茨城営業所 自動スクロールギャラリー ===== */
.gallery-marquee{overflow:hidden;position:relative;margin-top:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);}
.gallery-track{display:flex;gap:18px;width:max-content;animation:gallery-scroll 42s linear infinite;}
.gallery-marquee:hover .gallery-track{animation-play-state:paused;}
.gallery-item{position:relative;flex:0 0 auto;width:360px;margin:0;border-radius:var(--r);overflow:hidden;box-shadow:0 8px 24px rgba(26,31,46,.12);}
.gallery-item img{width:360px;height:240px;object-fit:cover;display:block;transition:transform .5s ease;}
.gallery-item:hover img{transform:scale(1.05);}
.gallery-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 14px 12px;font-family:'Noto Sans JP',sans-serif;font-size:12px;letter-spacing:.08em;color:#fff;background:linear-gradient(to top,rgba(26,31,46,.85),transparent);}
.gallery-item .gal-tag{position:absolute;top:10px;left:10px;font-family:'Noto Sans JP',sans-serif;font-size:10px;letter-spacing:.12em;font-weight:700;color:#fff;background:var(--primary);padding:4px 10px;border-radius:2px;z-index:1;}
@keyframes gallery-scroll{from{transform:translateX(0);}to{transform:translateX(calc(-50% - 9px));}}
@media(prefers-reduced-motion:reduce){.gallery-track{animation:none;}.gallery-marquee{overflow-x:auto;}}
@media(max-width:860px){.gallery-item,.gallery-item img{width:280px;}.gallery-item img{height:190px;}}

/* ===== ヘッダー メガメニュー（アイコン＋大手感） ===== */
.header { border-bottom: 1px solid var(--line); }
.header-inner { padding-top: 12px; padding-bottom: 12px; }
.nav { gap: 4px; }
.nav .nav-item { display: inline-flex; align-items: center; gap: 8px; padding: 12px 14px; border-radius: 9px; font-family:'Noto Sans JP',sans-serif; font-size: 14px; font-weight: 600; color: var(--ink); text-decoration: none; letter-spacing: 0.04em; position: relative; transition: color .2s, background .2s; }
.nav .nav-item .nav-ic { width: 19px; height: 19px; display: inline-flex; align-items:center; color: var(--ink-3); transition: color .2s, transform .25s; }
.nav .nav-item .nav-ic svg { width: 19px; height: 19px; }
.nav .nav-item:hover { color: var(--primary); background: var(--bg-2); }
.nav .nav-item:hover .nav-ic { color: var(--primary); transform: translateY(-1px); }
.nav .nav-item::after { content:''; position:absolute; left:14px; right:14px; bottom:5px; height:2px; background: var(--primary); border-radius:2px; transform: scaleX(0); transform-origin:center; transition: transform .25s; }
.nav .nav-item:hover::after { transform: scaleX(1); }
.nav .caret { display:inline-flex; align-items:center; margin-left:1px; color: var(--ink-3); transition: transform .25s, color .2s; }
.nav .caret svg { width:13px; height:13px; }
.nav .has-mega:hover .caret { transform: rotate(180deg); color: var(--primary); }
/* メガパネル */
.nav .has-mega { position: relative; }
.nav .mega { position:absolute; top:100%; left:0; margin-top:12px; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 26px 64px rgba(26,31,46,0.18); padding:18px; opacity:0; visibility:hidden; transform: translateY(8px); transition: opacity .22s ease, transform .22s ease, visibility .22s; z-index:50; }
.nav .has-mega:hover .mega { opacity:1; visibility:visible; transform: translateY(0); }
.nav .mega::before { content:''; position:absolute; top:-8px; left:34px; width:15px; height:15px; background:#fff; border-left:1px solid var(--line); border-top:1px solid var(--line); transform: rotate(45deg); }
.nav .mega-head { display:block; font-family:'Noto Sans JP',sans-serif; font-size:11px; font-weight:700; letter-spacing:.18em; color:var(--primary); padding:2px 10px 12px; }
.nav .mega-grid { display:grid; grid-template-columns: 1fr 1fr; gap:2px; }
.nav .mega-wide { min-width: 540px; }
.nav .mega-grid-1 { grid-template-columns: 1fr; min-width: 320px; }
.nav .mega-card { display:flex; align-items:flex-start; gap:13px; padding:13px 14px; border-radius:10px; text-decoration:none; transition: background .18s; }
.nav .mega-card:hover { background: var(--bg-2); }
.nav .mega-ic { flex:0 0 auto; width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border-radius:9px; background:var(--bg-2); color:var(--primary); transition: background .18s, color .18s; }
.nav .mega-ic svg { width:20px; height:20px; }
.nav .mega-card:hover .mega-ic { background: var(--primary); color:#fff; }
.nav .mega-txt { display:flex; flex-direction:column; gap:3px; }
.nav .mega-tt { font-family:'Noto Sans JP',sans-serif; font-size:14px; font-weight:600; color:var(--ink); letter-spacing:.02em; }
.nav .mega-ds { font-family:'Noto Sans JP',sans-serif; font-size:11.5px; color:var(--ink-3); line-height:1.5; }
.nav .has-mega:last-of-type .mega { left:auto; right:0; }
.nav .has-mega:last-of-type .mega::before { left:auto; right:34px; }
@media (max-width: 1180px){ .nav .nav-item { padding:10px 10px; font-size:13px; gap:6px; } .nav { gap:2px; } }
@media (max-width: 980px){ .nav .mega { display:none; } }

/* ヘッダー：1行表示の微調整（折り返し防止） */
.nav .nav-item { white-space: nowrap; padding: 10px 11px; gap: 7px; font-size: 13.5px; letter-spacing: 0.02em; }
.nav .nav-item .nav-ic, .nav .nav-item .nav-ic svg { width: 18px; height: 18px; }
.nav .nav-item::after { left: 11px; right: 11px; }
.nav .nav-tel { white-space: nowrap; padding: 11px 18px; font-size: 14px; }
@media (max-width: 1200px){ .logo-divider, .logo-tagline { display: none; } .nav .nav-item { padding: 9px 9px; font-size: 13px; gap: 6px; } }

/* ===== 本社 施設ギャラリー セクション ===== */
.facility-section{ background: var(--bg); padding: 96px 0; }
.facility-inner{ max-width:1280px; margin:0 auto; padding:0 24px; }
.facility-section .section-center{ margin-bottom:40px; }
.facility-section .gallery-item .gal-tag{ background: var(--ink); }

/* ===== ヘッダー再設計：トップは文字のみ／ホバーでアイコン付きメガ ===== */
.nav { gap: 2px; }
.nav .nav-item { display:inline-flex; align-items:center; gap:5px; padding:12px 15px; border-radius:0; background:none !important; font-family:'Noto Sans JP',sans-serif; font-size:15px; font-weight:600; color:var(--ink); letter-spacing:.05em; white-space:nowrap; position:relative; transition:color .2s; }
.nav .nav-item:hover, .nav .has-mega:hover > .nav-item { color:var(--primary); }
.nav .nav-item::after { content:''; position:absolute; left:15px; right:15px; bottom:6px; height:2px; background:var(--primary); border-radius:2px; transform:scaleX(0); transform-origin:center; transition:transform .25s; }
.nav .nav-item:hover::after, .nav .has-mega:hover > .nav-item::after { transform:scaleX(1); }
.nav .caret { display:inline-flex; align-items:center; color:var(--ink-3); transition:transform .25s,color .2s; }
.nav .caret svg { width:12px; height:12px; }
.nav .has-mega:hover .caret { transform:rotate(180deg); color:var(--primary); }
/* メガの余白・装飾を大手水準に */
.nav .mega { padding:22px; border-radius:16px; margin-top:14px; box-shadow:0 28px 70px rgba(26,31,46,0.20); }
.nav .mega-head { padding:0 12px 14px; font-size:11px; }
.nav .mega-grid { gap:4px; }
.nav .mega-card { padding:14px 16px; border-radius:12px; }
@media (max-width:1180px){ .nav .nav-item { padding:10px 11px; font-size:14px; } }
@media (max-width:1040px){ .logo-divider,.logo-tagline{display:none;} }

/* ===== ヒーローのフィルターを明るく＋文字の視認性向上 ===== */
.hero-overlay { background: linear-gradient(90deg, rgba(10,15,28,0.60) 0%, rgba(10,15,28,0.26) 52%, rgba(10,15,28,0.05) 100%); }
.hero-video-bg { filter: saturate(1.06) contrast(1.04); }
.hero-eyebrow { text-shadow: 0 1px 8px rgba(0,0,0,0.45); }
.hero-title { text-shadow: 0 2px 16px rgba(0,0,0,0.55); }
.hero-subtitle { color: rgba(255,255,255,0.95); text-shadow: 0 1px 10px rgba(0,0,0,0.5); }
.page-hero::after { background: linear-gradient(100deg, rgba(26,31,46,0.58) 0%, rgba(26,31,46,0.33) 50%, rgba(26,31,46,0.15) 100%); }
.page-hero-bg { filter: saturate(1.06) contrast(1.04); }
.page-hero .eyebrow { text-shadow: 0 1px 8px rgba(0,0,0,0.4); }
.page-hero h1 { text-shadow: 0 2px 16px rgba(0,0,0,0.55); }
.page-hero p.sub { color: rgba(255,255,255,0.92); text-shadow: 0 1px 10px rgba(0,0,0,0.5); }
@media (max-width:768px){ .hero-overlay { background: linear-gradient(180deg, rgba(15,20,32,0.42) 0%, rgba(15,20,32,0.68) 100%); } }

/* 固定サイドバナー：ヘッダーに被らないよう、ヘッダー下〜画面下の範囲で縦中央配置 */
.side-banners { top: 128px; bottom: 16px; transform: none; justify-content: center; }
@media (max-width: 1024px){ .side-banners { top: 116px; } }

/* 本社施設：写真グリッド（PC4列／スマホ2列） */
.facility-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.facility-grid .gallery-item{ width:auto; }
.facility-grid .gallery-item img{ width:100%; height:280px; }
@media(max-width:860px){ .facility-grid{ grid-template-columns:repeat(2,1fr); gap:12px; } .facility-grid .gallery-item img{ height:200px; } }
@media(max-width:560px){ .facility-grid{ grid-template-columns:1fr; } .facility-grid .gallery-item img{ height:240px; } }

/* ===== モバイル最適化：価格表をカード型に＋余白調整 ===== */
@media (max-width: 768px){
  /* 価格表を縦積みカードに */
  .price-table thead { display:none; }
  .price-table, .price-table tbody, .price-table tr, .price-table td { display:block; width:100% !important; }
  .price-table tr { border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:14px; background:#fff; }
  .price-table td { border:none !important; padding:3px 0; font-size:13.5px; line-height:1.8; }
  .price-table td:first-child { font-size:15px; font-weight:700; color:var(--ink) !important; margin-bottom:4px; }
  .price-table td.price { text-align:left; margin-top:8px; font-size:16px; white-space:normal; }
  .price-table td.price::before { content:"料金　"; color:var(--ink-3); font-weight:500; font-size:12px; }
  /* 大きめセクションの余白を圧縮 */
  .facility-section { padding:56px 0; }
  .about { padding:64px 0; }
  .certs { padding:56px 0; }
  .company-info { padding:56px 0; }
  .estimate-section { padding:56px 0; }
  .flow-step { gap:16px; padding:20px 0; }
  .flow-step::before { width:40px; height:40px; font-size:16px; }
}

/* ===== スマホメニュー：カテゴリをアコーディオン化（初期は閉じる） ===== */
.mm-group { margin: 0; }
.mm-group > span { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; font-family:'Noto Sans JP',sans-serif; font-size: 16px; font-weight: 600; letter-spacing: 0; color: var(--ink); border-bottom: 1px solid var(--line); cursor: pointer; -webkit-tap-highlight-color: transparent; user-select: none; }
.mm-group > span::after { content: ''; width: 9px; height: 9px; border-right: 2px solid var(--ink-3); border-bottom: 2px solid var(--ink-3); transform: rotate(45deg); transition: transform .25s, border-color .2s; margin: -3px 2px 0 0; flex-shrink: 0; }
.mm-group.open > span { color: var(--primary); }
.mm-group.open > span::after { transform: rotate(-135deg); border-color: var(--primary); margin-top: 3px; }
.mm-sub { max-height: 0; overflow: hidden; transition: max-height .3s ease; background: var(--bg); }
.mm-group.open .mm-sub { max-height: 600px; }
.mm-sub a { padding: 15px 24px 15px 40px !important; font-size: 14px !important; font-weight: 500 !important; color: var(--ink-2) !important; border-bottom: 1px solid var(--line); }
.mm-sub a:hover { background: #fff; color: var(--primary) !important; }

/* ============================================================
   v4: 見出しリビール / 波形ディバイダ / 家電設置ギャラリー
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0;transform:translateY(24px);filter:blur(5px);
    transition:opacity 1s cubic-bezier(.16,.84,.44,1),transform 1s cubic-bezier(.16,.84,.44,1),filter 1s ease;
    will-change:opacity,transform;}
  .reveal.in{opacity:1;transform:none;filter:none;}
}
/* セクション間の波形ディバイダ（ブランドゴールドの装飾波線） */
.wave-divider{position:relative;width:100%;height:92px;display:flex;align-items:center;justify-content:center;pointer-events:none;overflow:hidden;}
.wave-divider svg{display:block;width:min(860px,80%);height:36px;overflow:visible;}
.wave-divider .w1{fill:none;stroke:var(--accent);stroke-width:2;opacity:.55;stroke-linecap:round;}
.wave-divider .w2{fill:none;stroke:var(--accent);stroke-width:1.4;opacity:.22;stroke-linecap:round;}
@media (max-width:768px){.wave-divider{height:58px;}.wave-divider svg{height:24px;width:86%;}}
/* 家電設置ギャラリー */
.appliance-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px;}
.appliance-gallery figure{margin:0;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 8px 28px rgba(26,31,46,.10);}
.appliance-gallery img{display:block;width:100%;height:230px;object-fit:cover;transition:transform .7s cubic-bezier(.16,.84,.44,1);}
.appliance-gallery figure:hover img{transform:scale(1.06);}
.appliance-gallery figcaption{font-family:'Noto Sans JP',sans-serif;font-size:13px;color:#5a6172;padding:12px 14px;line-height:1.6;}
@media (max-width:768px){
  .appliance-gallery{grid-template-columns:repeat(2,1fr);gap:10px;}
  .appliance-gallery img{height:150px;}
}
/* ヒーロー動画背景（recruit） */
video.page-hero-bg{background:var(--ink);}

/* ============================================================
   v5: TOPヒーロー（動画をはっきり＋視認性＋ボタン光沢）
   ============================================================ */
/* ③ 全面フィルターを廃し、テキスト側のみ薄いスクリムで動画をはっきり見せる */
.hero-overlay{ background:linear-gradient(90deg, rgba(10,15,28,.58) 0%, rgba(10,15,28,.30) 36%, rgba(10,15,28,.06) 60%, rgba(10,15,28,0) 76%); }
/* ④ テキスト視認性（背景が明るくても読めるよう影付け） */
.hero-eyebrow{ text-shadow:0 1px 8px rgba(0,0,0,.45); }
.hero-title{ text-shadow:0 2px 18px rgba(0,0,0,.55),0 1px 3px rgba(0,0,0,.45); }
.hero-subtitle{ color:#fff; font-weight:500; text-shadow:0 1px 10px rgba(0,0,0,.5); }
/* ⑤ ボタンの拡大・配置調整 */
.hero-buttons{ gap:18px; align-items:center; margin-top:6px; }
.hero-buttons .btn-primary{ padding:20px 46px; font-size:16px; box-shadow:0 10px 30px rgba(200,52,30,.42); }
.hero-buttons .btn-secondary{ padding:18px 34px; font-size:15px; border-color:rgba(255,255,255,.6); backdrop-filter:blur(2px); }
/* ⑤ きらっと光る（右サイドバナーの sb-sheen と同系の演出） */
.btn-shine{ position:relative; overflow:hidden; }
.btn-shine::before{ content:''; position:absolute; top:-40%; left:-75%; width:50%; height:180%;
  background:linear-gradient(115deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
  transform:skewX(-18deg); pointer-events:none; z-index:2; animation:btn-sheen 4s ease-in-out infinite; }
@keyframes btn-sheen{ 0%,65%{ left:-75%; } 82%,100%{ left:175%; } }
@media (prefers-reduced-motion: reduce){ .btn-shine::before{ animation:none; } }
@media (max-width:768px){
  .hero-overlay{ background:linear-gradient(180deg, rgba(10,15,28,.28) 0%, rgba(10,15,28,.18) 42%, rgba(10,15,28,.64) 100%); }
  .hero-buttons{ gap:12px; }
  .hero-buttons .btn-primary,.hero-buttons .btn-secondary{ padding:16px; font-size:14px; }
}

/* ============================================================
   v5: 採用LP（recruit）コンポーネント
   ============================================================ */
.rec-hero-actions{ display:flex; gap:14px; margin-top:30px; flex-wrap:wrap; }
.rec-hero-actions .btn-primary{ padding:18px 42px; font-size:16px; box-shadow:0 10px 30px rgba(200,52,30,.45); }
.rec-hero-actions .btn-ghost{ display:inline-flex; align-items:center; gap:10px; padding:18px 34px; border:1px solid rgba(255,255,255,.65); border-radius:var(--r); color:#fff; text-decoration:none; font-weight:600; font-size:15px; font-family:'Noto Sans JP',sans-serif; transition:background .2s; backdrop-filter:blur(2px); }
.rec-hero-actions .btn-ghost:hover{ background:rgba(255,255,255,.14); }
.page-hero .sub{ max-width:680px; }
.rec-head{ text-align:center; max-width:760px; margin:0 auto 40px; }
.rec-head .eyebrow{ justify-content:center; color:var(--accent); }
.rec-head h2{ font-size:clamp(26px,3.4vw,38px); color:var(--ink); line-height:1.5; letter-spacing:.02em; }
.rec-head p{ font-family:'Noto Sans JP',sans-serif; color:var(--ink-2); margin-top:16px; line-height:2; font-size:15px; }
.rec-points{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:1100px; margin:0 auto; }
.rec-point{ background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; box-shadow:0 8px 28px rgba(26,31,46,.07); display:flex; flex-direction:column; }
.rec-point img{ width:100%; height:180px; object-fit:cover; }
.rec-point .rp-body{ padding:24px; }
.rec-point .rp-no{ color:var(--accent); font-weight:700; letter-spacing:.12em; font-size:12px; }
.rec-point h3{ color:var(--ink); font-size:19px; margin:6px 0 10px; line-height:1.5; }
.rec-point p{ font-family:'Noto Sans JP',sans-serif; color:var(--ink-2); font-size:14px; line-height:1.9; }
.rec-stats{ background:var(--ink); }
.rec-stats-inner{ max-width:1100px; margin:0 auto; padding:56px 24px; display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.rec-stat{ text-align:center; color:#fff; }
.rec-stat b{ display:block; font-size:46px; font-weight:700; line-height:1; color:var(--accent); letter-spacing:.01em; }
.rec-stat b small{ font-size:18px; margin-left:3px; font-weight:600; }
.rec-stat span{ display:block; margin-top:12px; font-family:'Noto Sans JP',sans-serif; font-size:13px; color:rgba(255,255,255,.82); letter-spacing:.04em; }
.rec-styles{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:1100px; margin:0 auto; }
.rec-style{ border-radius:12px; overflow:hidden; position:relative; color:#fff; min-height:330px; display:flex; flex-direction:column; justify-content:flex-end; padding:32px; }
.rec-style.is-go{ background:linear-gradient(120deg,#c8341e,#7d1f12); }
.rec-style.is-life{ background:linear-gradient(120deg,#2b3654,#12151f); }
.rec-style .rs-tag{ letter-spacing:.14em; font-weight:700; font-size:13px; opacity:.92; }
.rec-style h3{ font-size:25px; line-height:1.5; margin:8px 0 14px; }
.rec-style p{ font-family:'Noto Sans JP',sans-serif; font-size:14px; line-height:1.95; color:rgba(255,255,255,.92); }
.rec-style ul{ list-style:none; margin-top:18px; display:flex; gap:8px; flex-wrap:wrap; }
.rec-style li{ font-family:'Noto Sans JP',sans-serif; font-size:12px; background:rgba(255,255,255,.18); padding:6px 13px; border-radius:999px; }
.rec-day{ max-width:820px; margin:0 auto; position:relative; padding-left:36px; }
.rec-day::before{ content:''; position:absolute; left:11px; top:8px; bottom:8px; width:2px; background:var(--line); }
.rec-day-step{ position:relative; padding:0 0 28px; }
.rec-day-step::before{ content:''; position:absolute; left:-30px; top:4px; width:14px; height:14px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px #fff; }
.rec-day-step time{ font-weight:700; color:var(--accent); font-size:17px; letter-spacing:.04em; }
.rec-day-step h4{ color:var(--ink); font-size:16px; margin:2px 0 4px; }
.rec-day-step p{ font-family:'Noto Sans JP',sans-serif; color:var(--ink-2); font-size:14px; line-height:1.8; }
.rec-gallery{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:1100px; margin:0 auto; }
.rec-gallery figure{ margin:0; border-radius:8px; overflow:hidden; position:relative; }
.rec-gallery img{ display:block; width:100%; height:200px; object-fit:cover; transition:transform .7s cubic-bezier(.16,.84,.44,1); }
.rec-gallery figure:hover img{ transform:scale(1.06); }
.rec-gallery figcaption{ position:absolute; left:0; right:0; bottom:0; padding:20px 14px 10px; font-family:'Noto Sans JP',sans-serif; font-size:12px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.62)); }
.rec-gallery .span2{ grid-column:span 2; }
.rec-voices{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:1100px; margin:0 auto; }
.rec-voice{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:26px; box-shadow:0 8px 28px rgba(26,31,46,.06); }
.rec-voice .rv-role{ font-family:'Noto Sans JP',sans-serif; font-size:12px; color:var(--accent); font-weight:700; letter-spacing:.06em; }
.rec-voice h4{ color:var(--ink); font-size:17px; margin:6px 0 12px; line-height:1.5; }
.rec-voice p{ font-family:'Noto Sans JP',sans-serif; color:var(--ink-2); font-size:14px; line-height:1.95; }
.rec-note{ text-align:center; font-family:'Noto Sans JP',sans-serif; font-size:12px; color:var(--ink-3); margin-top:18px; }
.rec-flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:1100px; margin:0 auto; }
.rec-flow .rf{ background:var(--bg-2); border-radius:10px; padding:26px 20px; text-align:center; }
.rec-flow .rf b{ display:block; color:var(--accent); font-size:13px; letter-spacing:.16em; margin-bottom:10px; font-weight:700; }
.rec-flow .rf h4{ color:var(--ink); font-size:16px; margin-bottom:8px; }
.rec-flow .rf p{ font-family:'Noto Sans JP',sans-serif; color:var(--ink-2); font-size:13px; line-height:1.8; }
.rec-faq{ max-width:820px; margin:0 auto; }
.rec-faq details{ border:1px solid var(--line); border-radius:8px; margin-bottom:12px; background:#fff; }
.rec-faq summary{ list-style:none; cursor:pointer; padding:18px 52px 18px 22px; font-family:'Noto Sans JP',sans-serif; font-weight:600; color:var(--ink); position:relative; }
.rec-faq summary::-webkit-details-marker{ display:none; }
.rec-faq summary::before{ content:'Q'; color:var(--accent); font-weight:700; margin-right:10px; }
.rec-faq summary::after{ content:'+'; position:absolute; right:22px; top:50%; transform:translateY(-50%); color:var(--accent); font-size:22px; line-height:1; transition:transform .25s; }
.rec-faq details[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.rec-faq .fa{ padding:0 22px 20px; font-family:'Noto Sans JP',sans-serif; color:var(--ink-2); font-size:14px; line-height:1.95; }
.rec-entry{ background:linear-gradient(120deg,var(--primary),var(--primary-dark)); color:#fff; text-align:center; padding:66px 24px; }
.rec-entry h2{ font-size:clamp(24px,3vw,34px); line-height:1.5; }
.rec-entry p{ font-family:'Noto Sans JP',sans-serif; margin:14px auto 30px; max-width:640px; line-height:2; color:rgba(255,255,255,.94); }
.rec-entry .btn-white{ display:inline-flex; align-items:center; gap:12px; background:#fff; color:var(--primary); font-weight:700; padding:20px 50px; border-radius:var(--r); text-decoration:none; font-size:17px; box-shadow:0 12px 34px rgba(0,0,0,.22); font-family:'Noto Sans JP',sans-serif; }
@media (max-width:900px){
  .rec-points,.rec-voices,.rec-flow{ grid-template-columns:1fr 1fr; }
  .rec-stats-inner{ grid-template-columns:1fr 1fr; gap:26px; }
}
@media (max-width:768px){
  .rec-points,.rec-styles,.rec-voices,.rec-flow{ grid-template-columns:1fr; }
  .rec-gallery{ grid-template-columns:1fr 1fr; }
  .rec-gallery img{ height:150px; }
  .rec-style{ min-height:280px; padding:26px; }
}

/* ===== v6: TOPサービスカード／企業様バナーの hover を赤→紺×ゴールドへ変更 ===== */
/* --- サービスカード(.svc-grid-item) --- */
.svc-grid-item:hover .svc-cap{
  background:linear-gradient(to top,rgba(26,31,46,.93) 0%,rgba(26,31,46,.5) 55%,rgba(26,31,46,.08) 100%);
}
.svc-grid-item:hover .svc-no{ color:var(--accent); }
.svc-grid-item .svc-name{ position:relative; display:inline-block; align-self:flex-start; }
.svc-grid-item .svc-name::after{
  content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0;
  background:var(--accent); transition:width .4s ease;
}
.svc-grid-item:hover .svc-name::after{ width:100%; }
.svc-grid-item .svc-arrow{ transition:transform .35s ease, color .35s ease, opacity .35s ease; }
.svc-grid-item:hover .svc-arrow{ transform:translateX(6px); color:var(--accent); opacity:1; }

/* --- 企業様向けサイドバナー(.side-banner-corp)：hoverは紺を明るく＋影も紺系 --- */
.side-banner-corp:hover{ background:linear-gradient(135deg,#374563 0%,#232a3e 100%); }
.side-banner-corp:hover.side-banner,
.side-banner-corp:hover{ box-shadow:-10px 12px 34px rgba(26,31,46,0.5); }

/* ============================================================
   v7: デザイン・リファインメント層
   （紺×ゴールドのエディトリアル基調を維持したまま質感を一段引き上げ）
   ============================================================ */

/* 1. タイポグラフィの精度 */
.section-title{ line-height:1.45; letter-spacing:.04em; text-wrap:balance; }
.section-subtitle{ margin-bottom:56px; }
.section-eyebrow{ letter-spacing:.12em; font-weight:600; }
.cta-title{ line-height:1.5; letter-spacing:.04em; text-wrap:balance; }

/* 2. 実績バー：数字を等幅化＋ゴールドの下線アクセント */
.trust-num{ font-feature-settings:'tnum' 1; position:relative; display:inline-block; padding-bottom:12px; }
.trust-num::after{ content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:24px; height:2px; background:var(--accent); border-radius:2px; }
.trust-label{ letter-spacing:.18em; }

/* 3. 区切り線：ゆらぎ波線 → 上品なゴールド・ヘアライン＋ダイヤ */
.wave-divider{ height:66px; }
.wave-divider svg{ display:none; }
.wave-divider::before{ content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(560px,72%); height:1px;
  background:linear-gradient(90deg,transparent,rgba(217,154,59,.6) 24%,rgba(217,154,59,.6) 76%,transparent); }
.wave-divider::after{ content:""; position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%) rotate(45deg); width:7px; height:7px; background:var(--accent); }
@media(max-width:768px){ .wave-divider{ height:50px; } .wave-divider::before{ width:84%; } }

/* 4. カードに静かな奥行きとホバーリフト（3pxのシャープな角は維持） */
.cert-card,.company-card,.office-item,.office-card,.promise-item{
  box-shadow:0 1px 2px rgba(26,31,46,.04), 0 10px 28px rgba(26,31,46,.05);
  transition:transform .3s cubic-bezier(.2,.8,.25,1), box-shadow .3s, border-color .3s; }
.cert-card:hover,.office-card:hover{ transform:translateY(-4px);
  box-shadow:0 6px 14px rgba(26,31,46,.07), 0 18px 44px rgba(26,31,46,.10); }
.office-item:hover,.promise-item:hover{ transform:translateX(2px);
  box-shadow:0 4px 12px rgba(26,31,46,.06), 0 14px 36px rgba(26,31,46,.08); }
.cert-card:hover{ border-color:var(--accent); }

/* 価値観カード(3つのC)：左帯と番号をゴールドへ統一 */
.promise-item{ border-left-width:3px; border-left-color:var(--accent); }
.promise-num{ color:var(--accent); font-weight:600; }

/* お知らせ行：ホバーで左にゴールドのインジケータ */
.news-row{ position:relative; padding-left:18px; }
.news-row::before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:3px; height:0; background:var(--accent); transition:height .25s ease; }
.news-row:hover::before{ height:62%; }

/* 5. ボタンの質感（持ち上がり） */
.btn-primary{ box-shadow:0 6px 18px rgba(200,52,30,.22);
  transition:background .2s, transform .2s, box-shadow .2s; }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(200,52,30,.30); }
.cta-tel{ transition:border-color .2s, color .2s, transform .2s, box-shadow .2s; }
.cta-tel:hover{ transform:translateY(-2px); box-shadow:0 8px 22px rgba(26,31,46,.08); }

/* 6. ヘッダー：奥行きのある極薄シャドウ */
.header{ box-shadow:0 1px 0 rgba(227,230,235,.9), 0 6px 20px rgba(26,31,46,.045); }

/* 7. フッター：上端ゴールドの継ぎ目／実ロゴ復元／リンクの微動 */
.footer{ border-top:3px solid var(--accent); padding-top:72px; }
.footer-brand img{ filter:none; background:#fff; padding:14px 18px; border-radius:4px; box-shadow:0 6px 18px rgba(0,0,0,.18); }
.footer-col h4{ letter-spacing:.28em; }
.footer-col a{ transition:color .2s, padding-left .2s; }
.footer-col a:hover{ padding-left:4px; color:var(--accent); }

/* === 採用バナー（求人・3本目）＋スマホ右固定表示 === */
.side-banner-recruit{ background:linear-gradient(135deg,#e3a23a 0%,#c2851c 100%); color:#fff; }
.side-banner-recruit::before{ animation-delay:3.6s; }
.side-banner-recruit:hover{ background:linear-gradient(135deg,#efb24e 0%,#d2962a 100%); box-shadow:-10px 12px 34px rgba(194,133,28,.5); }
@media (max-width: 768px){
  .side-banners{ display:flex !important; top:50% !important; bottom:auto !important; transform:translateY(-50%) !important; justify-content:center; gap:0; }
  .side-banner-corp, .side-banner-indiv{ display:none !important; }
  .side-banner-recruit{ padding:24px 10px 24px 9px; box-shadow:-4px 6px 18px rgba(26,31,46,.32); }
  .side-banner-recruit .side-banner-label{ font-size:12px; letter-spacing:.18em; }
  .side-banner-recruit .side-banner-sub{ font-size:8px; }
  .side-banner-recruit .side-banner-icon, .side-banner-recruit .side-banner-icon svg{ width:16px; height:16px; }
}

/* === 詳細リンク（料金・エリア等） === */
.detail-link{ display:inline-flex; align-items:center; gap:8px; margin-top:20px; font-family:'Noto Sans JP',sans-serif; font-size:14px; font-weight:700; color:#fff; background:var(--primary); padding:12px 22px; border-radius:var(--r); text-decoration:none; letter-spacing:.04em; transition:background .2s ease, transform .2s ease, box-shadow .2s ease; }
.detail-link span{ transition:transform .2s ease; }
.detail-link:hover{ background:var(--accent); transform:translateY(-2px); box-shadow:0 10px 22px rgba(224,133,31,.28); }
.detail-link:hover span{ transform:translateX(4px); }

/* 旧ライトボックスCSSは廃止（openVehLightbox / lightbox.js の .veh-lightbox に一本化） */

/* === 会社案内メガメニュー：イメージ写真入り2列 === */
.nav .mega-grid-photo{ display:grid; grid-template-columns:1fr 1fr; gap:10px; min-width:480px; }
.nav .mega-grid-photo .span2{ grid-column:1 / -1; }
.nav .mega-grid-3{ grid-template-columns:repeat(3,1fr); min-width:600px; }
.nav .mega-grid-3 .mega-card-photo .mega-thumb{ height:92px; }
.nav .mega-card-photo{ flex-direction:column; align-items:stretch; gap:0; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fff; }
.nav .mega-card-photo:hover{ background:#fff; border-color:var(--primary); box-shadow:0 10px 24px rgba(26,31,46,.12); }
.nav .mega-card-photo .mega-thumb{ display:block; width:100%; height:104px; overflow:hidden; }
.nav .mega-card-photo .mega-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.nav .mega-card-photo:hover .mega-thumb img{ transform:scale(1.06); }
.nav .mega-card-photo .mega-txt{ padding:11px 13px 13px; gap:4px; }

/* === 募集職種一覧（求人ページ上部） === */
.job-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.job-list-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; text-decoration:none; transition:box-shadow .25s ease, transform .25s ease, border-color .25s ease; }
.job-list-card:hover{ box-shadow:0 16px 36px rgba(26,31,46,.14); transform:translateY(-3px); border-color:var(--primary); }
.job-list-card .jl-thumb{ display:block; width:100%; height:168px; overflow:hidden; }
.job-list-card .jl-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.job-list-card:hover .jl-thumb img{ transform:scale(1.06); }
.job-list-card .jl-body{ display:flex; flex-direction:column; gap:8px; padding:18px 20px 20px; font-family:'Noto Sans JP',sans-serif; }
.job-list-card .jl-badge{ align-self:flex-start; font-size:11px; font-weight:700; letter-spacing:.14em; color:#fff; background:var(--primary); padding:4px 12px; border-radius:3px; }
.job-list-card .jl-tt{ font-size:17px; font-weight:700; color:var(--ink); letter-spacing:.02em; }
.job-list-card .jl-ds{ font-size:13px; color:var(--ink-2); line-height:1.8; }
.job-list-card .jl-more{ margin-top:2px; font-size:13px; font-weight:700; color:var(--primary); letter-spacing:.04em; }
.job-list-card:hover .jl-more{ color:var(--accent); }
@media(max-width:700px){ .job-list{ grid-template-columns:1fr; } }

/* ===== 共有ライトボックス（全ページ） ===== */
.veh-lightbox{ position:fixed; inset:0; background:rgba(7,12,24,.92); z-index:9999; display:none; align-items:center; justify-content:center; }
.veh-lightbox.open{ display:flex; }
.veh-lb-stage{ position:relative; max-width:92vw; max-height:88vh; text-align:center; }
.veh-lb-img{ max-width:92vw; max-height:78vh; border-radius:10px; box-shadow:0 10px 50px rgba(0,0,0,.5); }
.veh-lb-title{ display:block; color:#fff; font-size:16px; font-weight:700; margin-bottom:14px; }
.veh-lb-counter{ display:block; color:rgba(255,255,255,.7); font-size:13px; margin-top:12px; }
.veh-lb-close{ position:absolute; top:-44px; right:0; width:40px; height:40px; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:24px; border-radius:50%; cursor:pointer; line-height:1; }
.veh-lb-nav{ position:absolute; top:44%; transform:translateY(-50%); width:48px; height:48px; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:30px; border-radius:50%; cursor:pointer; line-height:1; display:flex; align-items:center; justify-content:center; }
.veh-lb-nav:hover{ background:rgba(255,255,255,.3); }
.veh-lb-prev{ left:-66px; }
.veh-lb-next{ right:-66px; }
@media(max-width:768px){ .veh-lb-prev{ left:6px; } .veh-lb-next{ right:6px; } }
/* 素のfigureギャラリーの表示ルール：先頭（左端）の1枚＝その組の写真を全部見られる写真集、
   2枚目以降＝クリックでその1枚だけを拡大。バッジ（.gal-more/.gal-zoom）は lightbox.js が付与する。 */
.appliance-gallery figure, .rec-gallery figure, figure.gallery-item{ position:relative; }
/* 写真パネル共通バッジ（office等でページ内に個別指定が無いページ向けの共通スタイル） */
.gal-more{ position:absolute; right:10px; top:10px; display:inline-flex; align-items:center; gap:6px; background:rgba(7,18,38,.82); color:#fff; font-size:12px; font-weight:600; padding:6px 11px; border-radius:8px; z-index:3; pointer-events:none; }
.gal-zoom{ position:absolute; right:10px; top:10px; display:inline-flex; align-items:center; gap:6px; background:rgba(7,18,38,.72); color:#fff; font-size:12px; font-weight:600; padding:6px 11px; border-radius:8px; z-index:3; pointer-events:none; }

/* ===== フッター メインプッシュ（写真付きカテゴリー） ===== */
.footer-feature{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:40px; }
.ff-card{ position:relative; display:block; min-height:150px; border-radius:14px; overflow:hidden; text-decoration:none; box-shadow:0 10px 28px rgba(0,0,0,.28); }
.ff-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.16,.84,.44,1); }
.ff-card:hover img{ transform:scale(1.08); }
.ff-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,12,24,.10) 0%, rgba(8,12,24,.55) 55%, rgba(8,12,24,.86) 100%); }
.ff-card .ff-txt{ position:absolute; left:0; right:0; bottom:0; padding:16px 16px 15px; z-index:2; }
.ff-card .ff-tt{ display:block; color:#fff; font-weight:700; font-size:16px; letter-spacing:.02em; padding-left:12px; position:relative; }
.ff-card .ff-tt::before{ content:""; position:absolute; left:0; top:3px; bottom:3px; width:4px; border-radius:2px; background:var(--primary); }
.ff-card .ff-tt .ff-arw{ margin-left:6px; opacity:.7; transition:margin-left .25s; }
.ff-card:hover .ff-tt .ff-arw{ margin-left:10px; }
.ff-card .ff-ds{ display:block; color:rgba(255,255,255,.86); font-size:12px; margin-top:6px; padding-left:12px; line-height:1.5; }
@media(max-width:860px){ .footer-feature{ grid-template-columns:1fr 1fr; gap:12px; } }
@media(max-width:480px){ .footer-feature{ grid-template-columns:1fr; } .ff-card{ min-height:120px; } }

/* ===== 求人「働き方」カードの人型アニメーション ===== */
.rec-style{ overflow:hidden; }
.rec-style .rs-tag, .rec-style h3, .rec-style p, .rec-style ul{ position:relative; z-index:1; }
.human-anim{ position:absolute; top:14px; left:0; right:0; height:158px; display:flex; align-items:flex-start; justify-content:center; pointer-events:none; z-index:0; }
.ha-figure{ width:122px; height:150px; overflow:visible; filter:drop-shadow(0 10px 16px rgba(0,0,0,.28)); }
.ha-figure *{ transform-box:fill-box; }
.ha-head, .ha-torso, .ha-limb{ fill:#fff; }
.ha-arm, .ha-leg{ transform-origin:center top; }
.ha-arm-back, .ha-leg-back{ opacity:.5; }
.ha-body{ transform-origin:center bottom; }

/* TYPE A — GO!（走る） */
.ha-go .ha-body{ animation:haBob .54s ease-in-out infinite; }
.ha-go .ha-leg-front,.ha-go .ha-arm-back{ animation:haSwingA .54s ease-in-out infinite; }
.ha-go .ha-leg-back,.ha-go .ha-arm-front{ animation:haSwingB .54s ease-in-out infinite; }
.ha-speed rect{ fill:#fff; opacity:0; animation:haSpeed .54s linear infinite; }
.ha-speed rect:nth-child(2){ animation-delay:.12s; }
.ha-speed rect:nth-child(3){ animation-delay:.24s; }
@keyframes haBob{ 0%,100%{ transform:translateY(0) rotate(6deg);} 50%{ transform:translateY(-7px) rotate(6deg);} }
@keyframes haSwingA{ 0%,100%{ transform:rotate(34deg);} 50%{ transform:rotate(-30deg);} }
@keyframes haSwingB{ 0%,100%{ transform:rotate(-30deg);} 50%{ transform:rotate(34deg);} }
@keyframes haSpeed{ 0%{ transform:translateX(16px); opacity:0;} 25%{ opacity:.75;} 100%{ transform:translateX(-30px); opacity:0;} }

/* TYPE B — LIFE（ゆったり手を振る） */
.ha-life .ha-body{ animation:haSway 3.6s ease-in-out infinite; }
.ha-life .ha-arm-front{ animation:haWave 1.8s ease-in-out infinite; }
.ha-life .ha-arm-back{ transform:rotate(9deg); }
.ha-life .ha-leg-front{ transform:rotate(7deg); }
.ha-life .ha-leg-back{ transform:rotate(-7deg); }
.ha-sun-g{ transform-origin:center; animation:haSun 3.6s ease-in-out infinite; }
.ha-sun{ fill:#ffd36b; }
.ha-ray{ stroke:#ffd36b; stroke-width:3; stroke-linecap:round; }
@keyframes haSway{ 0%,100%{ transform:rotate(-3deg);} 50%{ transform:rotate(3deg);} }
@keyframes haWave{ 0%,100%{ transform:rotate(-126deg);} 50%{ transform:rotate(-152deg);} }
@keyframes haSun{ 0%,100%{ transform:scale(1); opacity:.85;} 50%{ transform:scale(1.14); opacity:1;} }

@media(prefers-reduced-motion:reduce){
  .ha-go .ha-body,.ha-go .ha-leg-front,.ha-go .ha-leg-back,.ha-go .ha-arm-front,.ha-go .ha-arm-back,.ha-speed rect,.ha-life .ha-body,.ha-life .ha-arm-front,.ha-sun-g{ animation:none; }
}
@media(max-width:560px){ .human-anim{ height:120px; } .ha-figure{ width:98px; height:120px; } }

/* ===== Botマークの吹き出し（採用ページ） ===== */
.fab-bubble{ position:absolute; right:100%; left:auto; margin-right:14px; bottom:14px; pointer-events:none; background:#fff; color:var(--ink); font-family:'Noto Sans JP',sans-serif; font-weight:700; font-size:13.5px; white-space:nowrap; padding:9px 15px; border-radius:18px; border:1px solid var(--line); box-shadow:0 8px 22px rgba(0,0,0,.16); animation:fabBubbleFloat 2.6s ease-in-out infinite; }
.fab-bubble::before{ content:""; position:absolute; right:-10px; bottom:12px; width:0; height:0; border-top:9px solid transparent; border-bottom:9px solid transparent; border-left:10px solid var(--line); }
.fab-bubble::after{ content:""; position:absolute; right:-8px; bottom:13px; width:0; height:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:9px solid #fff; }
@keyframes fabBubbleFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-5px);} }
body:has(#chatPanel.open) .fab-bubble{ opacity:0; visibility:hidden; }
body.chat-open .fab-bubble{ opacity:0; visibility:hidden; } /* :has()非対応端末向けフォールバック */
@media(max-width:560px){ .fab-bubble{ margin-right:12px; bottom:18px; font-size:12.5px; padding:8px 12px; } }

/* ===== レスポンシブ監査の追補修正（スマホ最適化） ===== */
@media (max-width: 768px){
  /* iOS Safari のフォーカス時自動ズーム防止：フォーム入力は16px以上 */
  .cform input, .cform select, .cform textarea,
  .ap-field input, .ap-field select, .ap-field textarea { font-size: 16px !important; }
  /* 価格表（3列）のカード化で中央「詳細」列にも見出しを付与（.price列は除外） */
  .price-table td:nth-child(2):not(.price)::before { content:"内容　"; color:var(--ink-3); font-weight:500; font-size:12px; }
}
@media (max-width: 560px){
  /* 募集要項テーブルをスマホで縦積みに */
  .job-spec th, .job-spec td { display: block; width: 100%; }
  .job-spec th { border-bottom: none; padding-bottom: 2px; }
  .job-spec td { padding-top: 2px; }
}
@media (max-width: 400px){
  /* 車種スペックの寸法値が窮屈な極小幅では折返し可に */
  .veh-show-spec div { flex-wrap: wrap; }
}