@charset "UTF-8";

/* =============================================
Base Set
============================================= */
html {
	font-size: 62.5%;
}

body {
	font-family: 'Noto Sans JP', sans-serif;
	font-feature-settings: "palt" 1;
	font-size: 1.4rem;
	font-weight: normal;
	line-height: 1.5;
	color: #323232;
	max-width: 600px;
	margin: 0 auto;
}

@media screen and (min-width:500px) {
	body {
		font-size: 1.8rem;
	}
}

*,
::before,
::after {
	box-sizing: border-box;
	border-style: solid;
	border-width: 0;
}

main {
	overflow: hidden;
}

/* ----- Img ----- */
img {
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
}

/* ----- Link ----- */
a {
	transition: all .3s ease;
}

/* ----- margin-bottom ----- */
.mb-0 {
	margin-bottom: 0px;
}

.mb-10 {
	margin-bottom: 10px;
}

.mb-20 {
	margin-bottom: 20px;
}

.mb-30 {
	margin-bottom: 30px;
}

.mb-40 {
	margin-bottom: 40px;
}


/* -------------------------------------
Common
------------------------------------- */
.inner {
	padding: 0 8%;
}

@media screen and (max-width:320px) {
	.inner {
		padding: 0 4%;
	}
}

.va-super {
	vertical-align: super;
	font-size: 1.0rem;
}

.note {
	font-size: 1.2rem;
	line-height: 1.25;
	margin-top: 16px;
}

.note--right-side {
	text-align: end;
}

.note--indent {
	text-indent: -1em;
	margin-left: 1em;
	display: inline-block;
}

.note--indent2 {
	margin-top: 0;
	text-indent: -1.75em;
	margin-left: 1.75em;
	display: inline-block;
}

@media screen and (min-width:500px) {
	.note {
		font-size: 1.4rem;
	}
}

@media screen and (max-width:360px) {}


