@charset "UTF-8";
/* =========================================================
   レジデンシャル常盤台 共通スタイル（2026 リニューアル版）
   ========================================================= */

/* ---------- 色・サイズの設定（ここを変えると全体に反映） ---------- */
:root {
  --bg: #fef1e0;          /* ページ背景（旧サイトのクリーム色） */
  --paper: #ffffff;       /* 本文エリア */
  --text: #3d3230;        /* 本文の文字色 */
  --text-sub: #6f625d;    /* 補足の文字色 */
  --accent: #b24f4f;      /* リンク色（旧 #C66 を読みやすく少し濃く） */
  --accent-hover: #8e3535;
  --frame: #ddb688;       /* お知らせ枠などの縁取り（旧デザインの茶色） */
  --frame-light: #f6e6d0;
  --green: #6a9a2c;       /* ロゴの黄緑 */
  --radius: 14px;
  --font-round: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "ヒラギノ丸ゴ ProN", sans-serif;
  --font-body: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Yu Gothic", "游ゴシック", YuGothic, Meiryo, "メイリオ", sans-serif;
}

/* ---------- 基本 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.04em;
}
img { max-width: 100%; height: auto; vertical-align: middle; border: 0; }
a { color: var(--accent); }
a:hover { color: var(--accent-hover); }
a:focus-visible, button:focus-visible {
  outline: 3px solid #e7a13a;
  outline-offset: 2px;
  border-radius: 4px;
}
h1, h2, h3 { font-family: var(--font-round); line-height: 1.4; }
address { font-style: normal; }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.skip-link {
  position: absolute; left: 8px; top: -60px; z-index: 100;
  background: var(--paper); padding: 8px 16px; border-radius: 8px;
}
.skip-link:focus { top: 8px; }

/* ---------- 全体の枠 ---------- */
.site {
  max-width: 960px;
  margin: 0 auto;
  background: var(--paper);
  box-shadow: 0 0 0 1px #f0dcc3, 0 8px 40px rgba(120, 80, 40, 0.08);
  min-height: 100vh;
}

/* ---------- ヘッダー ---------- */
.site-header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 24px;
  min-height: 140px;
  background: url(../images/header_bg.jpg) center / cover no-repeat;
}
.site-logo { display: block; max-width: 640px; }
.site-logo img { display: block; }

.nav-toggle { display: none; }

/* ---------- 2カラム ---------- */
.site-body {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 36px;
  padding: 16px 40px 48px;
}

/* ---------- サイドメニュー（画像ボタンを流用） ---------- */
.nav-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.nav-list a {
  position: relative;
  display: block;
  line-height: 0;
  border-radius: 4px;
  overflow: hidden;
}
.nav-list img.hover {
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity .2s ease;
}
.nav-list a:hover img.hover,
.nav-list a:focus-visible img.hover,
.nav-list a[aria-current] img.hover { opacity: 1; }
.nav-blog { margin-top: 8px; }

.link-box {
  margin-top: 20px;
  border: 1px solid var(--frame);
  border-radius: 6px;
  overflow: hidden;
}
.link-box-title { margin: 0; line-height: 0; }
.link-box ul { list-style: none; margin: 0; padding: 10px 14px 12px; font-size: 14px; }
.link-box li { position: relative; padding-left: 16px; }
.link-box li::before {
  content: ""; position: absolute; left: 2px; top: .65em;
  border: 5px solid transparent; border-left: 7px solid #c9a36e;
  border-right: 0;
}

/* ---------- メイン ---------- */
.main { display: grid; gap: 32px; align-content: start; }

