@charset "utf-8";
/*------------------------------------------------------------------------------------------------*/
/* Color Scheme [カラースキーム] -------------------------------------------------------------------
--------------------------------------------------------------------------------------------------*/
/* Variable Setting [変数設定]
	 Elements [要素]
	 Generic Classes [汎用クラス]
--------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------*/
/* Variable Setting [変数設定] /////////////////////////////////////////////////////////////////////
--------------------------------------------------------------------------------------------------*/
:root {
	--txt: #28323c;

	--trans: transparent; /* transparent */
	--wh: #fff; /* _white */
	--ulgy: #f7f7f7; /* ultra_light-gray */
	--lgy: #ededed; /* light-gray */
	--gy: #d9d9d9; /* -gray */
	--dgy:#b2b2b2; /* dark-gray */
	--udgy: #7c7c7c; /* ultra_dark-gray */
	--ibk:#262626; /* ink-black */
	--bk: #000; /* -black */

	--prd: #fee7e7; /* pale-red */
	--ulrd: #f9c1c1; /* ultra_light-red */
	--lrd: #f48282; /* light-red */
	--rd: #f16363; /* -red */
	--drd:#cd5454; /* dark-red */

	--ppk: #ffe0eb; /* pale-pink */
	--ulpk: #ffbdd4; /* ultra_light-pink */
	--lpk: #f6709f; /* light-pink */
	--pk: #e4608e; /* -pink */
	--dpk:#c54974; /* dark-pink */

	--por: #ffe1d3; /* pale-orange */
	--ulor: #ffb796; /* ultra_light-orange */
	--lor: #f68f5f; /* light-orange */
	--or: #e2774c; /* -orange */
	--dor:#e96734; /* dark-orange */

	--pyl: #f9f6d5; /* pale-yellow */
	--ulyl: #f0e88a; /* ultra_light-yellow */
	--lyl: #ecd330; /* light-yellow */
	--yl: #ebc04c; /* -yellow */
	--dyl:#f2b40c; /* dark-yellow */

	--pgr: #caeaed; /* pale-green */
	--ulgr: #9ddbe1; /* ultra_light-green */
	--lgr: #3cb6c4; /* light-green */
	--gr: #0ba4b5; /* -green */
	--dgr:#098c9a; /* dark-green */

	--paq: #d6ebf6; /* pale-blue */
	--ulaq: #9cd7ec; /* ultra_light-blue */
	--laq: #40a8e4; /* light-blue */
	--aq: #1f97dd; /* -blue */
	--daq:#007eb5; /* dark-blue */

	--pbl: #d7e2f2; /* pale-blue */
	--ulbl: #abc9f2; /* ultra_light-blue */
	--lbl: #5793e5; /* light-blue */
	--bl: #2d78df; /* -blue */
	--dbl:#2666be; /* dark-blue */

	--ppr: #e8e3f5; /* pale-purple */
	--ulpr: #cab3ff; /* ultra_light-purple */
	--lpr: #9468fd; /* light-purple */
	--pr: #8d5cd7; /* -purple */
	--dpr:#6639aa; /* dark-purple */

/* CTI color */
	--pcti: #dde8f0; /* pale-cti */
	--ulcti: #a7cfea; /* ultra_light-cti */
	--lcti: #4ea0d5; /* light-cti */
	--cti: #2288ca; /* -cti */
	--dcti:#1d74ac; /* dark-cti */
}

/*------------------------------------------------------------------------------------------------*/
/* Elements [要素] /////////////////////////////////////////////////////////////////////////////////
--------------------------------------------------------------------------------------------------*/
/* Selection [選択カラー]
--------------------------------------------------------------------------------------------------*/
::selection {
	background-color: var(--lyl);
	color: var(--ibk);
}
	::-moz-selection {
	background-color: var(--lyl);
	color: var(--ibk);
}