/* -------------------------------------
btn
------------------------------------- */
.btn {
	display: block;
	width: 255px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

.btn+.btn {
	margin-top: 20px;
}

.btn::before {
	content: "";
	display: block;
	width: 79px;
	height: 50px;
	position: absolute;
	top: 0;
	left: 0;
	background-image: url(../img/btn_search.png);
	background-size: contain;
	background-repeat: no-repeat;
	z-index: 1;
}

.btn-buy.btn::before {
	background-image: url(../img/btn_buy.png);
}

.btn-free.btn::before {
	background-image: url(../img/btn_free.png);
	width: 90px;
}

.btn__round {
	display: block;
	border-radius: 10px;
	background-color: #fff;
	border: 1px solid #323232;
	padding: 4px 0 4px 35%;
	font-size: 1.6rem;
	line-height: 1.25;
	font-weight: bold;
	position: relative;
}

.btn-free .btn__round {
	padding-left: 40%;
}

@media screen and (min-width:500px) {
	.btn {
		width: 320px;
		margin: 0 auto 20px;
	}

	.btn+.btn {
		margin-top: 24px;
	}

	.btn::before {
		width: 91px;
		height: 58px;
	}

	.btn-free.btn::before {
		width: 105px;
	}

	.btn__round {
		padding: 8px 0 8px 35%;
	}

}


/* -------------------------------------
Animation
------------------------------------- */
/* 上下に浮かぶ */
.anime-float-y {
	animation: anime-float-y 3s ease-in-out infinite;
	will-change: transform;
}

@keyframes anime-float-y {
	0%,
	100% {
		transform: translateY(-10px);
	}

	50% {
		transform: translateY(10px);
	}
}


/* フワッと出てくる */
.anime-fade-up {
	opacity: 0;
	transform: translateY(15px);
}

.anime-fade-up.is-show {
	animation: fadeUp 1s ease-in-out forwards;
}

@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(15px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* その場で出てくる */
.anime-fade {
	opacity: 0;
}

.anime-fade.is-show {
	animation: fade .5s ease-in-out .7s forwards;
}

@keyframes fade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}


@keyframes titleBar {
	from {
		transform: scaleX(0);
	}

	to {
		transform: scaleX(1);
	}
}

@keyframes blink {
	0% {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

/* -------------------------------------
header
------------------------------------- */
.pg-header {
	position: fixed;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 99;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	background-color: #fff;
}


/* -------------------------------------
fv
------------------------------------- */
.fv__product-name {
	color: #fff;
	font-size: 1.6rem;
	background-color: #323232;
	padding: 8px 0;
	text-align: center;
	letter-spacing: 1px;
}

.fv__image-unit {
	position: relative;
	background: url("../img/fv_bg_deco.webp") no-repeat top center / 100% auto;
	padding: 100px 8% 0;
}

.fv__product-image--parts01 {
	width: 84%;
	position: absolute;
	top: 11%;
	left: 11%;
}

.fv__product-image--parts02 {
	margin-bottom: 57px;
}

@media screen and (min-width:500px) {

	.fv__product-name {
		font-size: 2.2rem;
	}

	.fv__image-unit {
		padding: 130px 8% 0;
	}

	.fv__product-image--parts01 {
		top: 35px;
	}
}


/* -------------------------------------
intro
------------------------------------- */
.intro {
	position: relative;
}

.intro::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	background-color: #F1F5F7;
	z-index: -2;
}

.intro__heading-image {
	margin-bottom: 25px;
}

.intro__title {
	font-size: 1.6rem;
	padding-bottom: 8px;
	margin-bottom: 8px;
	border-bottom: solid 1px #006A87;
}

.intro__lead {
	margin-bottom: 80px;
	line-height: 1.75;
}

.intro__catch-copy-unit {
	position: relative;
}

.intro__catch-copy--sub {
	font-size: 1.7rem;
	font-weight: bold;
	margin-bottom: 4px;
}

.intro__catch-copy {
	position: relative;
	color: #fff;
	font-size: 3rem;
	font-weight: bold;
	padding: 13px 0;
	margin-bottom: 24px;
	letter-spacing: 2px;
}

.intro__catch-copy::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	background: #006A87;
	z-index: -1;
}

.intro__catch-image {
	position: absolute;
	top: -5px;
	right: -5px;
	width: 130px;
}

.intro__features-title-unit {
	position: relative;
}

.intro__features-title {
	position: relative;
	color: #fff;
	font-size: 1.7rem;
	font-weight: bold;
	padding: 4px 0;
	margin-bottom: 18px;
	text-align: center;
	letter-spacing: 2px;
	background: none;
	z-index: 0;
}

.intro__features-title::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #323232;
	transform: scaleX(0);
	transform-origin: left center;
	z-index: -1;
}

.intro__features-title.is-show::before {
	animation: titleBar 0.9s cubic-bezier(0.8, 0, 0.2, 1) forwards;
}

.intro__features-catch {
	width: 50px;
	position: absolute;
	top: -8px;
	right: 20px;
}

.intro__features-text-unit {
	color: #fff;
	padding: 27px 0;
	position: relative;
}

.intro__features-text-unit::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	background: #5A95AE;
	z-index: -1;
}

.intro__features-text {
	margin-bottom: 20px;
}

.intro__features-text--lead {
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 15px;
}

.intro__features-text--catch {
	font-size: 2.2rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 15px;
}

.intro__features-image {
	margin-left: -30px;
	margin-right: -30px;
}

@media screen and (min-width:500px) {
	.intro__title {
		font-size: 2.2rem;
	}

	.intro__catch-copy--sub {
		font-size: 2.2rem;

	}

	.intro__catch-copy {
		font-size: 3.8rem;
	}

	.intro__catch-image {
		top: -5px;
		right: 10px;
		width: 200px;
	}

	.intro__features-title {

		font-size: 2.2rem;
		margin-bottom: 28px;
	}

	.intro__features-catch {
		width: 70px;
		top: -16px;
		right: 20px;
	}

	.intro__catch-copy {
		margin-bottom: 38px;
	}

	.intro__features-text--lead {
		font-size: 2rem;
	}

	.intro__features-text--catch {
		font-size: 2.6rem;
	}
}


