@charset "UTF-8";
/* ===================================================================
CSS information
 file name  :  health-care.css
 style info :  ヘルスケア事業部（カーボフラテックス・家庭用医療機器・OEM/ODM） 追加スタイル
=================================================================== */
/* ---------------------
html
--------------------- */
html {
	margin-top: 0!important;

	@media screen and (max-width: 767px) {
		margin-top: 0!important;
	}
}

/* ---------------------
heater
--------------------- */
.health-care-lp {
	font-family: "Noto Sans JP", sans-serif;
	min-width: 1280px;

	@media screen and (max-width: 767px) {
		min-width: 100%
	}

	h2 {
		margin-bottom: 0;

		span::before {
			display: none;
		}
	}

	.pc-only {
		display: block;

		@media screen and (max-width: 767px) {
			display: none;
		}
	}

	.sp-only {
		display: none;

		@media screen and (max-width: 767px) {
			display: block;
		}
	}


	/* ---------------------
	header
	--------------------- */
	/* カーボフラテックス */
	&.heater {
		.mv {
			width: 100%;
			min-height: 790px;
			background: url("../img/health-care/heater/bg_mv.png") center 120px/cover no-repeat;
			text-align: center;
			padding-top: 120px;

			@media screen and (max-width: 767px) {
				background-position: center calc(80 / 375 * 100vw);
				min-height: auto;
				padding-top: calc(80 / 375 * 100vw);
			}

			h2 {
				font-size: 80px;
				font-weight: 800;
				line-height: 1;
				letter-spacing: 0.2em;
				margin-bottom: 114px;

				@media screen and (max-width: 767px) {
					font-size: 34px;
					width: calc(100% - 40px);
					margin: 0 auto 40px;
				}

				span {
					display: block;
					margin-bottom: 40px;

					@media screen and (max-width: 767px) {
						margin-bottom: 10px;
					}
				}
			}
		}
	}

	/* 家庭用医療機器 */
	&.home_use {
		.mv {
			width: 100%;
			/* min-height: 840px; */
			height: 100vh;
			max-height: 1200px;
			background: #f6f6f4 url("../img/health-care/home/bg_mv.jpg?240902") center bottom/cover no-repeat;
			text-align: center;
			padding-top: 126px;

			@media screen and (max-width: 767px) {
				height: calc(580 / 375 * 100vw);
				padding-top: calc(80 / 375 * 100vw);
				margin-top: 0;
				background-size: 190%;
			}

			h2 {
				font-size: 54px;
				font-weight: 800;
				line-height: 1.4;
				letter-spacing: 0.15em;
				margin-bottom: 65px;

				@media screen and (max-width: 767px) {
					font-size: 24px;
					width: calc(100% - 40px);
					margin: 0 auto 40px;
				}

				span {
					display: block;
					font-size: 30px;
					font-weight: 800;
					line-height: 1.4;
					letter-spacing: 0.045em;
					margin-bottom: 20px;

					@media screen and (max-width: 767px) {
						margin-bottom: 10px;
						font-size: 20px;
					}
				}
			}
		}
	}

	/* OEM/ODM */
	&.oem-odm {
		.mv {
			width: 100%;
			min-height: 100vh;
			padding-top: 100px;
			position: relative;
			margin-bottom: 200px;

			@media screen and (max-width: 1280px) and (min-width: 768px) {
				min-height: 960px;
			}

			@media screen and (max-width: 767px) {
				background-position: center 0;
				min-height: auto;
				padding-top: calc(80 / 375 * 100vw);
				margin-bottom: 60px;
			}

			.bg_mv {
				position: fixed;
				top: 0;
				left: 0;
				width: 100%;
				min-height: 100vh;
				background: url("../img/health-care/oem-odm/bg_mv.jpg") center 70px/cover no-repeat;
				z-index: -1;

				@media screen and (max-width: 767px) {
					background: url("../img/health-care/oem-odm/bg_mv_sp.jpg") center 60px/cover no-repeat;
				}

				&::after {
					position: absolute;
					top: 0;
					right: 0;
					z-index: 0;
					content: "";
					width: 100%;
					min-width: calc(100% - 290px);
					height: 100%;
					background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9));
				}

				@media screen and (max-width: 767px) {
					&::after {
						background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6));
					}
				}
			}

			.inner-mv {
				width: 730px;
				position: absolute;
				z-index: 1;
				top: 240px;
				left: calc(50% - 87px);

				@media screen and (max-width: 767px) {
					width: 100%;
					position: relative;
					top: 0;
					left: 0;
					padding-bottom: 40px;
				}
			}

			h2 {
				font-size: 50px;
				font-weight: 800;
				line-height: 1.8;
				letter-spacing: 0.03em;
				margin-bottom: 37px;

				@media screen and (max-width: 1280px) and (min-width: 768px) {
					font-size: 48px;
					letter-spacing: 0;
				}

				@media screen and (max-width: 767px) {
					font-size: 34px;
					line-height: 1.4;
					letter-spacing: 0.03em;
					width: calc(100% - 40px);
					margin: 0 auto 40px;
				}

				span {
					display: block;
					margin-bottom: 40px;

					@media screen and (max-width: 767px) {
						margin-bottom: 10px;
					}
				}
			}

			.language-area {
				justify-content: flex-start;
				margin-bottom: 104px;

				@media screen and (max-width: 767px) {
					margin-bottom: 60px;
				}

				p {
					font-size: 14px;
				}
			}

			p {
				font-size: 18px;
				font-weight: 400;
				line-height: 2.4;

				@media screen and (max-width: 767px) {
					padding: 0 20px;
					font-size: 16px;
					line-height: 2;
				}
			}
		}
	}

	/* language-area */
	.language-area {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;

		@media screen and (max-width: 767px) {
			flex-direction: column;
		}

		&.coming-soon ul li a {
			background-color: rgba(153, 153, 153, 1);
			border-color: rgba(153, 153, 153, 1);
			color: rgba(221, 221, 221, 1);
			pointer-events: none;

			&::after {
				display: none;
			}
		}

		p {
			font-size: 15px;
			font-weight: 400;
			letter-spacing: -0.005em;

			@media screen and (max-width: 767px) {
				margin-bottom: 10px;
			}

		}

		ul {
			display: flex;
			justify-content: center;
			gap: 10px;
			margin-left: 15px;

			@media screen and (max-width: 767px) {
				margin-left: 0;
			}

			li {
				a {
					display: flex;
					justify-content: center;
					align-items: center;
					width: 110px;
					height: 34px;
					background-color: #fff;
					border: #000 solid 1px;
					border-radius: 100vh;
					font-size: 14px;
					font-weight: 400;
					line-height: 1;
					position: relative;

					&:hover {
						background-color: #000;
						border-color: #fff;
						color: #fff;

						@media screen and (max-width: 767px) {
							background-color: #fff;
							border-color: #000;
							color: #000;
						}
					}

					&::after {
						position: absolute;
						top: 50%;
						right: 10px;
						transform: translateY(-50%);
						content:"\f054";
						font-family: "Font Awesome 6 Free";
						font-weight: 900;
						transition: all .0s;
					}
				}
			}
		}
	}


	/* ---------------------
	intro-area
	--------------------- */
	/* カーボフラテックス */
	&.heater {
		.intro-area {
			width: 100%;
			text-align: center;
			margin-top: -100px;
			margin-bottom: 90px;

			@media screen and (max-width: 767px) {
				margin: 50px auto 40px;
				width: calc(100% - 40px);
			}

			.use-list {
				width: 100%;
				display: flex;
				justify-content: center;
				gap: 20px;
				margin-bottom: 30px;

				@media screen and (max-width: 767px) {
					gap: 10px;
					margin-bottom: 20px;
				}

				li {
					padding: 16px 20px;
					border-radius: 10px;
					color: #fff;
					background: linear-gradient(30deg, rgba(225, 37, 33, 1), rgba(168, 19, 15, 1));
					font-size: 40px;
					font-weight: 800;
					line-height: 1;

					@media screen and (max-width: 767px) {
						padding: 10px;
						font-size: 16px;
					}
				}
			}

			h2 {
				font-size: 35px;
				font-weight: 800;
				line-height: 1.6;
				margin-bottom: 28px;

				@media screen and (max-width: 767px) {
					font-size: 22px;
				}
			}

			p {
				font-size: 16px;
				font-weight: 400;
				line-height: 2.2;
				letter-spacing: -0.01em;

				@media screen and (max-width: 767px) {
					font-size: 14px;
					text-align: left;
				}
			}
		}
	}

	/* 家庭用医療機器 */
	&.home_use {
		.intro-area {
			width: 100%;
			height: 670px;
			background: url("../img/health-care/home/bg_intro.jpg") center top/cover no-repeat;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;

			@media screen and (max-width: 767px) {
				margin: 0 auto 40px;
				padding: 20px 20px 40px;
				height: auto;
			}

			.intro-text {
				font-size: 16px;
				font-weight: 400;
				line-height: 2.2;
				text-align: center;
				margin-bottom: 60px;

				@media screen and (max-width: 767px) {
					text-align: left;
				}
			}

			.effect-area {
				width: 1080px;
				margin: 0 auto;
				display: flex;
				justify-content: space-between;
				position: relative;

				@media screen and (max-width: 767px) {
					width: 100%;
					flex-direction: column;
					gap: 60px;
				}

				li {
					width: 500px;
					border: solid 1px;
					border-radius: 20px;
					display: flex;
					align-items: center;
					flex-direction: column;
					padding: 30px 20px 40px;
					text-align: center;
					position: relative;

					@media screen and (max-width: 767px) {
						width: 100%;
						padding: 30px 20px;
					}

					&:nth-of-type(1) {
						border-color: rgba(0, 77, 161, 1);

						h2 {
							color: rgba(0, 77, 161, 1);
						}

						&::after {
							position: absolute;
							top: 50%;
							right: -80px;
							transform: translate(-50%, -50%);
							content: "";
							width: 40px;
							height: 40px;
							background: url("../img/health-care/home/icon_multiply.svg") center top/contain no-repeat;
						}

						@media screen and (max-width: 767px) {
							&::after {
								top: auto;
								bottom: calc(-50 / 375 * 100vw);
								right: 50%;
								transform: translate(50%, 0);
							}
						}
					}

					&:nth-of-type(2),&:nth-of-type(3) {
						border-color: rgba(209, 43, 36, 1);

						h2 {
							color: rgba(209, 43, 36, 1);
						}
					}

					h2 {
						font-size: 25px;
						font-weight: 800;
						line-height: 1.0;
						margin-bottom: 20px;
					}

					h3 {
						font-size: 18px;
						font-weight: 800;
						line-height: 1.6;
						margin-bottom: 10px;
						display: flex;
						align-items: center;

						@media screen and (max-width: 767px) {
							font-size: 14px;
						}

						span {
							width: 200px;
							display: inline-block;

							@media screen and (max-width: 767px) {
								width: calc(140 / 375 * 100vw);
								transform: translateY(2px);
							}
						}
					}

					p {
						font-size: 16px;
						font-weight: 400;
						line-height: 2.2;

						@media screen and (max-width: 767px) {
							line-height: 1.8;
						}
					}
				}
			}

			.use-list {
				width: 100%;
				display: flex;
				justify-content: center;
				gap: 20px;
				margin-bottom: 30px;

				@media screen and (max-width: 767px) {
					gap: 10px;
					margin-bottom: 20px;
				}

				li {
					padding: 16px 20px;
					border-radius: 10px;
					color: #fff;
					background: linear-gradient(30deg, rgba(225, 37, 33, 1), rgba(168, 19, 15, 1));
					font-size: 40px;
					font-weight: 800;
					line-height: 1;

					@media screen and (max-width: 767px) {
						padding: 10px;
						font-size: 16px;
					}
				}
			}

			h2 {
				font-size: 35px;
				font-weight: 800;
				line-height: 1.6;
				margin-bottom: 28px;

				@media screen and (max-width: 767px) {
					font-size: 22px;
				}
			}

			p {
				font-size: 16px;
				font-weight: 400;
				line-height: 2.2;
				letter-spacing: -0.01em;

				@media screen and (max-width: 767px) {
					font-size: 14px;
					text-align: left;
				}
			}
		}
	}

	/* ---------------------
	section-title
	--------------------- */
	.section-title {
		width: 100%;
		text-align: center;
		margin-bottom: 54px;

		@media screen and (max-width: 767px) {
			margin-bottom: 40px;
		}

		h2 {
			font-family: "Source Sans 3", sans-serif;
			font-size: 64px;
			font-weight: 900;
			line-height: 1.2;
			letter-spacing: 0.05em;

			@media screen and (max-width: 767px) {
				font-size: 40px;
			}

			.heater & {
				color: rgba(209, 43, 36, 1);
			}

			.home_use & {
				color: rgba(178, 156, 95, 1);
			}

			.oem-odm & {
				color: rgba(30, 119, 73, 1);
			}

			small {
				font-family: "Noto Sans JP", sans-serif;
				display: block;
				font-size: 16px;
				font-weight: 800;
				color: #000;
				letter-spacing: 0;
			}
		}
	}

	/* ---------------------
	about-area
	--------------------- */
	/* OEM/ODM */
	&.oem-odm {
		.about-area {
			padding-bottom: 50px;
			padding-top: 100px;
			background-color: #fff;

			@media screen and (max-width: 767px) {
				width: 100%;
				margin: 0 auto;
				padding-left: 20px;
				padding-right: 20px;
			}

			.about-content {
				width: 1082px;
				margin: 0 auto;

				@media screen and (max-width: 767px) {
					width: 100%;
				}

				.about-item {
					margin-bottom: 50px;

					h3 {
						font-size: 30px;
						font-weight: 800;
						line-height: 1;
						margin-bottom: 15px;
						display: inline-flex;
						align-items: center;

						@media screen and (max-width: 767px) {
							display: block;
							font-size: 20px;
							line-height: 1.6;
							margin-bottom: 30px;
						}

						span {
							font-size: 44px;
							font-weight: 900;
							color: rgba(30, 119, 73, 1);
							margin-right: 10px;

							@media screen and (max-width: 767px) {
								display: block;
								font-size: 30px;
							}
						}
					}

					h4 {
						font-size: 20px;
						font-weight: 800;
						line-height: 1.6;
						margin-bottom: 10px;

						@media screen and (max-width: 767px) {
							font-size: 17px;
						}
					}

					p {
						font-size: 16px;
						font-weight: 400;
						line-height: 1.8;
					}
				}
			}
		}
	}

	/* ---------------------
	feature-area
	--------------------- */
	.feature-area {
		margin-bottom: 120px;

		.home_use & {
			padding-top: 100px;

			@media screen and (max-width: 767px) {
				padding-top: 20px;
			}
		}

		.oem-odm & {
			background-color: rgba(242, 246, 245, 1);
			padding-top: 100px;
			padding-bottom: 110px;
			margin-bottom: 0;

			@media screen and (max-width: 767px) {
				width: 100%;
				padding-top: 50px;
				padding-bottom: 50px;
			}
		}

		@media screen and (max-width: 767px) {
			width: calc(100% - 40px);
			margin: 0 auto 60px;
		}

		.feature-list {
			width: 1080px;
			margin: 0 auto 110px;

			@media screen and (max-width: 767px) {
				width: 100%;
				margin-bottom: 60px;
			}

			.oem-odm & {
				display: flex;
				flex-wrap: wrap;
				align-items: flex-start;
				gap: 60px 40px;
				margin-bottom: 0;

				@media screen and (max-width: 767px) {
					padding: 0 40px;
				}
			}

			li {
				width: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
				gap: 40px;
				margin-bottom: 50px;

				@media screen and (max-width: 767px) {
					display: block;
				}

				.heater & {
					&:nth-of-type(even) {
						flex-direction: row-reverse;
					}
				}

				.home_use & {
					&:nth-of-type(odd) {
						flex-direction: row-reverse;
					}
				}

				.oem-odm & {
					width: 520px;
					flex-direction: column;
					gap: 20px;
					margin-bottom: 0;
				}

				.heater &, .home_use & {
					&:last-of-type {
						margin-bottom: 0;
					}
				}

				.text-box {
					width: 600px;
					margin-bottom: 20px;

					@media screen and (max-width: 767px) {
						width: 100%;
					}

					.title-container {
						.heater & {
							width: 100%;
							display: grid;
							gap: 10px;
							grid-template-columns: 61px auto;
							grid-template-rows: 2fr;
							margin-bottom: 26px;

							.number {
								grid-column: 1 / 2;
								grid-row: 1 / 3;
								text-align: center;

								@media screen and (max-width: 767px) {
									transform:translateY(20px);
								}
							}

							.tag {
								grid-column: 2 / 8;
								grid-row: 1 / 2;

								p {
									display: inline-block;
									font-size: 20px;
									font-weight: 800;
									line-height: 1;
									text-align: center;
									padding: 6px 13px;
									border-radius: 10px;
									color: #fff;
									background: linear-gradient(30deg, rgba(225, 37, 33, 1), rgba(168, 19, 15, 1));

									span {
										font-size: 24px;
									}
								}
							}
						}


						h2 {
							font-size: 30px;
							font-weight: 800;

							.heater & {
								grid-column: 2 / 8;
								grid-row: 2 / 3;
								line-height: 1;
								margin: 0;

								@media screen and (max-width: 767px) {
									line-height: 1.3;
								}
							}

							.home_use & {
								line-height: 1.6;
								margin-bottom: 30px;

								@media screen and (max-width: 767px) {
									font-size: 24px;
									margin-bottom: 10px;
								}

								span {
									display: inline-block;
									transform: translateY(10px);

									@media screen and (max-width: 767px) {
										width: 200px;
									}
								}
							}
						}

						+ p {
							font-size: 16px;
							font-weight: 400;
							line-height: 2;
							letter-spacing: -0.01em;
						}
					}
				}

				.oem-odm & {
					.img-box {
						@media screen and (max-width: 767px) {
							margin-bottom: 20px;
						}
					}
					.txt-box {
						h3 {
							font-size: 28px;
							font-weight: 800;
							line-height: 1.6;
							margin-bottom: 10px;

							@media screen and (max-width: 767px) {
								font-size: 20px;
							}
						}

						p {
							font-size: 16px;
							line-height: 1.7;
						}
					}
				}
			}

			li {
				.home_use &, .heater & {
					&:nth-of-type(1) .img-box {
						width: 440px;

						@media screen and (max-width: 767px) {
							width: 100%;
						}
					}
					&:nth-of-type(2) .img-box {
						width: 440px;

						@media screen and (max-width: 767px) {
							width: 100%;
						}
					}
					&:nth-of-type(3) .img-box {
						width: 444px;

						@media screen and (max-width: 767px) {
							width: 100%;
						}
					}

					.img-box {
						.inner-img {
							margin-bottom: 6px;
							border-radius: 20px;
							overflow: hidden;
						}

						p {
							font-size: 13px;
							font-weight: 400;
							line-height: 1.6;
							letter-spacing: -0.01em;
						}
					}
				}
			}
		}

		/* utilization-area */
		.utilization-area {
			width: 1080px;
			margin: 0 auto;

			@media screen and (max-width: 767px) {
				width: 100%;
			}

			h2 {
				font-size: 30px;
				font-weight: 800;
				line-height: 1.6;
				text-align: center;
				margin-bottom: 52px;

				@media screen and (max-width: 767px) {
					font-size: 20px;
					margin-bottom: 20px;
				}

				span {
					display: inline-block;
					transform: translateY(10px);
					margin-right: 4px;

					@media screen and (max-width: 767px) {
						width: 60%;
					}
				}
			}

			.utilization-list {
				width: 100%;
				display: flex;
				justify-content: space-between;
				gap: 40px;
				flex-wrap: wrap;

				@media screen and (max-width: 767px) {
					gap: 20px;
				}

				li {
					position: relative;
					border: rgba(209, 43, 36, 1) solid 1px;
					border-radius: 20px;

					&:nth-of-type(1),
					&:nth-of-type(2) {
						width: 520px;
						height: 303px;

						@media screen and (max-width: 767px) {
							width: 100%;
							height: calc(260 / 375 * 100vw);
						}

						.img-box {
							width: 410px;

							@media screen and (max-width: 767px) {
								width: calc(100% - 40px);
							}
						}
					}

					&:nth-of-type(3),
					&:nth-of-type(4),
					&:nth-of-type(5) {
						width: 333px;
						height: 260px;

						@media screen and (max-width: 767px) {
							width: 100%;
							height: calc(260 / 375 * 100vw);
						}

						.img-box {
							width: 260px;

							@media screen and (max-width: 767px) {
								width: calc(260 / 375 * 100vw);
								height: auto;
							}
						}
					}

					.img-box {
						margin: 20px auto 0;
					}
				}

				.text-box {
					position: absolute;
					bottom: 20px;
					left: 50%;
					transform: translateX(-50%);
					text-align: center;
					width: 100%;

					h3 {
						font-size: 22px;
						font-weight: 800;
						line-height: 1;
						margin-bottom: 5px;
					}
					p {
						font-size: 16px;
						font-weight: 400;
						line-height: 2;
					}
				}
			}
		}

		/* point-area */
		.point-area {
			padding: 120px 0;
			width: 100%;
			background-color: rgba(249, 246, 233, 1);

			@media screen and (max-width: 767px) {
				padding: 40px;
				width: calc(100% + 40px);
				margin: 0 -20px;
			}

			.point-list {
				width: 1080px;
				margin: 0 auto;
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				gap: 60px 40px;

				@media screen and (max-width: 767px) {
					width: 100%;
					flex-direction: column;
					gap: 40px;
				}

				li {
					width: 520px;

					@media screen and (max-width: 767px) {
						width: 100%;
					}

					.img-box {
						width: 100%;
						margin-bottom: 20px;
						border-radius: 20px;
						overflow: hidden;
					}

					.txt-box {
						width: 100%;
						display: flex;
						gap: 20px;

						.point-icon {
							width: 86px;
							height: 86px;
						}

						.title-container {
							width: 412px;

							h2 {
								font-size: 22px;
								font-weight: 800;
								line-height: 1.4;
								margin-bottom: 10px;
							}

							p {
								font-size: 15px;
								font-weight: 400;
								line-height: 1.6;
							}
						}
					}
				}
			}
		}

		/* comparison-area */
		.comparison-area {
			padding: 110px 0 0;
			width: 100%;

			@media screen and (max-width: 767px) {
				padding-top: 60px;
			}

			h2 {
				font-size: 30px;
				font-weight: 800;
				line-height: 1.6;
				margin-bottom: 50px;
				text-align: center;

				@media screen and (max-width: 767px) {
					font-size: 26px;
					text-align: left;
				}

				span {
					display: inline-block;
					width: 270px;
					transform:translateY(10px);

					@media screen and (max-width: 767px) {
						width: 200px;
					}
				}
			}

			.comparison-list {
				width: 1080px;
				margin: 0 auto;
				display: flex;
				justify-content: space-between;

				@media screen and (max-width: 767px) {
					width: 100%;
					flex-direction: column;
					gap: 20px;
				}

				li {
					width: 520px;
					border-radius: 20px;
					overflow: hidden;
					padding: 40px;
					text-align: center;

					@media screen and (max-width: 767px) {
						width: 100%;
						padding: 40px 20px 20px;
					}

					&:nth-of-type(1) {
						background-color: rgba(244, 244, 244, 1);

						h3 {
							background-color: rgba(85, 85, 85, 1);

							&::after {
								background-color: rgba(85, 85, 85, 1);
							}
						}
					}

					&:nth-of-type(2) {
						background-color:rgba(249, 246, 233, 1);

						h3 {
							background-color: rgba(178, 156, 95, 1);

							&::after {
								background-color: rgba(178, 156, 95, 1);
							}
						}
					}

					h3 {
						width: calc(100% + 80px);
						display: block;
						font-size: 20px;
						font-weight: 800;
						line-height: 1;
						color: #fff;
						padding: 22px;
						position: relative;
						margin: -40px -40px 0;

						@media screen and (max-width: 767px) {
							font-size: 16px;
						}

						&::after {
							position: absolute;
							bottom: -20px;
							left: 50%;
							transform: translateX(-50%) rotate(90deg);
							content: "";
							width: 15px;
							height: 25px;
							clip-path: polygon(0 0,100% 50%,0 100%);
						}
					}

					h4 {
						font-size: 25px;
						font-weight: 800;
						margin-top: 20px;

						span {
							width: 200px;
							display: inline-block;
						}
					}

					p {
						font-size: 18px;
						font-weight: 400;
						line-height: 1.6;
					}

					.img-box {
						margin-top: 26px;
						display: flex;
						flex-direction: column;
						gap: 30px;
					}
				}
			}
		}
	}

	/* ---------------------
	inquiry-area
	--------------------- */
	.inquiry-area {
		width: 100%;
		padding: 105px 0 120px;

		@media screen and (max-width: 767px) {
			padding: 40px 0;
		}

		.heater & {
			background: linear-gradient(0deg, rgba(225, 37, 33, 1), rgba(168, 19, 15, 1));
		}

		.home_use & {
			background: linear-gradient(0deg, rgba(178, 156, 95, 1), rgba(193, 169, 102, 1), rgba(219, 200, 149, 1));
		}

		.oem-odm & {
			background-color: rgba(30, 119, 73, 1);
		}


		&#inquiry {
			padding: 40px 0 50px;
		}

		.inner-inquiry {
			width: 1080px;
			margin: 0 auto;

			@media screen and (max-width: 767px) {
				width: calc(100% - 40px);
			}

			h2 {
				font-size: 35px;
				font-weight: 800;
				line-height: 1.6;
				text-align: center;
				margin-bottom: 0;

				@media screen and (max-width: 767px) {
					font-size: 24px;
				}

				.heater &, .oem-odm & {
					color: #fff;
				}

				.home_use & {
					color: #000;

					#inquiry & {
						color: #fff;
					}
				}
			}

			ul {
				display: flex;
				justify-content: center;

				@media screen and (max-width: 767px) {
					margin-top: 20px;
					gap: 20px;
					flex-direction: column;
				}

				.heater & {
					gap: 40px;
					margin-top: 40px;

					@media screen and (max-width: 767px) {
						gap: 20px;
					}
				}

				.home_use & {
					gap: 20px;
					margin-top: 30px;
				}

				.oem-odm & {
					gap: 40px;
					margin-top: 40px;

					@media screen and (max-width: 767px) {
						gap: 20px;
					}
				}

				li {
					a {
						display: flex;
						justify-content: center;
						align-items: center;
						background-color: #000;
						border: #000 solid 1px;
						border-radius: 100vh;
						font-weight: 800;
						line-height: 1.8;
						position: relative;
						color: #fff;
						transition: all .7s;

						@media screen and (max-width: 767px) {
							font-size: 20px;
							width: 100%;
							height: calc(80 / 375 * 100vw);
						}

						.heater & {
							width: 520px;
							height: 100px;
							font-size: 22px;

							@media screen and (max-width: 767px) {
								width: 100%;
								height: calc(80 / 375 * 100vw);
							}
						}

						.home_use & {
							width: 346px;
							height: 80px;
							font-size: 18px;

							@media screen and (max-width: 767px) {
								width: 100%;
								height: calc(80 / 375 * 100vw);
							}
						}

						.oem-odm & {
							width: 520px;
							height: 100px;
							font-size: 22px;

							@media screen and (max-width: 767px) {
								width: 100%;
								height: calc(80 / 375 * 100vw);
							}
						}

						&:hover {
							background-color: #fff;
							color: #000;

							@media screen and (max-width: 767px) {
								background-color: #000;
								color: #fff;
							}
						}

						p {
							text-align: center;
							line-height: 1.4;
						}

						span {
							display: block;
							font-size: 14px;
							font-weight: 400;
						}

						&::before {
							position: absolute;
							top: 50%;
							left: 60px;
							transform: translateY(-50%);
							font: var(--fa-font-regular);
							font-size: 32px;
							transition: all .0s;
						}

						@media screen and (max-width: 767px) {
							&::before {
								left: 20px;
							}
						}

						.heater &::before {
							left: 60px;
						}
						@media screen and (max-width: 767px) {
							.heater &::before {
								left: 20px;
							}
						}

						.home_use &::before {
							left: 30px;
						}

						@media screen and (max-width: 767px) {
							.home_use &::before {
								left: 20px;
							}
						}
					}

					&.mail a::before {
						content:"\f0e0";
					}

					&.dll a::before {
						content:"\f15c";
					}
				}
			}
		}
	}

	/* ---------------------
	spec-area
	--------------------- */
	&.heater {
		.spec-area {
			width: 100%;
			text-align: center;
			position: relative;

			.bg_spec {
				position: sticky;
				top: 0;
				z-index: -1;
				width: 100%;
				height: 100vh;
				background: url("../img/health-care/heater/bg_spec.png") top center/cover no-repeat;
			}

			.spec-content {
				margin-top: -100vh;
				padding: 104px;
				position: relative;
				width: 100%;
				z-index: 15;

				@media screen and (max-width: 767px) {
					padding: 80px 20px 0;
				}
			}

			.spec-intro {
				margin-bottom: 50px;
			}

			h3 {
				font-size: 30px;
				font-weight: 800;
				line-height: 1.6;
				margin-bottom: 30px;

				@media screen and (max-width: 767px) {
					font-size: 20px;
				}
			}

			p {
				font-size: 16px;
				font-weight: 400;
				line-height: 2;
				letter-spacing: -0.01em;

				@media screen and (max-width: 767px) {
					text-align: left;
				}
			}

			/* spec-image */
			.spec-image {
				width: 1080px;
				margin: 0 auto 50px;

				@media screen and (max-width: 767px) {
					width: 100%;
				}

				.img-box {
					width: 100%;
					margin-bottom: 70px;

					&:last-of-type {
						margin-bottom: 0;
					}

					.inner-img {
						margin: 0 auto -10px;
					}

					&:nth-of-type(1) .inner-img {
						width: 740px;

						@media screen and (max-width: 767px) {
							width: 100%;
						}
					}
					&:nth-of-type(2) .inner-img {
						width: 1080px;
						display: flex;
						justify-content: center;
						gap: 40px;
						margin-bottom: 30px;

						@media screen and (max-width: 767px) {
							width: 100%;
							flex-direction: column;
							gap: 20px;
						}

						img {
							width: 520px;
						}
					}
				}
			}

			/* spec-table */
			.spec-table {
				width: 1080px;
				margin: 0 auto;
				padding-bottom: 80px;

				@media screen and (max-width: 767px) {
					width: 100%;
				}

				h3 {
					margin-bottom: 50px;
				}

				.spec-table-container {
					width: 100%;
					position: relative;
					margin-bottom: 40px;

					@media screen and (max-width: 767px) {
						position: relative;
						margin-bottom: 30px;

						&::after {
							position: absolute;
							top: -30px;
							left: 0;
							content: "※表は横にスクロールできます";
							font-size: 16px;
							font-weight: 400;
						}
					}

					.spec-table-scroller {
						@media screen and (max-width: 767px) {
							overflow: scroll;
							padding-bottom: 10px;
						}
					}

					table {
						width: 100%;
						table-layout: fixed;

						@media screen and (max-width: 767px) {
							width: 1080px;
						}

						tr {
							border: rgba(209, 43, 36, 1) solid;
							border-width: 1px 1px 0 0;

							th, td {
								padding: 15px 10px;
								font-size: 16px;
							}

							th {
								border: rgba(255, 255, 255, 1) solid;
								border-width: 0 0 1px 1px;
								background-color: rgba(209, 43, 36, 1);
								color: #fff;
								font-weight: 800;

								&:first-of-type {
									border-left: rgba(209, 43, 36, 1) solid 1px;
								}
							}

							td {
								border: rgba(209, 43, 36, 1) solid;
								border-width: 0 0 1px 1px;
								background-color: #fff;
								font-weight: 400;
							}
						}
					}
				}

				.caution {
					text-align: left;

					h3 {
						color: rgba(209, 43, 36, 1);
						font-size: 20px;
						font-weight: 800;
						line-height: 2;
						margin-bottom: 16px;
						padding-left: 36px;
						position: relative;

						&::after {
							position: absolute;
							top: 50%;
							left: 0;
							transform: translateY(-50%);
							content: "";
							width: 30px;
							height: 26px;
							background: url("../img/health-care/heater/icon_caution.svg") top center/contain no-repeat;
						}
					}

					ul {
						li {
							font-size: 16px;
							font-weight: 400;
							line-height: 1.6;
							padding-left: 1.2em;
							position: relative;
							margin-bottom: 10px;

							&::before {
								position: absolute;
								top: 0.05em;
								left: 0;
								content: "・";
								width: 1em;
								height: 1em;
							}
						}
					}
				}
			}
		}
	}

	&.home_use {
		.spec-area {
			width: 100%;
			position: relative;

			@media screen and (max-width: 767px) {
				margin-bottom: 60px;
			}

			.spec-content {
				padding: 104px 0;
				position: relative;
				width: 100%;
				z-index: 15;

				@media screen and (max-width: 767px) {
					padding: 80px 20px 0;
				}

				.comparison-list {
					width: 1080px;
					margin: 0 auto 40px;
					display: flex;
					justify-content: space-between;

					@media screen and (max-width: 767px) {
						width: 100%;
						flex-direction: column;
						gap: 20px;
					}

					li {
						width: 520px;
						border-radius: 20px;
						overflow: hidden;
						padding: 40px;
						text-align: center;

						@media screen and (max-width: 767px) {
							width: 100%;
							padding: 40px 20px 20px;
						}

						&:nth-of-type(1) {
							background-color: rgba(222, 225, 238, 1);

							h3 {
								background-color: rgba(125, 137, 184, 1);

								&::after {
									background-color: rgba(125, 137, 184, 1);
								}
							}
						}

						&:nth-of-type(2) {
							background-color:rgba(227, 223, 239, 1);

							h3 {
								background-color: rgba(109, 99, 135, 1);

								&::after {
									background-color: rgba(109, 99, 135, 1);
								}
							}
						}

						h3 {
							width: calc(100% + 80px);
							display: block;
							font-size: 20px;
							font-weight: 800;
							line-height: 1;
							color: #fff;
							padding: 22px;
							position: relative;
							margin: -40px -40px 0;

							@media screen and (max-width: 767px) {
								font-size: 16px;
							}

							&::after {
								position: absolute;
								bottom: -20px;
								left: 50%;
								transform: translateX(-50%) rotate(90deg);
								content: "";
								width: 15px;
								height: 25px;
								clip-path: polygon(0 0,100% 50%,0 100%);
							}
						}

						h4 {
							font-size: 25px;
							font-weight: 800;
							margin-top: 20px;

							span {
								width: 200px;
								display: inline-block;
							}
						}

						p {
							font-size: 18px;
							font-weight: 400;
							line-height: 1.6;
						}

						.img-box {
							margin-top: 26px;
							display: flex;
							flex-direction: column;
							gap: 30px;
						}
					}
				}
			}
			.spec-block {
				width: 1080px;
				margin: 0 auto 60px;

				@media screen and (max-width: 767px) {
					width: 100%;
				}
			}

			.spec-intro {
				width: 100%;
				display: flex;
				justify-content: space-between;
				gap: 40px;
				margin-bottom: 20px;

				@media screen and (max-width: 767px) {
					flex-direction: column;
					margin-bottom: 50px;
				}

				.txt-box {
					width: 720px;

					@media screen and (max-width: 767px) {
						width: 100%;
					}

					p {
						font-size: 16px;
						font-weight: 400;
						line-height: 1.6;
					}

					.btn-mini {
						margin-top: 20px;

						@media screen and (max-width: 767px) {
							text-align: center;
						}
					}
				}

				.img-box {
					width: 320px;
					height: 210px;

					@media screen and (max-width: 767px) {
						margin: 0 auto;
						height: auto;
					}
				}
			}

			h3 {
				font-size: 30px;
				font-weight: 800;
				line-height: 1.6;
				margin-bottom: 30px;
				text-align: center;

				@media screen and (max-width: 767px) {
					font-size: 20px;
				}
			}

			p {
				font-size: 16px;
				font-weight: 400;
				line-height: 2;
				letter-spacing: -0.01em;

				@media screen and (max-width: 767px) {
					text-align: left;
				}
			}

			/* spec-table */
			.spec-table {
				width: 1080px;
				margin: 0 auto;

				@media screen and (max-width: 767px) {
					width: 100%;
					margin-top: 50px;
				}

				h3 {
					margin-bottom: 50px;
				}

				.spec-table-container {
					width: 100%;
					position: relative;
					margin-bottom: 40px;

					@media screen and (max-width: 767px) {
						position: relative;
						margin-bottom: 30px;

						&::after {
							position: absolute;
							top: -30px;
							left: 0;
							content: "※表は横にスクロールできます";
							font-size: 16px;
							font-weight: 400;
						}
					}

					.spec-table-scroller {
						@media screen and (max-width: 767px) {
							overflow: scroll;
							padding-bottom: 10px;
						}
					}

					table {
						width: 100%;

						@media screen and (max-width: 767px) {
							width: 1080px;
						}

						tr {
							border: rgba(178, 156, 95, 1) solid;
							border-width: 1px 1px 0 0;

							th, td {
								padding: 15px 10px;
								font-size: 16px;
								text-align: center;
							}

							th {
								border: rgba(255, 255, 255, 1) solid;
								border-width: 0 0 1px 1px;
								background-color: rgba(178, 156, 95, 1);
								color: #fff;
								font-weight: 800;

								&:first-of-type {
									border-left: rgba(178, 156, 95, 1) solid 1px;
								}
							}

							td {
								border: rgba(178, 156, 95, 1) solid;
								border-width: 0 0 1px 1px;
								background-color: #fff;
								font-weight: 400;

								&:first-of-type {
									background-color: rgba(255, 252, 240, 1);
									width: 280px;
								}

								strong {
									font-weight: 400;
									color: rgba(209, 43, 36, 1);
								}
							}
						}

						&.comparison {
							border-radius: 20px;
							overflow: hidden;

							tr {
								border: none;

								&:first-of-type {
									th {
										font-size: 18px;
										padding: 20px;

										&:nth-of-type(1) {
											background: none;
											border: none;
										}
										&:nth-of-type(2), &:nth-of-type(3) {
											border-radius: 20px 20px 0 0;
										}

										&:nth-of-type(2) {
											background-color: rgba(125, 137, 184, 1);
										}

										&:nth-of-type(3) {
											background-color: rgba(109, 99, 135, 1);
										}
									}
								}

								&:nth-of-type(2) {
									td {
										&:first-of-type {
											border-radius: 20px 0 0 0;
										}
									}
								}

								&:last-of-type td {
									border: none;
								}

								th, td {
									padding: 15px 10px;
									font-size: 16px;
									text-align: center;
								}

								td {
									border: rgba(255, 255, 255, 1) solid;
									border-width: 0 0 1px 0;
									background-color: #fff;

									&:nth-of-type(1) {
										background-color: rgba(228, 228, 228, 1);
										width: 220px;
									}

									&:nth-of-type(2), &:nth-of-type(3) {
										border-left: rgba(255, 255, 255, 1) solid 1px;
									}

									&:nth-of-type(2) {
										background-color: rgba(222, 225, 238, 1);
									}

									&:nth-of-type(3) {
										background-color: rgba(227, 223, 239, 1);
									}
								}
							}
						}
					}
				}
			}

			/* lending-area */
			.lending-area {
				width: 1080px;
				margin: 50px auto 0;
				border-radius: 20px;
				padding: 40px 190px 80px;
				border: rgba(178, 156, 95, 1) solid 1px;

				@media screen and (max-width: 767px) {
					width: 100%;
					padding: 30px 40px 40px;
					margin-top: 20px;
				}

				h4 {
					font-size: 30px;
					font-weight: 800;
					color: rgba(178, 156, 95, 1);
					margin-bottom: 20px;
					text-align: center;

					@media screen and (max-width: 767px) {
						font-size: 20px;
					}
				}

				dl {
					display: flex;
					align-items: center;
					gap: 10px;
					flex-wrap: wrap;
					margin-bottom: 56px;
					position: relative;

					@media screen and (max-width: 767px) {
						flex-direction: column;
					}

					&:last-of-type {
						margin-bottom: 0;
					}

					&::after {
						position: absolute;
						bottom: -30px;
						left: 9px;
						content: "";
						width: 15px;
						height: 15px;
						background-color: rgba(178, 156, 95, 1);
						aspect-ratio: 1/cos(30deg);
						clip-path: polygon(50% 100%,100% 0,0 0);
					}

					@media screen and (max-width: 767px) {
						&::after {
							left: 50%;
							transform: translateX(-50%);
						}
					}

					&:last-of-type:after {
						display: none;
					}

					dt {
						width: 180px;

						@media screen and (max-width: 767px) {
							width: calc(180 / 375 * 100vw);
						}
					}

					dd {
						width: calc(100% - 190px);
						margin-bottom: 40px;

						@media screen and (max-width: 767px) {
							width: 100%;
						}

						&:last-of-type {
							margin-bottom: 0;
						}

						h5 {
							font-size: 22px;
							font-weight: 800;
							margin-bottom: 10px;

							@media screen and (max-width: 767px) {
								text-align: center;
							}
						}

						p {
							font-size: 16px;
							font-weight: 400;
							line-height: 1.6;
							letter-spacing: -0.01em;

							strong {
								font-weight: 400;
								color: rgba(209, 43, 36, 1);
							}
						}

						.inquiry-box {
							display: inline-flex;
							align-items: center;
							margin-top: 10px;

							@media screen and (max-width: 767px) {
								flex-direction: column;
								width: calc(250 / 375 * 100vw);
								margin: 10 auto 0;
							}

							.time {
								@media screen and (max-width: 767px) {
									font-size: 14px;
									transform: translateY(-5px);
								}
							}

							.tel {
								font-size: 23px;
								font-weight: 700;
								line-height: 1;
								margin-left: 10px;

								small {
									font-size: 16px;
								}

								span {
									font-size: 14px;
									font-weight: 500;
									margin-left: 10px;
								}
							}
						}
					}
				}
			}
		}
	}

	/* ---------------------
	flow-area
	--------------------- */
	.flow-area {

		.heater &, .home_use & {
			width: 1080px;
			margin: 0 auto 120px;
			padding-top: 130px;

			@media screen and (max-width: 767px) {
				width: calc(100% - 40px);
				margin: 0 auto 60px;
				padding-top: 40px;
			}

			.home_use & {
				padding-top: 0;
			}

			h3 {
				text-align: center;
				margin-bottom: 40px;
				font-size: 30px;
				font-weight: 800;

				@media screen and (max-width: 767px) {
					font-size: 20px;
					margin-bottom: 30px;
				}

				span {
					@media screen and (max-width: 767px) {
						display: inline-block;
						width: 60%;
					}
				}
			}

			.flow-list {
				width: 100%;
				margin-bottom: 70px;

				.flow-list-item {
					display: flex;
					flex-direction: row-reverse;
					justify-content: space-between;
					width: 100%;
					padding: 40px;
					border: rgba(209, 43, 36, 1) solid 1px;
					border-radius: 20px;
					background-color: #fff;
					position: relative;

					@media screen and (max-width: 767px) {
						flex-direction: column;
						gap: 20px;
					}

					&:not(:last-of-type) {
						margin-bottom: 40px;
					}

					&:before {
						content: "";
						position: absolute;
						bottom: -43px;
						left: 50%;
						margin-left: -25px;
						border: 22px solid transparent;
						border-top: 22px solid #FFF;
						z-index: 2;
					}

					&:after {
						content: "";
						position: absolute;
						bottom: -44px;
						left: 50%;
						margin-left: -25px;
						border: 22px solid transparent;
						border-top: 22px solid rgba(209, 43, 36, 1);
						z-index: 1;
					}

					&:last-of-type:before,
					&:last-of-type:after {
						display: none;
					}

					.text-box {
						width: 526px;
						display: flex;
						flex-direction: column;
						justify-content: center;

						@media screen and (max-width: 767px) {
							width: 100%;
						}

						.step {
							margin-bottom: 0;

							p {
								font-size: 19px;
								font-weight: 700;
								line-height: 1;
								color: #fff;
								padding: 10px 14px;
								border-radius: 10px;
								background: linear-gradient(0deg, rgba(225, 37, 33, 1), rgba(168, 19, 15, 1));
								display: inline-block;
							}
						}

						h3 {
							font-size: 30px;
							font-weight: 800;
							line-height: 1.6;
							text-align: left;
							margin-bottom: 10px;
						}

						p {
							font-size: 16px;
							font-weight: 400;
							line-height: 2;
						}
					}

					.img-box {
						width: 440px;

						@media screen and (max-width: 767px) {
							width: 100%;
						}
					}
				}
			}
		}

		.oem-odm & {
			padding-top: 100px;
			padding-bottom: 120px;
			background-color: #fff;

			.flow-content {
				width: 1080px;
				margin: 0 auto 60px;
				padding: 50px 80px;
				background-color: rgba(242, 246, 245, 1);
				border-radius: 20px;

				@media screen and (max-width: 767px) {
					width: calc(100% - 40px);
					padding: 30px 30px 40px;
				}

				&>p {
					text-align: center;

					@media screen and (max-width: 767px) {
						text-align: left;
					}
				}

				h3 {
					font-size: 30px;
					font-weight: 800;
					line-height: 1.4;
					text-align: center;
					color: rgba(30, 119, 73, 1);
					margin-bottom: 0;

					&:has(+p) {
						margin-bottom: 26px;
					}
				}

				h4 {
					font-size: 22px;
					font-weight: 800;
					line-height: 1.6;
					margin-bottom: 16px;

					@media screen and (max-width: 767px) {
						text-align: center;
						margin-bottom: 10px;
					}
				}

				p {
					font-size: 16px;
					font-weight: 400;
					line-height: 1.8;
				}

				ul {
					li:not(:last-of-type) {
						padding-bottom: 20px;
						margin-bottom: 30px;
						border-bottom: rgba(30, 119, 73, 1) dashed 1px;
					}
				}
			}

			.after-service {
				background: none;
				border: solid 1px rgba(30, 119, 73, 1);
				margin-bottom: 0;

				h3 {
					margin-bottom: 20px;
				}

				h4 {
					margin-bottom: 4px;
				}

				p {
					font-size: 15px;
					margin-bottom: 10px;
				}
			}
		}

		/* movie-container */
		.movie-area {
			.heater & {
				width: 100%;

				.movie-container {
					width: 100%;

					.movie-item {
						width: 100%;
						display: flex;
						justify-content: space-between;
						align-items: center;

						@media screen and (max-width: 767px) {
							flex-direction: column;
						}

						&:nth-of-type(even) {
							flex-direction: row-reverse;

							@media screen and (max-width: 767px) {
								flex-direction: column;
							}
						}

						&:not(:last-of-type) {
							margin-bottom: 40px;
						}

						.text-box {
							width: 520px;
							margin-bottom: 10px;

							@media screen and (max-width: 767px) {
								width: 100%;
								margin-bottom: 20px;
							}

							h3 {
								font-size: 30px;
								font-weight: 800;
								text-align: left;
								display: inline-flex;
								align-items: center;
								margin-bottom: 10px;

								@media screen and (max-width: 767px) {
									display: block;
									font-size: 24px;
									line-height: 1.4;
								}

								span {
									font-size: 18px;
									color: rgba(209, 43, 36, 1);
									margin-right: 10px;

									@media screen and (max-width: 767px) {
										display: block;
									}
								}
							}

							p {
								font-size: 16px;
								font-weight: 400;
								line-height: 2;
								letter-spacing: -0.01em;
							}
						}

						.img-box {
							width: 520px;
							border-radius: 20px;
							overflow: hidden;
							position: relative;
							background-color: #000;
							transition: all 300ms;

							@media screen and (max-width: 767px) {
								width: 100%;
							}

							&::before {
								position: absolute;
								top: 50%;
								left: 50%;
								transform: translate(-50%, -50%);
								content: "";
								width: 100px;
								height: 100px;
								background: url("../img/health-care/heater/icon_play.svg") top center/contain no-repeat;
								z-index: 1;
								pointer-events: none;
							}

							img {
								transition: all 300ms;
								opacity: .7;

								&:hover {
									opacity: 1;
									cursor: pointer;

									@media screen and (max-width: 767px) {
										opacity: 1;
									}
								}
							}
						}
					}
				}
			}

			.home_use & {
				width: 100%;

				.movie-container {
					width: 100%;
					border-radius: 20px;
					overflow: hidden;
					padding: 40px;
					border: rgba(178, 156, 95, 1) solid 1px;
					margin-bottom: 70px;

					@media screen and (max-width: 767px) {
						padding: 40px 20px 20px;
					}

					h3 {
						width: calc(100% + 80px);
						display: block;
						font-size: 25px;
						font-weight: 800;
						line-height: 1;
						color: #fff;
						padding: 16px;
						position: relative;
						margin: -40px -40px 0;
						background-color: rgba(178, 156, 95, 1);

						&::after {
							position: absolute;
							bottom: -20px;
							left: 50%;
							transform: translateX(-50%) rotate(90deg);
							content: "";
							width: 15px;
							height: 25px;
							clip-path: polygon(0 0,100% 50%,0 100%);
						}
					}

					.movie-wrap {
						width: 100%;
						display: flex;
						justify-content: space-between;
						flex-wrap: wrap;
						gap: 40px 20px;
						margin-top: 40px;

						&.single {
							justify-content: center;
						}
					}

					.movie-item {
						width: 480px;

						.img-box {
							width: 100%;
							height: 280px;
							border-radius: 20px;
							overflow: hidden;
							position: relative;
							background-color: #000;
							transition: all 300ms;
							margin-bottom: 10px;

							@media screen and (max-width: 767px) {
								width: 100%;
								height: auto;
								margin-bottom: 20px;
							}

							&::before {
								position: absolute;
								top: 50%;
								left: 50%;
								transform: translate(-50%, -50%);
								content: "";
								width: 90px;
								height: 90px;
								background: url("../img/health-care/heater/icon_play.svg") top center/contain no-repeat;
								z-index: 1;
								pointer-events: none;
							}

							img {
								transition: all 300ms;
								opacity: .7;

								&:hover {
									opacity: 1;
									cursor: pointer;

									@media screen and (max-width: 767px) {
										opacity: 1;
									}
								}
							}
						}

						.txt-box {
							width: 100%;

							@media screen and (max-width: 767px) {
								width: 100%;
							}

							&.single p {
								text-align: center;

								@media screen and (max-width: 767px) {
									text-align: left;
									line-height: 1.6;
								}
							}

							h4 {
								font-size: 25px;
								font-weight: 800;
								text-align: left;
								display: inline-flex;
								align-items: center;
								margin-bottom: 10px;

								@media screen and (max-width: 767px) {
									display: block;
									font-size: 24px;
									line-height: 1.4;
								}

								span {
									font-size: 18px;
									font-family: "Source Sans 3", sans-serif;
									line-height: 1;
									color: #fff;
									margin-right: 10px;
									background-color: rgba(178, 156, 95, 1);
									border-radius: 100vh;
									padding: 8px;

									@media screen and (max-width: 767px) {
										display: inline-block;
										margin-bottom: 4px;
										padding: 8px 16px 6px;
									}
								}
							}

							p {
								font-size: 16px;
								font-weight: 400;
								line-height: 2;
								letter-spacing: -0.01em;

								@media screen and (max-width: 767px) {
									line-height: 1.6;
								}
							}
						}
					}
				}
			}
		}
	}

	/* ---------------------
	tel-link
	--------------------- */
	p.tel-link {
		font-size: 14px!important;
		font-weight: 500;
		display: flex;

		@media screen and (max-width: 767px) {
			display: block;
		}

		span {
			font-size: 25px;
			font-weight: 700!important;
			font-family: "Source Sans 3", sans-serif;
			line-height: 1.25!important;
			margin-right: 6px;
			display: flex;
			align-items: center;
		}
	}

	/* ---------------------
	case-area
	--------------------- */
	.case-area {
		width: 1080px;
		margin: 0 auto;
		padding-top: 100px;

		@media screen and (max-width: 767px) {
			width: calc(100% - 40px);
			padding-top: 60px;
		}

		h3 {
			text-align: center;
			margin-bottom: 50px;
			font-size: 30px;
			font-weight: 800;

			@media screen and (max-width: 767px) {
				font-size: calc(35 / 750 * 100vw);
				font-feature-settings: "palt";
				margin-bottom: 30px;
			}

			.oem-odm & {
				margin-bottom: 40px;
			}

			span {
				@media screen and (max-width: 767px) {
					width: 60%;
					display: inline-block;
				}
			}
		}
	}

	&.heater .case-area {
		.case-example {
			display: flex;
			justify-content: space-between;
			margin-bottom: 10px;

			@media screen and (max-width: 767px) {
				flex-direction: column;
				gap: 20px;
			}

			.case-example-item {
				width: 520px;
				background-color: rgba(246, 246, 246, 1);
				border-radius: 20px;
				padding: 40px;

				@media screen and (max-width: 767px) {
					width: 100%;
				}

				.img-box {
					margin: 0 auto;
					width: 360px;

					@media screen and (max-width: 767px) {
						width: 100%;
					}
				}

				.text-box {
					dl {
						display: flex;
						flex-wrap: wrap;

						@media screen and (max-width: 767px) {
							flex-direction: column;
						}

						dt {
							width: 86px;
							color: rgba(209, 43, 36, 1);
							font-size: 16px;
							font-weight: 400;
							padding: 30px 0;

							@media screen and (max-width: 767px) {
								padding: 20px 0 0;
							}
						}

						dd {
							width: calc(100% - 86px);
							font-size: 18px;
							font-weight: 800;
							padding: 30px 0;
							position: relative;

							@media screen and (max-width: 767px) {
								padding: 0 0 20px;
								width: 100%;
							}

							&:last-of-type{
								padding-bottom: 0;
							}

							&::after {
								position: absolute;
								bottom: 0;
								left: -86px;
								content: "";
								width: calc(100% + 86px);
								height: 1px;
								border-bottom: rgba(209, 43, 36, 1) dashed 1px;
							}

							@media screen and (max-width: 767px) {
								&::after {
									left: 0;
									width: 100%;
								}
							}

							&:last-of-type::after {
								display: none;
							}

							ul {
								li {
									font-size: 18px;
									font-weight: 800;
									line-height: 1.6;
									padding-left: 1.2em;
									position: relative;

									&::before {
										position: absolute;
										top: 0.05em;
										left: 0;
										content: "・";
										width: 1em;
										height: 1em;
									}
								}
							}
						}
					}
				}
			}
		}

		.note {
			font-size: 13px;
			font-weight: 400;
			text-align: right;
		}
	}

	&.home_use .case-area {
		.case-item {
			width: 800px;
			margin: 0 auto;

			@media screen and (max-width: 767px) {
				width: 100%;
			}

			li {
				width: 100%;
				background-color: rgba(249, 246, 233, 1);
				border-radius: 20px;
				padding: 30px 40px 30px 150px;
				margin-bottom: 30px;
				position: relative;

				@media screen and (max-width: 767px) {
					padding: 140px 30px 30px;
					margin-bottom: 30px;
				}

				&:last-of-type {
					margin-bottom: 0;
				}

				&::before {
					position: absolute;
					top: 50%;
					left: 40px;
					transform: translateY(-50%);
					content: "";
					width: 95px;
					height: 95px;
				}

				@media screen and (max-width: 767px) {
					&::before {
						top: 30px;
						left: 50%;
						transform: translateX(-50%);
					}
				}

				&:nth-of-type(1)::before {
					background: url("../img/health-care/home/ico_case01.png") center/contain no-repeat;
				}
				&:nth-of-type(2)::before {
					background: url("../img/health-care/home/ico_case02.png") center/contain no-repeat;
				}
				&:nth-of-type(3)::before {
					background: url("../img/health-care/home/ico_case03.png") center/contain no-repeat;
				}

				h4 {
					font-size: 20px;
					font-weight: 800;
					line-height: 1.6;
					padding-bottom: 15px;
					margin-bottom: 15px;
					border-bottom: rgba(178, 156, 95, 1) dashed 1px;

					@media screen and (max-width: 767px) {
						padding-bottom: 15px;
						margin-bottom: 15px;
					}
				}

				dl {
					width: 100%;
					display: flex;
					gap: 5px 10px;
					flex-wrap: wrap;

					dt {
						font-size: 16px;
						font-weight: 700;
						line-height: 1.6;
						color: rgba(178, 156, 95, 1);
					}

					dd {
						font-size: 16px;
						font-weight: 400;
						line-height: 1.6;
						width: calc(100% - 120px);
						font-feature-settings: "palt";

						@media screen and (max-width: 767px) {
							width: calc(190 / 375 * 100vw);
						}
					}
				}

				&.short-comment dl {
					flex-wrap: nowrap;
					gap: 20px 10px;

					@media screen and (max-width: 767px) {
						flex-wrap: wrap;
						gap: 10px;
					}

					dd {
						width: auto;
						margin-right: 10px;

						@media screen and (max-width: 767px) {
							margin-right: 0;
							width: calc(190 / 375 * 100vw);
						}
					}
				}
			}
		}
	}

	&.oem-odm {
		.case-area {
			padding-top: 50px;
			background-color: #fff;
			width: 100%;

			.inner-case-area {
				width: 1080px;
				margin: 0 auto;
				padding-bottom: 110px;

				@media screen and (max-width: 767px) {
					width: 100%;
					padding: 0 20px 50px;
				}
			}

			.case-intro {
				margin-bottom: 60px;

				@media screen and (max-width: 767px) {
					margin-bottom: 40px;
				}

				h3 {
					margin-bottom: 16px;
				}
				p {
					font-size: 16px;
					font-weight: 400;
					line-height: 2;
					text-align: center;

					@media screen and (max-width: 767px) {
						font-size: 14px;
						text-align: left;
					}

					span.red {
						color: rgba(225, 14, 12, 1);
					}
				}
			}

			.case-example {
				margin-bottom: 60px;
				display: flex;
				flex-direction: column;
				gap: 20px;

				.case-example-item {
					width: 100%;
					background-color: rgba(242, 246, 245, 1);
					border-radius: 20px;

					dl {
						dt {
							font-size: 22px;
							font-weight: 800;
							line-height: 1.6;
							color: rgba(30, 119, 73, 1);
							position: relative;
							cursor: pointer;
							padding:  30px 40px;

							&::after {
								position: absolute;
								top: 30px;
								right: 40px;
								font-family: "Font Awesome 6 Free";
								font-weight: 900;
								content:"\2b";
								width: 36px;
								height: 36px;
								border-radius: 50%;
								background-color: rgba(30, 119, 73, 1);
								color: #fff;
								display: flex;
								align-items: center;
								justify-content: center;
								transition: all 300ms;
								padding: 0 0 0 2px;
							}

							&.open {
								&::after {
									content:"\f068";
									transform: rotate(180deg);
								}
							}

							@media screen and (max-width: 767px) {
								font-size: 16px;
								padding: 20px 60px 20px 20px;

								&::after {
									width: calc(46 / 750 * 100vw);
									height: calc(46 / 750 * 100vw);
									top: calc(42 / 750 * 100vw);
									right: calc(30 / 750 * 100vw);
									padding: 1px 0 0 1px;
								}
							}
						}

						dd {
							display: none;
							padding:  0 40px 30px;

							@media screen and (max-width: 767px) {
								padding:  0 20px 20px;
							}

							ul {
								margin-bottom: 20px;

								@media screen and (max-width: 767px) {
									margin-bottom: 10px;
								}

								li {
									font-size: 18px;
									font-weight: 800;
									line-height: 1.6;
									margin-bottom: 6px;
									position: relative;
									padding-left: 1em;

									&::before {
										position: absolute;
										top: 0.1em;
										left: 0;
										font-family: "Font Awesome 6 Free";
										font-weight: 400;
										content:"\f14a";
										color: rgba(30, 119, 73, 1);
									}

									@media screen and (max-width: 767px) {
										font-size: 14px;
									}

								}
							}

							p {
								font-size: 16px;
								font-weight: 400;
								line-height: 1.8;

								@media screen and (max-width: 767px) {
									font-size: 14px;
								}
							}
						}
					}
				}
			}

			.case-genre {
				margin-bottom: 60px;
				display: flex;
				flex-direction: column;
				gap: 34px;

				.case-genre-item {
					h4 {
						font-size: 22px;
						font-weight: 800;
						line-height: 1;
						color: #fff;
						background-color: rgba(30, 119, 73, 1);
						border-radius: 8px;
						padding: 12px;
						text-align: center;
						margin-bottom: 32px;

						@media screen and (max-width: 767px) {
							margin-bottom: 20px;
							padding: 8px;
							font-size: calc(30 / 750 * 100vw);
						}
					}

					.case-genre-list {
						width: 100%;
						display: flex;
						flex-wrap: wrap;
						gap: 40px;

						@media screen and (max-width: 767px) {
							gap: 20px 30px;
						}

						&.list-parent {
							@media screen and (max-width: 767px) {
								gap: 40px 30px;
							}
						}

						li {
							width: calc((100% - (40px * 2)) / 3);

							@media screen and (max-width: 767px) {
								width: calc((100% - 30px) / 2);
							}

							.img-box {
								width: 100%;
								background-color: rgba(242, 246, 245, 1);
								border-radius: 20px;
								padding: 18px 10px;
							}

							p {
								font-size: 16px;
								font-weight: 400;
								text-align: center;
								margin-top: 5px;

								@media screen and (max-width: 767px) {
									font-size: calc(26 / 750 * 100vw);
								}
							}
						}
					}
				}
			}

			.case-product {
				.case-product-list {
					display: inline-block;
                    width: 100vw;
                    margin: 0 calc(50% - 50vw);
					gap: 0 40px;
					@media screen and (max-width: 767px) {
						gap: 0 30px;
					}

					/*li {
						width: calc((100% - (40px * 2)) / 3);

						@media screen and (max-width: 767px) {
							width: calc((100% - 40px) / 2);
						}*/

						.img-box {
							margin-bottom: 10px;
						}

						p {
							font-size: 16px;
							font-weight: 400;
							line-height: 1.6;
							text-align: center;

							@media screen and (max-width: 767px) {
								font-size: 14px;
							}
						}
					}
				}
			}
		}
	}

	/* ---------------------
	btn-mini
	--------------------- */
	.btn-mini {
		@media screen and (max-width: 767px) {
			margin-bottom: 10px;
		}

		a {
			padding-left: 30px;

			&::before {
				position: absolute;
				top: 50%;
				left: 30px;
				transform: translateY(-50%);
				font: var(--fa-font-regular);
				font-size: 20px;
				transition: all .0s;
			}

			@media screen and (max-width: 767px) {
				&::before {
					left: 25px;
				}
			}
		}

		&.mail a {
			&::before {
				content:"\f0e0";
			}
		}

		&.dll a {
			&::before {
				content:"\f15c";
			}
		}

		a {
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #000;
			border: #000 solid 1px;
			border-radius: 100vh;
			font-size: 14px;
			font-weight: 800;
			line-height: 1.4;
			position: relative;
			color: #fff;
			padding: 16px 40px 16px 56px;
			display: inline-block;

			@media screen and (max-width: 767px) {
				padding: 14px 30px 14px 46px;
				min-width: calc(260 / 375 * 100vw);
				text-align: center;
			}

			&:hover {
				background-color: #fff;
				color: #000;

				@media screen and (max-width: 767px) {
					background-color: #000;
					color: #fff;
				}
			}

			small {
				@media screen and (max-width: 767px) {
					font-size: 16px;
				}
			}

			.tel {
				@media screen and (max-width: 767px) {
					font-size: 25px;
				}
			}
		}
	}

	/* ---------------------
	faq-area
	--------------------- */
	.faq-area {
		width: 1080px;
		margin: 0 auto 120px;
		padding-top: 100px;

		@media screen and (max-width: 767px) {
			width: calc(100% - 40px);
			padding-top: 60px;
			margin-bottom: 60px;
		}

		.oem-odm & {
			background-color: #fff;
			width: 100%;
			margin-bottom: 0;
			padding-bottom: 1px;

			.inner-faq-area {
				width: 1080px;
				margin: 0 auto;

				@media screen and (max-width: 767px) {
					width: 100%;
					padding: 0 20px;
				}
			}
		}

		.faq-list {
			width: 800px;
			margin: 0 auto 120px;

			@media screen and (max-width: 767px) {
				width: 100%;
				margin-bottom: 60px;
			}

			dt {
				font-size: 22px;
				font-weight: 800;
				line-height: 1.6;
				margin-bottom: 20px;
				padding-left: 46px;
				position: relative;

				&::before {
					position: absolute;
					top: 0;
					left: 0;
					content: "";
					width: 36px;
					height: 36px;
				}

				.heater &::before {
					background: url("../img/health-care/heater/icon_q.svg") top center/contain no-repeat;
				}

				.home_use &::before {
					background: url("../img/health-care/home/icon_q.svg") top center/contain no-repeat;
				}

				.oem-odm &::before {
					background: url("../img/health-care/oem-odm/icon_q.svg") top center/contain no-repeat;
				}
			}

			dd {
				font-size: 16px;
				font-weight: 400;
				line-height: 1.6;
				padding-bottom: 28px;
				margin-bottom: 32px;
				position: relative;

				&::after {
					position: absolute;
					bottom: 0;
					left: 0;
					content: "";
					width: 100%;
					height: 1px;
				}

				.heater &::after {
					background-color: rgba(209, 43, 36, 1);
				}

				.home_use &::after {
					background-color: rgba(178, 156, 95, 1);
				}

				.oem-odm &::after {
					background-color: rgba(30, 119, 73, 1);
				}

				.tel-link {
					margin-top: 10px;
				}

				.inquiry-box {
					display: flex;
					gap: 20px;

					@media screen and (max-width: 767px) {
						flex-direction: column;
						margin-top: 20px;
						gap: 10px;
					}

					.btn-mini {
						margin-top: 20px;

						@media screen and (max-width: 767px) {
							margin: 0;
							text-align: center;
						}

						a {
							text-decoration: none;

							@media screen and (max-width: 767px) {
								width: calc(300 / 375 * 100vw);
							}
						}
					}
				}

				a {
					text-decoration: underline;

					&:hover {
						text-decoration: none;

						@media screen and (max-width: 767px) {
							text-decoration: underline;
						}
					}
				}
			}
		}
	}

	/* ---------------------
	transaction-area
	--------------------- */
	.transaction-area {
		width: 1080px;
		margin: 0 auto 120px;
		border-radius: 20px;
		padding: 70px 80px 80px;

		@media screen and (max-width: 767px) {
			width: 100%;
			padding: 30px 40px 40px;
		}

		.heater & {
			background-color: rgba(246, 246, 246, 1);
		}

		.home_use & {
			background-color: rgba(249, 246, 233, 1);

			@media screen and (max-width: 767px) {
				width: calc(100% - 40px);
				margin-bottom: 60px;
			}
		}

		.oem-odm & {
			width: auto;
			padding: 30px 0 0;
			margin-bottom: 0;

			@media screen and (max-width: 767px) {
				padding-top: 40px;
			}
		}

		h3 {
			font-size: 30px;
			font-weight: 800;
			margin-bottom: 30px;
			text-align: center;

			@media screen and (max-width: 767px) {
				font-size: 20px;
			}

			.heater & {
				color:  rgba(209, 43, 36, 1);
			}

			.home_use & {
				color:  rgba(178, 156, 95, 1);
			}
		}

		dl {
			display: flex;
			align-items: center;
			gap: 10px;
			flex-wrap: wrap;
			margin-bottom: 54px;
			position: relative;

			@media screen and (max-width: 767px) {
				flex-direction: column;
				margin-bottom: 100px;
			}

			.oem & {
				margin-bottom: 30px;
			}

			&:last-of-type {
				margin-bottom: 0;
			}

			&::after {
				position: absolute;
				bottom: -30px;
				left: 9px;
				content: "";
				width: 23px;
				height: 16px;
				aspect-ratio: 1/cos(30deg);
				clip-path: polygon(50% 100%,100% 0,0 0);
			}

			@media screen and (max-width: 767px) {
				&::after {
					bottom: -60px;
					left: 50%;
					transform: translateX(-50%);
				}
			}

			.heater &::after {
				background-color: rgba(209, 43, 36, 1);
			}

			.home_use &::after {
				background-color: rgba(178, 156, 95, 1);
			}

			.oem-odm &::after {
				background-color: rgba(30, 119, 73, 1);
			}

			.oem &::after {
				display: none;
			}

			&:last-of-type:after {
				display: none;
			}

			dt {
				width: 180px;

				@media screen and (max-width: 767px) {
					width: calc(100% - 100px);
					margin: 0 auto;
				}
			}

			dd {
				width: 730px;
				margin-bottom: 40px;

				@media screen and (max-width: 767px) {
					width: 100%;
				}

				&:last-of-type {
					margin-bottom: 0;
				}

				h4 {
					font-size: 22px;
					font-weight: 800;
					margin-bottom: 10px;
				}

				p {
					font-size: 16px;
					font-weight: 400;
					letter-spacing: -0.01em;
				}

				.inquiry-box {
					display: inline-flex;
					align-items: center;
					margin-top: 10px;

					@media screen and (max-width: 767px) {
						flex-direction: column;
						width: 100%;
						margin: 10px auto 0;
					}

					.time {
						@media screen and (max-width: 767px) {
							font-size: 14px;
							transform: translateY(-5px);
						}
					}

					.tel {
						font-size: 23px;
						font-weight: 700;
						line-height: 1;
						margin-left: 10px;

						@media screen and (max-width: 767px) {
							margin-left: 0;
						}

						small {
							font-size: 16px;
						}

						span {
							/* PC */
							@media screen and (min-width: 768px) {
								font-size: 14px;
								font-weight: 500;
								margin-left: 10px;
							}
						}

						a {
							@media screen and (max-width: 767px) {
								padding: 10px 20px;
							}
						}
					}
				}
			}
		}
	}

	/* ---------------------
	form
	--------------------- */
	.contentsWrap {

		@media screen and (max-width: 767px) {
			padding-top: 40px;
		}

		.heater & {
			background-color: rgba(246, 246, 246, 1);
		}

		.home_use & {
			background-color: rgba(249, 246, 233, 1);
		}

		.oem-odm & {
			background-color: rgba(242, 246, 245, 1);
		}

		.contentsForm {
			background-color: #fff;
			padding: 80px 140px;
            width: 100% !important;
			max-width: 1080px !important;
			border-radius: 20px;

			@media screen and (max-width: 767px) {
				width: 92% !important;
				padding: 20px;
			}

			.table01 {
				td {
					@media screen and (max-width: 767px) {
						padding-bottom: 10px;
					}

					.horizontal-item {
						@media screen and (max-width: 767px) {
							width: 100%;
							display: block;
							margin-left: 0 !important;
							padding: 10px 0;
						}
					}
				}
			}

			.btnSubmit {
				display:block;
				width:360px;
				background:rgba(209, 43, 36, 1);
				color:#fff;
				margin-left:auto;
				margin-right:auto;
				font-size:18px;
				font-weight:700;
				cursor:pointer;
				border:1px solid rgba(209, 43, 36, 1);
				background-size:24px;
				text-align:center;
				padding:20px 0;
				border-radius: 100vh;
				transition: all 300ms;
				position: relative;

				@media screen and (max-width: 767px) {
					width:100%;
				}

				.oem-odm & {
					background:rgba(30, 119, 73, 1);
					border-color:rgba(30, 119, 73, 1);
				}

				&::after {
					position: absolute;
					top: 50%;
					right: 40px;
					transform: translateY(-50%);
					content: "\f061";
					font-family: "Font Awesome 6 Free";
					font-weight: 900;
				}

				&:hover {
					color:rgba(209, 43, 36, 1);
					background:#fff;
					background-size:24px;

					@media screen and (max-width: 767px) {
						color:#fff;
						background:rgba(209, 43, 36, 1);
					}

					.oem-odm & {
						color:rgba(30, 119, 73, 1);

						@media screen and (max-width: 767px) {
							background:rgba(30, 119, 73, 1);
						}
					}
				}
			}
		}
	}

	/* ---------------------
	footer
	--------------------- */
	footer {
		width: 100%;
		padding: 20px 30px;
		display: flex;
		justify-content: space-between;
		align-items: flex-end;

		@media screen and (max-width: 767px) {
			flex-direction: column;
			gap: 20px;
			align-items: center;
		}

		.heater & {
			background-color: rgba(246, 246, 246, 1);
		}

		.home_use & {
			background-color: rgba(249, 246, 233, 1);
		}

		.oem-odm & {
			background-color: rgba(242, 246, 245, 1);
		}

		.logo-containser {
			display: flex;
			align-items: center;

			@media screen and (max-width: 767px) {
				flex-direction: column;
				align-items: flex-start;
				gap: 10px;
				width: 100%;
			}

			div {
				position: static;
				width: 146px;
				margin-right: 20px;
				text-align: left;

				img {
					position: static;
				}
			}

			p {
				font-size: 13px;
				font-weight: 400;
				line-height: 1.6;

				a {
					text-decoration: underline;

					&:hover {
						text-decoration: none;

						@media screen and (max-width: 767px) {
							text-decoration: underline;
						}
					}
				}
			}
		}

		.copyright {
			font-size: 12px;
			font-weight: 400;

			@media screen and (max-width: 767px) {
				text-align: center;
			}
		}
	}

	.footerContact, .breadcrumb, #footer  {
		display: none;
	}

	/* ---------------------
	バナー
	--------------------- */
	.bnr_area {
		width: 800px;
		margin: 70px auto 0;

		@media screen and (max-width: 767px) {
			width: 100%;
			margin-top: 40px;
		}
	}
}

