/*
 * デザイントークン（値の唯一の置き場所）
 *
 * 旧テーマの CSS とテーマ設定から実際に使われていた値だけを集めた（docs/analysis/tokens.md）。
 * 画面幅の切り替えは 770px（以下が SP）。メディアクエリでは変数が使えないため数値で書く。
 */
:root {
	/* 色 */
	--color-text: #333;
	--color-heading: #000;
	--color-muted: #666;
	--color-ink: #222;            /* ヘッダー・パンくず（pickedcolor1） */
	--color-accent: #de7000;      /* リンクのホバー・本文リンク（pickedcolor2 / 3） */
	--color-white: #fff;
	--color-black: #000;
	--color-border: #ccc;
	--color-border-light: #ddd;
	--color-surface: #f5f7f6;     /* フッター */
	--color-card: #fbfbfb;        /* お知らせのカード */
	--color-card-border: #eee;
	--color-button: #ccc;         /* 「詳細を見る」などのボタン */
	--color-overlay: rgba(0, 0, 0, 0.2);

	/* 書体 */
	--font-sans: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	--font-serif: "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	--font-number: Arial, sans-serif;

	/* 文字サイズ */
	--fs-base: 15px;   /* content_font_size */
	--fs-xs: 10px;
	--fs-s: 12px;
	--fs-m: 14px;

	/* 幅・高さ */
	--width-site: 1260px;    /* 旧 #main_col */
	--width-inner: 1200px;
	--width-narrow: 840px;   /* 旧 #left_col（固定ページ本文） */
	--gutter: 30px;
	--gutter-sp: 20px;
	--header-height: 60px;
	--header-height-sp: 55px;
	--crumb-height: 60px;
	--crumb-height-sp: 40px;

	/* 動き */
	--duration-fast: 0.2s;
	--duration-slow: 0.5s;

	/*
	 * アイコン（旧テーマのアイコンフォント design_plus の代わり）。
	 * mask-image に使い、色は background-color（currentColor）で付ける。
	 */
	--icon-chevron-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 3.5 17 12l-8.5 8.5' fill='none' stroke='%23000' stroke-width='2.6'/%3E%3C/svg%3E");
	--icon-chevron-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 3.5 7 12l8.5 8.5' fill='none' stroke='%23000' stroke-width='2.6'/%3E%3C/svg%3E");
	--icon-chevron-up: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 16.5 12 8l8.5 8.5' fill='none' stroke='%23000' stroke-width='2.6'/%3E%3C/svg%3E");
	--icon-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 7.5 12 16l8.5-8.5' fill='none' stroke='%23000' stroke-width='2.6'/%3E%3C/svg%3E");
	--icon-home: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5 1 12h3.2v9.5h6v-6.2h3.6v6.2h6V12H23z'/%3E%3C/svg%3E");
	--icon-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9.5' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Cpath d='M12 6v6.5l4 2.5' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3C/svg%3E");
	--icon-folder: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M1.5 4h8l2.2 2.5h10.8v13.5h-21z'/%3E%3C/svg%3E");
	--icon-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 4.5h20v3H2zm0 6h20v3H2zm0 6h20v3H2z'/%3E%3C/svg%3E");
	--icon-facebook: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.6 24V13.1h3.7l.6-4.3h-4.3V6.1c0-1.2.4-2.1 2.1-2.1H18V.2C17.6.1 16.3 0 14.8 0 11.6 0 9.4 2 9.4 5.6v3.2H5.7v4.3h3.7V24z'/%3E%3C/svg%3E");
	--icon-instagram: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='2' width='20' height='20' rx='5.5' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Ccircle cx='12' cy='12' r='4.6' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Ccircle cx='17.6' cy='6.4' r='1.5'/%3E%3C/svg%3E");
	--icon-rss: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='4' cy='20' r='2.8'/%3E%3Cpath d='M1.5 9.5a13 13 0 0 1 13 13M1.5 2a20.5 20.5 0 0 1 20.5 20.5' fill='none' stroke='%23000' stroke-width='3'/%3E%3C/svg%3E");
}