@charset "utf-8";
/* ----------------------------------------TOP PAGE---------------------------------------- */

/* ---------------mainvisual--------------- */
.main-visual {
	width: 100%;
	max-height: fit-content;
}

.main-visual img {
	width: 100%;
	height: 100%;
	vertical-align: bottom;
}

.main-visual h1 {
	display: none;
}

.top-section__title {
	text-align: center;
	margin-bottom: 1rem;
}

.top-section__title h2 {
	word-break: keep-all;
}

.top-section__title span {
	color: var(--lightblue);
}

.top-section__title::before {
	display: inline-block;
	font-family: var(--decofont);
	font-weight: 400;
	font-style: normal;
	font-size: clamp(5rem, -7rem + 32vw, 11rem);
	color: rgb(from var(--lightblue) r g b / 0.5);
	position: absolute;
	left: 0;
	top: -0.4em;
	z-index: -1;
	white-space: nowrap;
}

/* --------------------TOP-導入-------------------- */
.top-intro__text > p {
	text-align: center;
}

.top-intro__worries {
	display: flex;
	justify-content: center;
	align-items: center;
}

.top-intro__list > p {
	text-align: center;
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 2rem;
}

.top-intro__list ul {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-auto-rows: auto;
	gap: 2rem;
}
.top-intro__list li {
	width: clamp(9.375rem, 3.819rem + 11.57vw, 12.5rem);
	height: clamp(9.375rem, 3.819rem + 11.57vw, 12.5rem);
	aspect-ratio: 1/1;
	border-radius: 50%;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.35);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;

	opacity: 0;
	transition: opacity 0.8s ease;
}

.top-intro__list li.show {
	opacity: 1;
}

.top-intro__list li::before {
	content: '';
	border-radius: 50%;
	background-color: #ffffff8a;
	position: absolute;
	inset: 0;
	z-index: 0;
}

.top-intro__list li:nth-of-type(1) {
	background-image: url(../images/top-intro1.jpg);
	grid-column: 4/6;
	grid-row: 1/2;
}

.top-intro__list li:nth-of-type(2) {
	background-image: url(../images/top-intro2.jpg);
	grid-column: 6/8;
	grid-row: 1/2;
}
.top-intro__list li:nth-of-type(3) {
	background-image: url(../images/top-intro3.jpg);
	grid-column: 8/10;
	grid-row: 1/2;
}
.top-intro__list li:nth-of-type(4) {
	background-image: url(../images/top-intro4.jpg);
	grid-column: 3 / 5;
	grid-row: 2/3;
}
.top-intro__list li:nth-of-type(5) {
	background-image: url(../images/top-intro5.jpg);
	grid-column: 5/7;
	grid-row: 2/3;
}
.top-intro__list li:nth-of-type(6) {
	background-image: url(../images/top-intro6.jpg);
	grid-column: 7/9;
	grid-row: 2/3;
}
.top-intro__list li:nth-of-type(7) {
	background-image: url(../images/top-intro7.jpg);
	grid-column: 9/11;
	grid-row: 2/3;
}

.top-intro__list li p {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: absolute;
	z-index: 3;
	font-weight: 600;
	color: #000;
	word-break: auto-phrase;
}

.top-intro__note {
	text-align: center;
}

.top-intro__note a {
	display: inline-block;
	color: var(--red);
	font-weight: 500;
	border: 2px solid var(--red);
	padding: 0.5rem 1rem;
}
/* --------------------TOP-特徴-------------------- */

.top-features__list {
	display: flex;
	gap: 2rem;
}

.top-features__list li {
	display: flex;
	align-items: center;
	flex-direction: column;
	width: calc(100% / 3);
	gap: 0.5rem;
}

.top-features__list li h3 {
	text-align: center;
	font-size: 1.5rem;
}

.top-features__list li img {
	max-width: 320px;
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
}

/* --------------------TOP-DENBA Health とは-------------------- */
.top-health {
	padding-block: 3rem;
	background-image: url(../images/water-2.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	position: relative;
}

.top-health::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff;
	opacity: 0.5;
	width: 100%;
	height: 100%;
}

.top-health__container {
	position: relative;
	z-index: 3;
}

.top-health__box {
	display: flex;
	align-items: center;
}

.top-health__box figure,
.top-health__text {
	flex: 1;
}
.top-health__text {
	padding: 1.5rem;
}
.top-health__box figure img {
	width: 100%;
}

.top-health__text h3,
.top-tech__text h3 {
	position: relative;
	border-bottom: 1px solid #c9c9c9;
	background: 0 0;
	padding: 0 0 0.25em;
	margin-bottom: 0.5rem;
}

.top-health__text h3::after,
.top-tech__text h3::after {
	content: '.';
	line-height: 0;
	display: block;
	position: absolute;
	bottom: -1px;
	width: 30%;
	overflow: hidden;
	border-bottom: 1px solid var(--blue);
}

/* --------------------TOP-技術-------------------- */

.top-tech__box {
	display: flex;
	margin-bottom: 3rem;
}

.top-tech__box.reverse {
	flex-direction: row-reverse;
}

.top-tech__box figure {
	flex: 1;
	z-index: 10;
	min-width: 320px;
}

.top-tech__box figure img {
	width: 100%;
}

.top-tech__box figcaption {
	text-align: center;
}

.top-tech__text {
	background-color: var(--white);
	flex: 1;
	padding: 2rem 2rem 2rem 4rem;
	margin: 2rem 0 0 -2rem;
	min-height: 320px;
	display: flex;
	flex-direction: column;
}

