@charset "UTF-8";

/* ===============================
	変数定義
=============================== */
:root {
	--bg-color: rgba(66, 143, 90, 0.1);
	--margin-large: 6rem;
	--margin-medium: 4rem;
	--margin-small: 2rem;

	/* フォント */
	--base-font: "Inter", sans-serif;
	--noto: "Noto Sans JP", sans-serif;
}


/* アニメーション */

.bird,
.mv-fade-in,
.healingfan-info,
.main-title-animation,
.common-fade-animation {
	opacity: 0;
}

/* 共通 */
body::before {
	content: none;
}

.CommonFooter {
	position: relative;
	background-color: var(--bg-color);
}

.CommonFooter:before {
	content: "";
	display: block;
	position: fixed;
	z-index: -1;
	width: 100%;
	height: 100vh;
	background: url(/nature/assets/common/images/pg-green.jpg) no-repeat 0 0 / cover;
}

.second_mainvisual_img {
	padding-block-start: 0;
}

article {
	font-family: var(--base-font);
}

.section-title {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	font-size: 14rem;
	font-family: var(--noto);
	font-weight: 700;
	color: rgba(66, 143, 90, 0.20);
	line-height: 1;
	line-height: 0.75;
}

.section-title.right {
	right: 15px;
	left: auto;
}

.title-wrapper {
	overflow: hidden;
}

.common-sub-title {
	display: inline-block;
	margin-top: 30rem;
	font-size: 5rem;
	line-height: 1;
	border-radius: 4px;
	font-weight: bold;
}

.common-sub-title em {
	color: #428F5A;
}

.common-sub-text {
	margin-top: 5rem;
	line-height: 1.8;
}

.common-sub-text:nth-of-type(n+2) {
	margin-top: 1.5em;
}

.movie-btn {
	inline-size: 1em;
	block-size: 1em;
	margin-left: 0.5em;
}

.movie-button button {
	display: none;
}

.movie-button button.active {
	display: inline;
}

/* メインビジュアル */

.main-visual {
	block-size: 100%;
	margin-bottom: 15rem;
	font-family: var(--base-font);
}



.main-visual-contents-inner {
	position: relative;
	inline-size: 100%;
	block-size: 1800px;

}

.mainvisual-img-container {
	position: absolute;
	top: 10rem;
	right: 0;
	inline-size: 100%;
}

.mainvisual-img-container.pc-only {
	display: block;
}

.mainvisual-img-container.sp-only {
	display: none;
}

.mainvisual-img-inner {
	max-inline-size: 1500px;
	margin-inline: auto;
	margin-bottom: 10rem;
	position: sticky;
	top: 10rem;
	right: 0;
}

.mainvisual-img-inner::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	inline-size: 100%;
	block-size: 100%;
	background: url(images/bg-tree.svg) no-repeat top 7% left 2% / 100px, url(images/bg-moon.svg) no-repeat top 6% right 30% / 80px, url(images/bg-mount1.svg) no-repeat top 68% right 5% / 332px, url(images/bg-tree.svg) no-repeat top 94% left 47% / 100px, url(images/bg-tree.svg) no-repeat top 98% left 56% / 100px;
	opacity: 0.4;
}

.healingfan-info {
	position: absolute;
	left: 32%;
	top: 82%;
	text-align: center;
	color: #fff;
}

.healingfan-info li:first-of-type,
.healingfan-info li:nth-of-type(3) {
	font-size: 1.4rem;
}

.healingfan-info li:nth-of-type(2) {
	font-size: 1.8rem;
	font-weight: bold;
}

.healingfan-img {
	position: relative;
	inline-size: 60%;
	margin-left: 40%;
	max-inline-size: 900px;
}

.mv {
	background: url(/nature/assets/common/images/pg-green.jpg) no-repeat 0 0 / cover;
	background-attachment: fixed;
}

.header-group {
	inline-size: 100%;
}

.healingfun-top-text {
	position: sticky;
	top: 100px;
	left: 0;
	padding-bottom: 120px;
}

.healingfun-catch {
	margin-top: 120px;
	color: #fff;
	font-size: 2.8rem;
	font-weight: 400;
}

.healingfun-title {
	margin-top: 3rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.5rem;
	overflow: hidden;
}


.healingfun-title span {
	display: inline-block;
	font-size: 8rem;
	font-weight: bold;
	color: #fff;
	border-radius: 3px;
	line-height: 1.3;
}

