:root {
    --white: #fff;
    --black: #333;
    --brown: #6D3D18;
    --blue: #004bb1;
    --font-weight-bold: 600;
    --font-point: "M PLUS Rounded 1c", sans-serif;
}

.pt80 {
	padding-top: 80px!important;
}

.gnav ul .gnav-bg a {
    width: 100%;
    min-height: 52px;
    display: flex;
    padding: 14px 0;
    line-height: 1.2;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
}
nav ul li.list-child::before {
	right: 15px;
}

.c-mv__logo {
	padding-top: 50px;
}
.c-mv__logo h2 {
	background: #DCE9F7;
	color: #0064B2;
	margin: 20px 0;
	border-radius: 10px;
}
@media screen and (max-width: 750px) {
	.c-mv__logo {
		padding-top: 20px;
	}
	.c-mv__logo h2 {
		margin: 10px 0 0;
	}
	.c-mv picture {
		margin-top: 20px;
	}
}

.l-content {
	max-width: 1000px;
    width: 100%;
}
.l-content-bg {
	padding: 0;
	background: url(../img/subject/mathmatics-bg.png) repeat;
}

table {
	width: 95%;
	font-size: 0.875rem;
	margin: 0 auto;
	border-collapse: collapse;
	border-spacing: 0;
}
table th,
table td {
	padding: 5px;
	border: 1px solid #C9C9C9;
	white-space: nowrap;
	font-weight: normal;
}
table .publisher {
	text-align: left;
	padding-left: 8px;
}
table .subject {
	color: #fff;
	text-align: center;
}
table .gakunen td {
	width: calc(100% / 11);

}
table .kokugo {
	background-color: #CE0D66;
}
	table .kokugo-checked {
		color: #CE0D66;
	}
table .kanji {
	background-color: #E24C71;
}
	table .kanji-checked {
		color: #E24C71;
	}
table .syakai {
	background-color: #D57B00;
}
	table .syakai-checked {
		color: #D57B00;
	}
table .suugaku {
	background-color: #3B79C0;
}
	table .suugaku-checked {
		color: #3B79C0;
	}
table .kazu {
	background-color: #13B494;
}
	table .kazu-checked {
		color: #13B494;
	}
table .bunsyou {
	background-color: #234AB4;
}
	table .bunsyou-checked {
		color: #234AB4;
	}
table .rika {
	background-color: #59AA23;
}
	table .rika-checked {
		color: #59AA23;
	}
table .eigo {
	background-color: #802EA0;
}
	table .eigo-checked {
		color: #802EA0;
	}
table .ginou {
	background-color: #47ABAA;
}
	table .ginou-checked {
		color: #47ABAA;
	}

	.scroll-hint.is-right-scrollable {
		background: none!important;

	}

@media screen and (max-width: 768px) {
    .l-content-purchase-book {
		display: flex;
        flex-direction: column;
        align-items: center;
	}
}

.bg-arrow .l-content::before {
	content: '';
    position: absolute;
	width: 20vw;
	max-width: 74px;
    height: 100vh;
    top: 50px;
    left: 15%;
    background: url(../img/purchase/arrow-no.svg) top right / contain no-repeat;
	z-index: 50;
}
.bg-arrow .l-content::after {
	content: '';
    position: absolute;
	width: 20vw;
	max-width: 74px;
    height: 100vh;
    top: 50px;
    left: 5%;
    background: url(../img/purchase/arrow-yes.svg) top right / contain no-repeat;
	z-index: 20;
}
@media screen and (max-width: 500px) {
	.bg-arrow .l-content {
		gap: 80px;
	}
	.bg-arrow .l-content::before {
		width: 15vw;
		top: 100px;
		left: 16%;
	}
	.bg-arrow .l-content::after {
		width: 16.5vw;
		top: 118px;
		left: 2%;
	}
}

