@media (max-width: 975px) {
	/*===============================
	MARK: common
	=================================*/
	.pc-content {
		display: none !important;
	}
	.sp-content {
		display: block;
	}

	.btn {
		padding: 1.2em 3em;
		font-size: 20px;
	}

	.btn::after {
		right: 10%;
	}

	/*===============================
	MARK: TOP content
	=================================*/
	#lead .heading {
		padding-block: 25px 0px;
		padding-inline: 20px;
		width: 100%;
	}

	.futo-hoso {
		position: relative;
		top: 0;
		left: 0;
		transform: none;
		width: 100%;
		margin-left: 0;
		gap: 15%;
		padding: 10px 15px 5px 15px;
	}

	.futo-hoso img {
		display: block;
		max-width: 100%;
	}

	.arrow::after {
		height: calc(39px / 2);
		width: 39px;
	}

	#comparison {
		padding-top: 40px;
	}

	/* #comparison .heading {
		width: min(100%, 320px);
	} */

	.item-container {
		margin-block: 25px 45px;
		padding-inline: 0;
	}

	.item-main {
		flex-wrap: wrap;
	}

	.cat-wrap {
		order: 1;
		width: 100%;
		margin-bottom: 15px;
	}

	.item-category {
		width: 33%;
		justify-self: center;
		margin-inline: auto;
	}

	.item-main .item-wrap {
		order: 2;
		flex-shrink: 0;
		width: 50%;
	}

	.item-explain {
		padding-inline: 20px;
		margin-inline: auto;
		margin-top: 15px;
	}

	.item-explain p {
		text-align: left;
		border-radius: 12px;
		padding: 1.5em 15px;
	}

	#face-type {
		padding-block: 70px;
	}

	.point {
		gap: 13px;
		margin-top: 20px;
	}

	.point-item:nth-child(2) img {
		max-height: 2.7em;
	}
	.point-item:nth-child(3) img {
		max-height: 1.8em;
	}

	#face-type p {
		margin-block: 20px 45px;
	}
}

@media (max-width: 470px) {
	#comparison .heading {
		width: min(100%, 340px);
	}

	#face-type .btn-wrap {
		flex-direction: column;
		align-items: center;
		gap: 22px;
	}
}