.healingfun-bottom-block {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.healingfun-bottom-block:nth-of-type(n+2) {
	margin-top: 5rem;
}

.healingfun-bottom-text {
	position: relative;
	display: inline-block;
	padding: 0rem 1rem;
	font-size: 1.8rem;
	font-weight: bold;
	border-radius: 3px;
	color: #fff;
	line-height: 2;
}

.healingfun-bottom-block:first-of-type .healingfun-bottom-text {
	line-height: 1.6;
	font-size: 2.6rem;
}

.mainvisual-top-contents {
	position: sticky;
	top: 0;
	left: 0;
}

/* アバウト */
.about {
	background-color: #fff;
	padding-bottom: 15rem;
}

.about-contents-block {
	position: relative;
	margin-top: 10rem;
	display: flex;
	align-items: center;
}

.about-contents-block:has(.about-movie-area) {
	align-items: flex-start;
}

.about-contents-title {
	text-align: center;
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.6;
}

.about-contents-title em {
	color: #428F5A;
}

.about-contents-text {
	position: relative;
	z-index: 2;
	inline-size: 45%;
	padding: 50px 40px;
	margin-right: -60px;
	border: 1px solid #428F5A;
	border-radius: 30px;
	background-color: #fff;
}

.about-contents-point {
	text-align: center;
	font-size: 1.5rem;
	font-weight: bold;
}

.about-top-text-border.right {
	inline-size: 100%;
}

.about-bottom-text {
	margin-top: 40px;
}

.about-top-text.right::before {
	content: none;
}

.about-bottom-text p {
	line-height: 1.6;
}

.about-img img {
	border-radius: 20px;
}

.about-contents-text.right {
	margin-top: 80px;
	margin-left: -60px;
	/* inline-size: 50%; */
	inline-size: 45%;
}

.about-movie-area {
	inline-size: 56.4%;

}

.about-movie-area .movie {
	border-radius: 20px;
}

.about-movie-area .movie-contents {
	margin-top: 0;
}

.about .title-img {
	position: absolute;
	top: 90%;
	right: 0;
	display: block;
	inline-size: 360px;
}

.about-bg {
	max-inline-size: 1500px;
	margin-inline: auto;
	position: relative;
	background: url(images/bg-mount1.svg) no-repeat left 0% top 5% / 340px,
		url(images/bg-mount2.svg) no-repeat right 5% top 21% / 220px,
		url(images/bg-tree.svg) no-repeat left 0% top 100% / 110px;
}

/* フューチャー */

.feature {
	position: relative;
	background-color: #fff;
	padding-bottom: 15rem;
	margin-top: -1px;
}


.feature::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	inline-size: 100%;
	block-size: 100%;
	background-color: var(--bg-color);
}

.feature-bg {
	max-inline-size: 1500px;
	margin-inline: auto;
	background: url(images/bg-mount1.svg) no-repeat right 0% top 7% / 340px,
		url(images/bg-mount2.svg) no-repeat left 0% top 48% / 220px,
		url(images/bg-tree.svg) no-repeat left 2% top 98% / 120px;
}

.feature-width {
	position: relative;
	padding-top: 30rem;
}

.feature-sub-title {
	inline-size: fit-content;
	margin-inline: auto;
	overflow: hidden;
}

.feature-sub-title em {
	color: #428F5A;
}

.feature-sub-title span {
	display: inline-block;
	inline-size: fit-content;
	margin-inline: auto;
	text-align: center;
	line-height: 1;
	font-size: 5rem;
	font-weight: bold;
	border-radius: 4px;
}

.feature-sub-text {
	margin-top: 5rem;
	text-align: center;
}

.feature-common-title {
	inline-size: fit-content;
	margin-top: 100px;
	margin-inline: auto;
	font-size: 3rem;
	text-align: center;
	font-weight: bold;
	line-height: 1.6;
}

.feature-common-title em {
	color: #428F5A;
}

.feature-common-title span {
	display: block;
	margin-top: 0.2em;
	font-size: 1.5rem;
	color: #000;
}

.feature-common-text {
	margin-top: 5rem;
	text-align: center;
}

.feature .title-img {
	position: absolute;
	top: 85%;
	left: 0%;
	display: block;
	inline-size: 360px;
}

/* 動画 */

.movie-contents {
	max-inline-size: 600px;
	margin-inline: auto;
	margin-top: 4rem;
}

.about-movie-area .movie-contents {
	max-inline-size: none;

}

