.afterServiceHead {
	margin-top: calc(8px * 2);
}

.afterServiceHead__item {
	align-items: start;
	column-gap: calc(8px * 6);
    display: grid;
    grid-template-columns: 150px auto;
}

.afterServiceHead__item:nth-of-type(2) {
	margin-top: calc(8px * 8);
}

.afterServiceHead__itemHead {
	background: var(--colorBlack);
	padding: calc(8px * 3) 0;
	position: relative;
	text-align: center;
}

.afterServiceHead__itemHead::after {
	background: var(--colorBlack);
    bottom: -72px;
    content: "";
    clip-path: polygon(100% 0, 0 0, 50% 45%);
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
}

.afterServiceHead__itemHead--word {
	color: #fff;
	font-size: var(--fontSize24);
	font-weight: bold;
}

.afterServiceHead__itemBox--title {
	color:  var(--colorBlack);
	font-size: var(--fontSize24);
	font-weight: bold;
	line-height: 1.5;
}

.afterServiceHead__itemBox--text {
	color:  var(--colorBlack);
	font-size: var(--fontSize16);
	line-height: 2;
	margin-top: calc(8px * 2);
}

.afterServiceHead__itemBox__graph {
	margin-top: calc(8px * 4);
}

.afterServiceHead__itemBox__graphHouse {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	margin: 0 auto;
	position: relative;
	width: 80%;
}

.afterServiceHead__itemBox__graphHouse:nth-of-type(2) {
	margin-top: calc(8px * 2);
}

.afterServiceHead__itemBox__graphHouse:nth-child(2)::before {
	background: var(--colorBlack);
	content: "";
	height: 4px;
	left: 0;
	position: absolute;
	top: -8px;
	width: 100%;
}

.afterServiceHead__itemBox__graphHouse:nth-child(2)::after {
	background: var(--colorBlack);
    clip-path: polygon(40% 0, 100% 50%, 40% 100%, 63% 50%);
    content: "";
    height: 16px;
    position: absolute;
    right: -16px;
	top: -14px;
    transform: translateX(-50%);
    width: 24px;
}

.afterServiceHead__itemBox__graphHouse li {
	color:  var(--colorBlack);
	font-size: var(--fontSize16);
	font-weight: 500;
	text-align: center;
}

.afterServiceHead__itemBox__list {
	column-gap: calc(8px * 3);
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	margin-top: calc(8px * 4);
}

.afterServiceHead__itemBox__listBox {
	background: #faf5d2;
	border: 3px solid #e9d642;
	padding: calc(8px * 3);
}

.afterServiceHead__itemBox__listBox--title {
	border-bottom: 2px solid var(--colorBlack);
	color: var(--colorBlack);
	font-size: var(--fontSize20);
	font-weight: bold;
	padding-bottom: calc(8px * 1);
	text-align: center;
}

.afterServiceHead__itemBox__listBox--title span {
	font-size: var(--fontSize32);
}

.afterServiceHead__itemBox__listBox--text {
	color: var(--colorBlack);
	font-size: 14px;
	line-height: 2;
	margin-top: calc(8px * 2);
}

.afterServiceHead__itemBox__listBox--button {
	display: flex;
	margin-top: calc(8px * 3);
	justify-content: center;
}

.afterServiceHead__itemBox__listBox--button a {
	background: #e9d642;
	display: inline-block;
	color: #fff;
	font-size: var(--fontSize15);
	font-weight: 500;
	padding: calc(8px * 1.5) calc(8px * 6);
	text-align: center;
}

@media screen and (max-width: 767px) {
	.afterServiceHead {
		margin-top: calc(8px * 2);
	}
	
	.afterServiceHead__item {
		grid-template-columns: 100%;
	}
	
	.afterServiceHead__itemHead {
		padding: calc(8px * 2) 0;
	}
	
	.afterServiceHead__itemHead::after {
		display: none;
	}
	
	.afterServiceHead__itemBox--title {
		margin-top: calc(8px * 2);
	}
	
	.afterServiceHead__itemBox--text {
		margin-top: calc(8px * 2);
	}

	.afterServiceHead__itemBox__graphHouse {
		width: 100%;
	}
	
	.afterServiceHead__itemBox__graphHouse li {
		font-size: 13px;
	}
	
	.afterServiceHead__itemBox__list {
		grid-template-columns: 100%;
		margin-top: calc(8px * 3);
		row-gap: calc(8px * 2);
	}
}

.afterService__text {
	color: var(--colorBlack);
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize16);
	font-weight: 400;
	letter-spacing: 0.08em;
	line-height: 2;
	margin-top: 10px;
}

.afterService__textArea {
	grid-column: 2;
	grid-row: 1;
	margin: 0 10px;
}

.afterService__title {
	color: #fff;
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize24);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
}

.afterService__warranties {
	display: grid;
	gap: 20px;
	grid-column: 1 / span 2;
	grid-row: 2;
	grid-template-columns: 1fr 1fr 1fr;
	margin: 0 20px;
}