/* スライダー */
.slider {
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  background: #eee;
}
.slider-track { position: relative; aspect-ratio: 580 / 318; } /* 画像下端の透かし文字を隠すため少しトリミング */
.slide {
  position: absolute; inset: 0; margin: 0;
  opacity: 0;
  transition: opacity 1s ease;
}
.slide.is-active { opacity: 1; }
.slide img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.slide figcaption {
  position: absolute; left: 16px; bottom: 56px;
  background: rgba(255, 255, 255, .88);
  color: var(--text);
  font-family: var(--font-round);
  font-weight: 700;
  font-size: 15px;
  padding: 4px 14px;
  border-radius: 999px;
}
.slider-controls {
  position: absolute; left: 0; right: 0; bottom: 0;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 10px;
  background: linear-gradient(transparent, rgba(0, 0, 0, .35));
}
.slider-dots { display: flex; gap: 8px; }
.slider-dots button {
  width: 12px; height: 12px; padding: 0;
  border: 2px solid #fff; border-radius: 50%;
  background: transparent; cursor: pointer;
}
.slider-dots button[aria-current="true"] { background: #fff; }
.slider-prev, .slider-next {
  width: 34px; height: 34px;
  border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .85);
  color: var(--text);
  font-size: 22px; line-height: 1;
  cursor: pointer;
}