/* -------------------------------------
index
------------------------------------- */
.index {
	padding: 70px 0 70px 0;
	position: relative;
}

.index::before,
.index::after {
	content: '';
	display: block;
	width: 1px;
	height: 60px;
	background-color: #000;
	position: absolute;
	left: 50%;
	transform: scaleY(0);
	transition: transform 0.8s ease;
}

.index::before {
	top: 0;
	transform-origin: top center;
}

.index::after {
	bottom: 0;
	transform-origin: top center;
	transition-delay: .9s;
}

/* 表示時 */
.index.is-show::before,
.index.is-show::after {
	transform: scaleY(1);
}

.index__title {
	width: 20%;
	margin: 0 auto 15px;
}

.index__container {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px;
}

.index__card {
	font-size: 1.2rem;
	font-weight: bold;
	padding: 15px 17px;
}

.card--wide {
	grid-column: 1 / -1;
	display: flex;
}

.card--safety {
	background-color: #BFD6DB;
	padding-left: 8%;
	padding-right: 8%;
}

.index__card-title img {
	margin-bottom: 8px;
}

.card--safety .index__card-title {
	padding-right: 16px;
}

.index__card-badge {
	border: solid 2px #fff;
	border-radius: 50px;
	padding: 5px 0px;
	text-align: center;
}

.index__card-title,
.index__card-badge {
	flex: 0 0 50%;
}

.card--usability {
	background-color: #E9CCBC;
	padding-left: 16%;
}

.card--smart {
	background-color: #E9E8E8;
	padding-right: 16%;
}

.card--comfort {
	background-color: #DFD8BC;
	padding-left: 16%;
}

.card--longuse {
	background-color: #BECEC8;
	padding-right: 16%;
}

@media screen and (min-width:500px) {
	.index__card {
		font-size: 1.5rem;
		padding: 15px 40px 15px 40px;
	}

	.card--safety .index__card-title {
		padding-right: 40px;
	}

	.index__card-badge {
		margin-left: 15px;
		padding: 5px 0px;
	}
}


/* -------------------------------------
features（コンポーネント）
------------------------------------- */
.features__heading {
	padding-top: 50px;
	text-align: center;
}

.features__heading-title-unit {
	position: relative;
	z-index: 1;
}

.features__heading-title {
	background-color: #6DA3C0;
	margin-bottom: 20px;
}

.features__heading-lead {
	font-size: 1.7rem;
	font-weight: bold;
	margin-bottom: 10px;
	letter-spacing: 2px;
}

.features__heading-catch {
	font-size: 3.3rem;
	font-weight: bold;
}

.features__heading-image {
	position: relative;
	margin-bottom: 20px;
}

.features__heading-image::before {
	content: '';
	display: block;
	width: 100%;
	aspect-ratio: 750 / 172;
	position: absolute;
	top: -25px;
	left: 0;
	padding-top: 0px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: top center;
}

.features__wrap {
	padding-top: 30px;
	padding-bottom: 50px;
}

.features__container {
	position: relative;
	background-color: #fff;
	border-radius: 20px;
	margin-bottom: 60px;
	padding: 30px 0 45px;
}

.features__container.mb-0 {
	margin-bottom: 0px;

}

.features__title {
	position: relative;
	color: #fff;
	font-size: 1.8rem;
	padding: 4px 0;
	margin-bottom: 12px;
	text-align: center;
	letter-spacing: 2px;
	background: none;
	z-index: 0;
}

.features__title::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #323232;
	transform: scaleX(0);
	transform-origin: left center;
	z-index: -1;
}