/* ---------------------
modal
--------------------- */
.modal__item {
	margin-bottom: 40px;

	.modal {
		overflow: hidden;
		position: relative;

		&::before {
			content: '';
			display: block;
			padding-top: 60%;
		}

		img {
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			-o-object-fit: cover;
			object-fit: cover;
		}
	}
}

body.active {
	overflow: hidden;
}

html.active {
	overflow: hidden;
}

.main-modal {
	display: none;
	height: 100vh;
	position: fixed;
	top: 0;
	z-index: 1111111;
	width: 100%;
	left: 0;

	.container {
		position: relative;
		left: 50%;
		top: 50%;
		-webkit-transform: translateX(-50%) translateY(-50%);
				transform: translateX(-50%) translateY(-50%);
		max-width: 800px;

		.btn {
			width: 40px;
			height: 40px;
			position: absolute;
			top: -10px;
			right: -10px;
			cursor: pointer;
		}
	}

	.movie {
		position: relative;
		width: 100%;
		/* padding-top: 56.25%; */

		video {
			position: absolute;
			top: 0;
			right: 0;
			width: 100%;
			height: 100%;
		}

		iframe {
			width: 100%;
			height: auto;
			aspect-ratio: 16 / 9;
		}
	}

	.js-modal-close {
		.close-btn {
			width: 50px;
			height: 50px;
			position: absolute;
			top: 30px;
			right: 30px;
			cursor: pointer;
		}
	}
}

