/* ================================================================
   page-toptest.css — Top Test ページ専用スタイル
   ================================================================ */

/* ----------------------------------------------------------------
   CSS 変数
   ---------------------------------------------------------------- */
:root {
  --tt-primary:      #2C5F7A;
  --tt-primary-dark: #1E4356;
  --tt-bg-white:     #ffffff;
  --tt-bg-grey:      #F4F5F7;
  --tt-bg-blue:      #EBF2F6;
  --tt-bg-dark:      #1A2330;
  --tt-border:       #D8DEE4;
  --tt-text:         #1C1C1C;
  --tt-text-sub:     #5A6270;
  --tt-text-light:   #E8EDF2;
  --tt-text-light-sub: rgba(232, 237, 242, 0.65);
  --tt-accent-gold:  #B8A070;
  --tt-font-serif:   'Yu Mincho', '游明朝', 'Hiragino Mincho ProN', 'HiraMinProN-W3', Georgia, serif;
  --tt-font-sans:    -apple-system, BlinkMacSystemFont, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}

/* ----------------------------------------------------------------
   ベース
   ---------------------------------------------------------------- */
.top-test-page {
  font-family: var(--tt-font-sans);
  color: var(--tt-text);
  background: var(--tt-bg-white);
}

/* ----------------------------------------------------------------
   コンテナ
   ---------------------------------------------------------------- */
.top-test-page .tt-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 32px;
}

/* ----------------------------------------------------------------
   セクション共通
   ---------------------------------------------------------------- */
.top-test-page .tt-section {
  padding: 88px 0;
}

.top-test-page .tt-bg-grey { background: var(--tt-bg-grey); }
.top-test-page .tt-bg-blue { background: var(--tt-bg-blue); }

/* ----------------------------------------------------------------
   セクション見出し
   ---------------------------------------------------------------- */
.top-test-page .tt-section-head {
  text-align: center;
  margin-bottom: 56px;
}

.top-test-page .tt-section-en {
  display: block;
  font-size: 0.68rem;
  letter-spacing: 0.32em;
  color: var(--tt-primary);
  text-transform: uppercase;
  margin-bottom: 10px;
  font-family: var(--tt-font-sans);
}

.top-test-page .tt-section-title {
  font-family: var(--tt-font-serif);
  font-size: 2rem;
  font-weight: normal;
  letter-spacing: 0.12em;
  color: var(--tt-text);
  text-shadow: 0 1px 2px rgba(44, 95, 122, 0.08);
  position: relative;
  display: inline-block;
  padding-bottom: 20px;
  margin: 0;
}

.top-test-page .tt-section-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 32px;
  height: 1px;
  background: var(--tt-primary);
}

/* ----------------------------------------------------------------
   ボタン
   ---------------------------------------------------------------- */
.top-test-page .tt-btn {
  display: inline-block;
  padding: 12px 36px;
  border: 1px solid var(--tt-primary);
  color: var(--tt-primary);
  text-decoration: none;
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  font-family: var(--tt-font-sans);
  transition: background 0.2s, color 0.2s;
}

.top-test-page .tt-btn:hover {
  background: var(--tt-primary);
  color: #fff;
}

.top-test-page .tt-btn--sm {
  padding: 9px 24px;
  font-size: 0.75rem;
}

.top-test-page .tt-section-more {
  text-align: center;
  margin-top: 48px;
}

/* ================================================================
   固定ナビゲーション
   ================================================================ */
.page-template-page-toptest-php .site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 1px 12px rgba(0, 0, 0, 0.08);
}

/* WordPress 管理バー対応（デスクトップ: 32px） */
.admin-bar.page-template-page-toptest-php .site-header {
  top: 32px;
}

/* #wrapper にヘッダー分の余白を確保 */
.page-template-page-toptest-php #wrapper {
  padding-top: 80px;
}

.admin-bar.page-template-page-toptest-php #wrapper {
  padding-top: 80px;
}

