.home-hero {
	display: block;
	position: relative;
	padding-top: 1.06rem;
}

@media screen and (max-width: 768px) {

	.home-hero {
		padding-top: 0.7rem;
}
	}

.home-hero .media-frame {
		position: relative;
		aspect-ratio: 1360 / 620;
		width: 100%;
		overflow: clip;
		border-radius: 0.35rem;
	}

@media screen and (max-width: 768px) {

	.home-hero .media-frame {
			aspect-ratio: unset;
			min-height: 620px;
	}
		}

:is(.home-hero .media-frame) .media {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

.mobile-image:is(:is(.home-hero .media-frame) .media) {
				display: none;
			}

@media screen and (max-width: 768px) {

	:is(.home-hero .media-frame) .media {
				aspect-ratio: 370 / 620;
				display: none;
		}

				.mobile-image:is(:is(.home-hero .media-frame) .media) {
					display: block;
				}
			}

.home-hero .media-frame {
		display: flex;
		align-items: center;
		padding: 0.6rem;
	}

@media screen and (max-width: 768px) {

	.home-hero .media-frame {
			padding: 0.56rem 0.16rem;
			flex-direction: column;
			justify-content: stretch;
	}
		}

.home-hero .content {
		width: 100%;
		max-width: 7.1rem;
		margin: 0 auto;
		text-align: center;
	}

@media screen and (max-width: 768px) {

	.home-hero .content {
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			flex-grow: 1;
			gap: 0.4rem;
	}
		}

:is(.home-hero .content) .title {
			color: var(--color-peach);
			margin-bottom: 0.32rem;
		}

:is(.home-hero .content) .text {
			color: var(--color-peach);
			margin-bottom: 0.32rem;
		}

.home-hero .button-frame {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.32rem;
	}

@media screen and (max-width: 768px) {

	.home-hero .button-frame {
			flex-direction: column;
			gap: 0.14rem;
	}
		}

.home-hero .bottom-part {
		padding: 0.24rem 0;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

@media screen and (max-width: 800px) {

	.home-hero .bottom-part {
			overflow-x: scroll;
			justify-content: flex-start;
	}

			:is(.home-hero .bottom-part)::-webkit-scrollbar {
				height: 5px;
			}

			:is(.home-hero .bottom-part)::-webkit-scrollbar-track {
				background: var(--color-dark-beige);
				border-radius: 10px;
			}

			:is(.home-hero .bottom-part)::-webkit-scrollbar-thumb {
				background: var(--color-rust);
				border-radius: 10px;
			}
		}

:is(.home-hero .bottom-part) .inner-wrap {
			width: fit-content;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-wrap: wrap;
			gap: 0.24rem;
		}

@media screen and (max-width: 800px) {

	:is(.home-hero .bottom-part) .inner-wrap {
				flex-wrap: nowrap;
				justify-content: flex-start;
				white-space: nowrap;
		}
			}

:is(.home-hero .bottom-part) .text {
			color: var(--color-rust);
		}

:is(.home-hero .bottom-part) svg {
			display: block;
			width: 0.12rem;
			height: auto;
		}