@media screen and (max-width: 767px) {
.spec-table-container.heater_ct::after{
    content: "表格可以水平捲動" !important;
}

.spec-table-container.heater_cs::after{
    content: "表格可以水平滚动" !important;
}
}

.modal__bg {
	background: rgba(0, 0, 0, 0.9);
	height: 100vh;
	position: absolute;
	width: 100%;
}

.contentsWrap.bk{
    padding: 0 0 40px 0 !important;
}

.case-product-list .slick-slide{max-width: 333px; width: 100%; margin: 0 20px;}


.arrow_box{position: relative;
position: relative;
  max-width: 1080px;
  margin: -220px auto 220px;
  width: 100%;
}



.prev-arrow,
.next-arrow {
  position: absolute;
  top: 50%;
  margin: 0;
  padding: 0;
 width: 50px;
    display: block;
    height: 50px;
    border-radius: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  cursor: pointer;
  font-weight: bold;
}

.prev-arrow {
  left: -25px;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2250%22%20height%3D%2251%22%20viewBox%3D%220%200%2050%2051%22%20fill%3D%22none%22%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2225.5%22%20r%3D%2225%22%20fill%3D%22%231E7749%22%2F%3E%3Cpath%20d%3D%22M19.4184%2025.0642C18.8605%2025.6221%2018.8605%2026.5281%2019.4184%2027.086L26.5597%2034.2273C27.1176%2034.7852%2028.0237%2034.7852%2028.5816%2034.2273C29.1395%2033.6694%2029.1395%2032.7633%2028.5816%2032.2054L22.449%2026.0729L28.5771%2019.9403C29.135%2019.3824%2029.135%2018.4763%2028.5771%2017.9184C28.0192%2017.3605%2027.1131%2017.3605%2026.5552%2017.9184L19.414%2025.0597L19.4184%2025.0642Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-size: contain;
}

.next-arrow {
  right: -25px;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2250%22%20height%3D%2251%22%20viewBox%3D%220%200%2050%2051%22%20fill%3D%22none%22%3E%3Ccircle%20cx%3D%2225%22%20cy%3D%2225%22%20r%3D%2225%22%20transform%3D%22matrix(-1%200%200%201%2050%200.5)%22%20fill%3D%22%231E7749%22%2F%3E%3Cpath%20d%3D%22M30.5816%2025.0642C31.1395%2025.6221%2031.1395%2026.5281%2030.5816%2027.086L23.4403%2034.2273C22.8824%2034.7852%2021.9763%2034.7852%2021.4184%2034.2273C20.8605%2033.6694%2020.8605%2032.7633%2021.4184%2032.2054L27.551%2026.0729L21.4229%2019.9403C20.865%2019.3824%2020.865%2018.4763%2021.4229%2017.9184C21.9808%2017.3605%2022.8869%2017.3605%2023.4448%2017.9184L30.586%2025.0597L30.5816%2025.0642Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-size: contain;
}

@media screen and (max-width: 767px) {
    .arrow_box{max-width: 400px;}
    .prev-arrow {
        left: 5px;}
    .next-arrow {
        right: 5px;}

}