@charset "UTF-8";

/* ============================================================
   COMPANY ページ固有
   ============================================================ */

/* 代表メッセージの署名 */
.company-author { display: flex; flex-direction: column; align-items: flex-end; }
.company-author__role { font-family: "Zen Old Mincho", serif; color: #11192f; }
.company-author .company-author__role { margin: 0px 0px 0px 0px; }
.company-author__name { font-family: "Zen Old Mincho", serif; color: #11192f; letter-spacing: 0.08em; }

/* 会社情報テーブル */
.company-info { border-top: 1px solid #dfe1ec; }
.company-info__row { display: grid; border-bottom: 1px solid #dfe1ec; }
.company-info dt { font-family: "Noto Sans JP", sans-serif; color: #11192f; font-weight: 700; }
.company-info dd { color: #444b5e; }
.company-info dd a { color: #5985d1; transition: color 0.3s ease; }
.company-info dd a:hover { color: #24abff; }

/* 会社情報・沿革の各行を時間差でフェードイン（CONCEPT/MESSAGEと同様）*/
.company-info__row.fade-in { transition-duration: 0.6s; }
.company-info__row.fade-in:nth-child(2) { transition-delay: 0.06s; }
.company-info__row.fade-in:nth-child(3) { transition-delay: 0.12s; }
.company-info__row.fade-in:nth-child(4) { transition-delay: 0.18s; }
.company-info__row.fade-in:nth-child(5) { transition-delay: 0.24s; }
.company-info__row.fade-in:nth-child(6) { transition-delay: 0.30s; }
.company-info__row.fade-in:nth-child(7) { transition-delay: 0.36s; }
.company-info__row.fade-in:nth-child(8) { transition-delay: 0.42s; }
.company-info__row.fade-in:nth-child(9) { transition-delay: 0.48s; }
.company-map.fade-in { transition-delay: 0.2s; }

/* アクセスマップ */
.company-map { border-radius: 8px; overflow: hidden; box-shadow: 0px 14px 34px rgba(17, 25, 47, 0.10); background: rgba(255, 255, 255, 0.3); }
.company-map iframe { display: block; width: 100%; height: 100%; border: 0px; }
/* 画像版：カード装飾を外し、外周を透明フェードで背景になじませる */
.company-map.company-map--photo { border-radius: 0px; overflow: visible; box-shadow: none; background: transparent; height: auto; }
.company-map__link { display: block; position: relative; }
.company-map__img {
  display: block; width: 100%; max-width: 100%; height: auto; margin: 0px auto; cursor: pointer;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 12%, #000 88%, transparent 100%);
  mask-composite: intersect;
}

/* ============================================================
   PC（min-width: 768px）
   ============================================================ */
@media (min-width: 768px) {
  .company-author { margin: 48px 0px 0px 0px; }
  .company-author__role { font-size: 15px; margin: 0px 0px 16px 0px; letter-spacing: 0.04em; }
  .company-author .company-author__name { font-size: 36px; }

  .company-info__row { grid-template-columns: 220px 1fr; gap: 0px 32px; padding: 24px 0px 24px 0px; }
  .company-info dt { font-size: 15px; line-height: 1.9; }
  .company-info dd { font-size: 15px; line-height: 1.9; }

  .company-map { height: 400px; margin: 48px 0px 0px 0px; }
}

/* ============================================================
   SP（max-width: 767px）
   ============================================================ */
@media (max-width: 767px) {
  .company-author { margin: 32px 0px 0px 0px; }
  .company-author__role { font-size: 13px; margin: 0px 0px 12px 0px; }
  .company-author .company-author__name { font-size: 26px; }

  .company-info__row { grid-template-columns: 1fr; gap: 8px 0px; padding: 20px 0px 20px 0px; }
  .company-info dt { font-size: 13px; line-height: 1.8; }
  .company-info dd { font-size: 14px; line-height: 1.85; }

  .company-map { height: 280px; margin: 32px 0px 0px 0px; }
  /* SPは地図を画面幅より大きくズーム（リンクごと拡大＝ピンも一緒に拡大。左右はみ出しは overflow:hidden でクロップ）
     ※ .company-map.company-map--photo で特異度を上げないと上の overflow:visible に負けて横スクロールする */
  .company-map.company-map--photo { margin: 32px -24px 0px -24px; overflow: hidden; }
  .company-map__link { width: 140%; margin-left: -20%; }
  .company-map__img { width: 100%; max-width: 100%; margin: 0px; }
}

/* ============================================================
   代表プロフィール（主な経歴 / 出演・受賞歴）
   ============================================================ */
.founder-sub { font-family: "Zen Old Mincho", serif; font-weight: 700; color: #11192f; }
.founder-list li { position: relative; color: #444b5e; }
.founder-list li::before { content: ""; position: absolute; left: 0px; width: 6px; height: 6px; border-radius: 50%; background: linear-gradient(135deg, #ad4ea7 0%, #24abff 100%); }

/* 代表プロフィール冒頭：ポートレート + 紹介文 */
.founder-portrait { margin: 0px 0px 0px 0px; }
.founder-portrait img { display: block; width: 100%; height: auto; border-radius: 12px; box-shadow: 0px 16px 40px rgba(17, 25, 47, 0.16); background: #ffffff; }

@media (min-width: 768px) {
  .founder-sub { font-size: 19px; margin: 48px 0px 16px 0px; }
  .founder-list li { font-size: 16px; line-height: 1.9; padding: 0px 0px 0px 22px; margin: 0px 0px 14px 0px; }
  .founder-list li::before { top: 11px; }

  .founder-intro { display: grid; grid-template-columns: 360px 1fr; gap: 0px 48px; align-items: start; margin: 0px 0px 8px 0px; }
  .founder-intro__text .about-block__lead { margin: 0px 0px 24px 0px; }
}
@media (max-width: 767px) {
  .founder-sub { font-size: 17px; margin: 36px 0px 12px 0px; }
  .founder-list li { font-size: 14px; line-height: 1.85; padding: 0px 0px 0px 18px; margin: 0px 0px 12px 0px; }
  .founder-list li::before { top: 9px; }

  .founder-intro { display: block; }
  .founder-portrait { max-width: 340px; margin: 0px 0px 24px 0px; }
  .founder-intro__text .about-block__lead { margin: 0px 0px 16px 0px; }
}

/* page-hero: グラデ／色合いはそのまま、product-hero画像を薄く重ねる */
.page-hero::after { content: ""; position: absolute; inset: 0px; z-index: 0; background-image: url("../images/product-hero.webp"); background-size: cover; background-position: center; background-repeat: no-repeat; opacity: 0.20; pointer-events: none; }

/* breadcrumb を about-content 先頭(CONCEPT)の #f3f1fa と同じ背景にして連続させる。
   テキスト位置は news 同様（中央寄せ 1200px）になるよう inner で揃える */
.breadcrumb { background: #f3f1fa; max-width: none; padding: 0px 0px 0px 0px; }
.breadcrumb__inner { max-width: 1200px; margin: 0px auto 0px auto; }
.about-layout { padding-top: 0px; }
@media (min-width: 768px) {
  .breadcrumb__inner { padding: 72px 40px 24px 40px; }
}
@media (max-width: 767px) {
  .breadcrumb__inner { padding: 24px 24px 16px 24px; }
}

/* breadcrumb を about-nav（サイドナビ）の先頭にまとめる。
   PC：全幅の breadcrumb 帯を隠し、about-nav__crumb を表示。
   SP：about-nav-rail が非表示のため、従来どおり breadcrumb 帯を表示。 */
.about-nav__crumb { font-family: "Cinzel", serif; letter-spacing: 0.04em; color: #8a90a0; }
.about-nav__crumb a { color: #8a90a0; padding: 0px 0px 0px 0px; transition: color 0.3s ease; }
.about-nav__crumb a::before { display: none; }
.about-nav__crumb a:hover { color: #24abff; }
.about-nav__crumb span { color: #c0c0b8; margin: 0px 4px 0px 4px; }
@media (min-width: 768px) {
  .breadcrumb { display: none; }
  .about-nav__crumb { font-size: 12px; margin: 0px 0px 28px 0px; }
}
@media (max-width: 767px) {
  .about-nav__crumb { display: none; }
}