.movie-button {
	margin-top: 0.5em;
	text-align: right;
	font-size: 1.4rem;
}

.about-movie-area .movie-button {
	text-align: left;
}

/* Swiper */

.feature-swiper {
	position: relative;
	padding-inline: 6rem;
}

.feature-swiper .swiper-slide {
	inline-size: 100%;
}

.feature-card {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.feature-swiper-title {
	margin-inline: auto;
	margin-block: 4rem 2rem;
	inline-size: fit-content;
	color: #fff;
	font-size: 1.8rem;
	line-height: 1.5;
	text-align: center;
	padding: .2em 100px;
	background-color: #407D40;
	border-radius: 20px;
}

.feature-slide-img p {
	margin-top: 0.5em;
	padding-inline: 1em;
	text-align: center;
}

.feature-button-prev {
	position: absolute;
	top: 50%;
	left: 0;
	inline-size: 40px;
	block-size: 40px;
	background-image: url(images/swiper-arrow.svg);
	background-repeat: no-repeat;
	background-size: contain;
	transform: rotate(180deg);
}

.feature-button-next {
	position: absolute;
	top: 50%;
	right: 0;
	inline-size: 40px;
	block-size: 40px;
	background-image: url(images/swiper-arrow.svg);
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 2;
}

.swiper-button-disabled {
	display: none;
}

.swiper-pagination-bullets.swiper-pagination-horizontal {
	text-align: center;
}

.swiper-pagination-bullet-active {
	background-color: #407D40;
}

.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 5px);
}

.swiper-pagination-bullet {
	width: 12px;
	height: 12px;
}


/* テクノロジー */
.technology {
	background-color: #fff;
	padding-bottom: 15rem;
	margin-top: -1px;
}

.technology-bg {
	max-inline-size: 1500px;
	margin-inline: auto;
	background: url(images/bg-tree.svg) no-repeat top 15% right 6% / 110px,
		url(images/bg-moon.svg) no-repeat top 14% right 2% / 40px,
		url(images/bg-mount1.svg) no-repeat top 50% left 2% / 300px,
		url(images/bg-mount2.svg) no-repeat top 80% right 2% / 200px;
}

.technology-sub-text:nth-of-type(n+2) {
	margin-top: 2.5rem;
}

.technology-contents {
	position: relative;
}

.technology-block {
	display: grid;
	align-items: flex-start;
	grid-template-columns: 550px 1fr;
	margin-top: 10rem;
}

.technology-block:nth-of-type(3) {
	margin-top: 12rem;
}

.technology-block:nth-of-type(even) {
	grid-template-columns: 1fr 550px;
}


.technology-text-area {
	position: relative;
	padding: 5rem 60px 50px 40px;
	border: 1px solid #428F5A;
	border-radius: 30px;
	background-color: #fff;
}

.technology-block:nth-of-type(even) .technology-text-area {
	margin-top: 70px;
	margin-left: -30px;
	padding: 5rem 40px 50px 60px;
}

.technology-number {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 10rem;
	font-style: italic;
	text-align: center;
	color: #428F5A;
	font-weight: bold;
	line-height: 1;
	background-color: #fff;
}

.technology-block-title {
	margin-top: 0.5rem;
	font-size: 2.6rem;
	text-align: center;
	font-weight: bold;
}

.technology-block-title em {
	color: #428F5A;
}

.technology-block-point {
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
}

.technology-block-text {
	margin-top: 2rem;
	line-height: 1.6;
}

.technology-img {
	max-inline-size: 640px;
	position: relative;
	margin-top: 50px;
	margin-left: -20px;
}

.technology-block:nth-of-type(3) .technology-img {
	margin-top: 80px;
}

.technology-img img {
	overflow: hidden;
	border-radius: 20px;
}

.technology-block:nth-of-type(even) .technology-img {
	position: relative;
	margin-top: 0;
	margin-left: 0;
	z-index: 2;
}

.technology-img p {
	margin-top: 0.5em;
	font-size: 1.2rem;
}

.technology .title-img {
	position: absolute;
	top: 81%;
	right: 2%;
	display: block;
	inline-size: 360px;
}



/* エピソード */

.episode {
	position: relative;
	background-color: #fff;
	padding-bottom: 15rem;
	margin-top: -1px;
}

.episode::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	inline-size: 100%;
	block-size: 100%;
	background-color: var(--bg-color);
}