/* ================================================================
   スクロールアニメーション
   ================================================================ */
.top-test-page .tt-animate {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.65s ease, transform 0.65s ease;
}

.top-test-page .tt-animate.tt-animate--in {
  opacity: 1;
  transform: translateY(0);
}

/* カードのスタガー遅延 */
.top-test-page .tt-animate:nth-child(2) { transition-delay: 0.08s; }
.top-test-page .tt-animate:nth-child(3) { transition-delay: 0.16s; }
.top-test-page .tt-animate:nth-child(4) { transition-delay: 0.24s; }
.top-test-page .tt-animate:nth-child(5) { transition-delay: 0.32s; }
.top-test-page .tt-animate:nth-child(6) { transition-delay: 0.40s; }
.top-test-page .tt-animate:nth-child(7) { transition-delay: 0.48s; }

/* ================================================================
   1. スライダー
   ================================================================ */
.top-test-page .tt-hero-wrapper {
  position: relative; /* キャッチコピーオーバーレイの基点 */
}

.top-test-page .tt-section--slider {
  padding: 0;
  isolation: isolate; /* SmartSlider3のz-indexをセクション内部に封じ込める */
}

.top-test-page .toptest-slider {
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 720px;
  overflow: hidden;
}

/* Smart Slider 3 用: セクション自体で最大高を制御 */
.top-test-page .tt-section--slider {
  max-height: 720px;
  overflow: hidden;
}

/* ----------------------------------------------------------------
   Hero キャッチコピー オーバーレイ
   ---------------------------------------------------------------- */
.top-test-page .tt-hero-catch {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  max-width: 55%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 13% 0 0 5%;
  z-index: 20;
  pointer-events: none;
}

/* アイブロウ（昭和63年創業） */
.top-test-page .tt-hero-catch__eyebrow {
  display: block;
  font-family: var(--tt-font-sans);
  font-size: clamp(0.65rem, 1.2vw, 0.85rem);
  letter-spacing: 0.28em;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 14px;
  animation: tt-rise-up 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.3s both;
}

/* メインタイトル */
.top-test-page .tt-hero-catch__title {
  font-family: var(--tt-font-serif);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  font-weight: normal;
  line-height: 1.7;
  letter-spacing: 0.1em;
  color: #ffffff;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.45);
  margin: 0;
  animation: tt-rise-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.5s both;
}

/* 下から浮き上がるキーフレーム */
@keyframes tt-rise-up {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* モバイル調整 */
@media (max-width: 767px) {
  .top-test-page .tt-hero-catch {
    padding: 18% 0 0 6%;
  }
  .top-test-page .tt-hero-catch__title {
    font-size: clamp(1.1rem, 4.5vw, 1.5rem);
  }
}

.top-test-page .toptest-slider .swiper-slide {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.top-test-page .toptest-slider .swiper-wrapper {
  height: 100%;
}

.top-test-page .tt-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Swiper UI カスタマイズ */
.top-test-page .toptest-slider .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.6);
  opacity: 1;
}

.top-test-page .toptest-slider .swiper-pagination-bullet-active {
  background: #fff;
}

.top-test-page .toptest-slider .swiper-button-next,
.top-test-page .toptest-slider .swiper-button-prev {
  color: rgba(255, 255, 255, 0.75);
}

.top-test-page .toptest-slider .swiper-button-next:hover,
.top-test-page .toptest-slider .swiper-button-prev:hover {
  color: #fff;
}

/* ================================================================
   2. キャッチコピー
   ================================================================ */
.top-test-page .tt-section--catch {
  background: var(--tt-bg-white);
  text-align: center;
  padding: 140px 0;
}

.top-test-page .tt-catch-inner {
  max-width: 760px;
  margin: 0 auto;
}