.bg-arrow {
	position: relative;
	margin: 80px 0 0;
	padding: 40px 10px;
	background: #E9F2F7;
}
.bg-arrow > div {
	position: relative;
	z-index: 2;
	min-height: 500px;
}
.bg-arrow:before {
	content: "";
	position: absolute;
	display: block;
	left: 0;
	border-style: solid;
}
.bg-arrow:before {
	top: 0;
	margin-top: -4.94vw;
	border-color: transparent #E9F2F7 transparent;
	border-width: 5vw 50vw 0;
}
.bg-arrow .l-content {
	display: flex;
	flex-direction: column;
	gap: 110px;
}
.chart-title {
	background: #6D3D18;
	padding: 25px;
	font-size: 24px;
	color: var(--white);
	font-family: var(--font-point);
	font-weight: var(--font-weight-bold);
	border-radius: 25px;
	position: relative;
	z-index: 100;
}
.l-chart {
	background: #fff;
	border-radius: 26px;
	padding: 25px;
	display: flex;
	flex-direction: column;
	gap: 24px;
	position: relative;
}
.chart-no::before {
	content: '';
    position: absolute;
	width: 20vw;
    height: 20vh;
    max-width: 80px;
    max-height: 100px;
    top: -80px;
    right: 15%;
    background: url(../img/purchase/chart-no-img.png) top right / contain no-repeat;
}
@media screen and (max-width: 768px) {
	.chart-no::before {
		content: none;
	}
	.l-chart.chart-yes {
        padding: 25px 0;
    }
}
.chart-no {
	z-index: 40;
}
.chart-no p:first-child,
.chart-yes p:first-child {
	content: '';
    display: flex;
    position: absolute;
    width: 300px;
    height: 105px;
    top: -30px;
    left: 50%;
    padding: 0 0 15px 60px;
    transform: translate(-40%, -50%);
    background: url(../img/purchase/chart-no.png) top left / contain no-repeat;
    align-items: center;
    color: var(--white);
    font-family: var(--font-point);
    font-size: 24px;
	font-weight: var(--font-weight-bold);
}
/*
.chart-no::after {
	content: '';
    position: absolute;
	width: 20vw;
	max-width: 174px;
    height: 100vh;
    top: -160px;
    left: 15%;
    background: url(../img/purchase/arrow01.svg) top right / contain no-repeat;
	z-index: 50;
}
.chart-yes::after {
	content: '';
    position: absolute;
	width: 20vw;
	max-width: 72px;
    height: 100vh;
    top: -150px;
    left: 20%;
    background: url(../img/purchase/arrow02.svg) top right / contain no-repeat;
	z-index: 50;
}
*/
@media screen and (max-width: 768px) {
	.chart-no p:first-child, .chart-yes p:first-child {
		width: 240px;
		height: 105px;
		top: -20px;
		left: 60%;
		padding: 0 0 34px 47px;
		font-size: 20px;
	}
}
.chart-yes p:first-child {
	padding: 0 0 0 70px;
    background: url(../img/purchase/chart-yes.png) top left / contain no-repeat;
}
.chart-text {
	color: var(--brown);
	font-family: var(--font-point);
    font-size: 20px;
	font-weight: var(--font-weight-bold);
}
.c-contents__text-red {
	margin-bottom: 20px;
}
.l-content-purchase__buttons ul {
	padding: 10px 0 10px;
}
.bnr {
	width: 60%;
}
@media screen and (max-width: 768px) {
	.chart-yes p:first-child {
		padding: 0 0 13px 67px;
	}
	.bnr {
		width: 90%;
	}
}

.attention-text {
	width: 95%;
	padding: 20px;
	margin: 30px auto;
	text-align: left;
	background:#ecf1f4;
	font-size: 14px;
}
.attention-text span {
	font-family: var(--font-point);
	font-weight: bold;
	margin-bottom: 0;
}
.attention-text ul {
	margin-bottom: 15px;
	list-style:disc;
	padding-left: 20px;
}