.episode-bg {
	position: relative;
	max-inline-size: 1500px;
	margin-inline: auto;
	background:
		url(images/bg-moon.svg) no-repeat top 87% right 4% / 50px, url(images/bg-mount2.svg) no-repeat top 96% right 4% / 187px, url(images/bg-mount1.svg) no-repeat top 10% right 10% / 300px, url(images/bg-tree.svg) no-repeat top 92% left 42% / 70px, url(images/bg-tree.svg) no-repeat top 90% left 35% / 75px;
}

.episode-width {
	position: relative;
	padding-top: 10rem;
}


.episode-message {
	font-size: 4.2rem;
	font-weight: bold;
	line-height: 1.5;
}

.episode-message em {
	color: #428F5A;
}

.episode-contents {
	margin-top: 12rem;
}

.episode-sub-title {
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.6;
}

.episode-grid-container {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
}

.episode-grid-container:nth-of-type(even) .episode-text-area {
	order: 2;
}

.episode-grid-container:nth-of-type(n+2) {
	margin-top: 10rem;
}

.episode-text {
	margin-top: 3rem;
}

.episode-text:nth-of-type(n+2) {
	margin-top: 2rem;
}

.episode-img p {
	font-size: 1.2rem;
}

.episode-img.bottom img:first-of-type {
	inline-size: 460px;
}

.episode-img.bottom img:nth-of-type(n+2) {
	inline-size: 280px;
}

.episode-img.bottom img:nth-of-type(2) {
	display: block;
	margin-top: -20px;
	margin-left: auto;
}

.episode-img.bottom img:nth-of-type(3) {
	display: block;
	margin-top: -20px;
	margin-left: 20px;
}

.product-img {
	/* margin-top: -100px; */
	margin-left: 60%;
	inline-size: 32%;
}


/* ====================================
	スタイル（～1500px）
===================================== */
@media screen and (width <1500px) {
.healingfan-img {
	inline-size: 50%;
}
}



/* ====================================
	（～1080px）
===================================== */
@media screen and (width <1080px) {

	.section-title {
		font-size: 10rem;
	}

	/* MV */

	.mainvisual-img-inner::before {
		background: url(images/bg-tree.svg) no-repeat top 3% left 2% / 100px, url(images/bg-moon.svg) no-repeat top 1% right 30% / 80px, url(images/bg-mount1.svg) no-repeat top 75% right 5% / 230px, url(images/bg-tree.svg) no-repeat top 78% left 41% / 80px, url(images/bg-tree.svg) no-repeat top 90% left 49% / 60px;
	}

	.healingfan-info {
		left: 25%;
		top: 82%;
	}

	.healingfan-info li:first-of-type,
	.healingfan-info li:nth-of-type(3) {
		font-size: 1.2rem;
	}

	.healingfan-info li:nth-of-type(2) {
		font-size: 1.4rem;
	}

	/* ABOUT */

	.about .title-img {
		inline-size: 300px;
	}

	.about-contents-block {
		flex-direction: column;
		gap: 5rem;
	}

	.about-bg {
		background: url(images/bg-mount1.svg) no-repeat left 10% top 7% / 230px,
			url(images/bg-mount2.svg) no-repeat right 5% top 25% / 140px;
	}

	.about-contents-text {
		margin-right: 0;
		margin-top: 0;
		inline-size: 100%;
		padding: 0;
		border: none;
		border-radius: 0;
	}

	.about-contents-text.right {
		margin-top: 0;
		margin-left: 0;
		inline-size: 100%;
		order: -1;
	}

	.about-movie-area {
		margin-inline: auto;
	}

	.about-movie-area,
	.about-img {
		inline-size: 80%;
	}

	.about-bottom-text {
		margin-top: 20px;
	}

	/* TECHNOLOGY */


	.technology-block {
		margin-top: 5rem;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		gap: 3rem;
	}

	.technology-bg {
		background: url(images/bg-tree.svg) no-repeat top 11% right 10% / 85px,
			url(images/bg-moon.svg) no-repeat top 10% right 5% / 40px;
	}

	.technology-block:nth-of-type(even) {
		grid-template-columns: 1fr;
		margin-top: 7rem;
	}

	.technology-block:nth-of-type(3) {
		margin-top: 7rem;
	}

	.technology-block:nth-of-type(even) .technology-text-area {
		margin-top: 0;
		margin-left: 0;
		padding: 0;
	}

	.technology-block:nth-of-type(even) .technology-img {
		order: 2;
	}

	.technology-number {
		position: static;
		transform: translate(0, 0);
		font-size: 4rem;

	}

	.technology-block-title {
		margin-top: 0.5rem;
		font-size: 2rem;
	}

	.technology-text-area {
		padding: 0;
		border: none;
		border-radius: 0;
	}

	.technology-block-text {
		font-size: 1.5rem;
	}

	.technology-block-point {
		font-size: 1.4rem;
	}

	.technology-img {
		max-inline-size: 100%;
		margin-top: 0px;
		margin-left: 0px;
	}

	.technology-block:nth-of-type(3) .technology-img {
		margin-top: 0;
	}


	/* EPISODE */

	.episode-bg {
		background: url(images/bg-moon.svg) no-repeat top 95% right 13% / 50px, url(images/bg-mount2.svg) no-repeat top 99% right 14% / 187px, url(images/bg-mount1.svg) no-repeat top 7% right 10% / 300px, url(images/bg-tree.svg) no-repeat top 99% left 28% / 70px, url(images/bg-tree.svg) no-repeat top 98% left 21% / 75px;
	}

	.episode-grid-container {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		gap: 60px
	}

	.episode-grid-container:nth-of-type(even) .episode-text-area {
		order: 0;
	}

	.episode-img.bottom img:first-of-type {
		inline-size: 70%;
	}

	.episode-img.bottom img:nth-of-type(n+2) {
		inline-size: 60%;
	}


	.product-img {
		margin-top: 5rem;
		margin-left: 0;
		margin-inline: auto;
	}


}