.afterService__warranty--box {
	background: var(--colorLightYellow);
	border: 3px solid var(--colorYellow);
	padding: 10px 20px;
}

.afterService__warranty--heading {
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	color: var(--colorBlack);
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize20);
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.5;
	text-align: center;
}

.afterService__warranty--years {
	font-family: var(--fontRoboto);
	font-size: 42px;
}

.afterService__warranty--text {
	color: var(--colorBlack);
	font-family: var(--fontNotoSansJP);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	margin-top: 10px;
	padding-bottom: 10px;
}

.downText {
	writing-mode: tb-rl;
}

.memo {
	background: var(--colorLightYellow);
	margin-top: 64px;
}

.memo__banner {
	margin-top: 62px;
	text-align: center;
}

.memo__banner img {
	max-width: 430px;
	width: 100%;
	height: auto;
}

.memo__container {
	background: #fff;
	position: relative;
	top: 50px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

.memo__inner {
	padding: 48px 64px;
}

.point__display {
	display: flex;
	flex-direction: column;
}

.point__display--body {
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize16);
	font-weight: 400;
	line-height: 2;
	letter-spacing: 0.08em;
	color: var(--colorBlack);
	padding: 16px;
	height: 100%;
}

.point__display--list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	margin: 32px auto;
	max-width: 952px;
}

.point__heading {
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize32);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.16em;
	color: var(--colorBlack);
	text-align: center;
	margin-top: 16px;
}

.point__img {
	text-align: center;
	margin-top: 48px;
}

.point__img img {
	max-width: 495px;
	width: 100%;
	height: auto;
}

.point__number {
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize20);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.16em;
	color: var(--colorBlack);
	text-align: center;
}

.point__subheading {
	font-family: var(--fontNotoSansJP);
	font-size: var(--fontSize24);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.08em;
	color: var(--colorBlack);
	text-align: center;
	margin-top: 48px;
}

.point__textBox {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.servicePoints__container {
	margin-top: 30px;
}

.servicePoints__list {
	display: flex;
	flex-direction: column;
	gap: 48px;
	margin-top: 32px;
}

.servicePoints__listItem {
	display: flex;
	flex-direction: column;
}

.servicePoints__listItem hr {
	border: 1px solid #333333;
	width: 100%;
	margin-top: 32px;
}

.silverBody {
	border: 1px solid #e8e8e8;
}

.silverHead {
	background: #e8e8e8;
	padding: 2px 0;
}

.yellowHead {
	background: var(--colorYellow);
	padding: 2px 0;
}

.yellowBody {
	border: 1px solid var(--colorYellow);
}

@media screen and (max-width: 767px) {
	.afterService .wrapper {
		display: grid;
		column-gap: 20px;
		grid-template-columns: auto auto;
		grid-template-rows: 50px auto auto;
		margin: 40px auto 0;
		max-width: 95vw;
		padding: 0;
		row-gap: 0;
	}
	.afterService__display {
		grid-column: 2;
		grid-row: 1;
		padding: 10px 10px 30px;
	}
	.afterService__heading {
		margin-top: 20px;
	}
	.afterService__model {
		grid-column: 1;
		grid-row: 1 / span 3;
	}
	.afterService__model--item {
		gap: 10px;
		grid-template-columns: 1fr 1fr;
	}
	.afterService__model--list {
		display: grid;
	}
	.afterService__model--list::after {
		bottom: -2.5%;
		right: 41%;
		top: auto;
		transform: translateY(-50%) rotate(90deg);
	}
	.afterService__model--list::before {
		height: 100%;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
		width: 2px;
	}

	.afterService__text {
		margin-top: 0;
	}

	.afterService__textArea {
		align-self: unset;
		grid-column: 2;
		grid-row: 2 / span 2;
		margin-top: 20px;
	}

	.afterService__warranty--heading {
		text-align: center;
	}

	.memo__container {
		margin: 0 10px;
	}
	
	.memo__inner {
		padding: 20px 25px;
	}
	.point__display--list {
		grid-template-columns: 1fr;
	}
	.servicePoints__container {
		padding: 0 20px;
	}
	.servicePoints__list {
		gap: 50px;
	}
	.warrantyService .wrapper {
		column-gap: 20px;
		grid-template-columns: auto auto;
		margin: 50px auto 0;
		max-width: 95vw;
		padding: 0;
	}
	.warrantyService .afterService__display {
		grid-column: 1;
		grid-row: 1;
	}
	.warrantyService .afterService__textArea {
		grid-column: 2;
		grid-row: 1;
		margin-top: 0;
	}
	.warrantyService .afterService__textArea .afterService__text {
		margin-top: 0;
	}
	.afterService__warranties {
		display: flex;
		flex-direction: column;
		grid-column: 1 / span 2;
		grid-row: 2 / span 3;
	}
	.afterService__warranty--box {
		max-width: 85vw;
		margin: 0 auto;
	}

	.servicePoints__listItem hr{
		margin-top: 12px;
	}
}