:root {
    --main-color: #F6BD0A; /* メインカラー: ロゴの黄色 */
    --main-color-fore: #201512; /* メインカラーの前景色: ロゴの黒 */
    --main-color-light: #FFD54F; /* 明るいメインカラー */
    --main-color-light-fore: #201512; /* 明るいメインカラーの前景色: ロゴの黒 */
    --main-color-dark: #ffa524; /* 暗いメインカラー */
    --main-color-dark-fore: #201512; /* 暗いメインカラーの前景色: ロゴの黒 */

    --gradation-main-light: #FFF3B0;
    --gradation-main-dark: #F6BD0A;

    --accent-color: #C9030F; /* アクセントカラー: ロゴの赤 */
    --accent-color-fore: #FFFFFF; /* アクセントカラーの前景色: 白 */
    --accent-color-light: #E57373; /* 明るいアクセントカラー */
    --accent-color-light-fore: #201512; /* 明るいアクセントカラーの前景色: ロゴの黒 */

    --breadcrumb-custom-bg-color: #F6BD0A; /* パンくずリストの背景色: ロゴの黄色 */
    --breadcrumb-custom-color: #201512; /* パンくずリストの色: ロゴの黒 */

    --loading-color: #F6BD0A; /* ローディングカラー: ロゴの黄色 */

    --sample-color: #201512; /* サンプルカラー: ロゴの黒 */
    --sample-bg-color: #F6BD0A; /* サンプル背景色: ロゴの黄色 */

    --button-hover-shadow-color: rgba(201, 3, 15, 0.5); /* ボタンホバーの影の色: 半透明のロゴの赤 */

    --tr-odd-bg-color: #FFF3B0; /* 奇数行の背景色: 明るいソフトな黄色 */
}