/* ====================================
	スマートフォン専用スタイル（～768px）
===================================== */
@media screen and (width <768px) {

	.section-title {
		font-size: 8rem;
	}

	.technology .section-title {
		font-size: 5rem;
	}

	.common-sub-title {
		margin-top: 23rem;
		font-size: 2.4rem;
	}

	.common-sub-text {
		margin-top: 3rem;
		font-size: 1.5rem;
	}

	/* MV */


	.mainvisual-img-container.pc-only {
		display: none;
	}

	.mainvisual-img-container.sp-only {
		display: block;
	}

	.header-group {
		position: relative;
		z-index: 3;
	}


	.healingfun-title {
		margin-top: 1rem;
		gap: 1rem;
	}

	.main-visual {
		display: flex;
		flex-direction: column;
	}


	.mainvisual-img-inner {
		position: static;
		margin-bottom: 3rem;
	}


	.mainvisual-img-container {
		position: static;
	}

	.healingfan-img {
		inline-size: 50%;
		margin-right: auto;
		margin-left: auto;
		inline-size: 100%;
		z-index: 1;
	}

	.mainvisual-img-inner::before {
		background: url(images/bg-tree.svg) no-repeat top 42% left 10% / 56px, url(images/bg-moon.svg) no-repeat top 31% right 12% / 30px, url(images/bg-mount1.svg) no-repeat top 42% right 10% / 180px, url(images/bg-tree.svg) no-repeat top 51% left 18% / 53px, url(images/bg-tree.svg) no-repeat top 36% left 31% / 50px;
	}

	.mainvisual-top-contents {
		position: relative;
	}

	.healingfun-top-text {
		position: static;
		padding-bottom: 0;
	}

	.main-visual-contents-inner {
		block-size: auto;
	}

	.healingfun-title span {
		font-size: 4.5rem;
	}

	.healingfun-catch {
		margin-top: 10px;
		font-size: 1.8rem;
	}

	.healingfun-bottom-block:first-of-type .healingfun-bottom-text {
		padding: 0rem 0.3rem;
		font-size: 1.8rem;
	}

	.healingfun-bottom-block {
		margin-top: 5rem;
	}

	.healingfun-bottom-text {
		padding: 0rem 0.3rem;
		font-size: 1.5rem;
	}

	.healingfan-info {
		left: auto;
		right: 4%;
		top: 79%;
	}


	/* about */
	.about {
		padding-bottom: 7rem;
	}

	.about-bg {
		background: url(images/bg-mount1.svg) no-repeat left 10% top 7% / 150px;
	}

	.about .title-img {
		inline-size: 200px;
	}

	.about-movie-area,
	.about-img {
		inline-size: 100%;
	}

	.about-contents-title {
		font-size: 2rem;
	}

	.about-contents-point {
		font-size: 1.4rem;
	}


	.movie-contents {
		margin-top: 0;
	}

	.about-movie-area .movie-button {
		text-align: right;
	}

	.about-contents-block.is-first {
		gap: 3rem;
	}

	.about-contents-block {
		gap: 2rem;
	}

	.about-contents-block {
		margin-top: 7rem;
	}


	/* feature */

	.feature {
		padding-bottom: 7rem;
	}

	.feature-width {
		padding-top: 20rem;
	}

	.feature-bg {
		background: url(images/bg-mount1.svg) no-repeat right 5% top 8% / 130px, url(images/bg-mount2.svg) no-repeat left 3% top 31% / 83px;
	}

	.feature-sub-title span {
		margin-top: 0;
		font-size: 2.4rem;
	}

	.feature-common-title {
		font-size: 2rem;
	}


	.feature .title-img {
		top: 75%;
		left: 0%;
		inline-size: 200px;
	}

	.feature-sub-text {
		margin-top: 3rem;
		text-align: left;
	}

	.feature-bg-mount1 {
		background-image: none;
	}

	.feature-common-title {
		margin-top: 50px;
		padding: 0;
	}

	.feature-common-text {
		text-align: left;
		margin-top: 3rem;
		font-size: 1.5rem;
	}

	.feature .movie-contents {
		max-inline-size: 100%;
		inline-size: 100%;
		margin-top: 3rem;
	}

	.feature-slide-img p {
		font-size: 1.2rem;
		text-align: left;
	}

	.feature-swiper {
		padding-inline: 10px;
	}

	.feature-button-next,
	.feature-button-prev {
		inline-size: 20px;
		block-size: 20px;
	}

	.feature-button-next {
		right: -10px;
	}

	.feature-button-prev {
		left: -10px;
		z-index: 2;
	}


	.feature-swiper-title {
		font-size: 1.6rem;
		padding: .2em 50px;
	}

	.swiper-pagination-bullet {
		width: 8px;
		height: 8px;
	}


	/* technology */

	.technology {
		padding-bottom: 10rem;
	}

	.technology-bg {
		background: url(images/bg-tree.svg) no-repeat top 8% right 10% / 85px,
			url(images/bg-moon.svg) no-repeat top 6% right 5% / 40px;
	}

	.technology .title-img {
		inline-size: 200px;
	}

	/* episode */

	.episode-width {
		padding-top: 5rem;
	}

	.episode-contents {
		margin-top: 5rem;
	}

	.episode-bg {
		background: url(images/bg-moon.svg) no-repeat top 96% right 8% / 40px, url(images/bg-mount2.svg) no-repeat top 100% right 8% / 100px, url(images/bg-mount1.svg) no-repeat top 5% right 10% / 105px, url(images/bg-tree.svg) no-repeat top 99% left 19% / 41px, url(images/bg-tree.svg) no-repeat top 98% left 7% / 40px;
	}

	.episode-message {
		margin-left: 0;
		font-size: 2.4rem;
	}

	.episode-sub-title {
		font-size: 2rem;
	}

	.episode-grid-container {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		gap: 20px
	}

	.episode-grid-container:nth-of-type(n+2) {
		margin-top: 5rem;
	}

	.episode-grid-container:nth-of-type(even) .episode-text-area {
		order: 0;
	}

	.episode-text {
		margin-top: 2rem;
		font-size: 1.5rem;
	}

	.product-img {
		inline-size: 50%;
		margin-top: 10rem;
	}

}

/* ====================================
	TAB、PC、印刷専用スタイル（768px～）
===================================== */
@media print,
screen and (width >=768px) {
	:root {
		--margin-large: 8rem;
		--margin-medium: 6rem;
		--margin-small: 4rem;
	}
}


@media print,
screen and (1400px <=width) {
	.CommonFooter {
		padding-block: 7vw 10vw;
	}
}


/* ====================================
	タブレット専用スタイル（768px～1079px）
===================================== */
@media screen and (768px <=width < 1080px) {

	/* MV */

	.healingfan-img {
		inline-size: 50%;
		margin-left: auto;
	}

	.healingfun-catch {
		font-size: 2.2rem;
	}

	.healingfun-title span {
		font-size: 7rem;
	}

	.healingfun-bottom-block:first-of-type .healingfun-bottom-text {
		font-size: 2.2rem;
	}

	.healingfun-bottom-text {
		font-size: 1.6rem;
	}
}

/* ====================================
	PC専用スタイル（1080px～）
===================================== */
@media print,
screen and (1080px <=width) {}