@CHARSET "ISO-8859-1";

.points {
	border-bottom: var(--border-top);
	
	display: grid;
	grid-template-columns: calc(var(--max-width-header-half) * 0.12) calc(var(--max-width-header-half) * 0.15) calc(var(--max-width-header-half) * 0.15)
	calc(var(--max-width-header-half) * 0.09) calc(var(--max-width-header-half) * 0.15) calc(var(--max-width-header-half) * 0.10) calc(var(--max-width-header-half) * 0.05) calc(var(--max-width-header-half) * 0.12);
	grid-template-rows: calc(var(--max-height-header-points) / 2) calc(var(--max-height-header-points) / 2);
	grid-template-areas:
		"picremain value1 arrowleft amount arrowright value2 none picspend"
		"picremain value1 arrowleft amount arrowright value3 info picspend";
}

.points>.picRemain,
.points>.picSpend,
.points>.picArrowRemain,
.points>.picArrowSpend,
.points>.amountLabel, 
.points>.spendLabel,
.points>.remainLabel,
.points>.breakLabel,
.points>.breakInfoLabel {
	text-align: center;
	font-size: var(--font-13);
	font-weight: var(--font-weight-bold);
	width: calc(var(--max-width-header-half) * 0.15);
}

.points>.picRemain {
    display: flex;
	grid-area: picremain;
}

.points>.picSpend {
	display: flex;
	grid-area: picspend;
}

.points>.picArrowRemain {
	grid-area: arrowleft;
	display: none;
}

.points>.picArrowSpend {
	grid-area: arrowright;
	display: none;
}

.points>.amountLabel {
	display: none;
	grid-area: amount;
	width: unset;
}

.points>.spendLabel {
	grid-area: value2;
}

.points>.breakLabel {
	grid-area: value3;
}

.points>.breakInfoLabel {
	grid-area: info;
	text-align: center;
	font-size: var(--font-13);
	font-weight: var(--font-weight-bold);
	width: calc(var(--max-width-header-half) * 0.05);
}

.points>.breakInfoLabel>.breakInfoLabelImg {
	padding-top:;
	text-align: center;
	width: calc(var(--max-width-header-half) * 0.03);
}

.points>.breakInfoLabel>.breakInfoLabelImg:hover {
	background: var(--background-hover);
    border-radius: var(--border-radius-option);
}

.points>.remainLabel {
	grid-area: value1;
}

.points>.pointsImg {
	margin: auto;
	width: calc(var(--pic-small-medium) * 0.8);
}