/*------------------------------------------------------------------------------------------------*/
/* Generic Classes [汎用クラス] ////////////////////////////////////////////////////////////////////
--------------------------------------------------------------------------------------------------*/
/* Text [テキスト]
	 Background [背景カラー]
	 Button [ボタン]
--------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------*/
/* Text [テキスト]
--------------------------------------------------------------------------------------------------*/
.txt_wh {color: var(--wh);}
.txt_ulgy {color: var(--ulgy);}
.txt_lgy {color: var(--lgy);}
.txt_gy {color: var(--gy);}
.txt_dgy {color: var(--dgy);}
.txt_udgy {color: var(--udgy);}
.txt_ibk {color: var(--ibk);}
.txt_bk {color: var(--bk);}
.txt_drd {color: var(--drd);}
.txt_dpk {color: var(--dpk);}
.txt_dor {color: var(--dor);}
.txt_dyl {color: var(--dyl);}
.txt_dgr {color: var(--dgr);}
.txt_daq {color: var(--daq);}
.txt_dbl {color: var(--dbl);}
.txt_dpr {color: var(--dpr);}
.txt_dcti {color: var(--dcti);}

/*------------------------------------------------------------------------------------------------*/
/* Background [背景カラー]
--------------------------------------------------------------------------------------------------*/
.bg_trans {
	background: var(--trans);
}
.bg_ulgy {
	background: var(--ulgy);
	background: linear-gradient(180deg, var(--wh), var(--ulgy));
}
.bg_gy {
	background: var(--gy);
	background: linear-gradient(180deg, var(--lgy), var(--gy));
}
.bg_udgy {
	background: var(--udgy);
	background: linear-gradient(180deg, var(--dgy), var(--udgy));
}
.bg_ulrd {
	background: var(--ulrd);
	background: linear-gradient(180deg, var(--prd), var(--ulrd));
}
.bg_lrd {
	background: var(--lrd);
	background: linear-gradient(180deg, var(--ulrd), var(--lrd));
}
.bg_rd {
	background: var(--rd);
	background: linear-gradient(180deg, var(--lrd), var(--rd));
}
.bg_drd {
	background: var(--drd);
	background: linear-gradient(180deg, var(--rd), var(--drd));
}
.bg_ulpk {
	background: var(--ulpk);
	background: linear-gradient(180deg, var(--ppk), var(--ulpk));
}
.bg_lpk {
	background: var(--lpk);
	background: linear-gradient(180deg, var(--ulpk), var(--lpk));
}
.bg_pk {
	background: var(--pk);
	background: linear-gradient(180deg, var(--lpk), var(--pk));
}
.bg_dpk {
	background: var(--dpk);
	background: linear-gradient(180deg, var(--pk), var(--dpk));
}
.bg_ulor {
	background: var(--ulor);
	background: linear-gradient(180deg, var(--por), var(--ulor));
}
.bg_lor {
	background: var(--lor);
	background: linear-gradient(180deg, var(--ulor), var(--lor));
}
.bg_or {
	background: var(--or);
	background: linear-gradient(180deg, var(--lor), var(--or));
}
.bg_dor {
	background: var(--dor);
	background: linear-gradient(180deg, var(--or), var(--dor));
}
.bg_ulyl {
	background: var(--ulyl);
	background: linear-gradient(180deg, var(--pyl), var(--ulyl));
}
.bg_lyl {
	background: var(--lyl);
	background: linear-gradient(180deg, var(--ulyl), var(--lyl));
}
.bg_yl {
	background: var(--yl);
	background: linear-gradient(180deg, var(--lyl), var(--yl));
}
.bg_dyl {
	background: var(--dyl);
	background: linear-gradient(180deg, var(--yl), var(--dyl));
}
.bg_ulgr {
	background: var(--ulgr);
	background: linear-gradient(180deg, var(--pgr), var(--ulgr));
}
.bg_lgr {
	background: var(--lgr);
	background: linear-gradient(180deg, var(--lgr), var(--lgr));
}
.bg_gr {
	background: var(--gr);
	background: linear-gradient(180deg, var(--lgr), var(--gr));
}
.bg_dgr {
	background: var(--dgr);
	background: linear-gradient(180deg, var(--gr), var(--dgr));
}
.bg_plaq {
	background: var(--ulaq);
	background: linear-gradient(180deg, var(--paq), var(--ulaq));
}
.bg_laq {
	background: var(--laq);
	background: linear-gradient(180deg, var(--ulaq), var(--laq));
}
.bg_aq {
	background: var(--aq);
	background: linear-gradient(180deg, var(--laq), var(--aq));
}
.bg_daq {
	background: var(--daq);
	background: linear-gradient(180deg, var(--aq), var(--daq));
}
.bg_plbl {
	background: var(--ulbl);
	background: linear-gradient(180deg, var(--pbl), var(--ulbl));
}
.bg_lbl {
	background: var(--lbl);
	background: linear-gradient(180deg, var(--ulbl), var(--lbl));
}
.bg_bl {
	background: var(--bl);
	background: linear-gradient(180deg, var(--lbl), var(--bl));
}
.bg_dbl {
	background: var(--dbl);
	background: linear-gradient(180deg, var(--bl), var(--dbl));
}
.bg_ulpr {
	background: var(--ulpr);
	background: linear-gradient(180deg, var(--ppr), var(--ulpr));
}
.bg_lpr {
	background: var(--lpr);
	background: linear-gradient(180deg, var(--ulpr), var(--lpr));
}
.bg_pr {
	background: var(--pr);
	background: linear-gradient(180deg, var(--lpr), var(--pr));
}
.bg_dpr {
	background: var(--dpr);
	background: linear-gradient(180deg, var(--pr), var(--dpr));
}

