﻿@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/* =====================================================
   Override: ページヒーローセクション 縮小 + eyebrow非表示
   対象: 内部ページのみ（HOME は除外）
   変更: eyebrow非表示 / padding 40px→20px / title縮小 / min-height縮小
   ===================================================== */
.page-template-default .luna-page-hero {
  min-height: 10vh !important;
  padding: 20px 20px !important;
}
.page-template-default .luna-page-hero__eyebrow {
  display: none !important;
}
.page-template-default .luna-page-hero__title {
  font-size: clamp(22px, 4vw, 40px) !important;
}
.page-template-default .luna-page-hero__sub {
  margin-top: 8px !important;
}

/* =====================================================
   Override: ページヒーロー上部ギャップ解消
   原因: l-content padding-top(64px) + post_content margin-top(64px) = 128px の空白
   対象: 内部ページのみ（HOME は除外）
   ===================================================== */
.page-template-default .post_content .luna-page-hero:first-child {
  margin-top: -128px !important;
}
.admin-bar.page-template-default .post_content .luna-page-hero:first-child {
  margin-top: -96px !important;
}

/* ================================================
   fix_header 非表示 (2026-05-03)
   luna-header-transparent クラスとSWELL内部JSの衝突で
   スクロール時に fix_header が逆順フェードして2重表示になるため抑制
   ================================================ */
html.luna-header-transparent #fix_header {
  display: none !important;
}

/* =====================================================
   Fix: トップページ FV - SWELLコンテンツパディング除去 (2026-05-05)
   原因: .top #content に padding-top: 4em (64px) がSWELL側から自動設定される
         透過ヘッダー(-transparent)時はヒーローをビューポートトップから開始させる必要あり
         その結果、白いギャップが発生し白背景上で白文字ヘッダーが不可視になっていた
   ===================================================== */
.home #content {
  padding-top: 0 !important;
}

/* =====================================================
   Scroll Animation - js-* classes (2026-05-04)
   IntersectionObserver で .is-visible を付与して発火
   ===================================================== */

/* 下からスライド+フェイド（最頻出） */
.js-fade-up {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

/* フェイドのみ */
.js-fade-only {
  opacity: 0;
  transition: opacity 1.0s ease;
}

/* 左からスライドイン */
.js-slide-left {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

/* 右からスライドイン */
.js-slide-right {
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

/* 発火後（全クラス共通） */
.js-fade-up.is-visible,
.js-fade-only.is-visible,
.js-slide-left.is-visible,
.js-slide-right.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

/* =====================================================
   Fix: フッター copyright リンク文字色 (2026-05-05)
   原因: SWELLグローバルリンク色(#1a1a1a)がフッター背景と同色で不可視
   ===================================================== */
.l-footer .copyright a {
  color: #aaaaaa !important;
  text-decoration: underline !important;
}
.l-footer .copyright a:hover {
  color: #ffffff !important;
}
/* =====================================================
   Design System: 全ページ タイポグラフィ統一 (2026-05-05)
   ===================================================== */

/* ページタイトル：格式 */
/* .c-pageTitle と .c-pageTitle__inner はSWELLデフォルトに戻す（2026-05-06 過剰上書き削除） */

/* セクション padding（サブページのみ inline padding-top を上書き） */
.wp-block-group.alignfull { padding-top: 2.5rem; padding-bottom: 2.5rem; }
#body_wrap:not(.home) .wp-block-group.alignfull { padding-top: 2.5rem !important; }
/* サブページ: ヒーロー(wp-block-cover)直後の余白を抑制 */
#body_wrap:not(.home) .post_content .wp-block-cover.alignfull { margin-bottom: 0 !important; }

/* H2 基本マージン */
.post_content h2 { margin: 1.5rem 0 1.25rem !important; }
.wp-block-group.alignfull h2.wp-block-heading { margin-top: 1.5rem !important; margin-bottom: 1.25rem !important; }

/* H2 ボーダー付き（上マージンゼロ） */
.wp-block-group.alignfull h2.wp-block-heading[style*='border'] { margin-top: 0 !important; margin-bottom: 0.75rem !important; }
.kensetsu-section-h2 { margin-top: 0 !important; margin-bottom: 0.75rem !important; border-bottom: 2px solid #c8a96e; padding-bottom: 0.75rem; }

/* H3 */
.wp-block-group.alignfull h3.wp-block-heading { margin-top: 1.25rem !important; margin-bottom: 0.5rem !important; }

/* カラム内 padding-top（!important 除去 → inline style が優先される） */
.wp-block-group.alignfull .wp-block-columns { padding-top: 1.5rem; }

/* ENラベル(p) -> H2 密接 */
.wp-block-group.alignfull p + h2.wp-block-heading { margin-top: 0.5rem !important; }

/* カバーブロック内 H1/H2 */
.wp-block-cover h1.wp-block-heading { margin-top: 0.5rem !important; margin-bottom: 0 !important; }
.wp-block-cover h2.wp-block-heading { margin-top: 1.5rem !important; margin-bottom: 0.75rem !important; }
.wp-block-cover p + h1.wp-block-heading,
.wp-block-cover p + h2.wp-block-heading { margin-top: 0.5rem !important; }

/* =====================================================
   Fix: OUR STRENGTHS - 画像高さ統一 (2026-05-05)
   原因: strength-01-jisseki.jpg が800x1000px（縦長）のため
         カラム01だけ縦に伸びてレイアウト崩れが発生
   対策: aspect-ratio + object-fit:cover で4枚を同一高さに固定
   ===================================================== */
.taihoku-strength-img img {
  aspect-ratio: 3 / 2;
  width: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* =====================================================
   Fix: CONTACT label gold color + 2-column height align (2026-05-06)
   SWELLが .wp-block-group.alignfull 配下の p タグに color:white を強制継承するため
   !important で c8a96e を持つ p のみゴールドを再適用
   ===================================================== */
[style*="#1a2b3c"] p[style*="c8a96e"] { color: #c8a96e !important; }
[style*="#1a2b3c"] .wp-block-columns.alignwide { align-items: stretch; }
[style*="#1a2b3c"] .wp-block-columns.alignwide > .wp-block-column { display: flex; flex-direction: column; }
[style*="#1a2b3c"] .wp-block-column .wp-block-buttons { flex: 1; display: flex; flex-direction: column; }
[style*="#1a2b3c"] .wp-block-column .wp-block-button { flex: 1; display: flex; flex-direction: column; }
[style*="#1a2b3c"] .wp-block-column .wp-block-button__link { flex: 1 !important; display: flex !important; align-items: center; justify-content: center; }
[style*="#1a2b3c"] .wp-block-column .wp-block-group[style*="border"] { flex: 1; display: flex; flex-direction: column; justify-content: center; }