@charset "UTF-8";

/* ==========================================================================
   会社概要ページ（/about/company）専用パーツ

   対象ページ：.aby-page.aby-page-company

   このファイルは support-faq.css と併用します。ページ全体の土台
   （.aby-page／.aby-page-hero／.aby-page-h2／.aby-page-row／.aby-page-table／
   .aby-page-list／.aby-page-callout／.aby-page-contact 等）は support-faq.css
   のものをそのまま再利用し、他ページ（ご利用ガイド／よくあるご質問／沿革ページ）
   とトンマナ（書体・配色・余白の取り方）を統一しています。
   本ファイルには、このページ固有のパーツ（役員紹介カード・加盟団体リスト・
   社会貢献活動カード・沿革タイムライン）のみを追加します。
   ※本番ページのDOMには「企業理念」「行動指針」の見出し・本文も存在しましたが、
     実際の画面には表示されていない（非表示のCMSコンテンツ）ことが判明したため、
     本ドラフトには含めていません。

   ・すべて .aby-company- プレフィックスでスコープしており、category.css /
     history.css / support-faq.css とクラス名の重複はありません。
   ・元ページ（本番サイト）：https://www.abeyoando.co.jp/about/company
     本文・数値・リンク先・写真は本番の内容をそのまま踏襲していますが、
     見た目は「今風」に刷新し、他ページと共通のデザイン言語で再構成しています。
   ========================================================================== */

.aby-page-company .aby-page-section:first-of-type { padding-top: 0; margin-top: 0; border-top: 0; }

/* --------------------------------------------------------------------------
   会社概要：項目ごとに横罫線を入れる（会社名／所在地／創業／経営陣…の区切り）
   -------------------------------------------------------------------------- */

#company-profile .aby-page-row {
  border-bottom: 1px solid var(--abyp-line-soft);
  padding-bottom: 32px;
}
#company-profile .aby-page-row:last-child { border-bottom: 0; padding-bottom: 0; }

/* --------------------------------------------------------------------------
   会社概要テーブル：連絡フォームのリンク列
   -------------------------------------------------------------------------- */

.aby-company-inquiry-links { list-style: none; margin: 10px 0 0; padding: 0; }
.aby-company-inquiry-links li { margin-bottom: 6px; }
.aby-company-inquiry-links a { color: var(--abyp-gold); text-decoration: underline; font-size: 14.5px; }

/* --------------------------------------------------------------------------
   経営陣・役員紹介カード
   -------------------------------------------------------------------------- */

.aby-company-exec-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 40px 30px;
  margin: 10px 0 0;
}
.aby-company-exec-card { display: flex; gap: 22px; align-items: flex-start; margin-bottom:80px;}
.aby-company-exec-photo {
  flex: 0 0 auto; width: 150px; height: 150px; border-radius: 8px;
  overflow: hidden; background: #f2f2f2;
}
.aby-company-exec-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.aby-company-exec-body { flex: 1 1 auto; min-width: 0; }
.aby-company-exec-role {
  display: inline-block; font-size: 12px; color: var(--abyp-gold);
  border: 1px solid var(--abyp-gold); border-radius: 3px; padding: 2px 8px; margin-bottom: 8px;
}
.aby-company-exec-name { font-family: var(--abyp-serif); font-size: 17px; font-weight: 600; margin: 0 0 10px; color: var(--abyp-text); }
.aby-company-exec-bio { font-size: 13.5px; line-height: 1.9; color: #555; }

/* --------------------------------------------------------------------------
   加盟団体：プレーンなリスト（ボタン・枠なし）
   -------------------------------------------------------------------------- */

.aby-company-tags { list-style: none; margin: 10px 0 0; padding: 0; }
.aby-company-tags li {
  font-size: 14.5px; line-height: 1.9; color: var(--abyp-text);
}

/* --------------------------------------------------------------------------
   社会貢献活動
   -------------------------------------------------------------------------- */

.aby-company-csr-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.aby-company-csr-card { border: 1px solid var(--abyp-line-soft); border-radius: 10px; padding: 28px 26px; }
.aby-company-csr-card__title {
  font-family: var(--abyp-serif); font-size: 17px; font-weight: 600; color: var(--abyp-text);
  margin: 0 0 16px; padding-bottom: 12px; border-bottom: 1px solid var(--abyp-line-soft);
}
.aby-company-csr-card ul { list-style: none; margin: 0; padding: 0; }
.aby-company-csr-card li {
  font-size: 14px; line-height: 1.8; color: var(--abyp-text); padding-left: 18px; position: relative; margin-bottom: 8px;
}
.aby-company-csr-card li:last-child { margin-bottom: 0; }
.aby-company-csr-card li::before {
  content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--abyp-gold);
}

/* --------------------------------------------------------------------------
   沿革：タイムライン
   -------------------------------------------------------------------------- */

.aby-company-timeline { position: relative; margin: 10px 0 0; padding-left: 130px; }
.aby-company-timeline::before {
  content: ""; position: absolute; left: 96px; top: 6px; bottom: 6px; width: 1px; background: var(--abyp-line-soft);
}
.aby-company-timeline-item { position: relative; padding: 0 0 30px; }
.aby-company-timeline-item:last-child { padding-bottom: 0; }
.aby-company-timeline-item::before {
  content: ""; position: absolute; left: -38px; top: 5px; width: 9px; height: 9px;
  border-radius: 50%; background: var(--abyp-gold);
}
.aby-company-timeline-year {
  position: absolute; left: -130px; top: -1px; width: 84px; text-align: right;
  font-family: var(--abyp-serif); font-size: 13.5px; font-weight: 600; color: var(--abyp-gold);
  line-height: 1.6;
}
.aby-company-timeline-event { font-size: 14.5px; line-height: 1.85; color: var(--abyp-text); padding-top: 0; }

/* --------------------------------------------------------------------------
   スマートフォン
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    #company-profile .aby-page-row__body{flex: inherit;}
  .aby-company-exec-grid { grid-template-columns: 1fr; gap: 30px; }
  .aby-company-exec-card { gap: 16px; }
  .aby-company-exec-photo { width: 110px; height: 110px; }
  .aby-company-csr-grid { grid-template-columns: 1fr; gap: 16px; }

  .aby-company-timeline { padding-left: 0; }
  .aby-company-timeline::before { left: 4px; }
  .aby-company-timeline-item { padding-left: 26px; padding-bottom: 26px; }
  .aby-company-timeline-item::before { left: 0; top: 5px; }
  .aby-company-timeline-year { position: static; display: block; width: auto; text-align: left; margin-bottom: 4px; }
}