@font-face { font-family: Raleway;  src: url(/css/fonts/Raleway/Raleway-VariableFont_wght.ttf); }
@font-face { font-family: CenturyGothic;  src: url(/css/fonts/CenturyGothic/CenturyGothic-Regular.ttf); }

:root
{
	--master-background-color: #4B8AF3;

	--main-background-color: #99BFFF;
	--main-color: #4B8AF3;
	--main-active-color: #4B8AF3;
	--main-sub-color: #D2E8E3;
	--main-dark-text: #121212;
	--popin-background-color: #F5F5F5;
}

*
{
	font-size: 20px;
	line-height: 24px;
	color: #000000;
	box-sizing: border-box;
	user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none; /* iOS */
    -webkit-tap-highlight-color: transparent;
}
*
,input[type=text]
,select
{
	font-family: Raleway, Calibri, Arial;
}
input
,textarea
{
	user-select: text !important;
	-webkit-user-select: text !important;
	-webkit-touch-callout: default !important; /* iOS */
}
a
{
	-webkit-tap-highlight-color: transparent;
}

.C_BUTTON23
{
    display: flex;
    justify-content: center;
    gap: 8px;
	cursor: pointer;
	padding: 12px 24px 12px 24px;
	background-color: var(--main-active-color);
	border: 0px;
	border-radius: 32px;
	color: #FFFFFF !important;
	font-weight: 900;
	font-size: 24px;
	white-space: nowrap;
	text-decoration: none;
	box-shadow: 3px 3px 2px #CCCCCC;
}
.C_BUTTON23.C_RED	{	background-color: #BB0000; }
.C_BUTTON23.C_GRAY	{	background-color: #BBBBBB; }
.C_BUTTON23 > i.fa
{
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}
.C_BUTTON23 > font
{
	color: inherit;
	font-size: inherit;
	line-height: inherit;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
}
@media screen and (max-width: 720px)
{
	.C_BUTTON23
	{
		padding: 1vw 3vw 1vw 3vw;
		border-radius: 8vw;
		font-size: 3vw;
		line-height: 4vw;
	    gap: 4vw;
	}
}
@media screen and (max-width: 640px)
{
	.C_BUTTON23
	{
		padding: 3vw 4vw 3vw 4vw;
		border-radius: 8vw;
		font-size: 6vw;
		line-height: 7vw;
	}
}

.C_BUTTON66
{
	position: relative;
	display: inline-block;
	width: 48px;
	height: 48px;
	border-radius: 24px;
	border: 0px;
	background-color: #FFFFFF;
	box-shadow: 3px 3px 2px 0px #CCCCCC, 0px 0px 3px 0px #CCCCCC;
	cursor: pointer;
}
.C_BUTTON66.C_COLOR
{
	background-color: var(--main-active-color);
}
.C_BUTTON66.C_SUBCOLOR
{
	background-color: #F9F9F9;
	box-shadow: 3px 3px 2px 0px #BCBCBC, 0px 0px 3px 0px #BCBCBC;
}
.C_BUTTON66.C_SHADOWFLIP
{
	box-shadow: -3px 3px 2px 0px #CCCCCC, 0px 0px 3px 0px #CCCCCC;
}
.C_BUTTON66 > i.fa
{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	color: #AAAAAA;
	font-size: 24px;
	line-height: 24px;
}
.C_BUTTON66.C_COLOR > i.fa
{
	color: #FFFFFF;
}
.C_BUTTON66.C_SUBCOLOR > i.fa
{
	color: #666666;
}
@media screen and (max-width: 640px) and (orientation:portrait)
{
	.C_BUTTON66
	{
		border-radius: 7vw;
		width: 14vw;
		height: 14vw;
	}
	.C_BUTTON66 > i.fa
	{
		font-size: 7vw;
		line-height: 8vw;
	}
}

.C_INPUT
{
	display: block;
	width: 100%;
	border: 1px solid #545454;
	padding: 4px 8px 4px 8px;
	border-radius: 8px;
}
.C_INPUT[readonly]
{
	background-color: #CCCCCC;
}
.C_INPUT > option[marked="1"]
{
	background-color: #EEEEF5;
}
@media screen and (max-width: 640px)
{
	.C_INPUT
	{
		padding: 1.4vw 2.2vw 1.2vw 2.2vw;
		border-radius: 2vw;
		font-size: 6vw;
		line-height: 7vw;
	}
}