@charset "UTF-8";
/**************************************************************
【色追加方法】

《1》:rootに下記項目を追加
「****」はカラー名
filterは下記サイトにてプライマリーカラーをfilter化してください。
https://angel-rs.github.io/css-color-filter-generator/

  --color-****-primary: #******;
  --color-****-primary-dark: #******;
  --color-****-primary-light: #******;
  --color-****-accent: #******;
  --color-****-accent-dark: #******;
  --color-****-secondary: #******;
  --color-****-secondary-sub: #******;
  --color-****-open: orange;
  --color-****-nairan: green;
  --color-****-filter: ******; 

《2》rootで設定したカラーをdata-themeとして登録
body:where([data-theme=****]) {
  --color-primary: var(--color-****-primary);
  --color-primary-dark: var(--color-****-primary-dark);
  --color-primary-light: var(--color-****-primary-light);
  --color-accent: var(--color-****-accent);
  --color-accent-dark: var(--color-****-accent-dark);
  --color-secondary: var(--color-****-secondary);
  --color-secondary-sub: var(--color-****-secondary-sub);
  --color-open: var(--color-****-open);
  --color-nairan: var(--color-****-nairan);
  --color-image-filter: var(--color-****-filter);
}

《3》/inc/color.incに《1》で設定したカラー名を入力

**************************************************************/
/* カラー値 */
:root {
  --color-blue-primary: #004875;
  --color-blue-second: #00a5e5;
  --color-blue-bg01: #cbeefe;
  --color-blue-bg02: #a7dcfc;
  --color-blue-bg03: #7fbbf9;
  --color-blue-line01: #80cdfe;
  --color-blue-line02: #5ca9fc;
  --color-blue-line03: #4281f9;
  --color-blue-tablebg01: #fff;
  --color-blue-tablebg02: #ffffd1;
  --color-blue-tablebg03: #d9ebff;
  --color-blue-btn-light: #8dbaff;
  --color-blue-btn-dark: #7eb1ff;
  --color-blue-btn-textshadow: #0c3d87;
  --color-blue-filter: brightness(0) saturate(100%) invert(42%) sepia(93%) saturate(797%) hue-rotate(173deg)
    brightness(97%) contrast(86%);
  --color-brown-primary: #c48653;
  --color-brown-second: #c07f45;
  --color-brown-bg01: #efcdb1;
  --color-brown-bg02: #e6f2b2;
  --color-brown-bg03: #b4ef9d;
  --color-brown-line01: #eab38c;
  --color-brown-line02: #dce868;
  --color-brown-line03: #91ea68;
  --color-brown-tablebg01: #e4ae80;
  --color-brown-tablebg02: #fff;
  --color-brown-tablebg03: #f3d7c1;
  --color-brown-btn-light: #d69865;
  --color-brown-btn-dark: #8c4e1b;
  --color-brown-btn-textshadow: #8c4e1b;
  --color-brown-filter: brightness(0) saturate(100%) invert(36%) sepia(71%) saturate(490%) hue-rotate(345deg)
    brightness(100%) contrast(99%);
  --color-gray-primary: #aeaeae;
  --color-gray-second: #afafaf;
  --color-gray-bg01: #ddd;
  --color-gray-bg02: #ddd;
  --color-gray-bg03: #ddd;
  --color-gray-line01: #b2b2b2;
  --color-gray-line02: #b2b2b2;
  --color-gray-line03: #b2b2b2;
  --color-gray-tablebg01: #ddd;
  --color-gray-tablebg02: #fff;
  --color-gray-tablebg03: #f2f2f2;
  --color-gray-btn-light: #a5a5a5;
  --color-gray-btn-dark: #5b5b5b;
  --color-gray-btn-textshadow: #5b5b5b;
  --color-gray-filter: brightness(0) saturate(100%) invert(67%) sepia(46%) saturate(10%) hue-rotate(357deg)
    brightness(94%) contrast(83%);
  --color-green-primary: #46b48c;
  --color-green-second: #aaffb4;
  --color-green-bg01: #dcffe1;
  --color-green-bg02: #dcffeb;
  --color-green-bg03: #d3f5f6;
  --color-green-line01: #beecbe;
  --color-green-line02: #b4ebd6;
  --color-green-line03: #a9ecf5;
  --color-green-tablebg01: #dcffe1;
  --color-green-tablebg02: #fff;
  --color-green-tablebg03: #f1fff3;
  --color-green-btn-light: #7dd5b5;
  --color-green-btn-dark: #419979;
  --color-green-btn-textshadow: #419979;
  --color-green-filter: brightness(0) saturate(100%) invert(74%) sepia(9%) saturate(2275%) hue-rotate(107deg)
    brightness(83%) contrast(81%);
  --color-orange-primary: #ffa000;
  --color-orange-second: #ffa000;
  --color-orange-bg01: #eed7ad;
  --color-orange-bg02: #e8eba8;
  --color-orange-bg03: #d1ffa9;
  --color-orange-line01: #ffbb71;
  --color-orange-line02: #dbd853;
  --color-orange-line03: #b2ef78;
  --color-orange-tablebg01: #ffd392;
  --color-orange-tablebg02: #fff;
  --color-orange-tablebg03: #ffe8ca;
  --color-orange-btn-light: #f69b01;
  --color-orange-btn-dark: #885601;
  --color-orange-btn-textshadow: #885601;
  --color-orange-filter: brightness(0) saturate(100%) invert(82%) sepia(34%) saturate(3944%) hue-rotate(348deg)
    brightness(100%) contrast(98%);
  --color-pink-primary: #ff94fc;
  --color-pink-second: #ff94fc;
  --color-pink-bg01: #ffcaff;
  --color-pink-bg02: #e6e2ff;
  --color-pink-bg03: #ccf9ff;
  --color-pink-line01: #fda4ff;
  --color-pink-line02: #c9c5ff;
  --color-pink-line03: #98f2f4;
  --color-pink-tablebg01: #ff94fc;
  --color-pink-tablebg02: #fff;
  --color-pink-tablebg03: #feebff;
  --color-pink-btn-light: #d982d2;
  --color-pink-btn-dark: #8f3888;
  --color-pink-btn-textshadow: #8f3888;
  --color-pink-filter: brightness(0) saturate(100%) invert(78%) sepia(63%) saturate(830%) hue-rotate(254deg)
    brightness(104%) contrast(104%);
}