/* キャッチ eyebrow（「昭和63年創業」）— h2 と同一フォント設定 */
.top-test-page .tt-catch-eyebrow {
  display: block;
  font-family: var(--tt-font-serif);
  font-size: 2.2rem;
  font-weight: normal;
  line-height: 2.2;
  letter-spacing: 0.1em;
  color: var(--tt-text);
  margin-bottom: 0;
}

.top-test-page .tt-catch-title {
  font-family: var(--tt-font-serif);
  font-size: 2.2rem;
  font-weight: normal;
  line-height: 2.2;
  letter-spacing: 0.1em;
  color: var(--tt-text);
  margin: 0;
}

/* ================================================================
   3. 事業内容
   ================================================================ */
.top-test-page .tt-business-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.top-test-page .tt-business-card {
  background: var(--tt-bg-white);
  border: 1px solid var(--tt-border);
  padding: 32px 22px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.top-test-page .tt-business-card__title {
  font-family: var(--tt-font-serif);
  font-size: 1rem;
  font-weight: normal;
  letter-spacing: 0.06em;
  color: var(--tt-primary);
  margin: 0 0 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--tt-border);
}

.top-test-page .tt-business-card__desc {
  font-size: 0.84rem;
  line-height: 1.95;
  color: var(--tt-text-sub);
  margin: 0;
}

/* ================================================================
   4・5. プロジェクトカード（再生・開発 共通）
   ================================================================ */
.top-test-page .tt-project-grid {
  display: grid;
  gap: 22px;
}

.top-test-page .tt-project-grid--4 {
  grid-template-columns: repeat(4, 1fr);
}

.top-test-page .tt-project-grid--3 {
  grid-template-columns: repeat(3, 1fr);
}

.top-test-page .tt-project-card {
  background: var(--tt-bg-white);
  border: 1px solid var(--tt-border);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.top-test-page .tt-project-card__thumb {
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.top-test-page .tt-project-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.top-test-page .tt-project-card:hover .tt-project-card__thumb img {
  transform: scale(1.04);
}

.top-test-page .tt-project-card__body {
  padding: 18px 20px 22px;
  flex: 1;
}

.top-test-page .tt-project-card__name {
  font-family: var(--tt-font-serif);
  font-size: 1rem;
  font-weight: normal;
  letter-spacing: 0.05em;
  color: var(--tt-text);
  margin: 0 0 8px;
}

.top-test-page .tt-project-card__location {
  font-size: 0.76rem;
  color: var(--tt-primary);
  margin: 0 0 10px;
  letter-spacing: 0.03em;
}

.top-test-page .tt-project-card__desc {
  font-size: 0.82rem;
  line-height: 1.85;
  color: var(--tt-text-sub);
  margin: 0;
}

/* ================================================================
   6. 所有物件
   ================================================================ */
.top-test-page .tt-owned-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

.top-test-page .tt-owned-card {
  background: var(--tt-bg-white);
  border: 1px solid var(--tt-border);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.top-test-page .tt-owned-card__thumb {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  position: relative;
}

.top-test-page .tt-owned-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.top-test-page .tt-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--tt-primary);
  color: #fff;
  font-size: 0.67rem;
  letter-spacing: 0.08em;
  padding: 3px 10px;
  font-family: var(--tt-font-sans);
}

.top-test-page .tt-owned-card__body {
  padding: 16px 18px 20px;
  flex: 1;
}

.top-test-page .tt-owned-card__name {
  font-family: var(--tt-font-serif);
  font-size: 0.98rem;
  font-weight: normal;
  letter-spacing: 0.05em;
  color: var(--tt-text);
  margin: 0 0 6px;
}

.top-test-page .tt-owned-card__structure {
  font-size: 0.78rem;
  color: var(--tt-text-sub);
  margin: 0;
}

/* ================================================================
   7. 企業活動
   ================================================================ */
.top-test-page .tt-activity-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}

