@charset "utf-8";

/**
 * デザイントークン: カラーシステム
 * エルコムテーマの統一カラーパレット
 */

:root {
  /* === Primary Colors === */
  --col_primary: #e11f1f;         /* メインカラー（赤） */
  --col_primary_hover: #c41414;   /* ホバー時の濃い赤 */
  --col_primary_light: #f5576c;   /* 薄い赤（アクセント用） */
  
  /* === Base Colors === */
  --col_white: #fff;              /* 白 */
  --col_black: #000;              /* 黒 */
  --col_font: #222;               /* メインフォントカラー */
  
  /* === Gray Scale === */
  --col_gray: #e0e0e0;            /* ライトグレー（ボーダー等） */
  --col_gray_medium: #6c757d;     /* ミディアムグレー */
  --col_gray_dark: #495057;       /* ダークグレー */
  
  /* === Background Colors === */
  --bg_gray: #f5f6f7;             /* 背景グレー */
  --bg_dark: #252525;             /* ダーク背景（フッター等） */
  --bg_card: #f8f9fa;             /* カード背景 */
  
  /* === Gradient Backgrounds (Sub Pages) === */
  --gradient_business: linear-gradient(135deg, #667eea 0%, #764ba2 100%);  /* 事業内容（紫） */
  --gradient_equipment: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); /* 設備紹介（ピンク） */
  --gradient_company: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);   /* 会社概要（グレー） */
  --gradient_recruit: linear-gradient(135deg, #667eea 0%, #764ba2 100%);   /* 採用情報（青） */
  --gradient_contact: linear-gradient(135deg, #28a745 0%, #20c997 100%);   /* お問い合わせ（緑） */
  
  /* === New Page Gradients === */
  --gradient_news: linear-gradient(135deg, #ff7a00 0%, #ff9500 100%);      /* ニュース（オレンジ） */
  --gradient_works: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);     /* 加工実績（青） */
  --gradient_column: linear-gradient(135deg, #059669 0%, #10b981 100%);    /* 技術コラム（緑） */
  --gradient_faq: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);       /* FAQ（紫） */
  
  /* === Status Colors === */
  --col_success: #28a745;         /* 成功 */
  --col_warning: #ffc107;         /* 警告 */
  --col_danger: #dc3545;          /* エラー */
  --col_info: #17a2b8;            /* 情報 */
  
  /* === Transparency Variations === */
  --col_white_10: rgba(255, 255, 255, 0.1);
  --col_white_20: rgba(255, 255, 255, 0.2);
  --col_white_30: rgba(255, 255, 255, 0.3);
  --col_white_40: rgba(255, 255, 255, 0.4);
  --col_white_90: rgba(255, 255, 255, 0.9);
  
  --col_black_10: rgba(0, 0, 0, 0.1);
  --col_black_20: rgba(0, 0, 0, 0.2);
  --col_black_30: rgba(0, 0, 0, 0.3);
  --col_black_40: rgba(0, 0, 0, 0.4);
  
  /* === Border Colors === */
  --border_light: rgba(0, 0, 0, 0.04);
  --border_medium: rgba(0, 0, 0, 0.06);
  --border_dark: rgba(0, 0, 0, 0.08);
}