/* 枠付きカード（お知らせ等） */
.card {
  border: 3px solid var(--frame);
  border-radius: var(--radius);
  padding: 18px 24px 20px;
  background: var(--paper);
}
.section-title {
  display: flex; align-items: baseline; gap: 10px;
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid #e8d49a;
  color: #c8783c;
  font-size: 22px;
  font-weight: 700;
}
.section-title-icon {
  align-self: center;
  width: 22px; height: 22px; flex: none;
  background:
    linear-gradient(#c8783c, #c8783c) 0 0 / 10px 10px no-repeat,
    linear-gradient(#e3a86b, #e3a86b) 12px 0 / 10px 10px no-repeat,
    linear-gradient(#c8783c, #c8783c) 12px 12px / 10px 10px no-repeat,
    linear-gradient(#e3a86b, #e3a86b) 0 12px / 10px 10px no-repeat;
}
.section-title-en {
  font-family: var(--font-body);
  font-size: 13px; font-weight: normal;
  color: #b58a5a; letter-spacing: .08em;
}
.news-frame {
  display: block; width: 100%; height: 300px;
  border: 0;
}

/* 関連サイトバナー */
.related {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
}
.related a {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  text-decoration: none; color: var(--text-sub);
  font-size: 13px; text-align: center;
}
.related a:hover span { color: var(--accent); text-decoration: underline; }
.related img { border-radius: 21px; transition: transform .2s; }
.related a:hover img { transform: translateY(-2px); }

/* ご相談 */
.consult {
  background: var(--frame-light);
  border-radius: var(--radius);
  padding: 20px 20px 22px;
  text-align: center;
}
.consult-actions {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 12px;
  margin-top: 14px;
}
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 8px 24px;
  border-radius: 999px;
  font-family: var(--font-round); font-weight: 700; font-size: 16px;
  text-decoration: none;
  transition: background-color .2s, transform .2s;
}
.btn:hover { transform: translateY(-1px); }
.btn-tel { background: #c8783c; color: #fff; }
.btn-tel:hover { background: #ad6229; color: #fff; }
.btn-mail { background: #fff; color: #ad6229; border: 2px solid #c8783c; }
.btn-mail:hover { background: #fff8ef; color: #8e4a1a; }

/* ---------- フッター ---------- */
.site-footer {
  padding: 40px 24px 28px;
  text-align: center;
  font-size: 14px;
  color: var(--text-sub);
  background: url(../images/footer_bg.jpg) center bottom / cover no-repeat;
}
.site-footer address { margin: 10px 0 6px; line-height: 1.9; }
.site-footer p { margin: 0; }
.site-footer .copyright { margin-top: 14px; font-size: 12px; }

/* ページ全体のネコカーソル（旧サイトから継承・PCのみ） */
@media (hover: hover) {
  body { cursor: url(../neko.cur), auto; }
}

/* =========================================================
   タブレット以下
   ========================================================= */
@media (max-width: 860px) {
  .site-body { grid-template-columns: 180px minmax(0, 1fr); gap: 24px; padding: 16px 20px 40px; }
}

/* =========================================================
   スマートフォン
   ========================================================= */
@media (max-width: 700px) {
  body { font-size: 15px; }
  .site-header {
    min-height: 0;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 14px;
  }
  .site-logo { max-width: 72%; }

  /* メニューボタン */
  .nav-toggle {
    display: inline-flex; flex-direction: column; align-items: center; gap: 4px;
    flex: none;
    padding: 8px 10px 6px;
    border: 0; border-radius: 10px;
    background: rgba(255, 255, 255, .9);
    color: var(--text);
    font: 700 11px/1 var(--font-round);
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
  }
  .nav-toggle-bars,
  .nav-toggle-bars::before,
  .nav-toggle-bars::after {
    display: block; width: 24px; height: 3px; border-radius: 2px;
    background: #c8783c; transition: transform .2s, opacity .2s;
  }
  .nav-toggle-bars { position: relative; margin: 7px 0; }
  .nav-toggle-bars::before, .nav-toggle-bars::after { content: ""; position: absolute; left: 0; }
  .nav-toggle-bars::before { top: -7px; }
  .nav-toggle-bars::after { top: 7px; }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bars { background: transparent; }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bars::before { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] .nav-toggle-bars::after { transform: translateY(-7px) rotate(-45deg); }

  .site-body { display: flex; flex-direction: column-reverse; padding: 0 14px 32px; gap: 28px; }

  /* メニューは開閉式・2列の画像ボタン */
  .js .global-nav {
    display: none;
  }
  .js .global-nav.is-open { display: block; }
  .js .global-nav {
    position: absolute; left: 0; right: 0; top: var(--nav-top, 110px); z-index: 20;
    background: var(--paper);
    padding: 14px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .12);
  }
  .site { position: relative; }
  .nav-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .nav-list img { width: 100%; }
  .nav-blog { margin-top: 0; grid-column: 1 / -1; justify-self: center; max-width: 240px; }

  .sidebar { order: 0; }
  .link-box { width: 100%; max-width: 240px; margin: 0 auto; }
  .link-box-title img { width: 100%; }

  .main { gap: 24px; padding-top: 14px; }
  .slider { margin: 0 -14px; border-radius: 0; }
  .slide figcaption { font-size: 13px; bottom: 52px; left: 10px; }
  .card { padding: 14px 14px 16px; border-width: 2px; }
  .section-title { font-size: 19px; }
  .news-frame { height: 340px; }
  .related { grid-template-columns: 1fr; gap: 14px; }
  .consult { padding: 16px 12px 18px; }
  .consult-actions { flex-direction: column; }
  .btn { width: 100%; }
}

/* 動きを減らす設定の方へ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}

/* =========================================================
   1ページ構成用（各セクション）
   ========================================================= */
html { scroll-padding-top: 16px; }
.section { display: grid; gap: 20px; padding-top: 28px; border-top: 1px dashed #ecd9bf; }
.home { display: grid; gap: 32px; }
.section > p, .block > p { margin: 0; }

/* サイドメニューを画面に追従させる（PC） */
@media (min-width: 701px) {
  .sidebar {
    position: sticky; top: 16px; align-self: start;
    max-height: calc(100vh - 32px); overflow-y: auto;
    scrollbar-width: thin;
  }
}

/* 見出し画像 */
.title-img { margin: 0; line-height: 0; }
.title-img img { display: block; width: 100%; max-width: 580px; margin: 0 auto; }

/* 小見出し（旧・見出し画像をテキスト化） */
.subhead {
  margin: 0 0 10px;
  padding: 4px 12px;
  border-left: 6px solid #8aa4c8;
  background: linear-gradient(90deg, #f3f0ea, #fff);
  font-size: 18px; font-weight: 700;
  color: #4a3a33;
}
.subhead--pink   { border-left-color: #d58ca3; }
.subhead--purple { border-left-color: #b79ac9; }
.subhead--green  { border-left-color: #a7bf7a; }

.block { display: grid; gap: 12px; }
.block p { margin: 0; }
.wide-img { display: block; width: 100%; border-radius: 8px; }

/* 画像＋文章の横並び */
.media { display: flex; gap: 20px; align-items: flex-start; }
.media-img { flex: none; max-width: 42%; border-radius: 8px; }
.media-img--half { max-width: 48%; }
.media-body { display: grid; gap: 10px; min-width: 0; }
.media-body p { margin: 0; }

.place {
  font-family: var(--font-round); font-weight: 700;
  color: #6b4a2e;
  background: linear-gradient(transparent 62%, #fbe3b8 62%);
  padding: 0 2px;
}

/* 事業内容 */
.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.service { background: #fffaf3; border: 1px solid #f0dfc8; border-radius: 10px; padding: 14px 16px 16px; }
.service p { margin: 0 0 8px; }
.service .subhead { font-size: 16px; }
.service-cap { font-family: var(--font-round); font-weight: 700; color: #aa5a62; font-size: 18px; }
.service-cap strong { font-size: 28px; }
.service-cap span { font-size: 14px; }
.em { color: #aa5a62; }

/* Q&A */
.qa-list { margin: 0; display: grid; gap: 14px; }
.qa-item { border-bottom: 1px dashed #d8e0bd; padding-bottom: 14px; }
.qa-list dt, .qa-list dd { display: flex; gap: 12px; align-items: flex-start; margin: 0; }
.qa-list dt {
  background: #e4eace; border-radius: 8px; padding: 8px 12px;
  font-weight: 700;
}
.qa-list dt img, .qa-list dd img { flex: none; width: 32px; height: 32px; border-radius: 4px; }
.qa-list dt img { margin-top: -1px; }
.qa-list dd { padding: 10px 12px 0; }
.qa-list dd p { margin: 0 0 6px; }
.num-list { margin: 0; padding-left: 1.6em; }

/* 第三者委員会（画像ポスター） */
.poster { position: relative; max-width: 580px; margin: 0 auto; width: 100%; }
.poster img { display: block; width: 100%; }
.poster-over { position: absolute; inset: 0; height: 100%; }
.readtext { border: 2px solid var(--frame); border-radius: 10px; background: #fffaf3; }
.readtext summary {
  cursor: pointer; padding: 10px 16px;
  font-family: var(--font-round); font-weight: 700; color: #ad6229;
}
.readtext-body { padding: 0 18px 16px; font-size: 15px; }
.readtext-body h3 { font-size: 16px; margin: 16px 0 6px; color: #aa5a62; }
.readtext-body p { margin: 0 0 6px; }
.plain { margin: 0; padding-left: 1.2em; }
.plain li { margin-bottom: 4px; }
.note { font-size: 14px; color: var(--text-sub); }

/* アクセス */
.address-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.map-link {
  display: inline-block; padding: 4px 14px;
  border: 2px solid #c8783c; border-radius: 999px;
  color: #ad6229; text-decoration: none; font-weight: 700; font-size: 14px;
}
.map-link:hover { background: #fff8ef; }

/* 会社概要の表 */
.info-table { width: 100%; border-collapse: separate; border-spacing: 0 3px; font-size: 15px; }
.info-table th, .info-table td { padding: 8px 14px; text-align: left; vertical-align: top; }
.info-table th { width: 8.5em; font-weight: 700; white-space: nowrap; border-radius: 6px 0 0 6px; }
.info-table td { border-radius: 0 6px 6px 0; }
.info-table--pink th { background: #e6cccc; }
.info-table--pink td { background: #fae7d8; }
.info-table--green th { background: #c8d2aa; }
.info-table--green td { background: #e4eace; }

/* 埋め込み（常盤台便り・フォーム） */
.auto-frame { display: block; width: 100%; border: 0; }
.dayori-frame { height: 1070px; }
.contact-frame { height: 820px; }
.section-title--big { font-size: 26px; }

/* ページ先頭へ */
.to-top {
  position: fixed; right: 16px; bottom: 16px; z-index: 30;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%;
  background: #c8783c; color: #fff; text-decoration: none;
  font-size: 14px; line-height: 1.1;
  box-shadow: 0 3px 10px rgba(0,0,0,.2);
  opacity: 0; pointer-events: none; transition: opacity .3s;
}
.to-top span { font-size: 11px; font-family: var(--font-round); font-weight: 700; }
.to-top.is-shown { opacity: 1; pointer-events: auto; }
.to-top:hover { color: #fff; background: #ad6229; }

@media (max-width: 700px) {
  .section { padding-top: 22px; gap: 16px; }
  .subhead { font-size: 16px; }
  .media { flex-direction: column; }
  .media-img, .media-img--half { max-width: 100%; align-self: center; }
  .service-grid { grid-template-columns: 1fr; }
  .info-table th { width: 6.5em; padding: 8px 10px; white-space: normal; }
  .info-table td { padding: 8px 10px; }
  .qa-list dd { padding: 8px 4px 0; }
}

/* 採用情報ページ */
.section--first { border-top: 0; padding-top: 0; }
.flyer { display: grid; gap: 16px; justify-items: center; }
.flyer img { width: 100%; max-width: 560px; border-radius: 6px; box-shadow: 0 2px 10px rgba(120, 80, 40, .12); }
.consult-lead { margin: 0; font-family: var(--font-round); font-weight: 700; color: #6b4a2e; }

/* 採用情報ページ */
.section--first { border-top: 0; padding-top: 0; }
.flyer { display: grid; gap: 16px; justify-items: center; }
.flyer img { width: 100%; max-width: 560px; border-radius: 6px; box-shadow: 0 2px 10px rgba(120, 80, 40, .12); }
.consult-lead { margin: 0; font-family: var(--font-round); font-weight: 700; color: #6b4a2e; }
.contact-intro { display: flex; align-items: center; gap: 16px; }
.contact-intro img { flex: none; width: 120px; border-radius: 8px; }
.contact-intro p { margin: 0; }
@media (max-width: 700px) { .contact-intro img { width: 88px; } }

/* =========================================================
   メニューごとの切り替え表示（JavaScript有効時）
   ========================================================= */
.has-views .view[hidden] { display: none; }
.has-views .section { border-top: 0; padding-top: 0; }
.has-views .view.is-current { animation: view-in .35s ease; }
@keyframes view-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ページの長さが変わってもスクロールバーの分の幅を常に確保し、
   切り替え時にレイアウトが横にずれないようにする */
html { scrollbar-gutter: stable; }
@supports not (scrollbar-gutter: stable) {
  html { overflow-y: scroll; }
}

/* =========================================================
   採用情報：画像の拡大表示
   ========================================================= */
.flyer-hint { margin: 0; text-align: center; font-size: 14px; color: var(--text-sub); }
.zoom { position: relative; display: block; width: 100%; max-width: 560px; border-radius: 6px; cursor: zoom-in; }
.zoom img { display: block; width: 100%; border-radius: 6px; box-shadow: 0 2px 10px rgba(120, 80, 40, .12); transition: box-shadow .2s; }
.zoom:hover img { box-shadow: 0 4px 18px rgba(120, 80, 40, .25); }
.zoom-badge {
  position: absolute; right: 10px; bottom: 10px;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 12px 4px 10px; border-radius: 999px;
  background: rgba(61, 50, 48, .78); color: #fff;
  font: 700 13px/1.4 var(--font-round);
  pointer-events: none;
}
.zoom-badge::before {
  content: ""; width: 12px; height: 12px; flex: none;
  border: 2px solid #fff; border-radius: 50%;
  box-shadow: 4px 4px 0 -2.5px #fff; /* 虫めがねの柄 */
}

.viewer {
  position: fixed; inset: 0; z-index: 100;
  display: flex; flex-direction: column;
  background: rgba(35, 27, 24, .94);
  color: #fff;
}
.viewer[hidden] { display: none; }
.viewer-bar {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 12px;
  font: 700 15px/1 var(--font-round);
}
.viewer-bar .viewer-tools { display: flex; gap: 8px; }
.viewer button {
  min-height: 44px; padding: 0 16px;
  border: 0; border-radius: 999px;
  background: rgba(255, 255, 255, .16); color: #fff;
  font: 700 15px/1 var(--font-round); cursor: pointer;
}
.viewer button:hover { background: rgba(255, 255, 255, .28); }
.viewer button:disabled { opacity: .35; cursor: default; }
.viewer-close { background: #c8783c !important; }
.viewer-stage {
  flex: 1; min-height: 0;
  overflow: auto; -webkit-overflow-scrolling: touch;
  display: flex; justify-content: center; align-items: flex-start;
  padding: 0 12px 12px;
  touch-action: pan-x pan-y pinch-zoom;
}
.viewer-stage img {
  display: block; width: 100%; max-width: 900px; height: auto;
  background: #fff; border-radius: 4px;
  cursor: zoom-in;
}
.viewer.is-zoomed .viewer-stage img { max-width: none; width: 1800px; cursor: zoom-out; }
.viewer-nav { flex: none; display: flex; justify-content: center; gap: 12px; padding: 8px 12px 14px; }
.viewer-nav button { min-width: 120px; }
body.viewer-open { overflow: hidden; }

@media (max-width: 700px) {
  .viewer-bar { padding: 6px 8px; font-size: 14px; }
  .viewer button { padding: 0 12px; font-size: 14px; }
  .viewer-stage { padding: 0 4px 8px; }
  .viewer.is-zoomed .viewer-stage img { width: 1400px; }
  .viewer-nav button { min-width: 0; flex: 1; }
}

/* =========================================================
   採用情報：文字版の募集要項
   ========================================================= */
.jobs-summary, .jobs-detail { display: grid; gap: 14px; }
.jobs-lead, .jobs-intro p, .jobs-closing { margin: 0; }
.table-scroll { overflow-x: auto; }
.jobs-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px; }
.jobs-table th, .jobs-table td { padding: 9px 12px; text-align: left; border-bottom: 1px dashed #e3cfb4; vertical-align: top; }
.jobs-table thead th { background: #f6e6d0; font-size: 13px; color: #6b4a2e; border-bottom: 0; }
.jobs-table thead th:first-child { border-radius: 8px 0 0 8px; }
.jobs-table thead th:last-child { border-radius: 0 8px 8px 0; }
.jobs-table tbody th { font-weight: 700; white-space: nowrap; }
.jobs-table tbody th a { text-decoration: none; }
.jobs-table tbody th a:hover { text-decoration: underline; }
.jobs-table td strong { color: #aa5a62; font-size: 16px; }
.pay-unit { font-size: 13px; color: var(--text-sub); }

.jobs-intro { display: grid; gap: 8px; }
.system-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 6px; }
.system { border: 2px solid #e6b3b8; border-radius: 12px; padding: 10px 12px; background: #fffaf9; }
.system h4 { margin: 0 0 4px; font-family: var(--font-round); color: #c0505e; font-size: 15px; text-align: center; }
.system p { margin: 0; font-size: 14px; line-height: 1.7; }

.job-groups { display: grid; gap: 10px; }
.job-group { --c: #4f9fa5; --bg: #eef6f6; border: 2px solid var(--c); border-radius: 12px; background: #fff; overflow: hidden; scroll-margin-top: 16px; }
.job--teal  { --c: #4f9fa5; --bg: #eaf5f5; }
.job--pink  { --c: #d58ca3; --bg: #fbeff3; }
.job--green { --c: #6fa24a; --bg: #eef6e6; }
.job--brown { --c: #b98a5a; --bg: #f8efe4; }
.job--rose  { --c: #b9789e; --bg: #f7edf3; }
.job-group summary {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px;
  padding: 12px 44px 12px 16px; position: relative;
  background: var(--bg); cursor: pointer; list-style: none;
}
.job-group summary::-webkit-details-marker { display: none; }
.job-group summary::after {
  content: "＋"; position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px; border-radius: 50%; background: var(--c); color: #fff;
  display: grid; place-items: center; font-weight: 700; font-size: 15px; line-height: 1;
}
.job-group[open] summary::after { content: "－"; }
.job-name { font-family: var(--font-round); font-weight: 700; font-size: 18px; color: #4a3a33; }
.job-types { font-size: 13px; color: var(--text-sub); }
.job-body { display: grid; gap: 14px; padding: 14px 16px 16px; }
.job-body > p { margin: 0; }
.job-type { margin: 0 0 6px; padding-left: 10px; border-left: 5px solid var(--c); font-size: 16px; font-family: var(--font-round); }
.job-dl { margin: 0; display: grid; gap: 3px; font-size: 15px; }
.job-dl > div { display: grid; grid-template-columns: 8.5em minmax(0, 1fr); }
.job-dl dt { background: var(--bg); padding: 7px 10px; font-weight: 700; border-radius: 6px 0 0 6px; }
.job-dl dd { margin: 0; background: #fbf9f6; padding: 7px 12px; border-radius: 0 6px 6px 0; }
.job-dl dd strong { color: #aa5a62; font-size: 16px; }
.job-dl .note { font-size: 13px; }
.aid-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.aid { border: 1px solid #efc9d4; border-radius: 10px; padding: 10px 12px; background: #fffafb; }
.aid h4 { margin: 0 0 4px; font-family: var(--font-round); color: #b03c5a; font-size: 16px; }
.aid p { margin: 0; font-size: 14px; }
.aid-time { margin-top: 6px !important; font-weight: 700; color: #6b4a2e; }

.benefits { background: #eef1ea; border-radius: 12px; padding: 12px 16px; }
.benefits h3 { margin: 0 0 6px; font-size: 16px; color: #56704a; }
.benefits ul { margin: 0; padding-left: 1.3em; font-size: 15px; }
.jobs-closing { font-family: var(--font-round); font-weight: 700; color: #6b3a35; text-align: center; }
.apply-box { border: 2px solid var(--frame); border-radius: 12px; padding: 12px 16px; background: #fffaf3; }
.apply-box h3 { margin: 0 0 4px; font-size: 16px; color: #c8783c; }
.apply-box p { margin: 0 0 6px; font-size: 14px; }

@media (max-width: 700px) {
  .system-grid, .aid-grid { grid-template-columns: 1fr; }
  .job-dl > div { grid-template-columns: 1fr; }
  .job-dl dt { border-radius: 6px 6px 0 0; padding: 5px 10px; }
  .job-dl dd { border-radius: 0 0 6px 6px; }
  .jobs-table { font-size: 14px; }
  .jobs-table thead { display: none; }
  .jobs-table tr { display: grid; grid-template-columns: auto 1fr; gap: 0 10px; padding: 8px 2px; border-bottom: 1px dashed #e3cfb4; }
  .jobs-table th, .jobs-table td { padding: 0; border: 0; }
  .jobs-table tbody th { grid-column: 1 / -1; }
  .jobs-table td:last-child { text-align: right; }
}
.jobs-table td:last-child { white-space: nowrap; }

/* =========================================================
   採用情報（文字中心レイアウト・2026-10）
   ========================================================= */
.recruit { gap: 32px; }
.recruit-hero { display: grid; gap: 16px; }
.recruit-banner { display: block; width: 100%; border-radius: 10px; }
.recruit-pitch { display: grid; gap: 14px; }
.recruit-photo { display: block; width: 100%; border-radius: 14px; }
.recruit-pitch-text { display: grid; gap: 6px; text-align: center; }
.recruit-pitch-text p { margin: 0; }
.system h3 { margin: 0 0 4px; font-family: var(--font-round); color: #c0505e; font-size: 15px; text-align: center; }

.careaid-lead { display: flex; gap: 16px; align-items: center; background: #fbeff3; border-radius: 12px; padding: 12px 14px; }
.careaid-lead img { flex: none; width: 110px; height: auto; }
.careaid-lead > div { display: grid; gap: 8px; }
.careaid-lead p { margin: 0; }

.aid { position: relative; padding-right: 96px; min-height: 150px; }
.aid-img { position: absolute; right: 8px; bottom: 8px; width: auto; height: 120px; max-width: 88px; object-fit: contain; object-position: bottom right; }
.aid-img[src*="linen"] { max-width: 120px; height: auto; width: 110px; }
.aid:has(.aid-img[src*="linen"]) { padding-right: 126px; }

.jobs-closing { display: grid; justify-items: center; gap: 8px; }
.jobs-closing p { margin: 0; font-family: var(--font-round); font-weight: 700; color: #6b3a35; text-align: center; }
.jobs-closing img { width: 180px; height: auto; }

.flyers { display: grid; gap: 12px; }
.flyers > p { margin: 0; font-size: 15px; }
.flyer-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.flyer-thumb { max-width: none; }
.flyer-thumb img { box-shadow: 0 1px 6px rgba(120, 80, 40, .18); }
.flyer-cap { display: block; margin-top: 6px; font-size: 12px; line-height: 1.5; color: var(--text-sub); text-align: center; }

@media (max-width: 700px) {
  .recruit { gap: 26px; }
  .recruit-pitch-text { text-align: left; }
  .careaid-lead { flex-direction: column; text-align: left; }
  .careaid-lead img { width: 90px; }
  .flyer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}