.top-test-page .tt-activity-card {
  background: var(--tt-bg-white);
  border: 1px solid var(--tt-border);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.top-test-page .tt-activity-card__thumb {
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.top-test-page .tt-activity-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.top-test-page .tt-activity-card__body {
  padding: 28px 28px 32px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.top-test-page .tt-activity-card__title {
  font-family: var(--tt-font-serif);
  font-size: 1.1rem;
  font-weight: normal;
  letter-spacing: 0.06em;
  color: var(--tt-text);
  margin: 0 0 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--tt-border);
}

.top-test-page .tt-activity-card__desc {
  font-size: 0.9rem;
  line-height: 1.95;
  color: var(--tt-text-sub);
  margin: 0 0 24px;
  flex: 1;
}

/* ================================================================
   8. 沿革
   ================================================================ */
.top-test-page .tt-history {
  max-width: 760px;
  margin: 0 auto 48px;
  display: grid;
  grid-template-columns: 12rem 1fr;
  border-top: 1px solid var(--tt-border);
}

.top-test-page .tt-history__year,
.top-test-page .tt-history__desc {
  padding: 16px 0;
  border-bottom: 1px solid var(--tt-border);
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.75;
  font-family: var(--tt-font-sans);
}

.top-test-page .tt-history__year {
  font-weight: bold;
  color: var(--tt-primary);
  padding-right: 24px;
}

.top-test-page .tt-history__desc {
  color: var(--tt-text);
}

/* ================================================================
   9. 代表メッセージ
   ================================================================ */
.top-test-page .tt-message-inner {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 56px;
  align-items: start;
}

.top-test-page .tt-message-photo {
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--tt-bg-grey);
  border: 1px solid var(--tt-border);
  display: flex;
  align-items: center;
  justify-content: center;
}

.top-test-page .tt-message-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.top-test-page .tt-message-photo__placeholder {
  color: var(--tt-text-sub);
  font-size: 0.82rem;
  font-family: var(--tt-font-sans);
}

.top-test-page .tt-message-body p {
  font-size: 0.94rem;
  line-height: 2.2;
  color: var(--tt-text);
  margin: 0 0 20px;
}

.top-test-page .tt-message-body p:last-child {
  margin-bottom: 0;
}

.top-test-page .tt-message-sign {
  margin-top: 32px !important;
  font-family: var(--tt-font-serif);
  font-size: 1rem;
  letter-spacing: 0.08em;
  color: var(--tt-text);
  border-top: 1px solid var(--tt-border);
  padding-top: 20px;
}

/* ================================================================
   10. 会社概要
   ================================================================ */
.top-test-page .tt-company {
  max-width: 800px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 10rem 1fr;
  border-top: 1px solid var(--tt-border);
}

.top-test-page .tt-company dt,
.top-test-page .tt-company dd {
  padding: 14px 0;
  border-bottom: 1px solid var(--tt-border);
  margin: 0;
  font-size: 0.9rem;
  font-family: var(--tt-font-sans);
  line-height: 1.75;
}

.top-test-page .tt-company dt {
  font-weight: bold;
  color: var(--tt-text);
  padding-right: 20px;
}

.top-test-page .tt-company dd {
  color: var(--tt-text-sub);
}

/* ================================================================
   3a. ストーリー（感情）— Story Emotion
   ================================================================ */
.top-test-page .tt-section--story-emotion {
  background: var(--tt-bg-white);
  padding: 100px 0;
}

.top-test-page .tt-story-emotion {
  display: grid;
  grid-template-columns: 60% 1fr;
  gap: 64px;
  align-items: center;
}

.top-test-page .tt-story-emotion__photo {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--tt-bg-grey);
  border: 1px dashed var(--tt-border);
  display: flex;
  align-items: center;
  justify-content: center;
}

.top-test-page .tt-story-emotion__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.top-test-page .tt-story-emotion__photo-placeholder {
  font-size: 0.78rem;
  color: var(--tt-text-sub);
  font-family: var(--tt-font-sans);
  text-align: center;
  padding: 16px;
}