body:where([data-theme=blue]) {
  --color-primary: var(--color-blue-primary);
  --color-second: var(--color-blue-second);
  --color-bg01: var(--color-blue-bg01);
  --color-bg02: var(--color-blue-bg02);
  --color-bg03: var(--color-blue-bg03);
  --color-line01: var(--color-blue-line01);
  --color-line02: var(--color-blue-line02);
  --color-line03: var(--color-blue-line03);
  --color-tablebg01: var(--color-blue-tablebg01);
  --color-tablebg02: var(--color-blue-tablebg02);
  --color-tablebg03: var(--color-blue-tablebg03);
  --color-btn-light: var(--color-blue-btn-light);
  --color-btn-dark: var(--color-blue-btn-dark);
  --color-btn-textshadow: var(--color-blue-btn-textshadow);
  --color-image-filter: var(--color-blue-filter);
}

body:where([data-theme=brown]) {
  --color-primary: var(--color-brown-primary);
  --color-second: var(--color-brown-second);
  --color-bg01: var(--color-brown-bg01);
  --color-bg02: var(--color-brown-bg02);
  --color-bg03: var(--color-brown-bg03);
  --color-line01: var(--color-brown-line01);
  --color-line02: var(--color-brown-line02);
  --color-line03: var(--color-brown-line03);
  --color-tablebg01: var(--color-brown-tablebg01);
  --color-tablebg02: var(--color-brown-tablebg02);
  --color-tablebg03: var(--color-brown-tablebg03);
  --color-btn-light: var(--color-brown-btn-light);
  --color-btn-dark: var(--color-brown-btn-dark);
  --color-btn-textshadow: var(--color-brown-btn-textshadow);
  --color-image-filter: var(--color-brown-filter);
}