.top-tech__text h3 {
	word-break: keep-all;
}

.top-tech__text span {
	display: block;
	font-size: clamp(1.25rem, 0.806rem + 0.93vw, 1.5rem);
	line-height: 1.2;
	word-break: auto-phrase;
}

.top-tech__box.reverse .top-tech__text {
	background-color: var(--waterblue);
	padding: 2rem 4rem 2rem 2rem;
	margin: 2rem -2rem 0 0;
}

/* --------------------TOP-インタビュー-------------------- */

.top-interview {
	background-image: url(../images/wave.png);
	background-position: bottom;
	background-size: cover;
	background-repeat: no-repeat;
	padding-bottom: 10rem;
}

.top-interview__box {
	display: flex;
	gap: 2rem;
}

.top_interview__text,
.top-interview__box figure,
.top-interview__video {
	flex: 1;
}

.top-interview__video iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
}

.top-interview__textinner {
	padding: 1.5rem;
}
/* --------------------TOP-グッドスリーププラン-------------------- */

.top-collabo .top-section__title p {
	font-size: 20px;
	font-weight: bold;
}

.top-collabo__box {
	display: flex;
}
.top-collabo__box > * {
	flex: 1;
}
.top-collabo__box h3 {
	font-size: 1.5rem;
}

.top-collabo__text {
	display: flex;
	flex-direction: column;
	padding: 1.5rem;
	min-height: 360px;
}
.top-collabo__text p:nth-of-type(1) {
	margin-bottom: 2rem;
}

.top-collabo .page_link_btn {
	width: 300px;
	margin-top: auto;
	margin-inline: auto;
}

.top-collabo .page_link_btn a {
	width: 100%;
	background-image: radial-gradient(#ad8929, #c9ad6b);
}

/* --------------------TOP-口コミ-------------------- */

.top-voice__box {
	width: 100%;
}

.top-voice__box ul {
	padding: 1.5rem;
	display: flex;
	gap: 1.5rem;
	overflow-x: scroll;
}

.top-voice__box ul li {
	flex: 0 0 320px;
	padding: 1rem;
	border-radius: 5px;
	display: flex;
	flex-direction: column;
}

.top-voice__box ul li:nth-child(odd) {
	background-color: var(--waterblue);
}

.top-voice__box ul li:nth-child(even) {
	background-color: var(--white);
}

.top-voice__box ul li h3 {
	font-size: 16px;
	font-weight: bold;
	height: 3rem;
}

.top-voice__box ul li p:nth-of-type(1) {
	text-align: right;
}

.top-voice__box ul li p:nth-of-type(2) {
	margin-top: 1rem;
}
.top-voice__box ul li p {
	text-align: justify;
	word-break: normal;
}

/* --------------------TOP-導入事例-------------------- */

@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
.scroll-infinity__wrap {
	display: flex;
	overflow: hidden;
}
.scroll-infinity__list {
	display: flex;
	list-style: none;
	padding: 0;
}
.scroll-infinity__list--left {
	animation: infinity-scroll-left 50s infinite linear 0.5s both;
}

.scroll-infinity__item {
	width: calc(100vw / 4);
}

.scroll-infinity__item > img {
	height: 100%;
}

.top-case__box {
	margin-bottom: 0;
	position: relative;
	z-index: 5;
	margin-top: -3rem;
}

.top-case__box ul {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

.top-case__box li {
	background-color: white;
	flex: 1;
	box-shadow: 0px 5px 15px 0px rgb(from var(--blue) r g b / 0.5);
	/* border: 1px solid var(--lightblue); */
	border-radius: 5px;
	padding: 1rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.top-case__box h3 {
	word-break: auto-phrase;
	font-size: clamp(1.25rem, 0.806rem + 0.93vw, 1.5rem);
	height: 3em;
}
.top-case__box p {
	word-break: auto-phrase;
}
.top-case__box li img {
	width: 150px;
}
.top-case .page_link_btn a {
	width: 300px;
}
/* --------------------TOP-商品一覧-------------------- */

.top-product {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	margin-bottom: 3rem;
	padding: 3rem 0;
}

.top-product::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(https://denba.co.jp/denbahealth/wp-content/uploads/2024/09/3750749_m.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	opacity: 0.2; /* ← 背景の透過率をここで調整 */
	z-index: -1;
}

.top-product__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(0.5rem, -0.841rem + 4.88vw, 1.5rem);
	padding: 2rem 0;
}

.top-product__list li {
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
	background-color: #fff;
	border-radius: 5px;
}

.top-product__list li a {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: clamp(10rem, 6.25rem + 15vw, 17.5rem);
	padding: 1rem;
	text-align: center;
}

a.is-disabled {
	pointer-events: none; /* クリックできない */
	cursor: default; /* カーソルを矢印に */
}

.top-product__list li p:nth-of-type(1) {
	font-size: 18px;
	font-weight: bold;
}

/* --------------------TOP-youtube-------------------- */
.top-youtube {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2rem;
}

.top-youtube__box {
	flex: 1;
	aspect-ratio: 16/9;
}

.top-youtube__box iframe {
	width: 100%;
	height: 100%;
}

/* --------------------TOP-バナー-------------------- */

.top-banner {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	align-items: center;
	justify-content: space-between;
	margin-inline: auto;
	margin-block: 1rem;
}

.top-banner > * {
	flex: 1;
}

.top-banner__container a {
	display: inline-block;
	height: 100%;
}

.top-banner img {
	aspect-ratio: 3 / 1;
	object-fit: contain;
	height: auto;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.35);
}
/* ----------------------------------------TOP-RESPONCIVE---------------------------------------- */

@media (max-width: 999px) {
	.top-features__list {
		flex-direction: column;
		align-items: center;
	}

	.top-features__list li {
		width: 100%;
	}

	.top-features__list li img {
		max-width: inherit;
		width: min(80%, 400px);
	}

	.top-health__box {
		flex-direction: column;
	}
	.top-health__box figure {
		width: 100%;
	}

	.top-tech__box,
	.top-tech__box.reverse,
	.top-interview__box {
		flex-direction: column;
	}

	.top-tech__text,
	.top-tech__box.reverse .top-tech__text {
		padding: 2rem;
		margin: 0 0 2rem;
	}
	.top-interview {
		background-size: contain;
	}

	.top-collabo__box {
		flex-direction: column;
	}

	.top-collabo .page_link_btn {
		margin-top: 3rem;
	}

	.scroll-infinity__item {
		width: calc(100vw / 2);
	}

	.scroll-infinity__item > img {
		height: 100%;
	}
	.top-case__box ul {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 768px) {
	.top-intro__list ul {
		display: flex;
		flex-wrap: wrap;
		gap: 2rem;
		justify-content: center;
	}
}
@media (max-width: 599px) {
	.top-case__box li img {
		width: 120px;
	}
	.top-case__box p {
		display: none;
	}
	.scroll-infinity__list {
		max-height: 250px;
	}
	.scroll-infinity__item {
		width: calc(100vw / 1);
	}
	.top-youtube {
		flex-direction: column;
	}
	.top-banner {
		flex-direction: column;
		justify-content: center;
	}
	.top-banner > * {
		flex: inherit;
	}
}

/* ----------------------------------------subpage-TOP---------------------------------------- */

.page_header {
	position: relative;
	background: url(../images/pageheader.jpeg) no-repeat 50% center;
	background-size: cover;
	min-height: 9rem;
	margin-top: 0;
	margin-bottom: 0;
	padding-bottom: 0;
	display: flex;
	align-items: center;
	position: relative;
	z-index: 1;
	text-align: center;
}

.page_header::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff;
	opacity: 0.9;
	width: 100%;
	height: 100%;
}

.page_header-inner {
	max-width: 1140px;
	position: relative;
	z-index: 5;
	margin: 1.5em auto;
}

h1.page_header-title {
	font-weight: 700;
	font-size: clamp(1.5rem, 1.136rem + 1.82vw, 2.5rem);
}

/* --------------------------------------404 error-------------------------------------- */
.error-404 {
	padding: 5rem 2rem;
}

/* ----------------------------------------DENBA Helthとは---------------------------------------- */

.about-title {
	text-align: center;
	margin-bottom: 1.5rem;
}

.about-title__p {
	text-align: center;
}
/* 導入 */

.about-intro {
	text-align: center;
	margin-bottom: 7rem;
}

.about-intro h2 {
	font-size: clamp(1.5rem, 0.611rem + 1.85vw, 2rem);
}

.about-intro__text {
	margin: 2rem auto;
	word-break: keep-all;
}

.about-intro__text p {
	line-height: 2;
}

.about-intro__text span {
	font-size: 1.5em;
	font-weight: bold;
}

.about-achievements__slider {
	max-height: 400px;
}

.about-achievements__slider li {
	height: 100%;
}
/* 経緯 */

.about-feature__container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 5%;
}