.top-test-page .tt-story-emotion__copy .tt-section-en {
  display: block;
  margin-bottom: 20px;
}

.top-test-page .tt-story-emotion__title {
  font-family: var(--tt-font-serif);
  font-size: 2.4rem;
  font-weight: normal;
  line-height: 1.75;
  letter-spacing: 0.08em;
  color: var(--tt-text);
  margin: 0 0 28px;
}

.top-test-page .tt-story-emotion__lead {
  font-size: 1rem;
  line-height: 2.2;
  color: var(--tt-text);
  margin: 0;
}

/* 「外苑前」などの地名強調 */
.top-test-page .tt-place {
  color: var(--tt-primary);
  font-style: normal;
  letter-spacing: 0.05em;
}

/* ================================================================
   3b. ストーリー（タイムライン）— Story Timeline
   ================================================================ */
.top-test-page .tt-section--story-timeline {
  background: var(--tt-bg-dark);
  padding: 120px 0;
}

/* 見出し: ライト版 */
.top-test-page .tt-section-head--light {
  text-align: center;
  margin-bottom: 64px;
}

.top-test-page .tt-section-en--light {
  display: block;
  font-size: 0.68rem;
  letter-spacing: 0.32em;
  color: var(--tt-accent-gold);
  text-transform: uppercase;
  margin-bottom: 10px;
  font-family: var(--tt-font-sans);
}

.top-test-page .tt-section-title--light {
  font-family: var(--tt-font-serif);
  font-size: 2rem;
  font-weight: normal;
  letter-spacing: 0.12em;
  color: var(--tt-text-light);
  position: relative;
  display: inline-block;
  padding-bottom: 20px;
  margin: 0;
}

.top-test-page .tt-section-title--light::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 32px;
  height: 1px;
  background: var(--tt-accent-gold);
}

/* ================================================================
   事業変遷グラフ（Ganttチャート）— p.7「事業の変遷」再現
   ================================================================ */

/* 横スクロールラッパー（スマホ対応） */
.top-test-page .tt-biz-chart-scroll {
  overflow-x: auto;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
}

/* グラフ全体：左軸 + エリア + 右軸 を横並び */
.top-test-page .tt-biz-chart {
  display: flex;
  gap: 0;
  height: 620px;       /* 上部の余裕を確保するため拡大 */
  min-width: 660px;
  align-items: stretch;
  padding-top: 24px;   /* 1988年バーの上に呼吸空間 */
  box-sizing: border-box;
}

/* ── 左軸：年度ラベル ─────────────────────── */
.top-test-page .tt-biz-chart__axis {
  width: 52px;
  flex-shrink: 0;
  position: relative;
  border-right: 1px solid rgba(184, 160, 112, 0.25);
}

.top-test-page .tt-biz-chart__year-label {
  position: absolute;
  right: 10px;
  transform: translateY(-50%);
  font-size: 0.63rem;
  color: var(--tt-text-light-sub);
  font-family: var(--tt-font-sans);
  letter-spacing: 0.04em;
  white-space: nowrap;
}

/* ── グラフエリア ────────────────────────── */
.top-test-page .tt-biz-chart__area {
  flex: 1;
  position: relative;
  overflow: hidden;
}

/* 横グリッドライン */
.top-test-page .tt-biz-chart__gridline {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(184, 160, 112, 0.12);
  pointer-events: none;
}

/* バー列群：flex で横並び */
.top-test-page .tt-biz-chart__bars {
  display: flex;
  height: 100%;
  gap: 3px;
  padding: 0 8px;
}

.top-test-page .tt-biz-chart__col {
  flex: 1;
  position: relative;
}

/* 個別バー（top/height は PHP インライン指定） */
.top-test-page .tt-biz-bar {
  position: absolute;
  width: 100%;
  border-radius: 2px 2px 0 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 6px;
  overflow: hidden;
}