body:where([data-theme=gray]) {
  --color-primary: var(--color-gray-primary);
  --color-second: var(--color-gray-second);
  --color-bg01: var(--color-gray-bg01);
  --color-bg02: var(--color-gray-bg02);
  --color-bg03: var(--color-gray-bg03);
  --color-line01: var(--color-gray-line01);
  --color-line02: var(--color-gray-line02);
  --color-line03: var(--color-gray-line03);
  --color-tablebg01: var(--color-gray-tablebg01);
  --color-tablebg02: var(--color-gray-tablebg02);
  --color-tablebg03: var(--color-gray-tablebg03);
  --color-btn-light: var(--color-gray-btn-light);
  --color-btn-dark: var(--color-gray-btn-dark);
  --color-btn-textshadow: var(--color-gray-btn-textshadow);
  --color-image-filter: var(--color-gray-filter);
}

body:where([data-theme=green]) {
  --color-primary: var(--color-green-primary);
  --color-second: var(--color-green-second);
  --color-bg01: var(--color-green-bg01);
  --color-bg02: var(--color-green-bg02);
  --color-bg03: var(--color-green-bg03);
  --color-line01: var(--color-green-line01);
  --color-line02: var(--color-green-line02);
  --color-line03: var(--color-green-line03);
  --color-tablebg01: var(--color-green-tablebg01);
  --color-tablebg02: var(--color-green-tablebg02);
  --color-tablebg03: var(--color-green-tablebg03);
  --color-btn-light: var(--color-green-btn-light);
  --color-btn-dark: var(--color-green-btn-dark);
  --color-btn-textshadow: var(--color-green-btn-textshadow);
  --color-image-filter: var(--color-green-filter);
}

body:where([data-theme=orange]) {
  --color-primary: var(--color-orange-primary);
  --color-second: var(--color-orange-second);
  --color-bg01: var(--color-orange-bg01);
  --color-bg02: var(--color-orange-bg02);
  --color-bg03: var(--color-orange-bg03);
  --color-line01: var(--color-orange-line01);
  --color-line02: var(--color-orange-line02);
  --color-line03: var(--color-orange-line03);
  --color-tablebg01: var(--color-orange-tablebg01);
  --color-tablebg02: var(--color-orange-tablebg02);
  --color-tablebg03: var(--color-orange-tablebg03);
  --color-btn-light: var(--color-orange-btn-light);
  --color-btn-dark: var(--color-orange-btn-dark);
  --color-btn-textshadow: var(--color-orange-btn-textshadow);
  --color-image-filter: var(--color-orange-filter);
}

body:where([data-theme=pink]) {
  --color-primary: var(--color-pink-primary);
  --color-second: var(--color-pink-second);
  --color-bg01: var(--color-pink-bg01);
  --color-bg02: var(--color-pink-bg02);
  --color-bg03: var(--color-pink-bg03);
  --color-line01: var(--color-pink-line01);
  --color-line02: var(--color-pink-line02);
  --color-line03: var(--color-pink-line03);
  --color-tablebg01: var(--color-pink-tablebg01);
  --color-tablebg02: var(--color-pink-tablebg02);
  --color-tablebg03: var(--color-pink-tablebg03);
  --color-btn-light: var(--color-pink-btn-light);
  --color-btn-dark: var(--color-pink-btn-dark);
  --color-btn-textshadow: var(--color-pink-btn-textshadow);
  --color-image-filter: var(--color-pink-filter);
}

* {
  margin: 0px;
  padding: 0;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  padding: 0;
  margin: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img {
  border: 0;
}

img,
embed,
object,
iframe {
  vertical-align: bottom;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-weight: normal;
  font-style: normal;
}

ol, ul {
  list-style: none;
}

caption, th {
  text-align: left;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0px;
  padding: 0px;
}

q:before, q:after {
  content: "";
}

abbr, acronym {
  border: 0;
}

table {
  border-spacing: 0;
}

* html table, *:first-child + html table {
  border-collapse: collapse;
}

caption, th {
  text-align: left;
  font-weight: normal;
}

table, th, td, img {
  border: 0;
}

input {
  vertical-align: middle;
}

q:before, q:after {
  content: "";
}

ul {
  list-style: none;
}

a {
  color: #0125ff;
  text-decoration: underline;
}
a:hover {
  color: #8898fb;
  text-decoration: underline;
}

/***IE7?????h?~***/
*:first-child + html img {
  display: block;
}