.features__title.is-show::before {
	animation: titleBar 0.9s cubic-bezier(0.8, 0, 0.2, 1) forwards;
}


.title__badge {
	width: 70px;
	position: absolute;
	top: -25px;
	left: -20px;
	z-index: 1;
}

.features__lead {
	font-size: 1.4rem;
	text-align: center;
}

.features__catch {
	font-size: 1.8rem;
	font-weight: bold;
	text-align: center;

}

.features__image.image--secondary {
	margin-top: 30px;
}

.features .note {
	padding-left: 8%;
}

.features .note--indent {
	padding-left: 8%;
}

.features__lead.lead--inner {
	padding: 0 8%;
}

.blink-stack {
	position: relative;
}

.blink-stack .blink--over {
	position: absolute;
	inset: 0;
	animation: blink 2s ease-in-out infinite;
}

.blink-stack img {
	display: block;
	width: 100%;
}


@media screen and (min-width:500px) {
	.features__heading-lead {
		font-size: 2.4rem;
	}

	.features__heading-catch {
		font-size: 4.8rem;
	}

	.features__container {
		margin-bottom: 80px;
		padding: 45px 0 40px;
	}

	.features__title {
		font-size: 2.6rem;
		margin-bottom: 24px;
	}

	.features__lead {
		font-size: 2rem;
	}

	.features__catch {
		font-size: 2.6rem;
	}

	.features__heading-image::before {
		top: -45px;
	}

	.title__badge {
		width: 100px;
		top: -40px;
		left: -30px;
	}
}


/* -------------------------------------
safety
------------------------------------- */
.safety {
	background-color: #BFD6DB;
}

.safety .features__heading-image::before {
	background-image: url("../img/safety_bg_heading-deco.webp");
}

.safety .features__container:nth-of-type(1),
.safety .features__container:nth-of-type(2) {
	padding-bottom: 20px;
}

.safety .features__container:nth-last-child(3) {
	padding-bottom: 0;
}

.safety .features__image.image--cushion {
	padding: 0 15%;
}

.safety .features__image.image--seat {
	padding: 10px 0 10px;
}

.safety .features__image.image--secondary {
	padding: 0 8% 20px;
}

.safety .features__image.image--shield {
	padding: 20px 15% 15px;
}

.safety-standard {
	position: relative;
}

.safety-standard__title {
	font-size: 1.9rem;
	font-weight: bold;
	padding: 20px 20px 0;
	border-top: solid 1px #000;
}

.safety-standard__badge {
	width: 98px;
	position: absolute;
	top: -30px;
	right: 0px;
}

.safety-standard__description {
	padding: 0 20px 20px;
	margin-bottom: 12px;
	border-bottom: solid 1px #323232;
}

.safety-standard__note {
	font-size: 1.2rem;
	margin-bottom: 20px;
	padding: 0 20px;
}

.safety-standard__note.mb-0 {
	margin-bottom: 0px;
}


@media screen and (min-width:500px) {
	.safety-standard__badge {
		width: 120px;
		top: -40px;
		right: 22px;
	}

	.safety-standard__note {
		font-size: 1.4rem;
	}

	.safety-standard__title {
		font-size: 2.2rem;
		margin-bottom: 8px;
	}
}


/* -------------------------------------
usability
------------------------------------- */
.usability {
	background-color: #E9CCBC;
}

.usability .features__heading-title {
	background-color: #D08369;
	margin-bottom: 20px;
}

.usability .features__heading-image::before {
	background-image: url("../img/usability_bg_heading-deco.webp");
}

.usability .heading-image-unit {
	position: relative;
}

.usability .image__deco {
	position: absolute;
	bottom: -14%;
	right: 39%;
	width: 15%;
}

.usability .features__lead {
	text-align: left;
	padding: 0 8%;
	margin-bottom: 20px;
}

