@charset "UTF-8";
/*
  Dojo Navi（tepss.com/dojo-navi/）— CSS カスタムプロパティ
  ==============================================================
  ソース: tepss_dojo-navi/dojo_tenda/assets/css/
  更新: 2026-06
  ==============================================================
*/

:root {

  /* ── テキスト ── */
  --color-text:        #202020;   /* base.css: body { color: #202020 } */
  --color-text-light:  #7c7b7b;   /* header h1 */
  --color-text-white:  #ffffff;

  /* ── プライマリ（赤） ── */
  --color-primary:        #e60012;  /* utility.css: .btn-re { background: #e60012 } */
  --color-primary-hover:  #eb8686;  /* .btn-re:hover */
  --color-primary-light:  #ffc4c4;  /* .btn-wh:hover */

  /* ── アクセント（青灰） ── */
  --color-accent:       #b5cbd9;   /* top.css: .support-item { border: 1px solid #b5cbd9 } */
  --color-accent-dark:  #6497b8;   /* .price-item:nth-of-type(3) */

  /* ── セクション背景 ── */
  --color-bg-cream:   #faf2e2;   /* top.css: .dojoNavi / .feature / .contact */
  --color-bg-blue:    #e8eef2;   /* top.css: .merit-arrow / .support */
  --color-bg-gray:    #f5f4f4;
  --color-bg-white:   #ffffff;
  --color-bg-dark:    #292929;   /* base.css: .footer-inner */

  /* ── ボーダー ── */
  --color-border:       #202020;
  --color-border-light: #dedede;  /* top.css: .col4-box .box-item */
  --color-border-accent:#b5cbd9;
  --color-border-cream: #f5e5c5;  /* top.css: .dojoNavi-item */

  /* ── 数値強調色 ── */
  --color-num-accent:   #f5d085;  /* top.css: .feature-item span */
  --color-highlight:    #fddb7f;  /* テキストマーカー */

  /* ── レイアウト ── */
  --container-max:     1100px;
  --container-padding: 20px;

  /* ── タイポグラフィ ── */
  --font-size-base: 1.6rem;
  --line-height-base: 1.6;

  /* ── スペーシング ── */
  --section-padding-pc: 100px;
  --section-padding-sp: 28px;

  /* ── シャドウ ── */
  --shadow-card: none;   /* dojo-naviは影ボーダーなし */

  /* ── リンク・追加アクセント（dojo.css / theme.css / style2.css 由来） ── */
  --color-link:        #2266aa;  /* dojo.css: .breadcrumb li a / #footer .list_link li a / .support_link a（省略形 #26a も同色） */
  --color-heading-accent: #31802a; /* style2.css: section.post-content h2 { color } / theme.css: .widget_recommend_post h4 { background-color } */
  --color-link-hover:  #2581c4;  /* theme.css: a.more-link:hover { background } / style2.css: .leadArea a:hover, .leadArea .more { color } */

  /* ── 追加（2026-07-14 var()統一時に発見。--color-text(#202020)とは別の純黒等） ── */
  --color-black:       #000000; /* base.css: .header-top .top-btn / .footer 各種ボーダー・アイコン背景 */
  --color-price-accent: #eb6464; /* top.css: .merit-circle 文字色 / .price-item:nth-of-type(1) */
  --color-bg-light-gray: #ededed; /* content.css: .page-benefits/.page-faq の薄グレー背景・ボーダー */
  --color-text-gray:   #404040;  /* content.css: 本文の中間グレーテキスト */
  --color-bg-cream-stripe: #fdf9f1; /* top.css/tenda.css: .feature 等の斜めストライプ背景（薄い方） */
  --color-online-blue: #0082d5;  /* top.css: .online（オンライン相談セクション） */
  --color-border-gray: #cccccc;  /* base.css/utility.css/top.css: 汎用の薄ボーダー */
  --color-border-input: #dddddd; /* base.css: .pageTop-btn等 / utility.css: input系ボーダー（--color-border-lightの#dedededとは別値） */
  --color-pagetop-bg:  #212121;  /* base.css: .pageTop-btn 背景 */
  --color-deco-gray:   #eeecec;  /* base.css: .logo-btn-link 右下斜め装飾 */
  --color-step-current-bg: #222222;    /* base.css: .p-step__item.is-current 背景 */
  --color-step-current-border: #333333; /* base.css: .p-step__item.is-current ボーダー */
  --color-online-bg:   #ecf6fe;  /* top.css: a.online 背景（薄水色） */
  --color-bg-hover-gray: #e2e2e2; /* utility.css: .submit-back:hover 背景 */
  --color-bg-label:    #f7f7f7;  /* utility.css: .dl-table-style dl dt.any::before（任意ラベル）背景 */
  --color-text-label:  #5e5d5d;  /* utility.css: 任意ラベルの文字色 */
  --color-bg-table-header: #f5f5f5; /* utility.css: .table-style th 背景 */
  --color-shadow-gray: #999999;  /* utility.css: box-shadow の影色 */
  --color-bg-stripe-blue: #f1f5f7; /* content.css: .features-box/.demo-box の偶数番ストライプ背景 */
  --color-bg-pink-light: #fdefef; /* content.css: 薄ピンク背景ボックス */
  --color-marker-red-light: #fbe5e7; /* content.css: .c-marker（赤系）のマーカー背景 */
  --color-disabled-gray: #9d9d9d; /* content.css: .faq-box:hover（コメントアウト中） */
  --color-border-medium-gray: #666666; /* tenda.css: .reserve a:hover ボーダー */
  --color-marker-yellow: #fff799; /* tenda.css: strong.marker_yellow 背景 */
}