/* kd-tokens.css
 * 色・余白などの変数。ルートサイト(kaitoridan.com)の配色に合わせている。
 *   ネイビー  #2b3366 (ヘッダー・フッター)      rgb(43,51,102)
 *   空色      #98caff (セクション背景)          rgb(152,202,255)
 *   薄グレー  #edf2f6 (ページ背景)              rgb(237,242,246)
 *   コーラル  #ff785f (ボタン)                  rgb(255,120,95)
 * 配色を変えるときは、このファイルの変数だけ触ればよい。
 * `html:root` にしているのは、Arkhe がヘッド内に出力する :root の変数より優先させるため。
 */
html:root {
	/* ---- ルートサイトの配色 ---- */
	--kd-navy: #2b3366;
	--kd-navy-dark: #1f2550;
	--kd-sky: #98caff;
	--kd-sky-pale: #e6f1ff;
	--kd-page: #edf2f6;
	--kd-coral: #ff785f;
	--kd-coral-dark: #f0553a;
	--kd-yellow: #ffe02a;
	--kd-text: #101828;
	--kd-heading: #0f172b;
	--kd-link: #155dfc;
	--kd-border: #d5dce6;
	--kd-card-bg: #e8f3ff; /* 買取率カードの本文色 */
	--kd-card-line: #c9d8ea; /* カード内の区切り線 */
	--kd-topbar: #333333;
	--kd-topbar-text: #f0e1c3;
	--kd-header-h: 64px;
	--kd-radius: 12px;
	--kd-font: Arial, Helvetica, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;

	/* ---- Arkhe ---- */
	--ark-color--main: var(--kd-navy);
	--ark-color--text: var(--kd-text);
	--ark-color--link: var(--kd-link);
	--ark-color--bg: var(--kd-page);
	--ark-color--gray: var(--kd-page);
	--ark-width--container: 1200px;
	--ark-width--article: 920px;
	--ark-width--article--slim: 920px;
	--ark-font_family: var(--kd-font);

	/* ---- SWELL ブロック互換CSS(swell-compat.css)が参照する変数 ---- */
	--color_main: var(--kd-navy);
	--color_main_thin: rgba(43, 51, 102, 0.06);
	--color_main_dark: var(--kd-navy-dark);
	--color_text: var(--kd-text);
	--color_link: var(--kd-link);
	--color_border: hsla(0, 0%, 78%, 0.5);
	--color_gray: rgba(43, 51, 102, 0.06);
	--color_content_bg: #fff;
	--color_border--table: var(--kd-border);

	--color_list_check: var(--kd-navy);
	--color_list_num: var(--kd-navy);
	--color_list_good: #86dd7b;
	--color_list_triangle: #f4e03a;
	--color_list_bad: #f36060;

	--color_faq_q: var(--kd-coral);
	--color_faq_a: var(--kd-navy);

	/* アイコン付きボックス(is-style-big_icon_* など。記事内で多用されているので元の色を維持) */
	--color_icon_good: #3cd250;
	--color_icon_good_bg: #ecffe9;
	--color_icon_bad: #4b73eb;
	--color_icon_bad_bg: #eafaff;
	--color_icon_info: #f578b4;
	--color_icon_info_bg: #fff0fa;
	--color_icon_announce: #ffa537;
	--color_icon_announce_bg: #fff5f0;
	--color_icon_pen: #7a7a7a;
	--color_icon_pen_bg: #f7f7f7;
	--color_icon_book: #787364;
	--color_icon_book_bg: #f8f6ef;
	--color_icon_point: #ffa639;
	--color_icon_check: #86d67c;
	--color_icon_batsu: #f36060;
	--color_icon_hatena: #5295cc;
	--color_icon_caution: #f7da38;
	--color_icon_memo: #84878a;

	/* 記事中の「濃い色/薄い色」の文字色・背景色(has-swl-deep-01-color 等。意味が変わらないよう元の色を維持) */
	--color_deep01: #e44141;
	--color_deep02: #3d79d5;
	--color_deep03: #63a84d;
	--color_deep04: #f09f4d;
	--color_pale01: #fff2f0;
	--color_pale02: #f3f8fd;
	--color_pale03: #f1f9ee;
	--color_pale04: #fdf9ee;
	--color_mark_blue: #d8f0ff;
	--color_mark_green: #e0ffe7;
	--color_mark_yellow: #ffec9b;
	--color_mark_orange: #fcdbe8;

	--color-review_star: #ffb400;

	--swl-text_color--black: #333;
	--swl-text_color--white: #fff;
	--swl-color_hov_gray: rgba(3, 2, 2, 0.05);
	--swl-color_shadow: rgba(0, 0, 0, 0.12);
	--swl-box_shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 4px 4px -4px rgba(0, 0, 0, 0.1);
	--swl-img_shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 4px 8px -4px rgba(0, 0, 0, 0.2);
	--swl-btn_shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 0 4px 8px -4px rgba(0, 0, 0, 0.2);
	--swl-box_padding: 1.5em;
	--swl-block-margin: 2em;
	--swl-pad_container: 16px;
	--swl-fz--xs: 0.75em;
	--swl-fz--small: 0.9em;
	--swl-fz--normal: 1rem;
	--swl-fz--medium: 1.1em;
	--swl-fz--large: 1.25em;
	--swl-fz--huge: 1.6em;
	--swl-radius--2: 2px;
	--swl-radius--4: 4px;
	--swl-radius--8: 8px;
	--swl-list-padding--left: 1.5em;
	--swl-list-padding--has_bg: 1em 1em 1em 1.75em;
	--swl-letter_spacing: 0;
}