.about-feature__box {
	flex-basis: clamp(300px, 30%, 400px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-image: url(../images/water.png);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);

	aspect-ratio: 1 / 1;
	border-radius: 50%;
	position: relative;
	margin: 0.5rem 0;
}

.about-feature__box::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: #ffffff69;
	border-radius: 50%;
}

.about-feature__text {
	position: relative;
	z-index: 3;
}

.about-feature__box h3 {
	word-break: auto-phrase;
	text-align: center;
	height: 3em;
	display: flex;
	align-items: center;
	justify-content: center;
}

.about-feature__box p {
	padding: 1rem 1.5rem;
}

/* 販売実績 */

.about-achievements {
	padding-block: 3rem;
	background-color: aliceblue;
	margin-bottom: 7rem;
}

.about-achievements .c-inner > p {
	text-align: center;
	margin-bottom: 2rem;
	font-size: clamp(1rem, 0.728rem + 1.09vw, 1.25rem);
}

.about-achievements__container {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.about-achievements__slider {
	flex: 1;
	overflow: hidden;
	max-width: 60%;
}

.about-achievements__box {
	flex: 1;
}

.about-achievements__slider li {
	flex-shrink: 0;
}

.about-achievements__slider li img {
	width: 100%;
	height: auto;
	display: block;
}

.about-achievements__text {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.about-achievements .page_link_btn a {
	width: 300px;
}

/* 技術 */

.about-tech__container1,
.about-tech__container2,
.about-tech__container3 {
	margin-bottom: 2rem;
}

.about-tech__container1 {
	display: flex;
	align-items: center;
	gap: 2rem;
}
.about-tech__container1 > * {
	flex: 1;
}

.about-tech__box {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.about-tech__box > * {
	flex: 1;
}
/* 安全性 */
.about-safety__container > p {
	text-align: center;
	margin-bottom: 2rem;
}
.about-safety__box {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.about-safety__box figure,
.about-safety__text {
	flex: 1;
}
/* 共同研究 */
.about-reserch {
	padding: 3rem 0;
	background-color: #1d1d2b;
	color: white;
	position: relative;
	overflow: hidden;
}

.about-reserch h2 {
	position: relative;
	z-index: 3;
}

.about-reserch__container {
	position: relative;
	z-index: 3;
}

.background {
	width: 100%;
	height: 100%;
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	z-index: 0;
}
.about-reserch__container ul {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.about-reserch__container ul li {
	height: 200px;
	text-align: center;
}

.about-reserch__container ul li h3 {
	margin-bottom: 2rem;
}

/* 特許 */

.about-patent__container {
	display: flex;
	align-items: center;
}
.about-patent__container p {
	position: relative;
	display: inline-block;
	color: #fff;
	padding: 0.5rem 1rem;
	background-color: rgb(0, 15, 88);
	font-size: clamp(1rem, -0.087rem + 4.35vw, 2rem);
	left: calc(100vw - 80%);
	z-index: 3;
}

.about-patent__slide {
	width: 70%;
	padding: 2rem 0;
	background-color: #f0f8ff;
	border-top-left-radius: 40px;
	border-bottom-left-radius: 40px;
	margin-right: 0;
	margin-left: auto;
}

.about-patent__slide .scroll-infinity__item {
	width: calc(100vw / 6);
	padding: 2rem 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.about-patent__slide .scroll-infinity__item > img {
	max-height: 90%;
	transform: rotate(-10deg);
	display: block;
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
}

/* DENBA Healthの使い方 */

.about-use- > p {
	text-align: center;
	margin-bottom: 2rem;
	font-size: 1.25rem;
}

.about-use__box {
	display: flex;
	align-items: center;
	gap: 2rem;
}

@media (max-width: 768px) {
	.about-achievements__container,
	.about-safety__box,
	.about-use__box {
		flex-direction: column;
	}
	.about-reserch_container ul {
		grid-template-columns: repeat(1, 1fr);
	}

	.about-reserch_container ul li {
		height: 150px;
	}
	.about-patent__container p {
		left: calc(100vw - 90%);
	}
}

/* ----------------------------------------DENBA Helth シリーズ ---------------------------------------- */

#DH-C,
#DH-S,
#DH-HG {
	margin-bottom: 2rem;
}

.dh-series {
	padding-top: 3rem;
	margin-bottom: 3rem;
}

.dh-series th {
	width: 6em;
}
.dh-series td {
	width: 17em;
}

/* ----------------------------------------DENBA Sleep---------------------------------------- */

.sleep-mainvisual {
	width: 100%;
	height: 80vh;
	background-color: black;
}
.sleep-mainvisual video {
	width: 100%;
	height: 100%;
	vertical-align: bottom;
}

.sleep-bg {
	background-image: url(../images/pageheader.jpeg);
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
	color: white;
	position: relative;
}
.sleep-bg::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background: radial-gradient(rgb(23, 30, 87) 27%, rgba(10, 10, 10, 0.52) 76%);
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
}

.sleep-bg section,
.sleep-bg > div {
	position: relative;
	z-index: 1;
	padding: 3rem 0;
}

.sleep-bg h2 {
	text-align: center;
	margin-bottom: 1.5rem;
	word-break: keep-all;
}

.sleep-introduction {
	padding-block: 2rem;
}

.sleep-introduction__text {
	text-align: center;
}

.sleep-introduction__text h2 {
	font-size: 2.5rem;
}
.sleep-introduction__list {
	padding: 2rem 0;
	text-align: center;
}

.sleep-introduction__list h3 {
	display: inline-block;
	position: relative;
	font-size: 1.5rem;
	margin-bottom: 2rem;
}
/* .sleep-introduction__list h3:before {
	position: absolute;
	top: calc(50% - 1px);
	left: -35%;
	width: clamp(4rem, 8.33vw, 6.25rem);
	height: 1px;
	content: '';
	background: #ffffff;
}

.sleep-introduction__list h3:after {
	position: absolute;
	top: calc(50% - 1px);
	right: -35%;
	width: clamp(4rem, 8.33vw, 6.25rem);
	height: 1px;
	content: '';
	background: #ffffff;
} */

.sleep-introduction__list ul {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2rem;
}

.sleep-introduction__list li {
	position: relative;
	width: clamp(11.25rem, -2.083rem + 27.78vw, 18.75rem);
	height: clamp(11.25rem, -2.083rem + 27.78vw, 18.75rem);
	aspect-ratio: 1/1;
	border-radius: 50%;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.35);
	overflow: hidden;
}

.sleep-introduction__list li::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 50%;
	padding: 4px;
	background: linear-gradient(to right, #b39855, #fff9e6, #b39855);
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	box-sizing: border-box;
}

.sleep-introduction__list li::after {
	content: '';
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: linear-gradient(135deg, #0c0f1d 0%, #171e54 100%);
	/* background: linear-gradient(135deg, #1d262e 0%, #063761 100%); */
	z-index: 1;
}

.sleep-introduction__list li p {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: absolute;
	z-index: 2;
	color: #fff9e6;
	word-break: auto-phrase;
	padding: 1rem;
	font-size: clamp(1rem, 0.556rem + 0.93vw, 1.25rem);
}

/* 独自性 */
.sleep-unique__box {
	display: flex;
	gap: 2rem;
	align-items: center;
	justify-content: center;
}

.sleep-unique__slider {
	flex: 1;
	overflow: hidden;
	max-width: 60%;
}

.sleep-unique__slider li {
	flex-shrink: 0;
}

.sleep-unique__slider li img {
	width: 100%;
	height: auto;
	display: block;
}

.sleep-unique__text {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.sleep-unique__textinner {
	flex: 1;
	background-image: url(../images/gekkeikan.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	min-height: 240px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.sleep-unique__textinner h3 {
	font-family: 'Noto Serif', serif;
	text-align: center;
	text-shadow: 0 0 20px black;
}

/* 大口先生 */

.ohguchi-method > p {
	text-align: center;
	font-size: 1.25rem;
	margin-bottom: 2rem;
}
.ohguchi-method__container {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 2rem;
}

.ohguchi-method__container > * {
	flex: 1;
}
.ohguchi-method__text {
	padding: 1rem;
}
.ohguchi-method__list {
	margin-top: 2rem;
}

.ohguchi-method__list ul {
	margin-left: 1rem;
}

.ohguchi-method__movie video {
	width: 100%;
	height: 100%;
	vertical-align: bottom;
}
/* 共同研究 */

.sleep-research__container,
.sleep-research-univ__container {
	display: flex;
	gap: 2rem;
	height: 100%;
}

.sleep-research__container > * {
	flex: 1;
}

.sleep-research__container figure img {
	display: block;
	margin-inline: auto;
}

.sleep-research__container figure figcaption {
	font-size: -12px;
	text-align: center;
}

.sleep-research-univ__container {
	justify-content: center;
	align-items: center;
}

.sleep-research__text {
	/* flex: 0 0 calc(50% - 1rem); */
	flex: 1;
}

.sleep-research-univ__container .prof {
	width: 250px;
	height: 250px;
	border-radius: 50%;
	position: relative;
	overflow: hidden;
}

.sleep-research-univ__container .prof img {
	position: absolute;
	top: 0;
	left: 0;
	width: auto;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 768px) {
	.sleep-unique__box,
	.ohguchi-method__container,
	.sleep-research .c-inner > div {
		flex-direction: column;
	}
}

/* 技術 */

/* .sleep-tec {
	background: radial-gradient(rgb(2, 3, 129) 49%, rgb(40, 116, 252) 100%);
	color: #fff;
} */
.sleep-tec__container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2rem;
}

.sleep-tec__image {
	/* flex: 0 0 calc(50% - 1rem); */
	flex: 1;
}

.sleep-tec__image img {
	width: 100%;
}
.sleep-tec__container p {
	/* flex: 0 0 calc(50% - 1rem); */
	flex: 1;
}

.sleep-tech__movie video {
	width: 100%;
	height: 100%;
	vertical-align: bottom;
}
/* 製品情報 */

.sleep-product__container {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	margin-bottom: 1rem;
}

.sleep-product__container > * {
	flex: 1;
}

.sleep-product__box {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}

.sleep-product__table th,
.sleep-product__table td {
	padding: 0.5rem;
	vertical-align: middle;
}

/* .sleep-product__table th {
	min-width: 8em;
} */

/* sleep youtube */

.sleep-youtube iframe {
	display: block;
	width: 60%;
	aspect-ratio: 16/9;
	margin-inline: auto;
}

/* sleep　お客様の声 */
.sleep-voice {
	background-image: url(../images/sleep-voice-bg.png);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
	padding: 2rem 1rem;
}

.sleep-voice h2 {
	text-align: center;
	position: relative;
	z-index: 3;
}

.sleep-voice::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(255, 255, 255, 0.3);
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
}

.sleep-voice__container {
	padding-block: 2rem;
	position: relative;
	z-index: 3;
}
.sleep-voice__container h3 {
	font-size: 1.25rem;
}

.sleep-voice__container ul {
	display: flex;
	gap: 1.5rem;
	overflow-x: scroll;
}

.sleep-voice__container ul li {
	flex: 0 0 320px;
	border-radius: 5px;
	display: flex;
	flex-direction: column;
	margin-bottom: 2rem;
}

@media (max-width: 768px) {
	.sleep-unique__slider {
		max-width: 100%;
	}
	.sleep-youtube iframe {
		width: 100%;
	}
	.sleep-product__container {
		flex-direction: column;
	}

	.sleep-voice__container ul li {
		flex: 0 0 320px;
	}
}

.sleep-fixed__banner {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background: rgba(255, 255, 255, 0.7); /* 半透明黒帯 */
	color: #000000;
	transform: translateY(100%); /* 最初は非表示 */
	transition: transform 0.3s ease;
	z-index: 9999;
	overflow-x: hidden;
}

.sleep-fixed__inner {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 1rem 0;
	gap: 1rem;
}

.sleep-fixed__banner.show {
	transform: translateY(0); /* 表示状態 */
}

.fixed-banner__text {
	margin: 0;
}

.fixed-banner__button {
	background: #26730a;
	color: #fff;
	padding: 0.75rem 1.5rem;
	text-decoration: none;
	border-radius: 3px;
	transition: background 0.3s ease;
}

.fixed-banner__button:hover {
	background: #26730a;
}

/* ----------------------------------------DENBA PET---------------------------------------- */

/* ------------------------------------------------------------DENBA mobile------------------------------------------------------------ */

.mobile-title {
	text-align: center;
	margin-bottom: 1rem;
	word-break: auto-phrase;
}

.mobile-feature__container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}
.mobile-feature__container > * {
	flex: 1;
}

.mobile-feature__text h3 {
	font-size: 1.5rem;
}
/* mobile youtube */
.mobile-youtube__container {
	display: flex;
	gap: 2rem;
	margin-bottom: 2rem;
	justify-content: space-between;
	align-items: center;
}
/* mobile 使用シーン */
.mobile-use__box {
	margin-bottom: 3rem;
}

.mobile-use__box h3 {
	margin-bottom: 1rem;
}
.mobile-use__box th,
.mobile-use__box td {
	padding: 0.5rem 1rem;
}
.mobile-use__box th {
	width: 30%;
}
.mobile-use__box table {
	width: 100%;
	margin-inline: auto;
}
.mobile-use__box tr:nth-child(odd) {
	background-color: #f0f0f0;
}
/* mobile 製品仕様 */
.mobile-product__container {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2rem;
	margin-bottom: 2rem;
}

.mobile-product__container > * {
	flex: 1;
}

.mobile-product__container .slick-prev,
.mobile-product__container .slick-next {
	z-index: 2;
}

.mobile-product__container .slick-prev {
	left: 0 !important;
}

.mobile-product__container .slick-next {
	right: 0 !important;
}

.product-slider__area {
	flex: 1;
	overflow: hidden;
	max-width: 60%;
	margin: 0 auto;
}

.product-slider__img,
.product-slider__thumb {
	padding: 2px;
}
.product-slider__img img,
.product-slider__thumb img {
	width: 100%;
	height: auto;
	display: block;
}
.mobile-product_text table th,
.mobile-product_text table td {
	width: max-content;
	padding: 0.5rem;
	vertical-align: middle;
	text-align: left;
}

.mobile-mat__link {
	display: flex;
	flex-direction: column;
	align-items: center;
}
/* mobile 使用方法 */
.mobile-howtouse__movie {
	display: flex;
	gap: 2rem;
	margin-bottom: 2rem;
	justify-content: space-between;
	align-items: center;
}
.mobile-howtouse__movie figure {
	width: fit-content;
}

.mobile-howtouse__movie figure video,
.mobile-howtouse__movie figure iframe {
	max-width: 100%;
	vertical-align: bottom;
}
.mobile-howtouse__movie figcaption {
	font-weight: bold;
	text-align: center;
}

.mobile-howtouse__movie > * {
	flex: 1;
}

/* mobile サブスク登録方法 */

.mobile-subsc__container {
	padding: 1rem;
}
.mobile-subsc__container ol {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.mobile-subsc__container ol li {
	padding: 1rem;
	border: 1px solid #013d95;
}

.mobile-subsc__container ol li h3 {
	font-size: 1.25rem;
}

.mobile-subsc__box span {
	background-color: #013d95;
	color: #fff;
	padding: 0.25rem 0.5rem;
	line-height: 1;
	margin-right: 1rem;
}

.mobile-subsc__container ol li i {
	font-size: 2rem;
}

.mobile-subsc__container ol li p {
	margin-left: 3rem;
}
.mobile-campaign figure {
	width: 100%;
	max-width: 800px;
	margin-inline: auto;
}

@media (max-width: 768px) {
	.mobile-feature__container,
	.mobile-product__container,
	.mobile-youtube__container,
	.mobile-howtouse__movie {
		flex-direction: column;
	}

	.mobile-use__box table {
		width: 100%;
	}
	.mobile-use__box tr {
		margin-bottom: 0.5rem;
	}

	.mobile-use__box tr:nth-child(odd) {
		background-color: inherit;
	}
	.mobile-use__box th,
	.mobile-use__box td {
		display: block;
		width: 100%;
		text-align: left;
	}
	.mobile-use__box th {
		border-bottom: 1px dotted #c9c9c9;
	}
}
/* ----------------------------------------スポーツ支援プロジェクト---------------------------------------- */

.athlete-visual {
	aspect-ratio: 1280 / 600; /* 画像の元サイズに合わせる */
	width: 100%;
	overflow: hidden;
}

.athlete-visual img {
	width: 100%;
	height: 100%;
	object-fit: contain; /* or cover */
	display: block;
}

.athlete > h3 {
	position: relative;
	border-bottom: 1px solid #c9c9c9;
	background: 0 0;
	padding: 0 0 0.25em;
	margin-bottom: 0.5rem;
}

.athlete > h3::after {
	content: '.';
	line-height: 0;
	display: block;
	position: absolute;
	bottom: -1px;
	width: 30%;
	overflow: hidden;
	border-bottom: 1px solid var(--blue);
}
.athlete > p {
	margin-bottom: 2rem;
}

.athlete > figure {
	width: 100%;
	max-width: 1000px;
	margin-inline: auto;
}
.athlete-list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	padding:3rem 0;
}

.athlete-list article {
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: var(--white);
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
	padding: 1rem;
	height: 100%;
}

/* チーム・アスリート名前 */
.athlete-list h3 {
	text-align: center;
	margin-bottom: 1rem;
}
/* 各項目タイトル */
.athlete-list h4 {
	font-size: 1.25rem;
	margin-bottom: 0.5rem;
}

.athlete_list p {
	word-break: normal;
	line-height: 1.2;
}
.athlete-box {
	display: grid;
	grid-template-columns: clamp(12.5rem, 10.938rem + 6.25vw, 15.625rem) 1fr;
	/* grid-template-rows: clamp(12.5rem, 10.938rem + 6.25vw, 15.625rem) 1fr 1fr; */
	gap: 1rem;
	height: 100%;
}
.athlete-box__image {
	margin-inline: auto;
	position: relative;
	width: clamp(12.5rem, 10.938rem + 6.25vw, 15.625rem);
	height: clamp(12.5rem, 10.938rem + 6.25vw, 15.625rem);
}

.athlete-box__slider {
	width: 100%;
	height: 100%;
	overflow: hidden;
	object-fit: cover;
}

.athlete-box__slider img {
	width: 100%;
	height: 100%;
}

.athlete-box__caption {
	position: absolute;
	right: 0;
	bottom: 1rem;
	background-color: var(--black);
	color: var(--white);
	padding: 0.5rem;
	word-break: auto-phrase;
	font-size: 14px;
}

.athlete-box__text:nth-of-type(2) {
	grid-row: 1/2;
	grid-column: 2 /3;
}
.athlete-box__text:nth-of-type(3) {
	grid-row: 2/3;
	grid-column: 1 /3;
}
.athlete-box__text:nth-of-type(4) {
	grid-row: 3/4;
	grid-column: 1 /3;
}

.athlete-box__link {
	grid-row: 4/5;
	grid-column: 2 /3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	justify-self: end;
}

.personal-sns {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
}
.personal-sns i {
	font-size: 2rem;
}

.mobile_btn {
	display: block;
}
.mobile_btn a {
	width: 180px;
	position: relative;
	display: inline-block;
	background-image: linear-gradient(90deg, #001e47, #013d95);
	padding: 0.5rem 1rem;
	font-size: 1rem;
	color: #fff;
	letter-spacing: 0.1rem;
	transition: all 0.3s ease;
	cursor: po-nter;
	text-decoration: none;
	text-align: center;
	border-radius: 5px;
}

/* @media (max-width: 1200px) {
	.athlete_list {
		grid-template-columns: 1fr;
	}
} */

@media (max-width: 1024px) {
	.athlete-list {
		grid-template-columns: 1fr 1fr;
	}

	.athlete-list article {
		justify-content: flex-start;
	}
	.athlete-box {
		/* grid-template-columns: 1fr;
		grid-template-rows: max-content;
		gap: 1rem; */
		display: flex;
		flex-direction: column;
		height: 100%;
	}
	.athlete-box__link {
		margin-top: auto;
	}
}

@media (max-width: 768px) {
	.athlete-list {
		grid-template-columns: 1fr;
	}
	.athlete-box {
		display: grid;
		grid-template-columns: clamp(12.5rem, 10.938rem + 6.25vw, 15.625rem) 1fr;
		gap: 1rem;
	}
}

@media (max-width: 599px) {
	.athlete-list {
		grid-template-columns: 1fr;
	}
	.athlete-box {
		display: flex;
		gap: 1rem;
	}
}
/* ----------------------------------------mobile 法人向けページ---------------------------------------- */
.mobilecorp-visual {
	display: flex;
	justify-content: center;
}
.mobilecorp-visual img {
	max-width: 500px;
	width: 100%;
}

.mobilecorp-title {
	text-align: center;
	margin-bottom: 1.5rem;
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 2rem;
	color: #0a2540; /* 深いネイビー */
}

/* 導入セクション */
.mobilecorp-intro {
	line-height: 1.8;
	padding-block: 3rem;
}

.mobilecorp-intro p {
	margin-bottom: 1.5rem;
	font-size: 1rem;
}

/* 健康経営アクション */
.mobilecorp-action {
	background-color: #f5f8fa;
	padding-block: 3rem;
}

.mobilecorp-action__innerbox {
	display: flex;
	align-items: center;
}
.mobilecorp-action__innerbox img {
	width: 300px;
}

.mobilecorp-action p {
	font-size: 1rem;
	line-height: 1.8;
	margin-bottom: 1.5rem;
}

.mobilecorp-action ul {
	margin-bottom: 2rem;
	padding-left: 1.2rem;
}

.mobilecorp-action ul li {
	list-style: disc;
	margin-bottom: 0.75rem;
	font-size: 1rem;
}

.mobilecorp-action h3 {
	font-size: 1.4rem;
	font-weight: 600;
	margin-bottom: 1rem;
	color: var(--darkblue);
}

.mobilecorp-action strong {
	color: #0074c8; /* アクセントブルー */
}

/* 選ばれる理由 */

.mobilecorp-reason {
	padding-block: 3rem;
}
.mobilecorp-reason__container ol {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem;
}

.mobilecorp-reason__container ol li {
	flex-basis: clamp(300px, 30%, 400px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
}

.mobilecorp-reason__container ol li h3 {
	font-size: 1.25rem;
	color: var(--lightblue);
	height: 3em;
}

.mobilecorp-reason__container ol li span {
	display: block;
	font-size: 2rem;
	line-height: 1;
}

.mobilecorp-reason__container img {
	border-radius: 50%;
	object-fit: cover;
	width: 250px;
	height: 250px;
	box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
}

/* --------------------法人-口コミ-------------------- */

.mobilecorp-voice {
	padding-block: 3rem;
}

.mobilecorp-voice__box {
	width: 100%;
}

.mobilecorp-voice__box ul {
	padding: 1.5rem;
	display: flex;
	gap: 1.5rem;
	overflow-x: scroll;
}

.mobilecorp-voice__box ul li {
	flex: 0 0 320px;
	padding: 1rem;
	border-radius: 5px;
	display: flex;
	flex-direction: column;
}

.mobilecorp-voice__box ul li:nth-child(odd) {
	background-color: var(--waterblue);
}

.mobilecorp-voice__box ul li:nth-child(even) {
	background-color: var(--white);
}

.mobilecorp-voice__box ul li h3 {
	font-size: 16px;
	font-weight: bold;
	height: 3rem;
}

.mobilecorp-voice__box ul li p:nth-of-type(1) {
	text-align: right;
}

.mobilecorp-voice__box ul li p:nth-of-type(2) {
	margin-top: 1rem;
}
.mobilecorp-voice__box ul li p {
	text-align: justify;
	word-break: normal;
}

.mobilecorp-contact {
	padding-block: 3rem;
	background-color: #f5f8fa;
}
.mobilecorp-contact__container {
	display: flex;
	justify-content: center;
	align-items: center;
}

.mobilecorp-contact__container img {
	width: 150px;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
	.mobilecorp-title {
		font-size: 1.6rem;
	}

	.mobilecorp-intro p,
	.mobilecorp-action p,
	.mobilecorp-action ul li {
		font-size: 0.95rem;
	}

	.mobilecorp-action h3 {
		font-size: 1.2rem;
	}
	.mobilecorp-action__innerbox {
		flex-direction: column;
	}
	.mobilecorp-contact__container {
		flex-direction: column;
	}
}
/* ----------------------------------------Mobile FAQ---------------------------------------- */

.mobile-faq ol {
	padding: 1rem;
	list-style: decimal;
	background-color: var(--iceblue);
	margin-bottom: 2rem;
}

.mobile-faq li {
	list-style: decimal;
	list-style-position: inside;
	padding-left: 1rem;
}
.mobile-faq li a {
	display: inline-block;
	padding-block: 0.5rem;
}

.mobile-faq__sche {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 2rem;
}

.mobile-faq h3 {
	margin-bottom: 2rem;
}

.mobile-faq_container {
	padding-top: 3rem;
}

/* ----------------------------------------商品一覧ページ---------------------------------------- */

.p-product h2 {
	position: relative;
	border-bottom: 1px solid #c9c9c9;
	background: 0 0;
	padding: 0 0 0.25rem;
	margin-bottom: 2rem;
}

.p-product h2::after {
	content: '.';
	line-height: 0;
	display: block;
	position: absolute;
	bottom: -1px;
	width: 30%;
	overflow: hidden;
	border-bottom: 1px solid var(--blue);
}

/* ----------------------------------------業種別採用事例ページ---------------------------------------- */

.case-study h2 {
	position: relative;
	border-bottom: 1px solid #c9c9c9;
	background: 0 0;
	padding: 0 0 0.25em;
	margin-bottom: 1.5rem;
}
.case-study h2::before {
	content: '.';
	line-height: 0;
	display: block;
	position: absolute;
	bottom: -1px;
	width: 30%;
	overflow: hidden;
	border-bottom: 1px solid var(--blue);
}

.case-study__container {
	padding: 2rem;
}

.case-study__container h3 {
	margin-bottom: 1rem;
}

.case-study__box {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 2rem;
	margin-bottom: 2rem;
}

.case-study__box > * {
	flex: 1;
}
.case-study__image {
	flex: 1;
	overflow: hidden;
	max-width: 60%;
}
.case-study__table th {
	text-align: center;
}

.case-study__table th,
.case-study__table td {
	width: max-content;
	padding: 0.25rem;
	vertical-align: middle;
}

.case-study__table td i {
	padding-left: 0.5rem;
}

@media (max-width: 768px) {
	.case-study__box {
		flex-direction: column;
		align-items: stretch; /* 幅を100%にする */
	}

	.case-study__box > * {
		flex: none; /* 幅1:1を無効化 */
		width: 100%; /* 幅いっぱい */
	}

	.case-study__image {
		max-width: 100%; /* 必要に応じて画像幅を調整 */
	}
}

/* ----------------------------------------企業概要ページ---------------------------------------- */

.company_about {
	margin-inline: auto;
}

.company_about th,
.company_about td {
	padding: 1em 0;
	position: relative;
}

.company_about th::before,
.company_about td::before {
	content: '';
	position: absolute;
	bottom: 0;
	width: calc(100% - 0.1875rem);
}

.company_about th,
.branch_table th {
	width: 10rem !important;
	vertical-align: middle;
}

.company_about th::before {
	left: 0;
	border-bottom: 1px solid var(--blue);
}
.company_about td {
	padding: 1em 1.5em;
}

.company_about td::before {
	right: 0;
	border-bottom: 1px solid #d3d3d3;
}

.company_about ul span {
	display: inline-block;
	width: 5em;
	margin-right: 1rem;
}

.branch_box {
	margin: 3rem auto;
	width: min(90%, 655px);
}

.branch_box h2 {
	font-size: 1.5rem;
}
.branch_table th {
	padding: 0.5em 0 !important;
	border: none !important;
}

.branch_table td {
	padding: 0.5em 1.5em !important;
	border: none !important;
}

/* フォーム全体 */
.contact-form {
	max-width: 600px;
	margin: 0 auto;
	font-size: 15px;
}

/* 各フィールド */
.contact-form .form-group {
	margin-bottom: 20px;
}

.contact-form label {
	display: block;
	margin-bottom: 5px;
	font-weight: bold;
}

.contact-form input[type='text'],
.contact-form input[type='email'],
.contact-form input[type='tel'],
.contact-form textarea {
	width: 100%;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 15px;
}

.contact-form textarea {
	resize: vertical;
}

.contact-form input[type='checkbox'] {
	margin-right: 5px;
}

.contact-form .required {
	color: red;
	font-size: 12px;
	margin-left: 5px;
}

.contact-form .form-submit {
	margin-top: 30px;
}

.contact-form input[type='submit'] {
	background: var(--lightblue);
	color: #fff;
	padding: 12px 30px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.contact-form input[type='submit']:hover {
	background: var(--darkblue);
}

.contact-form .recaptcha-note {
	font-size: 12px;
	color: #555;
	margin-top: 20px;
}

/* ----------------------------------------DENBA Mist---------------------------------------- */