.usability .features__container {
	padding: 30px 0 50px;
}

.usability .features__container:nth-of-type(2),
.usability .features__container:nth-of-type(3),
.usability .features__container:nth-of-type(5) {
	padding: 30px 0 30px;
}

.usability .features__title.title__deco--new {
	position: relative;
}

.usability .features__title.title__deco--new::after {
	position: absolute;
	top: -48px;
	right: 7px;
	content: '';
	display: block;
	width: 25%;
	height: 83px;
	background-image: url(../img/deco_new.webp);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

@media screen and (min-width:500px) {
	.usability .features__container {
		padding: 40px 0 60px;
	}

	.usability .features__container:nth-of-type(2),
	.usability .features__container:nth-of-type(3),
	.usability .features__container:nth-of-type(5) {
		padding: 40px 0 40px;
	}

	.usability .features__title.title__deco--new::after {
		width: 120px;
		height: 90px;
	}
}


/* -------------------------------------
smart
------------------------------------- */
.smart {
	background-color: #E9E8E8;
	margin-top: 20px;
}

.smart .features__heading-title {
	background-color: #B1AEAE;
	margin-bottom: 20px;
}

.smart .features__heading-image::before {
	background-image: url("../img/smart_bg_heading-deco.webp");
}

.smart .features__heading-catch {
	font-family: "Noto Sans JP", sans-serif;
}

.smart .features__container:nth-of-type(1) .features__title {
	margin: 0 -9.5% 12px;
}

.smart .features__container.mb-0 {
	margin-bottom: 0;
}

.smart .features__image-unit {
	position: relative;
	margin-bottom: 60px;
}

.smart .features__image-unit.unit--separate {
	padding-top: 30px;
	margin-left: -10%;
	margin-right: -10%;
}

.smart .features__image-unit.unit--separate .features__image01 {
	margin-left: -10%;
	margin-right: -5%;
}

.smart .features__image01 {
	position: absolute;
	top: -16%;
	left: 0;
}

.smart .features__lead {
	text-align: left;
}

.smart__detail-box {
	margin-bottom: 50px;
}

.smart__detail-box .smart__detail-unit:first-of-type {
	margin-bottom: 20px;
}

.smart__detail-title {
	font-size: 1.7rem;
	font-weight: bold;
	padding-top: 15px;
	margin-bottom: 30px;
	border-top: solid 1px #323232;
	text-align: center;
}

.smart__detail-unit {
	position: relative;
	display: flex;
	justify-content: space-between;
}

.detail-unit__catch {
	position: absolute;
	top: -15px;
	left: -21%;
	width: 106px;
}

.smart__detail-image {
	width: 48%;
}

.smart__detail-desc-unit {
	width: 48%;
	align-items: stretch;
	display: flex;
	flex-direction: column;
}

.smart__detail-desc-catch {
	font-weight: bold;
	color: #006A87;
	margin-bottom: 5px;
}

.smart__additional-info-title {
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	padding-top: 15px;
	margin-bottom: 20px;
	border-top: solid 1px #323232;
}

.smart__additional-info-image {
	margin-bottom: 30px;
}

.smart .features__title.title--alternative {
	font-size: 1.8rem;
}

.features__title.title--alternative::before {
	background: #5A95AE;
}

.smart .note--alternative {
	padding-left: 0;
	margin-top: 24px;
}

@media screen and (min-width:500px) {
	.smart .features__container:nth-of-type(1) .features__title {
		margin: 0 -9.5% 24px;
	}

	.smart .features__image01 {
		top: -90px;
	}

	.smart__detail-title {
		font-size: 2.2rem;
	}

	.smart__detail-box .smart__detail-unit:first-of-type {
		margin-bottom: 40px;
	}

	.smart__detail-desc-catch {

		font-size: 2rem;
	}

	.smart__additional-info-title {
		font-size: 2.2rem;
	}

	.smart .features__title.title--alternative {
		font-size: 2.4rem;
	}
}


/* -------------------------------------
comfort
------------------------------------- */
.comfort {
	background-color: #DFD8BC;
}

.comfort .features__heading-title {
	background-color: #A0856A;
	margin-bottom: 20px;
}

.comfort .features__heading-image::before {
	background-image: url("../img/comfort_bg_heading-deco.webp");
}

.comfort .features__catch.catch--second {
	position: relative;
	margin-top: 45px;
	margin-bottom: 5px;
	padding-top: 15px;
}

.comfort .features__catch.catch--second::before {
	content: '';
	display: block;
	width: 24%;
	height: 45px;
	background-image: url(../img/deco_new.webp);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	top: -20px;
	left: 30px;
}

.comfort .features__catch.catch--second::after {
	content: '';
	display: block;
	width: 55%;
	height: 1px;
	background-color: #000;
	position: absolute;
	top: 0px;
	right: 30px;
}

.comfort .features__container .image--shade02 {
	padding-left: 9%;
	padding-right: 3%;
}

.comfort .features__image.image--first {
	padding-top: 20px;
	padding-left: 7%;
	padding-right: 7%;
}

.comfort .features__image.image--secondary {
	margin-top: 0px;
	padding-left: 0%;
	padding-right: 0%;
}

.comfort .features__image.image--seat01 {
	padding-top: 40px;
}

.comfort .features__lead {
	text-align: left;
}

.comfort__detail-unit {
	position: relative;
	display: flex;
	justify-content: space-between;
	background-color: #F1F5F7;
	padding: 30px 28px 18px;
	margin-top: 20px;
}

.comfort__detail-unit.unit--second {
	margin-top: 0px;

}

.comfort__badge--only-bitte01,
.comfort__badge--only-bitte02 {
	width: 166px;
	position: absolute;
	top: -40px;
	left: 50%;
	transform: translateX(-50%);
}

.comfort__detail-image {
	width: 47%;
}

.comfort__detail-desc-unit {
	width: 47%;
	align-items: stretch;
	display: flex;
	flex-direction: column;
}

.comfort__detail-desc-catch {
	font-weight: bold;
	color: #006A87;
	margin-bottom: 3px;
}

.comfort .note.note--indent.note--alternative {
	padding-left: 0%;
}

.comfort .note.note--indent2 {
	padding-top: 16px;
}


@media screen and (min-width:500px) {
	.comfort__badge--only-bitte01,
	.comfort__badge--only-bitte02 {
		width: 220px;
		top: -52px;
	}

	.comfort__detail-desc-catch {
		font-size: 2rem;
	}

	.comfort__detail-unit {
		padding: 45px 28px 39px;
	}

	.detail-unit__catch {
		width: 140px;
	}

	.comfort .features__catch.catch--second::after {
		width: 62%;
	}

	.comfort .features__catch.catch--second::before {
		width: 120px;
		height: 80px;
		top: -35px;
		left: 30px;
	}
}


/* -------------------------------------
long-use
------------------------------------- */
.long-use {
	background-color: #BECEC8;
}

.long-use .features__heading-title {
	background-color: #729B8A;
}

.long-use .features__lead {
	text-align: start;
	padding: 0 7%;
	margin-bottom: 10px;
}

.long-use .features__heading-image::before {
	background-image: url("../img/long-use_bg_heading-deco.webp");
}

.long-use .features__container.mb-0 {
	margin-bottom: 0;
}

.long-use .features__container:nth-of-type(2),
.long-use .features__container:nth-of-type(3),
.long-use .features__container:nth-of-type(4) {
	padding-bottom: 0;
}

.long-use .features__image.image--hirobiro-seat {
	padding-top: 20px;
	padding-bottom: 30px;
}

.long-use .features__image.image--reclining {
	padding-left: 8%;
	padding-right: 8%;
}

.long-use .features__image.image--washable-seat {
	padding-top: 10px;
	padding-left: 8%;
	padding-right: 8%;
	padding-bottom: 20px;
}

.long-use .features__container.badge--washable {
	position: relative;
}

.long-use .features__container.badge--washable::before {
	position: absolute;
	top: -15px;
	left: -20px;
	content: '';
	display: block;
	background-image: url(../img/long-use_badge_washable.webp);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 70px;
	height: 70px;
	z-index: 1;
}

.washing-method {
	padding: 0 8%;
}

.washing-method__title {
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom: solid 1px #323232;
}

.washing-method__item {
	font-weight: bold;
}

.washing-method__item .item--second-line {
	padding-left: 1rem;
}

.washing-method__instructions {
	margin-top: 10px;
}

.long-use .note--alternative {
	padding-left: 0;
}

@media screen and (min-width:500px) {
	.long-use .features__container.badge--washable::before {
		top: -28px;
		left: -32px;
		width: 110px;
		height: 110px;
	}
}


/* -------------------------------------
share-area
------------------------------------- */
.share-area {
	background-color: #E6160B;
	padding-bottom: 35px;
}

.center-txt {
	text-align: center;
}

.share-area .center-txt {
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
	padding: 10px 10px 20px;
}

.share-area.lineup-share {
	background: #fff;
	padding-top: 20px;
}

.share-area.lineup-share .center-txt {
	color: var(--black);
}

@media screen and (min-width:500px) {
	.share-area {
		padding-bottom: 40px;
	}

	.share-area .center-txt {
		font-size: 2.0rem;
		line-height: 1.75;
		padding-bottom: 30px;
	}

	.share-area.lineup-share {
		padding-bottom: 20px;
	}
}


/* -------------------------------------
lineup
------------------------------------- */
.lineup-head {
	background-color: #8AC5DD;
	padding: 75px 0 40px;
}

.lineup__title {
	width: 80%;
	margin: 0 auto 35px;
}

.lineup__heading-title {
	padding: 3px 0;
	background-color: #fff;
	margin-left: -9.5%;
	margin-right: -9.5%;
}

.thumbnail-list {
	width: 265px;
	margin: 0 auto;
	column-gap: 5px;
	display: flex;
	justify-content: space-between;
}

.thumbnail-item {
	width: 28%;
	padding: 26px 0;
	text-align: center;
	font-size: 1.7rem;
}

.thumbnail-item.item-brown .img-def,
.thumbnail-item.item-beige .img-def,
.thumbnail-item.item-black .img-def {
	display: block;
}

.thumbnail-item.item-brown .img-ov,
.thumbnail-item.item-beige .img-ov,
.thumbnail-item.item-black .img-ov {
	display: none;
}

.thumbnail-item.thumbnail-current.item-brown .img-def,
.thumbnail-item.thumbnail-current.item-beige .img-def,
.thumbnail-item.thumbnail-current.item-black .img-def {
	display: none;
}

.thumbnail-item.thumbnail-current.item-brown .img-ov,
.thumbnail-item.thumbnail-current.item-beige .img-ov,
.thumbnail-item.thumbnail-current.item-black .img-ov {
	display: block;
}

.slide-item__main {
	width: 85%;
	margin: 0 auto;
}

.slide-item__info {
	background-color: #fff;
	border-radius: 20px;
	padding: 65px 30px 15px;
	display: flex;
	justify-content: space-between;
	margin-top: -80px;
	align-items: stretch;
}

.slide-item__cont {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	flex: 1;
	margin-bottom: 10px;
}

.product-strong {
	display: block;
	font-size: 1.7rem;
	font-weight: bold;
}

.product-info .note {
	margin-top: 0;
}

.product-info .note:nth-of-type(3) {
	border-bottom: 1px solid #000;
	padding-bottom: 6px;
	margin-bottom: 6px;
	margin-top: 10px;
}

.product-info .note:nth-of-type(7) {
	margin-top: 10px;
}

.note-icon {
	width: 30px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}

.slide-item__title .title--sub {
	font-size: 1.7rem;
}

.slide-item__title {
	font-size: 2.8rem;
	font-weight: 700;
}

.slide-item__title .title--2rows {
	display: inline-block;
	line-height: 1;
}

.slide-item__color {
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: 5px;
}

.slide-item__sub {
	width: 75px;
}

.lineup-body {
	background-color: #fff;
	padding-top: 20px;
	position: relative;
	padding-bottom: 160px;
}

.lineup-body::before {
	content: "";
	display: block;
	width: 140px;
	height: 188px;
	position: absolute;
	bottom: -12px;
	right: 6%;
	background: url(../img/option_img.webp) no-repeat top center / contain;
}

.lineup-option {
	padding: 23px 0 30px;
}

.lineup-option__cont {
	border: 2px solid #8AC5DD;
	border-radius: 20px;
	padding: 40px 0 30px;
	position: relative;
}

.lineup-option__title {
	width: 155px;
	position: absolute;
	top: -25px;
	left: -11%;
}

.lineup-option__item+.lineup-option__item {
	margin-top: 30px;
}

.lineup-option__catch {
	background-color: #E1E8E8;
	font-size: 1.5rem;
	font-weight: 700;
	padding: 10px 30px;
	margin-bottom: 15px;
}

.lineup-option__detail {
	padding: 0 30px;
}

.lineup-option__product {
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: 5px;
}

.lineup-option__text {
	font-size: 1.3rem;
	font-weight: 700;
}

@media screen and (min-width:500px) {
	.thumbnail-list {
		width: 365px;
	}

	.slide-item__info {
		padding: 70px 60px 12px;
	}

	.lineup-body::before {
		width: 190px;
		height: 220px;
	}

	.product-strong {
		font-size: 2.2rem;
	}

	.lineup-option__catch {
		font-size: 1.8rem;
	}

	.lineup-option__product {
		font-size: 1.8rem;
	}

	.lineup-option__text {
		font-size: 1.4rem;
	}
}


/* -------------------------------------
reparation
------------------------------------- */
.reparation {
	padding: 30px 13% 40px;
}

.reparation__catch {
	color: #9D8254;
	text-align: center;
	font-size: 18px;
	margin: 0 0 20px;
	position: relative;
}

.reparation__catch::before,
.reparation__catch::after {
	content: '';
	display: block;
	width: 1px;
	height: 70px;
	position: absolute;
	background-color: #9D8254;
}

.reparation__catch::before {
	top: 5px;
	left: 15px;
	transform: rotate(-20deg);
}

.reparation__catch::after {
	top: 5px;
	right: 15px;
	transform: rotate(20deg);
}

.reparation__catch .dashed {
	font-size: 30px;
	font-weight: bold;
}

@media screen and (min-width:500px) {
	.reparation__catch::before {
		left: 80px;
	}

	.reparation__catch::after {
		right: 80px;
	}
}


/* -------------------------------------
Fixed-menu
------------------------------------- */
#sp-fixed-menu {
	display: none;
	position: fixed;
	max-width: 600px;
	width: 100%;
	bottom: 0;
	z-index: 99;
	background-color: #fff;
}

.footer-btn-area {
	display: flex;
	border-top: 4px solid #fff;
	column-gap: 3px;
}

.footer-btn-items {
	width: 50%;
	background-color: #cc6246;
}

.footer-btn-items img {
	width: 170px;
	margin: 0 auto;
}

/* -------------------------------------
Footer
------------------------------------- */
.footer-wrap {
	padding-bottom: 60px;
}

.footer-wrap iframe {
	min-height: 330px;
}

@media screen and (min-width:500px) {
	.footer-wrap {
		padding-bottom: 70px;
	}

	.footer-wrap iframe {
		min-height: 380px;
	}

}