/*-------------------------------------------------------------
top-common-sa
-------------------------------------------------------------*/
.top-aruaru-sa-img-wrap {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img-wrap {
		flex-direction: row-reverse;
		justify-content: space-between;
	}
}

.top-aruaru-sa-img01 {
	width: 100%;
	max-width: 283px;
	margin-inline: auto;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img01 {
		/* max-width: 283px; */
		margin: 0;
	}
}

.top-aruaru-sa-img01 img {
	aspect-ratio: 283/425;
	object-fit: cover;
}

.top-aruaru-sa-img02 {
	width: 100%;
	margin-inline: auto;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img02 {
		max-width: 487px;
		margin: 0;
	}
}

.top-aruaru-sa-img02 img {
	aspect-ratio: 16/9;
	object-fit: cover;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img02 img {
		aspect-ratio: 487/325;
	}
}

.top-aruaru-sa-contents {
	position: relative;
	padding-bottom: 260px;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-contents {
		padding-bottom: 0;
	}
}

.top-aruaru-sa-img03 {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	animation: bound 1s ease-in alternate infinite;
	transform-origin: center bottom;
}

@media screen and (min-width: 768px) {
	.top-aruaru-sa-img03 {
		left: auto;
		right: 0;
		transform: translateX(0);
		animation: bound-pc 1s ease-in alternate infinite;
	}
}

@keyframes bound {
	0% {
		transform: translateX(-50%) translateY(-20%) scale(1, 1);
	}
	80% {
		transform: translateX(-50%) translateY(0%) scale(1, 1);
	}
	100% {
		transform: translateX(-50%) translateY(0%) scale(1.1, 0.9);
	}
}

@keyframes bound-pc {
	0% {
		transform: translateY(-20%) scale(1, 1);
	}
	80% {
		transform: translateY(0%) scale(1, 1);
	}
	100% {
		transform: translateY(0%) scale(1.1, 0.9);
	}
}

.top-aruaru-sa-img03 img {
	width: 160px;
	height: 230px;
}

.top-aruaru-sa-img04 {
	width: 100%;
	margin-inline: auto;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img04 {
		max-width: 509px;
		margin: 0;
	}
}

.top-aruaru-sa-img04 img {
	aspect-ratio: 16/9;
	object-fit: cover;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img04 img {
		aspect-ratio: 509/339;
	}
}

.top-aruaru-sa-list-item {
	list-style-type: disc;
	list-style-position: inside;
}

.top-aruaru-sa-img05 {
	width: 100%;
	margin-inline: auto;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img05 {
		max-width: 532px;
		margin: 0;
	}
}

.top-aruaru-sa-img05 img {
	aspect-ratio: 16/9;
	object-fit: cover;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img05 img {
		aspect-ratio: 532/355;
	}
}

.top-aruaru-sa-img-wrap02 {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
@media screen and (min-width: 1200px) {
	.top-aruaru-sa-img-wrap02 {
		flex-direction: row;
	}
}

.top-aruaru-sa-img-wrap02 img {
	width: 100%;
	aspect-ratio: 16/9;
	object-fit: cover;
}
@media screen and (min-width: 1200px) {
	.top-aruaru-sa-img-wrap02 img {
		max-width: 536px;
		aspect-ratio: 536/402;
	}
}

.top-aruaru-aruaru-sa-flow-item {
	list-style-type: decimal;
	list-style-position: inside;
}

.top-aruaru-sa-img08 {
	width: 100%;
	margin-inline: auto;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img08 {
		max-width: 318px;
		margin: 0;
	}
}

.top-aruaru-sa-img08 img {
	aspect-ratio: 16/9;
	object-fit: contain;
}
@media screen and (min-width: 768px) {
	.top-aruaru-sa-img08 img {
		aspect-ratio: 318/339;
	}
}