/**
 * DOWA ECO-SYSTEM 共通コンポーネントCSS
 *
 * page-*.php のインラインCSSから抽出した共通スタイル。
 * 各クラスの使用ページはコメントで記載。
 *
 * 注意: style.css で既に定義されているスタイル（.service-card, .news-item,
 * .banner-card のホバーエフェクト等）はここには含まない。
 */

/* ==========================================================================
   カード・セクション
   ========================================================================== */

/**
 * .section-card — カードのホバーエフェクト
 * 使用: service-soil, soil-buried-waste, soil-costfix, soil-groundwater,
 *       soil-remediation, soil-survey(section-header), waste
 */
.section-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.section-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

/**
 * .business-card — ビジネスカードのホバーエフェクト
 * 使用（0.2s版）: service-soil, soil-buried-waste, soil-costfix, soil-groundwater,
 *                  soil-remediation, soil-survey, waste, waste-flow, waste-permit,
 *                  recycle-composite
 * 使用（0.3s版）: service-global, global-china, global-indonesia, global-myanmar,
 *                  global-singapore, global-thailand, global-us-europe,
 *                  service-consulting, service-logistics
 * → 0.2s版をデフォルトとして採用（使用ページ数が多い）
 *   0.3s版のページはインラインでオーバーライド
 */
.business-card {
  transition: all 0.2s ease;
}

.business-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

/**
 * .content-section — コンテンツセクションのホバーエフェクト
 * 使用: service-consulting, service-logistics
 */
.content-section {
  transition: all 0.3s ease;
}

.content-section:hover {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   ボタン
   ========================================================================== */

/**
 * .action-button — アクションボタンのホバーエフェクト
 * 使用: service-soil, soil-costfix, waste, waste-flow, waste-permit
 */
.action-button {
  transition: all 0.2s ease;
}

.action-button:hover {
  background-color: #006578;
}

/**
 * .link-button — リンクボタンのホバーエフェクト
 * 使用: service-soil, soil-costfix
 * 注意: recycle-compositeでは異なるスタイル（inline維持）
 */
.link-button {
  transition: all 0.2s ease;
}

.link-button:hover {
  background-color: #006578;
  transform: translateX(4px);
}

/* ==========================================================================
   ナビゲーション
   ========================================================================== */

/**
 * .service-nav-item — サービスナビのホバーエフェクト
 * 使用: service-soil, service-recycle, service-waste, corp-domestic,
 *       corp-domestic-consulting, corp-domestic-home-appliances,
 *       corp-domestic-logistics, corp-domestic-recycle-foods,
 *       corp-domestic-recycle-metal, corp-domestic-recycle-vehicle,
 *       corp-domestic-soil, corp-domestic-wastemanagement
 */
.service-nav-item {
  transition: all 0.2s ease;
}

.service-nav-item:hover {
  background-color: rgba(0, 128, 146, 0.1);
}

/**
 * .nav-link — アンダーラインアニメーション付きナビリンク
 * 使用: soil-buried-waste, soil-groundwater
 */
.nav-link {
  transition: all 0.2s ease;
  position: relative;
}

.nav-link:hover {
  color: #018d9e;
}

.nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #018d9e;
  transition: width 0.2s ease;
}

.nav-link:hover::after {
  width: 100%;
}

/* ==========================================================================
   リンク
   ========================================================================== */

/**
 * .company-link — 会社リンクのホバーエフェクト
 * 使用（透明版）: service-recycle, service-waste
 * 使用（移動版）: soil-buried-waste, soil-groundwater, soil-remediation
 * → 透明版をデフォルトとして採用
 *   移動版のページはインラインでオーバーライド
 */
.company-link {
  transition: all 0.2s ease;
}

.company-link:hover {
  background-color: rgba(0, 128, 146, 0.05);
}

/**
 * .related-company-link — 関連会社リンクのホバーエフェクト
 * 使用: service-consulting, service-logistics
 */
.related-company-link {
  transition: all 0.3s ease;
}

.related-company-link:hover {
  background-color: rgba(0, 128, 146, 0.05);
}

/**
 * .section-anchor-link — セクションアンカーリンクのホバーエフェクト
 * 使用: service-consulting, service-logistics
 */
.section-anchor-link {
  transition: all 0.2s ease;
}

.section-anchor-link:hover {
  color: #008092;
}

/* ==========================================================================
   ニュース・リリースページ
   ========================================================================== */

/**
 * .sidebar-link — サイドバーリンクのホバー・アクティブ
 * 使用: release, release-sustainability
 */
.sidebar-link {
  transition: all 0.2s ease;
}

.sidebar-link:hover {
  color: #008d9f;
}

.sidebar-link.active {
  color: #008d9f;
}

/**
 * .year-link — 年リンクのホバー・アクティブ
 * 使用: release, release-sustainability
 */
.year-link {
  transition: all 0.2s ease;
}

.year-link:hover {
  color: #5c5c5c;
}

.year-link.active {
  color: #008d9f;
}