/*------------------------------------------------------------------------------------------------*/
/* Button [ボタン]
--------------------------------------------------------------------------------------------------*/
.btn.bg_gy:hover {
	border: 3px solid var(--ulgy);
	background: var(--gy);
	background: linear-gradient(180deg, var(--gy), var(--ulgy));
}
.btn.bg_rd:hover {
	border: 3px solid var(--ulrd);
	background: var(--lrd);
	background: linear-gradient(180deg, var(--drd), var(--rd));
}
.btn.bg_pk:hover {
	border: 3px solid var(--ulpk);
	background: var(--lpk);
	background: linear-gradient(180deg, var(--dpk), var(--pk));
}
.btn.bg_or:hover {
	border: 3px solid var(--ulor);
	background: var(--lor);
	background: linear-gradient(180deg, var(--dor), var(--or));
}
.btn.bg_yl:hover {
	border: 3px solid var(--ulyl);
	background: var(--lyl);
	background: linear-gradient(180deg, var(--dyl), var(--yl));
}
.btn.bg_gr:hover {
	border: 3px solid var(--ulgr);
	background: var(--lgr);
	background: linear-gradient(180deg, var(--dgr), var(--gr));
}
.btn.bg_aq:hover {
	border: 3px solid var(--ulaq);
	background: var(--laq);
	background: linear-gradient(180deg, var(--daq), var(--aq));
}
.btn.bg_bl:hover {
	border: 3px solid var(--ulbl);
	background: var(--lbl);
	background: linear-gradient(180deg, var(--dbl), var(--bl));
}
.btn.bg_pr:hover {
	border: 3px solid var(--ulpr);
	background: var(--lpr);
	background: linear-gradient(180deg, var(--dpr), var(--pr));
}

/*------------------------------------------------------------------------------------------------*/
/* Button Text [ボタンテキストカラー]
--------------------------------------------------------------------------------------------------*/
.bg_trans {
	background: var(--trans);
}
.bg_ulgy {
	background: var(--ulgy);
	background: linear-gradient(180deg, var(--wh), var(--ulgy));
}
.bg_gy {
	background: var(--gy);
	background: linear-gradient(180deg, var(--lgy), var(--gy));
}
.btn.bg_ulrd,
.btn.bg_lrd,
.btn.bg_rd,
.btn.bg_drd,
.btn.bg_ulpk,
.btn.bg_lpk,
.btn.bg_pk,
.btn.bg_dpk,
.btn.bg_ulor,
.btn.bg_lor,
.btn.bg_or,
.btn.bg_dor,
.btn.bg_ulyl,
.btn.bg_lyl,
.btn.bg_yl,
.btn.bg_dyl,
.btn.bg_ulgr,
.btn.bg_udgy,
.btn.bg_lgr,
.btn.bg_gr,
.btn.bg_dgr,
.btn.bg_plaq,
.btn.bg_laq,
.btn.bg_aq,
.btn.bg_daq,
.btn.bg_plbl,
.btn.bg_lbl,
.btn.bg_bl,
.btn.bg_dbl,
.btn.bg_ulpr,
.btn.bg_lpr,
.btn.bg_pr,
.btn.bg_dpr {
	color: #fff;
}

/*------------------------------------------------------------------------------------------------*/