/* -------------------- */
:root {
	--color-r1: #ff0000;
	--color-r1-hover: #ff0000;
	--color-r2: #ff69b4;
	--color-r2-hover: #ff69b4;
	--color-b1: #1176d4;
	--color-b1-hover: #1176d4;
	--color-b2: #6495ed;
	--color-b2-hover: #6495ed;
	--color-g1: #228b22;
	--color-g1-hover: #228b22;
	--color-g2: #32cd32;
	--color-g2-hover: #32cd32;
	--color-o1: #ffa500;
	--color-o1-hover: #ffa500;
	--color-o2: #ffd700;
	--color-o2-hover: #ffd700;
}

/* --------------------共通 */
.cst-text,
.cst-box {
	cursor: pointer;
	transition: all 0.3s ease 0s;
}
/* --------------------テキスト表示:共通 */
.cst-text.-link {
	color: var(--color-b1);
	font-size: 100%;
	text-decoration: underline;
}
/* --------------------BOX表示:共通 */
.cst-box {
	display: inline-block;
	padding: 0em 0em 0em 0em; /* 0.6em 2em */
	margin: 0em 0em 0em; /* 0 0 1em */
	background-color: var(--color-g1);
	color: #fff;
	font-size: 100%;
	min-height: 1.0em; /* 1.5em */
	text-align: center;
}
.cst-box>span {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 1.0em; /* 1.5em */
}
/* --------------------共通:太字 */
.cst-text.-bold,
.cst-box.-bold {
	font-weight: bold;
}
/* --------------------共通:サイズ */
.cst-text.-size90,
.cst-box.-size90 {
	font-size: 90%;
}
.cst-text.-size100,
.cst-box.-size100 {
	font-size: 100%;
}
.cst-text.-size110,
.cst-box.-size110 {
	font-size: 110%;
}
.cst-text.-size120,
.cst-box.-size120 {
	font-size: 120%;
}
.cst-text.-size130,
.cst-box.-size130 {
	font-size: 130%;
}
.cst-text.-size140,
.cst-box.-size140 {
	font-size: 140%;
}
.cst-text.-size150,
.cst-box.-size150 {
	font-size: 150%;
}
.cst-text.-size160,
.cst-box.-size160 {
	font-size: 160%;
}
.cst-text.-size170,
.cst-box.-size170 {
	font-size: 170%;
}
.cst-text.-size180,
.cst-box.-size180 {
	font-size: 180%;
}
.cst-text.-size190,
.cst-box.-size190 {
	font-size: 190%;
}
.cst-text.-size200,
.cst-box.-size200 {
	font-size: 200%;
}
/* --------------------テキスト表示:カラー */
/* レッド */
.cst-text.-color-r1 {
	color: var(--color-r1);
}
.cst-text.-color-r2 {
	color: var(--color-r2);
}
/* グリーン */
.cst-text.-color-g1 {
	color: var(--color-g1);
}
.cst-text.-color-g2 {
	color: var(--color-g2);
}
/* ブルー */
.cst-text.-color-b1 {
	color: var(--color-b1);
}
.cst-text.-color-b2 {
	color: var(--color-b2);
}
/* オレンジ */
.cst-text.-color-o1 {
	color: var(--color-o1);
}
.cst-text.-color-o2 {
	color: var(--color-o2);
}
/* --------------------テキスト表示:オンマウス */
.cst-text.-hover:hover{
	color: var(--color-b1-hover);
}
/* レッド */
.cst-text.-hover-r1:hover {
	color: var(--color-r1-hover);
}
.cst-text.-hover-r2:hover {
	color: var(--color-r2-hover);
}
/* グリーン */
.cst-text.-hover-g1:hover {
	color: var(--color-g1-hover);
}
.cst-text.-hover-g2:hover {
	color: var(--color-g2-hover);
}
/* ブルー */
.cst-text.-hover-b1:hover {
	color: var(--color-b1-hover);
}
.cst-text.-hover-b2:hover {
	color: var(--color-b2-hover);
}
/* オレンジ */
.cst-text.-hover-o1:hover {
	color: var(--color-o1-hover);
}
.cst-text.-hover-o2:hover {
	color: var(--color-o2-hover);
}
/* --------------------テキスト表示:配置 */
.cst-text.-left,
.cst-text.-center,
.cst-text.-right{
	display: inline-block;
	width: 100%;
}
.cst-text.-left{
	text-align: left;
}
.cst-text.-center{
	text-align: center;
}
.cst-text.-right{
	text-align: right;
}
/* --------------------BOX角丸表示 */
.cst-box.-radius {
	border-radius: 5px;
}
/* --------------------BOX表示:カラー */
/* レッド */
.cst-box.-color-r1 {
	background-color: var(--color-r1);
}
.cst-box.-color-r2 {
	background-color: var(--color-r2);
}
/* グリーン */
.cst-box.-color-g1 {
	background-color: var(--color-g1);
}
.cst-box.-color-g2 {
	background-color: var(--color-g2);
}
/* ブルー */
.cst-box.-color-b1 {
	background-color: var(--color-b1);
}
.cst-box.-color-b2 {
	background-color: var(--color-b2);
}
/* オレンジ */
.cst-box.-color-o1 {
	background-color: var(--color-o1);
}
.cst-box.-color-o2 {
	background-color: var(--color-o2);
}
/* --------------------BOX表示:オンマウス */
.cst-box.-hover-4:hover {
	opacity: 0.4;
}
.cst-box.-hover-5:hover {
	opacity: 0.5;
}
.cst-box.-hover-6:hover {
	opacity: 0.6;
}
.cst-box.-hover-7:hover {
	opacity: 0.7;
}
.cst-box.-hover-8:hover {
	opacity: 0.8;
}
.cst-box.-hover-9:hover {
	opacity: 0.9;
}
/* --------------------BOX表示:横幅 */
.cst-box.-wp50 {
	min-width: 50%;
}
.cst-box.-wp60 {
	min-width: 60%;
}
.cst-box.-wp70 {
	min-width: 70%;
}
.cst-box.-wp80 {
	min-width: 80%;
}
.cst-box.-wp90 {
	min-width: 90%;
}
.cst-box.-wp100 {
	min-width: 100%;
}
.cst-box.-w50 {
	min-width: 50px;
}
.cst-box.-w100 {
	min-width: 100px;
}
.cst-box.-w150 {
	min-width: 150px;
}
.cst-box.-w200 {
	min-width: 200px;
}
.cst-box.-w250 {
	min-width: 250px;
}
.cst-box.-w300 {
	min-width: 300px;
}
.cst-box.-w350 {
	min-width: 350px;
}
.cst-box.-w400 {
	min-width: 400px;
}
.cst-box.-w450 {
	min-width: 450px;
}
.cst-box.-w500 {
	min-width: 500px;
}
.cst-box.-w550 {
	min-width: 550px;
}
.cst-box.-w600 {
	min-width: 600px;
}
.cst-box.-w650 {
	min-width: 650px;
}
.cst-box.-w700 {
	min-width: 700px;
}
.cst-box.-w750 {
	min-width: 750px;
}
.cst-box.-w800 {
	min-width: 800px;
}
/* --------------------BOX表示:縦幅 */
.cst-box.-h15 {
	min-height: 1.5em;
}
.cst-box.-h15>span {
	min-height: 1.5em;
}
.cst-box.-h20 {
	min-height: 2em;
}
.cst-box.-h20>span {
	min-height: 2em;
}
.cst-box.-h25 {
	min-height: 2.5em;
}
.cst-box.-h25>span {
	min-height: 2.5em;
}
.cst-box.-h30 {
	min-height: 3em;
}
.cst-box.-h30>span {
	min-height: 3em;
}
.cst-box.-h35 {
	min-height: 3.5em;
}
.cst-box.-h35>span {
	min-height: 3.5em;
}
.cst-box.-h40 {
	min-height: 4em;
}
.cst-box.-h40>span {
	min-height: 4em;
}
.cst-box.-h45 {
	min-height: 4.5em;
}
.cst-box.-h45>span {
	min-height: 4.5em;
}
.cst-box.-h50 {
	min-height: 5em;
}
.cst-box.-h50>span {
	min-height: 5em;
}
.cst-box.-h55 {
	min-height: 5.5em;
}
.cst-box.-h55>span {
	min-height: 5.5em;
}
.cst-box.-h60 {
	min-height: 6em;
}
.cst-box.-h60>span {
	min-height: 6em;
}
/* --------------------BOX表示:配置 */
.cst-box.-left,
.cst-box.-center,
.cst-box.-right{
	display: block;
	max-width: max-content;
}
.cst-box.-left{
	margin-left: 0;
	margin-right: auto;
}
.cst-box.-center{
	margin-left: auto;
	margin-right: auto;
}
.cst-box.-right{
	margin-left: auto;
	margin-right: 0;
}
/* -------------------- */