/*
 * ======================================
 * site.css — ふぁみりーあっぷ サイト固有CSS
 * ======================================
 * main.css（共通SCSS）で再現できないデザイン差分のみ追加。
 * 値は claude-design-output/ の完成デザインから実数抽出。
 *
 * 追加クラス一覧（共通SCSS取り込み検討用）は本ファイル末尾に記載。
 */

/* ===== 基本トーン ===== */
body {
  font-weight: 500;
  padding-top: 112px; /* 固定ヘッダー分 */
}
@media (max-width: 1100px) {
  body { padding-top: 64px; }
}
main { display: block; }

.fu-en { font-family: "Fredoka", sans-serif; }

/* リード文・本文の共通色 */
.fu-lead { font-size: 16px; line-height: 2; color: #5a544c; }
.fu-note { font-size: 12.5px; color: #9a9488; }

/* ==========================================================================
 * ヘッダー（固定・ロゴ + アイコン付きナビ + 波線ボーダー）
 * ========================================================================== */
.fu-header.header-bar {
  box-shadow: 0 4px 18px rgba(0, 0, 0, .05);
}
.fu-header .header__inner {
  max-width: 1400px;
  width: 95%;
  padding: 0 16px;
  height: 112px;
  gap: 24px;
}
.fu-header .header__logo { display: flex; align-items: center; }
.fu-header .header__logo img { height: 74px; width: auto; }

.fu-header .header__nav {
  align-items: flex-end;
  gap: 6px;
  margin: 0;
}
.fu-header .header__nav-item a {
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 12px;
  border-bottom: 3px solid transparent;
  margin-bottom: -3px;
}
/* 既定の下線アニメーションは使わない（border-bottom で現在ページ表示） */
.fu-header .header__nav-item a::after { display: none; }
.fu-header .header__nav-item a:hover { opacity: .72; }

.fu-header .fu-nav-icon,
.fu-header .fu-nav-icon svg {
  display: block;
  width: 26px;
  height: 26px;
}
.fu-header .header__nav-ja {
  font-size: 14px;
  font-weight: 600;
  color: #2f2a26;
  margin-top: 0;
  line-height: 1.2;
}
.fu-header .header__nav-en {
  font-family: "Fredoka", sans-serif;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .14em;
  color: #a39c90;
  line-height: 1;
}
/* 現在ページ */
.fu-header .header__nav-item--current a { border-bottom-color: #009d92; }
.fu-header .header__nav-item--current .header__nav-ja,
.fu-header .header__nav-item--current .header__nav-en { color: #009d92; }

/* 波線ボーダー（ヘッダー下端） */
.fu-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='30'%20height='12'%20viewBox='0%200%2030%2012'%3E%3Cpath%20d='M0%206%20Q7.5%200%2015%206%20T30%206'%20fill='none'%20stroke='%23009d92'%20stroke-width='3'/%3E%3C/svg%3E") repeat-x;
  background-size: auto 12px;
  pointer-events: none;
}
@media (max-width: 1100px) {
  .fu-header .header__inner { height: 64px; }
  .fu-header .header__logo img { height: 44px; }
}

/* ==========================================================================
 * ボタン（pill + ハードシャドウ 3D）
 * ========================================================================== */
.fu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: inherit;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.4;
  padding: 16px 30px;
  border: none;
  border-radius: 999px;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background-color .2s ease, color .2s ease;
}
.fu-btn:hover { opacity: 1; }
.fu-btn .fu-arrow { flex: none; }

.fu-btn--teal   { background: #009d92; color: #fff; box-shadow: 0 5px 0 #00776e; }
.fu-btn--teal:hover   { transform: translateY(2px); box-shadow: 0 3px 0 #00776e; }
.fu-btn--orange { background: #ffa632; color: #fff; box-shadow: 0 5px 0 #e08a1e; }
.fu-btn--orange:hover { transform: translateY(2px); box-shadow: 0 3px 0 #e08a1e; }
.fu-btn--yellow { background: #F2C443; color: #5a4a00; box-shadow: 0 5px 0 #d0a520; padding: 18px 34px; font-size: 17px; }
.fu-btn--yellow:hover { transform: translateY(2px); box-shadow: 0 3px 0 #d0a520; }
.fu-btn--white  { background: #fff; color: #c47c00; box-shadow: 0 6px 0 rgba(0,0,0,.12); padding: 17px 32px; }
.fu-btn--white:hover  { transform: translateY(2px); box-shadow: 0 4px 0 rgba(0,0,0,.12); }

.fu-btn--outline {
  background: #fff;
  color: #009d92;
  border: 2px solid #009d92;
  box-shadow: none;
  font-size: 15px;
  padding: 12px 26px;
}
.fu-btn--outline:hover { background: #e9f6f5; transform: none; }

.fu-btn--sm { font-size: 15px; padding: 14px 30px; }

/* ==========================================================================
 * ページトップボタン（common.js 連動）
 * ========================================================================== */
.page-top {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: #009d92;
  cursor: pointer;
  z-index: 90;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .3s ease, transform .3s ease, background-color .2s ease;
  box-shadow: 0 4px 0 #00776e;
}
.page-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.page-top:hover { background: #00867c; }
.page-top__arrow {
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2.5px solid #fff;
  border-right: 2.5px solid #fff;
  transform: rotate(-45deg);
  margin: 3px auto 0;
}
@media (max-width: 640px) {
  .page-top { right: 14px; bottom: 74px; width: 42px; height: 42px; }
}

/* ==========================================================================
 * セクション共通：見出し・波・レイアウト
 * ========================================================================== */
.fu-container { max-width: 1200px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.fu-container--1100 { max-width: 1100px; }
.fu-container--1080 { max-width: 1080px; }
.fu-container--1040 { max-width: 1040px; }
.fu-container--1000 { max-width: 1000px; }
.fu-container--900  { max-width: 900px; }
.fu-container--820  { max-width: 820px; }

.fu-sec { padding-top: 90px; padding-bottom: 90px; }
.fu-sec--tint { background: #f2faf9; position: relative; }
.fu-sec--tint2 { background: #fff7ec; position: relative; }
@media (max-width: 640px) { .fu-sec { padding-top: 56px; padding-bottom: 56px; } }

/* 中央見出し（EN Fredoka + JP + リード） */
.fu-sec-head { text-align: center; margin-bottom: 44px; }
.fu-sec-head__en {
  font-family: "Fredoka", sans-serif;
  font-size: 40px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.1;
  margin: 0 0 8px;
  color: #009d92;
}
.fu-sec-head__en--red       { color: #ec4434; }
.fu-sec-head__en--teal      { color: #009d92; }
.fu-sec-head__en--orange    { color: #ffa632; }
.fu-sec-head__en--orange2   { color: #e6852e; }
.fu-sec-head__en--gold      { color: #b8901a; }
.fu-sec-head__en--turquoise { color: #4CC7C5; }
.fu-sec-head__en--white     { color: #fff; }
.fu-sec-head__ja { font-size: 24px; font-weight: 600; margin: 0; color: #2f2a26; line-height: 1.5; }
.fu-sec-head__lead { font-size: 16px; line-height: 2; color: #5a544c; margin: 22px auto 0; max-width: 720px; }
.fu-sec-head__lead--tight { margin-top: 14px; }
@media (max-width: 640px) {
  .fu-sec-head__en { font-size: 30px; }
  .fu-sec-head__ja { font-size: 20px; }
}

/* 波型ディバイダー（inline SVG の高さ制御） */
.fu-wave { display: block; width: 100%; height: 52px; position: relative; z-index: 2; }
.fu-wave--66 { height: 66px; }
@media (max-width: 640px) { .fu-wave { height: 30px; } .fu-wave--66 { height: 40px; } }

/* ==========================================================================
 * ページヒーロー（左テキスト + 右画像 + 淡色帯）
 * ========================================================================== */
.fu-phero { position: relative; overflow: hidden; padding: 44px 0; }
.fu-phero__band {
  position: absolute;
  left: 0; right: 0; top: 50%;
  transform: translateY(-50%);
  height: 180px;
  background: #eef8f6;
}
.fu-phero__band--teal   { background: #eef8f6; }
.fu-phero__band--orange { background: #fff7ec; }
.fu-phero__band--red    { background: #fdeeec; }
.fu-phero__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  position: relative;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 48px;
  align-items: center;
}
.fu-phero__en {
  font-family: "Fredoka", sans-serif;
  font-size: 40px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.1;
  margin: 0 0 6px;
  color: #009d92;
}
.fu-phero__en--teal    { color: #009d92; }
.fu-phero__en--red     { color: #ec4434; }
.fu-phero__en--orange2 { color: #e6852e; }
.fu-phero__ttl { font-size: 28px; font-weight: 600; color: #2f2a26; margin: 0; }
.fu-phero__crumb { font-size: 13px; color: #5a544c; margin: 18px 0 0; }
.fu-phero__crumb a { color: #5a544c; }
.fu-phero__img { position: relative; height: 320px; }
.fu-phero__img img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 24px; }
@media (max-width: 900px) {
  .fu-phero__inner { grid-template-columns: 1fr; gap: 24px; }
  .fu-phero__band { display: none; }
  .fu-phero__img { height: 220px; }
  .fu-phero__en { font-size: 32px; }
}

/* ==========================================================================
 * 概要テーブル（白カード + ラベル/値の行）
 * ========================================================================== */
.fu-dl {
  background: #fff;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .05);
}
.fu-dl__row {
  display: grid;
  grid-template-columns: 200px 1fr;
  border-bottom: 1px solid #eef2ee;
}
.fu-dl__row:last-child { border-bottom: none; }
.fu-dl__key {
  background: #f7fbfa;
  padding: 20px 26px;
  font-weight: 600;
  color: #009d92;
  font-size: 15px;
}
.fu-dl__val {
  padding: 20px 26px;
  font-size: 16px;
  line-height: 1.85;
  color: #3f3a34;
}
/* オレンジ系ラベル（募集要項） */
.fu-dl--orange .fu-dl__key { background: #fff7ec; color: #ec4434; }
@media (max-width: 640px) {
  .fu-dl__row { grid-template-columns: 110px 1fr; }
  .fu-dl__key { padding: 16px; font-size: 13px; }
  .fu-dl__val { padding: 16px; font-size: 14px; }
}

/* ==========================================================================
 * お問い合わせ CTA 帯（contact-cta.php）
 * ========================================================================== */
.fu-cta { background: #009d92; position: relative; overflow: hidden; }
.fu-cta::before,
.fu-cta::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.fu-cta::before { top: -40px; right: 60px; width: 160px; height: 160px; background: rgba(255,255,255,.08); }
.fu-cta::after  { bottom: -60px; left: 40px; width: 200px; height: 200px; background: rgba(242,196,67,.14); }
.fu-cta__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 52px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  position: relative;
  z-index: 1;
}
.fu-cta__label {
  font-family: "Fredoka", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .16em;
  color: #F2C443;
  margin: 0 0 6px;
}
.fu-cta__title { font-size: 26px; font-weight: 600; color: #fff; margin: 0; line-height: 1.4; }
.fu-cta__text { font-size: 14px; color: rgba(255,255,255,.85); margin: 10px 0 0; }
.fu-cta__btn { flex: none; }
@media (max-width: 768px) {
  .fu-cta__inner { flex-direction: column; align-items: flex-start; gap: 22px; padding: 40px 24px; }
  .fu-cta__title { font-size: 21px; }
}

/* ==========================================================================
 * フッター（事業所マップカード + 濃色ボトム）
 * ========================================================================== */
.fu-footer__maps { background: #fffdf7; padding: 56px 24px 40px; }
.fu-footer__maps-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.fu-office {
  background: #fff;
  border: 1px solid #eee4cf;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
}
.fu-office iframe { border: 0; display: block; width: 100%; height: 260px; }
.fu-office__body { padding: 22px 24px; }
.fu-office__name { font-size: 16px; font-weight: 600; color: #009d92; margin: 0 0 10px; }
.fu-office__addr { font-size: 16px; line-height: 1.7; color: #4a453f; margin: 0 0 12px; }
.fu-office__tels { display: flex; gap: 24px; font-size: 14px; color: #2f2a26; }
.fu-office__tels b { font-family: "Fredoka", sans-serif; color: #009d92; font-weight: 600; }

.fu-footer__bottom { background: #2f2a26; color: #fff; padding: 40px 24px 28px; }
.fu-footer__bottom-inner { max-width: 1200px; margin: 0 auto; }
.fu-footer__cols { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; flex-wrap: wrap; }
.fu-footer__brand { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.fu-footer__logo { display: inline-block; background: #fffdf7; padding: 10px 16px; border-radius: 14px; line-height: 0; }
.fu-footer__logo img { display: block; height: 44px; width: auto; }
.fu-dots { display: flex; gap: 4px; }
.fu-dots span { width: 11px; height: 11px; border-radius: 50%; }
.fu-dots__r { background: #ec4434; }
.fu-dots__g { background: #009d92; }
.fu-dots__y { background: #F2C443; }
.fu-footer__name { font-size: 19px; font-weight: 600; color: #fff; }
.fu-footer__desc { font-size: 13px; color: rgba(255,255,255,.7); margin: 0; line-height: 1.7; }
.fu-footer__nav { display: flex; flex-direction: column; gap: 10px; }
.fu-footer__nav a { color: rgba(255,255,255,.85); font-size: 13.5px; }
.fu-footer__nav a:hover { color: #fff; }
.fu-footer__copy {
  font-family: "Fredoka", sans-serif;
  font-size: 12px;
  color: rgba(255,255,255,.5);
  margin: 28px 0 0;
  text-align: center;
  border-top: 1px solid rgba(255,255,255,.12);
  padding-top: 20px;
}
@media (max-width: 768px) {
  .fu-footer__maps-inner { grid-template-columns: 1fr; }
  .fu-footer__cols { flex-direction: column; gap: 24px; }
}

/* ==========================================================================
 * セクション背景オーバーレイ（パターン画像）
 * ========================================================================== */
.fu-sec__pattern {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .12;
  pointer-events: none;
  z-index: 0;
}
.fu-sec__inner { position: relative; z-index: 1; }

/* ==========================================================================
 * 3つの柱（TOP：写真 + あしらい）
 * ========================================================================== */
.fu-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.fu-pillar__media { position: relative; width: 100%; height: 260px; }
.fu-pillar__deco { position: absolute; width: 150px; height: auto; pointer-events: none; }
.fu-pillar__deco--tl { top: -30px; left: -30px; }
.fu-pillar__deco--bl { bottom: -30px; left: -30px; }
.fu-pillar__deco--tr { top: -30px; right: -30px; }
.fu-pillar__photo { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 22px; }
.fu-pillar__body { padding: 24px 0 34px; }
.fu-pillar__en { font-family: "Fredoka", sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .12em; margin: 0; text-align: center; }
.fu-pillar__name { font-size: 21px; font-weight: 600; margin: 6px 0 10px; text-align: center; }
.fu-pillar__desc { font-size: 16px; line-height: 1.9; color: #5a544c; margin: 0; }
.fu-c-red { color: #ec4434; }
.fu-c-teal { color: #009d92; }
.fu-c-gold { color: #b8901a; }
.fu-c-yellow { color: #F2C443; }
@media (max-width: 900px) { .fu-pillars { grid-template-columns: 1fr; gap: 40px; } }

/* ==========================================================================
 * A型 / B型 カード（TOP SERVICE）
 * ========================================================================== */
.fu-abcards { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.fu-abcard { background: #fff; border-radius: 26px; overflow: hidden; box-shadow: 0 12px 30px rgba(0,0,0,.05); }
.fu-abcard__head { padding: 24px 30px; display: flex; align-items: center; gap: 14px; }
.fu-abcard__head--a { background: #009d92; }
.fu-abcard__head--b { background: #ffa632; }
.fu-abcard__badge { position: relative; font-family: "Fredoka", sans-serif; font-size: 30px; font-weight: 600; color: #fff; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; flex: none; }
.fu-abcard__badge img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: brightness(0) invert(1); opacity: .22; }
.fu-abcard__badge span { position: relative; }
.fu-abcard__ttl { margin: 0; color: #fff; font-size: 22px; font-weight: 600; }
.fu-abcard__sub { margin: 2px 0 0; color: rgba(255,255,255,.88); font-size: 13px; }
.fu-abcard__body { padding: 26px 30px; }
.fu-abcard__body p { font-size: 16px; line-height: 1.95; color: #5a544c; margin: 0; }
@media (max-width: 768px) { .fu-abcards { grid-template-columns: 1fr; } }

/* ==========================================================================
 * ご利用の流れ（フロー）
 * ========================================================================== */
.fu-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; position: relative; }
.fu-flow__line { position: absolute; top: 3px; left: calc(16.66% - 19px); right: calc(16.66% - 19px); height: 3px; background: #f2c443; z-index: 0; }
.fu-flow__step { border-radius: 22px; padding: 30px 26px; text-align: center; position: relative; }
.fu-flow__no { position: absolute; top: -23px; left: 50%; transform: translateX(-50%); z-index: 1; font-family: "Fredoka", sans-serif; font-weight: 600; font-size: 17px; color: #fff; width: 52px; height: 52px; background: url("https://ros-cdn.s3.ap-northeast-1.amazonaws.com/hp/img/ros_keiyaku/28250/flow_no_bg.png") center/contain no-repeat; display: flex; align-items: center; justify-content: center; }
.fu-flow__ttl { font-size: 18px; font-weight: 600; margin: 14px 0 8px; }
.fu-flow__desc { font-size: 16px; line-height: 1.85; color: #5a544c; margin: 0; }
@media (max-width: 900px) {
  .fu-flow { grid-template-columns: 1fr; gap: 40px; }
  .fu-flow__line { display: none; }
}

/* ==========================================================================
 * スタッフ募集バナー（TOP）
 * ========================================================================== */
.fu-rec { max-width: 1040px; margin: 0 auto 90px; padding: 44px 24px; }
.fu-rec__box { border-radius: 28px; background: linear-gradient(120deg, #F2C443, #ffa632); position: relative; }
.fu-rec__circle { position: absolute; top: 24px; left: 60px; width: 150px; height: 150px; border-radius: 50%; background: rgba(255,255,255,.18); }
.fu-rec__grid { display: grid; grid-template-columns: 1.35fr 0.65fr; align-items: stretch; position: relative; }
.fu-rec__text { padding: 48px 64px; }
.fu-rec__en { font-family: "Fredoka", sans-serif; font-size: 40px; font-weight: 600; letter-spacing: .02em; line-height: 1.1; color: #fff; margin: 0 0 6px; }
.fu-rec__ttl { font-size: 24px; font-weight: 600; color: #fff; margin: 0; line-height: 1.4; }
.fu-rec__desc { font-size: 16px; color: #fff; margin: 12px 0 0; }
.fu-rec__btn { margin-top: 26px; }
.fu-rec__media { position: relative; align-self: stretch; min-height: 220px; }
.fu-rec__media-inner { position: absolute; top: 50%; left: 12px; right: 44px; transform: translateY(-50%); height: calc(100% + 72px); }
.fu-rec__media-inner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 22px; }
@media (max-width: 768px) {
  .fu-rec__grid { grid-template-columns: 1fr; }
  .fu-rec__text { padding: 36px 28px; }
  .fu-rec__media { min-height: 200px; margin: 0 20px 24px; }
  .fu-rec__media-inner { position: relative; top: 0; left: 0; right: 0; transform: none; height: 200px; }
}

/* ==========================================================================
 * ABOUT ページ
 * ========================================================================== */
.fu-about-ttl { font-size: 24px; font-weight: 600; margin: 0 0 26px; line-height: 1.5; }
.fu-about-body { line-height: 2.1; max-width: none; margin: 0; }
.fu-left-head { text-align: left; }
.fu-mb-32 { margin-bottom: 32px; }

/* 3つの柱：アイコンカード */
.fu-pcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.fu-pcard { background: #fff; border-radius: 24px; padding: 32px 26px; box-shadow: 0 10px 26px rgba(0,0,0,.05); border-top: 6px solid #009d92; text-align: center; }
.fu-pcard--red    { border-top-color: #ec4434; }
.fu-pcard--teal   { border-top-color: #009d92; }
.fu-pcard--yellow { border-top-color: #F2C443; }
.fu-pcard img { width: 140px; height: auto; display: block; margin: 0 auto 14px; }
.fu-pcard__name { font-size: 20px; font-weight: 600; margin: 0 0 8px; }
.fu-pcard__desc { font-size: 16px; line-height: 1.9; color: #5a544c; margin: 0; }

/* スコア表カード */
.fu-score { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.fu-score__item { display: flex; align-items: center; gap: 18px; background: #fff; border: 2px solid #f0e7d2; border-radius: 18px; padding: 24px 28px; text-decoration: none; box-shadow: 0 6px 16px rgba(0,0,0,.04); transition: transform .2s ease, box-shadow .2s ease; }
.fu-score__item:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(0,0,0,.08); opacity: 1; }
.fu-score__ico { flex: none; width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; }
.fu-score__ico svg { width: 26px; height: 26px; }
.fu-score__ico--red { background: #ec4434; }
.fu-score__ico--teal { background: #009d92; }
.fu-score__name { display: block; font-size: 16px; font-weight: 600; color: #2f2a26; }
.fu-score__file { display: block; font-size: 12.5px; color: #8a8478; font-family: "Fredoka", sans-serif; }

@media (max-width: 768px) {
  .fu-pcards { grid-template-columns: 1fr; }
  .fu-score { grid-template-columns: 1fr; }
}

/* ==========================================================================
 * SERVICE ページ
 * ========================================================================== */
/* A/B 比較表 */
.fu-compare { display: grid; grid-template-columns: 1fr 1fr; border-radius: 22px; overflow: hidden; box-shadow: 0 12px 30px rgba(0,0,0,.06); }
.fu-compare__h { padding: 26px; text-align: center; color: #fff; }
.fu-compare__h--a { background: #009d92; }
.fu-compare__h--b { background: #ffa632; }
.fu-compare__h span { font-family: "Fredoka", sans-serif; font-size: 34px; font-weight: 600; }
.fu-compare__h p { font-size: 20px; font-weight: 600; margin: 4px 0 0; }
.fu-compare__cell { background: #fff; padding: 24px 28px; }
.fu-compare__cell--br { border-right: 1px solid #eef2ee; }
.fu-compare__cell--bb { border-bottom: 1px solid #eef2ee; }
.fu-compare__label { font-size: 12px; font-weight: 600; margin: 0 0 6px; letter-spacing: .08em; }
.fu-compare__label--a { color: #009d92; }
.fu-compare__label--b { color: #ffa632; }
.fu-compare__txt { font-size: 16px; line-height: 1.8; color: #3f3a34; margin: 0; }
.fu-compare__txt small { font-size: 12.5px; color: #8a8478; }

/* A/B 作業見出し */
.fu-worktop { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.fu-worktop__badge { font-family: "Fredoka", sans-serif; font-size: 24px; font-weight: 600; color: #fff; width: 54px; height: 54px; background-repeat: no-repeat; background-position: center; background-size: contain; display: flex; align-items: center; justify-content: center; flex: none; }
.fu-worktop__en { font-family: "Fredoka", sans-serif; font-size: 12px; letter-spacing: .16em; margin: 0; }
.fu-worktop__en--a { color: #009d92; }
.fu-worktop__en--b { color: #ffa632; }
.fu-worktop__ttl { font-size: 26px; font-weight: 600; margin: 2px 0 0; }
.fu-worktop__illust { margin-left: auto; width: 150px; height: auto; }

/* 作業カード（左ボーダー） */
.fu-wcards3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.fu-wcards4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.fu-wcard { background: #fff; border-radius: 20px; padding: 28px 26px; box-shadow: 0 8px 22px rgba(0,0,0,.05); border-left: 5px solid #009d92; }
.fu-wcards4 .fu-wcard { padding: 26px 22px; }
.fu-wcard--yellow    { border-left-color: #F2C443; }
.fu-wcard--teal      { border-left-color: #009d92; }
.fu-wcard--red       { border-left-color: #ec4434; }
.fu-wcard--turquoise { border-left-color: #4CC7C5; }
.fu-wcard__ttl { font-size: 17px; font-weight: 600; margin: 0 0 8px; }
.fu-wcards4 .fu-wcard__ttl { font-size: 16px; }
.fu-wcard__desc { font-size: 16px; line-height: 1.85; color: #5a544c; margin: 0; }
.fu-wcards4 .fu-wcard__desc { line-height: 1.8; }

/* 注記ボックス */
.fu-notebox { font-size: 16px; color: #5a544c; margin: 22px 0 0; border-radius: 14px; padding: 16px 22px; }
.fu-notebox--teal { background: #f2faf9; }
.fu-notebox--orange { background: #fff7ec; }
.fu-notebox b { color: #009d92; }
.fu-service-flow { margin-top: 56px; }

@media (max-width: 900px) {
  .fu-wcards3 { grid-template-columns: 1fr; }
  .fu-wcards4 { grid-template-columns: 1fr 1fr; }
  .fu-worktop__illust { width: 96px; }
}
@media (max-width: 640px) {
  .fu-compare { grid-template-columns: 1fr 1fr; }
  .fu-wcards4 { grid-template-columns: 1fr; }
}

/* ==========================================================================
 * RECRUIT ページ
 * ========================================================================== */
.fu-rintro { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.fu-rintro__ttl { font-size: 24px; font-weight: 600; margin: 0 0 20px; line-height: 1.5; }
.fu-phcard { aspect-ratio: 4/3; border-radius: 26px; background: linear-gradient(135deg, #ffa632, #F2C443); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #fff; box-shadow: 0 16px 36px rgba(255,166,50,.28); }
.fu-phcard svg { width: 52px; height: 52px; }
.fu-phcard span { font-size: 13px; font-weight: 600; opacity: .9; }

.fu-apply { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.fu-apply__item { background: #fff; border-radius: 22px; padding: 36px 30px; box-shadow: 0 10px 26px rgba(0,0,0,.05); }
.fu-apply__ico { width: 60px; height: 60px; border-radius: 18px; display: flex; align-items: center; justify-content: center; margin: 0 auto 18px; }
.fu-apply__ico svg { width: 30px; height: 30px; }
.fu-apply__ico--teal { background: #009d92; }
.fu-apply__ico--orange { background: #ffa632; }
.fu-apply__ttl { font-size: 19px; font-weight: 600; margin: 0 0 10px; }
.fu-apply__desc { font-size: 16px; line-height: 1.8; color: #5a544c; margin: 0 0 20px; }
.fu-apply__tel { font-family: "Fredoka", sans-serif; font-size: 15px; font-weight: 600; color: #2f2a26; margin: 0; line-height: 1.9; }
.fu-apply__tel b { font-size: 19px; }
@media (max-width: 768px) {
  .fu-rintro { grid-template-columns: 1fr; gap: 28px; }
  .fu-apply { grid-template-columns: 1fr; }
}

/* ==========================================================================
 * CONTACT ページ
 * ========================================================================== */
.fu-notice { background: #fff7ec; border: 2px solid #ffe0b5; border-radius: 18px; padding: 24px 28px; display: flex; gap: 16px; align-items: flex-start; }
.fu-notice__ico { flex: none; width: 40px; height: 40px; border-radius: 12px; background: #ffa632; display: flex; align-items: center; justify-content: center; }
.fu-notice__ico svg { width: 22px; height: 22px; }
.fu-notice__ttl { font-size: 16px; font-weight: 600; margin: 0 0 6px; color: #c47c00; }
.fu-notice__txt { font-size: 16px; line-height: 1.85; color: #5a544c; margin: 0; }

.fu-form { background: #fff; border-radius: 24px; padding: 44px 46px; box-shadow: 0 12px 30px rgba(0,0,0,.06); }
.fu-form__grid { display: flex; flex-direction: column; gap: 26px; }
.fu-form__row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.fu-field { display: block; }
.fu-label { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 600; margin-bottom: 10px; }
.fu-req { background: #ec4434; color: #fff; font-size: 11px; padding: 2px 8px; border-radius: 6px; font-weight: 600; }
.fu-input { width: 100%; box-sizing: border-box; padding: 14px 16px; border: 2px solid #e7ddc8; border-radius: 12px; font-size: 15px; background: #fffdf9; font-family: inherit; color: #2f2a26; }
textarea.fu-input { resize: vertical; }
.fu-input:focus { outline: none; border-color: #009d92; }
.fu-radios { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.fu-radio { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 500; padding: 12px 20px; border: 2px solid #e7ddc8; border-radius: 12px; cursor: pointer; background: #fffdf9; }
.fu-radio input { accent-color: #009d92; width: 16px; height: 16px; }
.fu-form__submit { text-align: center; margin-top: 8px; }
.fu-btn--submit { padding: 18px 56px; font-size: 17px; }

/* ===== CMS埋め込みフォーム（.form-contents）を静的フォームのデザインに合わせる ===== */
/* すべて .fu-form 配下にスコープし、後読みされる mail-form.css に特異度で勝つ */
.fu-form .form-contents { background: transparent; }
.fu-form .form-contents form dl { margin-bottom: 0; }

/* dt を左フロート→縦積み（ラベル上・入力下） */
.fu-form .form-contents form dl dt:not(.pattern-exclusion),
.fu-form .form-contents form dl dd:not(.pattern-exclusion) {
  float: none; width: auto; padding: 0; margin: 0; border-bottom: none; line-height: 1.5;
}
.fu-form .form-contents form dl dt:not(.pattern-exclusion) { margin-bottom: 10px; }
.fu-form .form-contents form dl dd:not(.pattern-exclusion) { margin-bottom: 26px; }
.fu-form .form-contents form dl dd:not(.pattern-exclusion):last-of-type { margin-bottom: 0; }

/* ラベル文字 */
.fu-form .form-contents form dl dt:not(.pattern-exclusion) span {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14.5px; font-weight: 600; color: #2f2a26;
}
/* 必須バッジを .fu-req 風（赤・角丸・ラベル文字の後ろ） */
.fu-form .form-contents.form-pattern-1 form dl dt:not(.pattern-exclusion) span::before {
  content: '必須'; order: 2;
  background: #ec4434; color: #fff;
  font-size: 11px; font-weight: 600;
  padding: 2px 8px; margin: 0; border-radius: 6px; top: 0;
}

/* 入力欄（input.textarea / textarea.textarea） */
.fu-form .form-contents.form-pattern-1 dd:not(.pattern-exclusion) .textarea,
.fu-form .form-contents form dl dd:not(.pattern-exclusion) input.textarea,
.fu-form .form-contents form dl dd:not(.pattern-exclusion) textarea.textarea {
  width: 100%; box-sizing: border-box;
  padding: 18px 16px; border: 2px solid #e7ddc8; border-radius: 12px;
  font-size: 15px; background: #fffdf9; font-family: inherit; color: #2f2a26;
}
.fu-form .form-contents form dl dd:not(.pattern-exclusion) textarea.textarea { resize: vertical; }
.fu-form .form-contents .textarea:focus { outline: none; border-color: #009d92; }

/* ラジオを .fu-radio チップ風に */
.fu-form .form-contents form dl dd:not(.pattern-exclusion) label {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14.5px; font-weight: 500;
  padding: 12px 20px; border: 2px solid #e7ddc8; border-radius: 12px;
  background: #fffdf9; cursor: pointer; margin: 0 12px 12px 0;
}
.fu-form .form-contents form dl dd:not(.pattern-exclusion) label input.radio {
  accent-color: #009d92; width: 16px; height: 16px; margin: 0;
}

/* 送信ボタンをオレンジのピル（3D影）に */
.fu-form .form-contents.form-pattern-1 .submit-btn {
  display: block; width: fit-content; max-width: 100%; min-width: 280px;
  margin: 12px auto 0; padding: 18px 56px;
  font-family: inherit; font-size: 17px; font-weight: 600;
  color: #fff; background: #ffa632; border: none; border-radius: 999px;
  box-shadow: 0 5px 0 #e08a1e; transition: transform .15s ease, box-shadow .15s ease;
}
.fu-form .form-contents.form-pattern-1 .submit-btn:hover {
  background: #ffa632; transform: translateY(2px); box-shadow: 0 3px 0 #e08a1e;
}
.fu-form .form-contents .submit-btn::before { display: none; }

.fu-telcards { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.fu-telcard { border-radius: 20px; padding: 28px; text-align: center; }
.fu-telcard--teal { background: #f2faf9; }
.fu-telcard--orange { background: #fff7ec; }
.fu-telcard__label { font-size: 15px; font-weight: 600; margin: 0 0 8px; }
.fu-telcard--teal .fu-telcard__label { color: #009d92; }
.fu-telcard--orange .fu-telcard__label { color: #ffa632; }
.fu-telcard__num { font-family: "Fredoka", sans-serif; font-size: 28px; font-weight: 600; color: #2f2a26; text-decoration: none; }
.fu-telcard__note { font-size: 12.5px; color: #8a8478; margin: 8px 0 0; }
.fu-subhead { text-align: center; font-size: 22px; font-weight: 600; margin: 0 0 24px; }
.fu-notice-sec { padding-top: 90px; }
.fu-form-sec { padding-top: 32px; padding-bottom: 90px; }
@media (max-width: 640px) { .fu-notice-sec { padding-top: 56px; } .fu-form-sec { padding-bottom: 56px; } }
@media (max-width: 768px) {
  .fu-form { padding: 30px 22px; }
  .fu-form__row2 { grid-template-columns: 1fr; }
  .fu-telcards { grid-template-columns: 1fr; }
}

/* ==========================================================================
 * BLOG（お知らせ一覧・詳細）
 * ========================================================================== */
.fu-blog { max-width: 1160px; margin: 0 auto; padding: 64px 24px 80px; display: grid; grid-template-columns: 1fr 300px; gap: 48px; align-items: start; }
.fu-blog--entry { padding-top: 36px; }
.fu-crumb { font-size: 13px; color: #9a9488; margin: 0 0 28px; }
.fu-crumb a { color: #9a9488; }
.fu-blog-inner { max-width: 1160px; margin: 0 auto; padding: 36px 24px 80px; }
.fu-blog-grid { display: grid; grid-template-columns: 1fr 300px; gap: 48px; align-items: start; }

.fu-filter { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 32px; }
.fu-filter a { font-size: 13.5px; font-weight: 600; padding: 9px 18px; border-radius: 999px; text-decoration: none; background: #fff; color: #5a544c; border: 1px solid #e7ddc8; }
.fu-filter a.is-active { background: #009d92; color: #fff; border-color: #009d92; }

.fu-arts { display: flex; flex-direction: column; gap: 22px; }
.fu-art { display: grid; grid-template-columns: 200px 1fr; gap: 24px; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 6px 18px rgba(0,0,0,.04); text-decoration: none; border: 1px solid #f0e7d2; transition: transform .2s ease, box-shadow .2s ease; }
.fu-art:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(0,0,0,.08); opacity: 1; }
.fu-art__thumb { display: flex; align-items: center; justify-content: center; min-height: 130px; }
.fu-art__thumb svg { width: 34px; height: 34px; }
.fu-art__thumb--news  { background: linear-gradient(135deg, #009d92, rgba(0,0,0,.05)); }
.fu-art__thumb--event { background: linear-gradient(135deg, #ffa632, rgba(0,0,0,.05)); }
.fu-art__thumb--job   { background: linear-gradient(135deg, #ec4434, rgba(0,0,0,.05)); }
.fu-art__body { padding: 22px 24px 22px 0; }
.fu-art__meta { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.fu-tag { font-size: 11.5px; font-weight: 600; color: #fff; padding: 3px 12px; border-radius: 999px; }
.fu-tag--news { background: #009d92; }
.fu-tag--event { background: #ffa632; }
.fu-tag--job { background: #ec4434; }
.fu-art__date { font-family: "Fredoka", sans-serif; font-size: 13px; color: #9a9488; }
.fu-art__ttl { font-size: 17px; font-weight: 600; color: #2f2a26; margin: 0 0 8px; line-height: 1.6; }
.fu-art__ex { font-size: 13.5px; line-height: 1.8; color: #7a746a; margin: 0; }

.fu-pager { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 44px; }
.fu-pager a, .fu-pager span { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-family: "Fredoka", sans-serif; font-weight: 600; text-decoration: none; }
.fu-pager span.is-current { background: #009d92; color: #fff; }
.fu-pager a { background: #fff; border: 1px solid #e7ddc8; color: #5a544c; }
.fu-pager a svg { width: 16px; height: 16px; }

.fu-side { display: flex; flex-direction: column; gap: 28px; }
.fu-widget { background: #fff; border-radius: 18px; padding: 26px 24px; box-shadow: 0 6px 18px rgba(0,0,0,.04); border: 1px solid #f0e7d2; }
.fu-widget__en { font-family: "Fredoka", sans-serif; font-size: 12px; letter-spacing: .14em; color: #009d92; margin: 0 0 4px; }
.fu-widget__ttl { font-size: 16px; font-weight: 600; margin: 0 0 16px; }
.fu-catlist { display: flex; flex-direction: column; }
.fu-catlist a { display: flex; justify-content: space-between; align-items: center; padding: 11px 0; border-bottom: 1px solid #f2ecdd; font-size: 16px; color: #4a453f; text-decoration: none; }
.fu-catlist a span:last-child { font-family: "Fredoka", sans-serif; font-size: 12px; color: #9a9488; }
.fu-recent { display: flex; flex-direction: column; gap: 14px; }
.fu-recent a { text-decoration: none; display: block; }
.fu-recent__date { display: block; font-family: "Fredoka", sans-serif; font-size: 12px; color: #9a9488; }
.fu-recent__ttl { display: block; font-size: 16px; font-weight: 600; color: #3f3a34; line-height: 1.6; margin-top: 2px; }
.fu-archive { display: flex; flex-direction: column; }
.fu-archive a { padding: 10px 0; border-bottom: 1px solid #f2ecdd; font-size: 16px; color: #4a453f; text-decoration: none; }

/* 記事詳細 */
.fu-entry__meta { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.fu-entry__date { font-family: "Fredoka", sans-serif; font-size: 14px; color: #9a9488; }
.fu-entry__ttl { font-size: 30px; font-weight: 600; line-height: 1.5; margin: 0 0 28px; }
.fu-entry__hero { aspect-ratio: 16/8; border-radius: 22px; background: linear-gradient(135deg, #009d92, #4CC7C5); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #fff; margin-bottom: 36px; box-shadow: 0 12px 30px rgba(0,157,146,.2); }
.fu-entry__hero svg { width: 46px; height: 46px; }
.fu-entry__hero span { font-size: 13px; opacity: .9; }
.fu-entry__body { font-size: 16px; line-height: 2.1; color: #3f3a34; }
.fu-entry__body p { margin: 0 0 24px; }
.fu-entry__body h2 { font-size: 20px; font-weight: 600; margin: 36px 0 14px; padding-left: 14px; border-left: 5px solid #009d92; }
.fu-entry__body h2.is-orange { border-left-color: #ffa632; }
.fu-entry__back { margin-top: 44px; text-align: center; }

@media (max-width: 900px) {
  .fu-blog, .fu-blog-grid { grid-template-columns: 1fr; }
  .fu-tag--news, .fu-tag--event, .fu-tag--job { }
}
@media (max-width: 640px) {
  .fu-art { grid-template-columns: 110px 1fr; gap: 14px; }
  .fu-art__body { padding: 16px 16px 16px 0; }
  .fu-entry__ttl { font-size: 22px; }
}

/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 * .fu-header 系      - 固定ヘッダー / アイコン付きナビ / 波線ボーダー
 * .fu-btn 系         - pill + ハードシャドウ3Dボタン（構造不足：影付き立体ボタン）
 * .fu-sec-head 系    - EN(Fredoka)+JP 中央見出し（色バリエーション）
 * .fu-wave           - inline SVG 波ディバイダーの高さ制御
 * .fu-phero 系       - 左テキスト+右画像+淡色帯のページヒーロー
 * .fu-dl 系          - 白カード型 定義リスト（概要・要項）
 * .fu-cta 系         - ティール CTA 帯（装飾円つき）
 * .fu-footer 系      - 事業所マップカード + 濃色ボトム
 * .fu-pillars/pcard  - 3つの柱（写真型 / アイコンカード型）
 * .fu-abcard         - A型/B型 カラーヘッダーカード
 * .fu-flow           - 番号バッジ+コネクタ線のフロー
 * .fu-compare        - A/B 比較グリッド表
 * .fu-wcard          - 左ボーダー作業カード
 * .fu-form 系        - 角丸フォーム（入力/ラジオ/必須バッジ）
 * .fu-art/widget/pager - ブログ一覧カード・サイドバー・ページャ
 * .fu-entry 系       - 記事詳細（左ボーダー見出し・ヒーロー）
 *
 * ======================================
 * 共通SCSSに不足していたもの（5分類）
 * ======================================
 * - 装飾パターン不足：inline SVG 波ディバイダー（上下境界を白で切り抜く形）
 * - 構造不足：ハードシャドウ立体 pill ボタン（0 5px 0 で影を落とす表現）
 * - 装飾パターン不足：ヘッダー下端の手描き風波線ボーダー（repeat SVG）
 * - 値の粒度不足：デザイン固有の px 見出し（40px EN / 24px JP 等）と余白
 * - 構造不足：フロー番号バッジ（画像背景の丸バッジ+コネクタ線）
 */