/* カラーパレット定義 */
:root {
    /* プライマリカラー */
    --primary01: #005BAC;         /* メインカラー1 */
    --primary02: #FFD400;         /* メインカラー2 */
    --primary03: #06C755;         /* メインカラー3 */
    --primary04: #dc3545;         /* メインカラー4 */
    --primary05: #6f42c1;         /* メインカラー5 */
    --primary06: #fd7e14;         /* メインカラー6 */
    --primary07: #20c997;         /* メインカラー7 */
    --primary08: #6c757d;         /* メインカラー8 */
    
    /* テキストカラー */
    --text01: #333333;            /* テキストカラー1（白系背景用） #333333*/
    --text02: #ffffff;            /* テキストカラー2（黒系背景用） */
    
    /* タグカラー */
    --tag-blog-bg: #fd7e14;            /* ブログタグ背景色（赤） */
    --tag-blog-text: #333333;          /* ブログタグ文字色（白） */
    --tag-info-bg: #06C755;            /* お知らせタグ背景色（赤） */
    --tag-info-text: #333333;          /* お知らせタグ文字色（白） */
    --tag-shopinfo-bg: #FFD400;        /* Shop Infoタグ背景色（赤） */
    --tag-shopinfo-text: #333333;      /* Shop Infoタグ文字色（白） */
    --tag-staff-bg: #FFD400;           /* スタッフタグ背景色（赤） */
    --tag-staff-text: #333333;         /* スタッフタグ文字色（白） */
    
    /* タブカラー */
    --tab-border: #333333;             /* タブボーダー色（赤） */
    --tab: #333333;                    /* タブ色（赤） */
    --tab-active-bg: #333333;          /* アクティブタブ背景色（赤） */
    --tab-active: #ffffff;             /* アクティブタブ色（赤） */
    
    /* アイテムカラー */
    --item-bg: #f0f0f0;                /* アイテム背景色（赤） */
    
    /* 背景カラー */
    --bg01: #f0f0f0;              /* 背景カラー1 */
    --bg02: #fff;                 /* 背景カラー2 */
    --bg03: #1a1a1a;              /* 背景カラー3（黒色系） */
    --bg04: #2d2d2d;              /* 背景カラー4（黒色系） */
    
                    /* その他 */
                --border01: #333333;             /* ボーダーカラー1 */
                --border02: #ddd;             /* ボーダーカラー2 */
    
    
    /* ヘッダー内 */
    --header-logo-bg: #005BAC;          /* ヘッダーロゴ背景色（赤） */
    --header-nav-bg: #FFD400;           /* ヘッダーナビ背景色（赤） */
    
    /* スタッフカラー */
    --staff-box-top-bg: #005BAC;        /* スタッフボックス上部背景色（赤） */
    --staff-box-bottom-bg: #ffffff;     /* スタッフボックス下部背景色（赤） */
    
    /* 記事カラー */
    --article-number: #005BAC;          /* 記事番号色（赤） */
    
    /* 料金プランカラー */
    --price-local-bg: #FF6B35;          /* ローカルプラン背景色（オレンジ） */
    --price-local-text: #ffffff;        /* ローカルプラン文字色（紫） */
    --price-standard-bg: #20B2AA;       /* スタンダードプラン背景色（ティール） */
    --price-standard-text: #ffffff;     /* スタンダードプラン文字色（紫） */
    --price-extensive-bg: #06C755;      /* エクステンシブプラン背景色（黄色） */
    --price-extensive-text: #ffffff;    /* エクステンシブプラン文字色（紫） */
    
    /* 疾患例タグカラー */
    --tag-disease-examples-bg: #FFD400; /* 疾患例タグ背景色（赤） */
    --tag-disease-examples-text: #333333; /* 疾患例タグ文字色（紫） */
    
    /* 疾患カードカラー */
    --case-number: #005BAC;              /* 疾患カード番号色（紫） */
    
    /* ノート・ポイントカラー */
    --note-title-bg: #ffffff;            /* ノートタイトル背景色（赤） */
    --note-title-text: #333333;          /* ノートタイトル文字色（白） */
    --point-title-bg: #ffffff;           /* ポイントタイトル背景色（赤） */
    --point-title-text: #333333;         /* ポイントタイトル文字色（白） */
    
    /* 見出し矢印カラー */
    --h3-arrow-bg: #005BAC;              /* h3矢印背景色（赤） */
    --h3-arrow-text: #ffffff;            /* h3矢印文字色（白） */
    
    /* 吹き出しカラー */
    --fukidashi-bg: #FFD400;             /* 吹き出し背景色（赤） */
    --fukidashi-text: #333333;           /* 吹き出し文字色（紫） */
    --fukidashi-txt: #FFD400;            /* 吹き出しテキスト色（赤） */
    
    /* 記事h4カラー */
    --article-h4-bg: #005BAC;            /* 記事h4背景色（赤） */
    
    /* モバイルタブバーカラー */
    --mobile-tabbar-bg: #ffffff;         /* モバイルタブバー背景色（赤） */
    
    /* バーガーメニューカラー */
    --hamburger-bg: #FFD400;             /* バーガーメニュー背景色（ピンク） */
    
    /* 予約リンクカラー */
    --reservation-online-bg: #005BAC;    /* ネット予約背景色（緑） */
    --reservation-online-text: #ffffff;  /* ネット予約文字色（白） */
    --reservation-line-bg: #06C755;      /* LINE予約背景色（LINE緑） */
    --reservation-line-text: #ffffff;    /* LINE予約文字色（白） */
    
    /* 固定メニューカラー */
    --fixed-nav-bg: #ffffff;             /* 固定メニュー背景色（紫） */
    
    /* ホバー効果 */
    --hover-opacity: 0.7;         /* ホバー時の透明度 */
    --hover-transition: 0.3s ease; /* ホバーアニメーション時間 */
    --hover01: #007bff;           /* ホバーカラー1 */
    --hover02: #e6c200;           /* ホバーカラー2（濃い黄色） */
    --hover03: #ddd;           /* ホバーカラー3（オレンジ色） */

    /* 料金計算フォーム */
    --form-title: #005BAC;        /* フォーム見出し・ラベル色（赤） */
    --first-tag-bg: #fd7e14;      /* 初回タグ背景色（緑） */
    --first-tag-text: #ffffff;    /* 初回タグ文字色（白） */
    --subsequent-tag-bg: #06C755; /* 二回目以降タグ背景色（グレー） */
    --subsequent-tag-text: #ffffff; /* 二回目以降タグ文字色（白） */
    --calculation-bg: #005bac;     /* 計算結果背景色（青） */
    --calculation-text: #ffffff;   /* 計算結果文字色（白） */
    --amount-text: #ffd400;        /* 金額文字色（黄色） */
    --radio-selected: #005bac;     /* ラジオボタン選択時色（青） */
                
                /* 鍼灸学生クイズ */
                --quiz-selected-bg: #333333;    /* クイズ選択状態背景色（濃いグレー） */
                --quiz-selected-text: #ffffff;  /* クイズ選択状態文字色（白） */
                --quiz-correct-bg: #06C755;     /* クイズ正解背景色（緑） */
                --quiz-correct-text: #ffffff;   /* クイズ正解文字色（白） */
                --quiz-incorrect-bg: #dc3545;   /* クイズ不正解背景色（赤） */
                --quiz-incorrect-text: #ffffff; /* クイズ不正解文字色（白） */
                --quiz-submit-bg: #333333;      /* クイズ送信ボタン背景色（濃いグレー） */
                --quiz-next-bg: #06C755;        /* クイズ次へボタン背景色（緑） */
                --quiz-next-text: #ffffff;      /* クイズ次へボタン文字色（白） */
                --quiz-next-hover: #218838;     /* クイズ次へボタンホバー色（濃い緑） */
                --quiz-result-correct-bg: #d4edda;    /* クイズ正解結果背景色（薄い緑） */
                --quiz-result-correct-text: #155724;  /* クイズ正解結果文字色（濃い緑） */
                --quiz-result-incorrect-bg: #f8d7da;   /* クイズ不正解結果背景色（薄い赤） */
                --quiz-result-incorrect-text: #721c24; /* クイズ不正解結果文字色（濃い赤） */

    /* アイコンカラー */
    --icon-date: #333333;          /* 日付アイコン色（青） */

    /* 影（box-shadow） */
    --shadow-color-rgb: 0, 0, 0; /* 影の基本色（RGB） */
    --shadow-sm: 0 1px 2px rgba(var(--shadow-color-rgb), 0.08);
    --shadow-md: 0 4px 8px rgba(var(--shadow-color-rgb), 0.10);
    --shadow-lg: 0 8px 24px rgba(var(--shadow-color-rgb), 0.12);
    --shadow-top-md: 0 -2px 10px rgba(var(--shadow-color-rgb), 0.10);
}