/* ── バー下部ラベル行 ──────────────────────── */
.top-test-page .tt-biz-chart__label-row {
  display: flex;
  min-width: 660px;
  margin-top: 10px;
  align-items: flex-start;
}

/* 左軸の幅に合わせたスペーサー */
.top-test-page .tt-biz-chart__label-axis-gap {
  width: 52px;
  flex-shrink: 0;
}

/* バーと同じ flex 配置でラベルを並べる */
.top-test-page .tt-biz-chart__label-cols {
  flex: 1;
  display: flex;
  gap: 3px;
  padding: 0 8px;
}

.top-test-page .tt-biz-chart__label-col {
  flex: 1;
  font-size: 0.58rem;
  color: var(--tt-text-light-sub);
  font-family: var(--tt-font-sans);
  text-align: center;
  line-height: 1.45;
  word-break: keep-all;     /* 句の途中では折り返さない */
  overflow-wrap: break-word; /* 長い語は折り返す */
}

/* 右軸の幅に合わせたスペーサー */
.top-test-page .tt-biz-chart__label-eras-gap {
  width: 156px;
  flex-shrink: 0;
  margin-left: 8px;
}

/* バーカラー：グレー系で統一（明度差で区別） */
.top-test-page .tt-biz-bar--blue   { background: #7A8E9E; } /* 不動産売買仲介 */
.top-test-page .tt-biz-bar--grey1  { background: #556068; } /* 一般住宅賃貸仲介 */
.top-test-page .tt-biz-bar--grey2  { background: #4E5A62; } /* 賃貸不動産管理 */
.top-test-page .tt-biz-bar--grey3  { background: #48545C; } /* 海外投資家向け */
.top-test-page .tt-biz-bar--grey4  { background: #424E56; } /* 住環境事業 */
.top-test-page .tt-biz-bar--grey5  { background: #465058; } /* 区分リノベーション */
.top-test-page .tt-biz-bar--navy   { background: #687888; } /* 不動産オーナー業 */
.top-test-page .tt-biz-bar--green1 { background: #728292; } /* 一棟リノベーション */
.top-test-page .tt-biz-bar--green2 { background: #6A7A8A; } /* 一棟コンバージョン */
.top-test-page .tt-biz-bar--teal   { background: #627080; } /* 不動産開発 */
.top-test-page .tt-biz-bar--orange { background: #849298; } /* 民泊事業 */

/* ── 右軸：時代ラベル ─────────────────────── */
.top-test-page .tt-biz-chart__eras {
  width: 156px;
  flex-shrink: 0;
  position: relative;
  border-left: 1px solid rgba(184, 160, 112, 0.2);
  margin-left: 8px;
}

.top-test-page .tt-biz-chart__era {
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  transform: translateY(-50%);
  padding-left: 14px;
}

.top-test-page .tt-biz-chart__era-tick {
  position: absolute;
  left: 0;
  width: 10px;
  height: 1px;
  background: var(--tt-accent-gold);
}

.top-test-page .tt-biz-chart__era-text {
  font-size: 0.62rem;
  color: var(--tt-text-light-sub);
  line-height: 1.45;
  font-family: var(--tt-font-sans);
  letter-spacing: 0.02em;
}

/* ================================================================
   3c. ストーリー（パートナー）— Story Partners（横スライダー）
   ================================================================ */
.top-test-page .tt-section--story-partners {
  background: var(--tt-bg-white);
}

/* スライダーラッパー: コンテナ幅を超えて右端をチラ見せ */
.top-test-page .tt-partners-slider-wrap {
  /* overflow を clip にして右端チラ見せを有効化、上下は見せる */
  overflow: hidden;
}

.top-test-page .tt-partners-slider-container {
  /* コンテナ左端を基準に右へはみ出させる */
  overflow: visible;
  position: relative;
}

/* Swiper 本体 */
.top-test-page .tt-partners-swiper {
  overflow: visible; /* 右端のチラ見せ用 */
  padding-bottom: 48px; /* ページネーション分の余白 */
}

/* カード（swiper-slide の中身） */
.top-test-page .tt-partner-card {
  background: var(--tt-bg-white);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  cursor: default;
  user-select: none;
}

.top-test-page .tt-partner-card__photo {
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: var(--tt-bg-grey);
  display: flex;
  align-items: center;
  justify-content: center;
}

.top-test-page .tt-partner-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.top-test-page .tt-partner-card__photo-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.76rem;
  color: var(--tt-text-sub);
  font-family: var(--tt-font-sans);
  background: var(--tt-bg-grey);
}

.top-test-page .tt-partner-card__body {
  padding: 14px 18px 18px;
  flex: 1;
}

.top-test-page .tt-partner-card__role {
  display: block;
  font-size: 0.65rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--tt-primary);
  font-family: var(--tt-font-sans);
  margin-bottom: 8px;
}

.top-test-page .tt-partner-card__name {
  font-family: var(--tt-font-serif);
  font-size: 1.05rem;
  font-weight: normal;
  letter-spacing: 0.06em;
  color: var(--tt-text);
  margin: 0 0 12px;
}

.top-test-page .tt-partner-card__desc {
  font-size: 0.84rem;
  line-height: 1.95;
  color: var(--tt-text-sub);
  margin: 0;
}

/* ページネーション */
.top-test-page .tt-partners-swiper__pagination {
  bottom: 0;
}

.top-test-page .tt-partners-swiper__pagination .swiper-pagination-bullet {
  background: var(--tt-border);
  opacity: 1;
}

.top-test-page .tt-partners-swiper__pagination .swiper-pagination-bullet-active {
  background: var(--tt-primary);
}

/* 矢印ナビ（PCのみ） */
.top-test-page .tt-partners-swiper__prev,
.top-test-page .tt-partners-swiper__next {
  color: var(--tt-primary);
  top: calc(50% - 24px); /* ページネーション分を除いた中央 */
}

.top-test-page .tt-partners-swiper__prev::after,
.top-test-page .tt-partners-swiper__next::after {
  font-size: 1.1rem;
}

/* ================================================================
   レスポンシブ — タブレット（〜1024px）
   ================================================================ */
@media screen and (max-width: 1024px) {
  .top-test-page .tt-section {
    padding: 64px 0;
  }

  .top-test-page .tt-container {
    padding: 0 24px;
  }

  .top-test-page .tt-section-head {
    margin-bottom: 44px;
  }

  .top-test-page .tt-business-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .top-test-page .tt-project-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .top-test-page .tt-project-grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }

  .top-test-page .tt-owned-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .top-test-page .tt-message-inner {
    grid-template-columns: 260px 1fr;
    gap: 40px;
  }

  /* Story Emotion: tablet → 1カラム */
  .top-test-page .tt-story-emotion {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  /* Story Partners: tablet → Swiper 矢印を非表示 */
  .top-test-page .tt-partners-swiper__prev,
  .top-test-page .tt-partners-swiper__next {
    display: none;
  }
}

/* WordPress 管理バー対応（モバイル: 46px） */
@media screen and (max-width: 782px) {
  .admin-bar.page-template-page-toptest-php .site-header {
    top: 46px;
  }
}

/* ================================================================
   レスポンシブ — スマートフォン（〜768px）
   ================================================================ */
@media screen and (max-width: 768px) {
  .top-test-page .tt-section {
    padding: 48px 0;
  }

  .top-test-page .tt-container {
    padding: 0 16px;
  }

  .top-test-page .tt-section-head {
    margin-bottom: 32px;
  }

  .top-test-page .tt-section-title {
    font-size: 1.4rem;
  }

  /* スライダー（aspect-ratio ベースのため height 上書き不要） */
  .top-test-page .toptest-slider .swiper-button-next,
  .top-test-page .toptest-slider .swiper-button-prev {
    display: none;
  }

  /* キャッチコピー */
  .top-test-page .tt-section--catch {
    padding: 100px 0;
  }

  .top-test-page .tt-catch-title {
    font-size: 1.6rem;
  }

  /* Story Emotion */
  .top-test-page .tt-section--story-emotion {
    padding: 64px 0;
  }

  .top-test-page .tt-story-emotion__title {
    font-size: 1.6rem;
  }

  /* Story Timeline */
  .top-test-page .tt-section--story-timeline {
    padding: 64px 0;
  }

  /* Ganttチャート：タブレット */
  .top-test-page .tt-biz-chart {
    height: 480px;
  }

  .top-test-page .tt-biz-chart__eras {
    width: 120px;
  }

  .top-test-page .tt-biz-chart__era-text {
    font-size: 0.56rem;
  }

  .top-test-page .tt-biz-chart__label-eras-gap {
    width: 120px;
  }

  /* キャッチ eyebrow */
  .top-test-page .tt-catch-eyebrow {
    font-size: 0.72rem;
    margin-bottom: 20px;
  }

  /* Ganttチャート：スマホ（横スクロール維持、高さ縮小） */
  .top-test-page .tt-biz-chart {
    height: 380px;
    min-width: 580px;
  }

  .top-test-page .tt-biz-chart__label-row {
    min-width: 580px;
  }

  .top-test-page .tt-biz-chart__eras {
    width: 100px;
  }

  .top-test-page .tt-biz-chart__era-text {
    font-size: 0.52rem;
  }

  .top-test-page .tt-biz-chart__axis {
    width: 42px;
  }

  .top-test-page .tt-biz-chart__label-axis-gap {
    width: 42px;
  }

  .top-test-page .tt-biz-chart__label-eras-gap {
    width: 100px;
  }

  .top-test-page .tt-biz-chart__label-col {
    font-size: 0.52rem;
  }

  /* Story Partners: スマホ → 矢印非表示（Swiper breakpoint で slidesPerView:1 ） */
  .top-test-page .tt-partners-swiper__prev,
  .top-test-page .tt-partners-swiper__next {
    display: none;
  }

  /* 事業内容 */
  .top-test-page .tt-business-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  /* プロジェクトカード */
  .top-test-page .tt-project-grid--4,
  .top-test-page .tt-project-grid--3 {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* 所有物件 */
  .top-test-page .tt-owned-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* 企業活動 */
  .top-test-page .tt-activity-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  /* 沿革 */
  .top-test-page .tt-history {
    grid-template-columns: 1fr;
  }

  .top-test-page .tt-history__year {
    padding-bottom: 2px;
    border-bottom: none;
  }

  .top-test-page .tt-history__desc {
    padding-top: 4px;
  }

  /* 代表メッセージ */
  .top-test-page .tt-message-inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .top-test-page .tt-message-photo {
    aspect-ratio: 3 / 4;
    max-width: 280px;
  }

  /* 会社概要 */
  .top-test-page .tt-company {
    grid-template-columns: 1fr;
  }

  .top-test-page .tt-company dt {
    padding-bottom: 2px;
    border-bottom: none;
    padding-top: 14px;
  }

  .top-test-page .tt-company dd {
    padding-top: 2px;
  }

  .top-test-page .tt-section-more {
    margin-top: 32px;
  }
}

/* ================================================================
   レスポンシブ — 小型スマートフォン（〜480px）
   ================================================================ */
@media screen and (max-width: 480px) {
  .top-test-page .tt-section-title {
    font-size: 1.25rem;
  }

  .top-test-page .tt-catch-title {
    font-size: 1.1rem;
    line-height: 2.0;
  }

  .top-test-page .tt-business-card {
    padding: 22px 16px;
  }

  .top-test-page .tt-activity-card__body {
    padding: 20px 18px 24px;
  }

  .top-test-page .tt-btn {
    padding: 11px 28px;
  }
}