@charset "UTF-8";
/* ============================================================
   変数（色・文字・幅）
   値は旧 CSS（/css/layout.css・sp.css）と同じ。デザインを変えるときは、まずここを変える
   ブレークポイント：768px（タブレット以上＝旧 CSS の PC 表示）、1024px（PC）
   ※ CSS の変数は @media の条件には使えないので、数字は各ファイルに直接書く
   ============================================================ */
@layer tokens {
	:root {
		/* 色 */
		--c-text: #333;            /* PC の文字 */
		--c-text-sp: #111;         /* スマホの文字 */
		--c-link: #0B623A;         /* 本文のリンク・パンくず */
		--c-green-dark: #063A23;   /* スマホのメニュー背景・サイドの文字 */
		--c-green-deep: #063922;   /* 見出し */
		--c-gold: #B8A32C;         /* イベントの日付 */
		--c-white: #FFF;
		--c-line: #EBEBEB;         /* プルダウンの区切り */
		--c-line-side: #C2C5B4;    /* サイドメニューの区切り */
		--c-bg-side-hover: #F3F3F0;
		--c-bg-side-sp: #C8F2DA;   /* スマホのサイドバナーの背景 */
		--c-bg-bread: #EAEAE3;
		--c-border-vis: #E4E4E4;
		--c-footer-text: #CCC;

		/* 文字 */
		--font-base: Meiryo, "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
		--fs-base: 16px;           /* スマホ。768px 以上は下で 14px */
		--ls-base: 0;
		--lh-base: 1.6;
		--fw-reset: 600;           /* 旧 sp.css がスマホで見出し・段落などを太字寄りにしていた値 */
		--c-body: var(--c-text-sp);

		/* 幅（768px 以上の固定幅。旧 CSS と同じ） */
		--w-site: 1010px;          /* ヘッダー・メニュー・パンくず・フッター */
		--w-wrap: 1020px;          /* 本文＋サイドメニュー */
		--w-main: 740px;           /* 本文 */
		--w-side: 250px;           /* サイドメニュー */

		/* 影・重なり */
		--shadow-bnr: rgba(0, 0, 0, 0.2) 0 0 8px 1px;
		--shadow-drop: rgba(0, 0, 0, 0.2) 0 0 7px 0;
		--z-header: 1000;
		--z-menu: 10000;
		--z-pagetop: 10000;
	}

	@media (min-width: 768px) {
		:root {
			--fs-base: 14px;
			--ls-base: 0.4px;
			--lh-base: normal;
			--fw-reset: normal;
			--c-body: var(--c-text);
		}
	}
}