/**
 * .pagination-link — ページネーションリンク
 * 使用: release, release-sustainability, search-en
 */
.pagination-link {
  transition: all 0.2s ease;
}

.pagination-link:hover {
  color: #5c5c5c;
  text-decoration: underline;
}

.pagination-link.active {
  color: #5c5c5c;
  text-decoration: underline;
}

/**
 * .pagination-arrow — ページネーション矢印
 * 使用: release, release-sustainability, search-en
 */
.pagination-arrow {
  transition: all 0.2s ease;
}

.pagination-arrow:hover {
  background-color: #f0f0f0;
}

/**
 * .search-item — 検索結果アイテムのホバー
 * 使用: search-en
 * 注意: 1ファイルのみだが、将来検索ページが増える可能性があるため含む
 */
.search-item {
  transition: all 0.3s ease;
}

.search-item:hover {
  background-color: rgba(0, 128, 146, 0.05);
}

/* ==========================================================================
   画像・メディア
   ========================================================================== */

/**
 * .image-mask — 画像の角丸マスク
 * 使用: service-soil, soil-buried-waste, soil-costfix, soil-groundwater,
 *       soil-remediation, soil-survey
 */
.image-mask {
  border-radius: 16px;
  overflow: hidden;
}

/* ==========================================================================
   フォント
   ========================================================================== */

/**
 * .font-termina — Terminaフォントの代替定義
 * 使用: service-soil, soil-buried-waste, soil-costfix, soil-groundwater,
 *       soil-remediation, soil-survey, waste, waste-flow, waste-permit,
 *       recycle, recycle-composite
 * 注意: style.css に .font-['Termina'] の定義があるが、
 *       インラインでは .font-termina として使われている
 */
.font-termina {
  font-family: 'Termina', Arial, sans-serif;
}

/* ==========================================================================
   テーブル（グループ会社ページ共通）
   ========================================================================== */

/**
 * .info-table — 情報テーブルのレスポンシブスタイル
 * 使用: corp-domestic-consulting, corp-domestic-home-appliances,
 *       corp-domestic-logistics, corp-domestic-recycle-foods,
 *       corp-domestic-recycle-metal, corp-domestic-recycle-vehicle,
 *       corp-domestic-soil, corp-domestic-wastemanagement
 */
.info-table th {
  width: 180px;
  vertical-align: top;
  padding-right: 16px;
}

.info-table td {
  padding-bottom: 12px;
}

@media (max-width: 1023px) {
  .info-table th {
    width: 100%;
    display: block;
    padding-bottom: 4px;
  }

  .info-table td {
    display: block;
    padding-bottom: 16px;
  }

  .info-table tr {
    display: block;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 12px;
    margin-bottom: 12px;
  }

  .info-table tr:last-child {
    border-bottom: none;
  }
}

/**
 * .info-table-3col — 3列情報テーブルのレスポンシブスタイル
 * 使用: corp-domestic-consulting, corp-domestic-home-appliances,
 *       corp-domestic-logistics, corp-domestic-recycle-foods,
 *       corp-domestic-recycle-metal, corp-domestic-recycle-vehicle,
 *       corp-domestic-soil, corp-domestic-wastemanagement
 */
.info-table-3col th.factory-name {
  width: 200px;
  vertical-align: top;
  padding-right: 16px;
  border-right: 1px solid #e5e5e5;
}

.info-table-3col th.label {
  width: 240px;
  vertical-align: top;
  padding-left: 16px;
  padding-right: 16px;
}

.info-table-3col td {
  padding-bottom: 12px;
  padding-left: 16px;
}

@media (max-width: 1023px) {
  .info-table-3col th.factory-name {
    width: 100%;
    display: block;
    padding-bottom: 8px;
    border-right: none;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 12px;
  }

  .info-table-3col th.label {
    width: 100%;
    display: block;
    padding-left: 0;
    padding-bottom: 4px;
  }

  .info-table-3col td {
    display: block;
    padding-left: 0;
    padding-bottom: 16px;
  }

  .info-table-3col tr {
    display: block;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 12px;
    margin-bottom: 12px;
  }

  .info-table-3col tr:last-child {
    border-bottom: none;
  }
}

/**
 * .category-dropdown — カテゴリドロップダウンのトランジション
 * 使用: corp-domestic, corp-domestic-consulting, corp-domestic-home-appliances,
 *       corp-domestic-logistics, corp-domestic-recycle-foods,
 *       corp-domestic-recycle-metal
 */
.category-dropdown {
  transition: all 0.3s ease;
}

/* ==========================================================================
   リリースページ グラデーション背景
   ========================================================================== */

/**
 * .gradient-bg — リリースページ用グラデーション背景
 * 使用: release, release-sustainability
 * 注意: gradient-bg.css の .gradient-bg-main とは別のクラス
 */
.gradient-bg {
  background-image: linear-gradient(221deg, rgba(205, 255, 255, 1) 0%, rgba(230, 255, 239, 1) 100%);
}
