/* --------------------------------------------------------------------------------
RESET
-------------------------------------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

ul,
ol {
	padding: 0;
}

body,
h1,
h2,
h3,
h4,
h5,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
	margin: 0;
}

body {
	min-height: 100vh;
	line-height: 1.5;
}

ul[class],
ol[class] {
	list-style: none;
}

a:not([class]) {
	text-decoration-skip-ink: auto;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
	aspect-ratio: attr(width) / attr(height);
}

article > * + * {
	margin-top: 1em;
}

input,
button,
textarea,
select {
	font: inherit;
}

@media (prefers-reduced-motion: reduce) {
	* {
	animation-duration: 0.01ms !important;
	animation-iteration-count: 1 !important;
	transition-duration: 0.01ms !important;
	scroll-behavior: auto !important;
	}
}



/* --------------------------------------------------------------------------------
 pc_sp
-------------------------------------------------------------------------------- */
.hidden-xs {
	display: block;
}
.visible-xs {
	display: none;
}

@media screen and (max-width: 500px) {
	.hidden-xs {
		display: none;
	}
	.visible-xs {
		display: block;
	}
}

/* --------------------------------------------------------------------------------
 list
-------------------------------------------------------------------------------- */

ul,
ol {
	padding: 0;
	margin: 0;
	list-style: none;
}


/* --------------------------------------------------------------------------------
 FONT text_align color
-------------------------------------------------------------------------------- */

.f_itali { font-family: "Italianno", cursive; }
.f_shpr { font-family: "Shippori Mincho", serif; }
/*color*/
.c_red { color: #b21e25; }
.c_green { color: #1c8f8a; }



/* --------------------------------------------------------------------------------
 filter
-------------------------------------------------------------------------------- */
.shadow {
	filter: drop-shadow(0 0.15625rem 0.25rem rgba(0, 0, 0, 0.1));
	transform: translateZ(0);
}
.glow {
	filter:
	 drop-shadow(0 0 0.125rem rgba(255,255,255,1))
	 drop-shadow(0 0 0.125rem rgba(255,255,255,1))
	 drop-shadow(0 0 0.3125rem rgba(255,255,255,1));
	transform: translateZ(0);
}
.glowtext {
	text-shadow:
	 0 0 0.3125rem rgba(255,255,255,.5),
	 0 0 0.9375rem rgba(255,255,255,.5)
}


/* --------------------------------------------------------------------------------
 marker
-------------------------------------------------------------------------------- */
.js-line {
	padding-bottom: 0.25rem;
	display: inline;
	position: relative;
	z-index: 2;
	&::before {
		content: "";
		width: 100%;
		height: 0.0625rem;
		position: absolute;
		left: 0;
		bottom: 0;
		transform: scaleX(0);
		transform-origin: left;
		transition: transform 2s ease-in-out;
		z-index: 2;
	}
	&.is-inview::before {
		transform: scaleX(1);
	}
}
.js-marker {
	padding: .125rem .3125rem;
	display: inline;
	position: relative;
	z-index: 2;
	&::before {
		content: "";
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		bottom: 0;
		transform: scaleX(0);
		transform-origin: left;
		transition: transform 2s ease-in-out;
		z-index: -1;
	}
	&.is-inview::before {
		transform: scaleX(1);
	}
}
#News .news_text .js-marker::before {
	background: #f6e6d2;
}


/* --------------------------------------------------------------------------------
 wrap FONT text_align color
-------------------------------------------------------------------------------- */

html {
	font-size: calc(32vw / 7.5);
	overflow-x: hidden;
}

@media screen and (min-width: 750px) {
	html {
		font-size: 32px;
	}
}

body {
	max-width: 750px;
	margin: 0 auto;
	overflow: hidden;
	font-family: "Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
	color: #000;
	font-weight: 200;
	background: #f6f6f6;
	font-feature-settings: "palt";
}

.wrap {
	width: 100%;
	max-width: 750px;
	font-weight: 200;
	font-family: "Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
	color: #000;
	font-feature-settings: "palt";
	letter-spacing: 0.046875rem;
	line-height: 1.6;
	margin: 0 auto;
	background: #fff;
	overflow: hidden;
	img {
		max-width: 100%;
		height: auto;
		display: block;
	}
	a {
		text-decoration: none;
		transition: .25s;
		&::after {
			transition: .25s;
		}
		img {
			transition: .25s;
		}
	}
}


/* --------------------------------------------------------------------------------
 #fv
-------------------------------------------------------------------------------- */
#FV {
	position: relative;
	z-index: 1;
	.fv_video {
		width: 100%;
		margin: 0;
		display: block;
		position: relative;
		z-index: 1;
		overflow: hidden;
		video {
			width: 100%;
			height: 100%;
			aspect-ratio: 18 / 25;
			display: block;
			object-fit: cover;
			position: relative;
			z-index: 1;
		}
		.video_logo {
			width: 5.75rem;
			position: absolute;
			top: 2rem;
			left: 50%;
			transform: translateX(-50%);
			z-index: 2;
		}
		.video_title {
			width: 100%;
			font-size: 2.1875rem;
			font-weight: 500;
			color: #fff;
			text-align: center;
			position: absolute;
			top: 1.5rem;
			left: 0;
			z-index: 2;
		}
	}/*fv_video*/
	.fv_cart {
		background: #f3f5f9;
		.cart_title {
			position: relative;
			.title_item {
				width: 4.375rem;
				position: absolute;
				bottom: 60%;
				left: 4%;
				z-index: 2;
			}
		}
		.cart_item {
			position: relative;
			.item_title {
				width: 100%;
				position: absolute;
				top: 1.5rem;
				left: 0;
				z-index: 2;
				.title_sub {
					font-size: 1.0625rem;
					font-weight: 600;
					text-align: center;
					margin-bottom: .25rem;
					.sub_text {
						padding: 0 2.5rem;
						position: relative;
						&::before {
							content: "";
							width: 2rem;
							height: 0.0625rem;
							background: #000;
							position: absolute;
							top: 50%;
							left: 0;
							transform: translateY(-50%);
						}
						&::after {
							content: "";
							width: 2rem;
							height: 0.0625rem;
							background: #000;
							position: absolute;
							top: 50%;
							right: 0;
							transform: translateY(-50%);
						}
					}
				}
				.title_text {
					font-size: 1.625rem;
					font-weight: 500;
					color: #ba0020;
					text-align: center;
					.marker {
						color: #fff;
						padding: .35rem .5rem;
						background: #ba0020;
					}
				}
			}
			.item_pococe {
				width: 4.8125rem;
				position: absolute;
				top: 8rem;
				left: 5.3%;
			}
			.item_description {
				width: 100%;
				padding: 0 12%;
				display: flex;
				justify-content: center;
				position: absolute;
				bottom: 5.5rem;
				left: 0;
				z-index: 2;
				.description_text {
					flex: 1;
					font-size: 0.625rem;
					text-align: center;
					&:first-child {
						flex: 1.125;
					}
				}
			}
		}
		.cart_body {
			margin-top: -4rem;
			padding-bottom: 2.5rem;
			position: relative;
			z-index: 3;
			.body_list {
				width: 82%;
				margin: 0 auto 1.5rem;
				padding: 1.5rem 1rem .5rem;
				border: 0.0625rem solid #BA0020;
				background: #fff;
				list-style: none;
				li {
					font-size: 1rem;
					padding-left: 1.5rem;
					margin-bottom: .5rem;
					position: relative;
					&::before {
						content: "";
						height: 1.25rem;
						width: 1.25rem;
						display: inline-block;
						clip-path: polygon(35% 88%, 94% 12%, 100% 16%, 35% 100%, 0 55%, 6% 50%);
						background: #BA0020;
						position: absolute;
						top: 50%;
						left: 0;
						transform: translateY(-50%);
					}
					&:last-child {
						font-size: 0.625rem;
						text-align: right;
						&::before {
							display: none;
						}
					}
				}
			}
			.btn {
				width: 90%;
				margin: auto;
				background: linear-gradient(to bottom,
					color-mix(in oklab, #333 92%, white),
					color-mix(in oklab, #111 92%, white) 100%
				);
				border-radius: 0.3125rem;
				position: relative;
				&::before {
					content: "";
					position: absolute;
					inset: 0;
					background: linear-gradient(to bottom,
						color-mix(in oklab, #333 95%, black),
						color-mix(in oklab, #111 95%, black) 100%
					);
					border-radius: 0.3125rem;
					opacity: 0;
					transition: opacity 0.5s ease;
					pointer-events: none;
					z-index: 1;
				}
				&:hover::before {
					opacity: 1;
				}
				a {
					font-size: 1.0625rem;
					color: #fff;
					text-align: center;
					text-decoration: none;
					line-height: 1.25;
					padding: 1.25rem 1.3125rem;
					display: block;
					position: relative;
					z-index: 3;
					&::after{
						content: "";
						width: 0.45rem;
						height: 0.75rem;
						background: #fff;
						clip-path: polygon(0 0, .09375rem 0, 100% 50%, .09375rem 100%, 0 100%, calc(100% - .09375rem) 50%);
						position: absolute;
						top: 50%;
						right: 1rem;
						transform: translateY(-50%);
						z-index: 2;
					}
				}
			}
		}
	}/*fv_cart*/
}


/* --------------------------------------------------------------------------------
#Clinic
-------------------------------------------------------------------------------- */
#Clinic {
	padding: 2.5rem 0;
	background: #fff;
	.clinic_label {
		font-size: 1rem;
		font-weight: 600;
		margin-bottom: .5rem;
		padding-left: calc(5.33% + .5rem);
		position: relative;
		&::before {
			content: "";
			width: 5.33%;
			height: 0.0625rem;
			background: #000;
			position: absolute;
			top: 50%;
			left: 0;
			transform: translateY(-50%);
		}
	}
	.clinic_title {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: left;
		margin-bottom: 1rem;
		padding-left: 5.33%;
	}
	.clinic_profile {
		padding: 0 5.33%;
		.profile_image {
			position: relative;
			z-index: 2;
		}
		.profile_text {
			width: 100%;
			display: block;
			margin-bottom: 1rem;
			padding: 6rem 6% 1rem;
			color: #fff;
			margin-top: -5rem;
			background: #BA0020;
			position: relative;
			left: -6%;
			z-index: 1;
			.text_name {
				font-size: 0.875rem;
    			margin-bottom: 0.75rem;
			}
			.text_description {
				font-size: 0.75rem;
			}
		}
	}
	.clinic_text {
		font-size: 1rem;
		padding: 0 5.33%;
	}
}


/* --------------------------------------------------------------------------------
#Trouble
-------------------------------------------------------------------------------- */
#Trouble {
	padding-bottom: 2rem;
	.trouble_bg {
		margin-bottom: 5rem;
		padding: 2.5rem 5.33%;
		background: #efefef;
	}
	h2 {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1.5rem;
	}
	.trouble_box {
		position: relative;
		.box_text {
			font-size: 1rem;
			line-height: 2;
			position: relative;
			z-index: 2;
			span {
				position: relative;
				&::before {
					content: "";
					width: calc(100% + 0.5rem);
					height: calc(100% + 0.25rem);
					background: #fff;
					opacity: .85;
					position: absolute;
					top: -0.125rem;
					left: -0.25rem;
					z-index: -1;
				}
			}
		}
		.box_image {
			width: 16.875rem;
			position: absolute;
			top: -0.5rem;
			right: -5.5%;
			z-index: 1;
		}
	}
	.trouble_message {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: center;
	}
}


/* --------------------------------------------------------------------------------
#Product
-------------------------------------------------------------------------------- */
#Product {
	padding-bottom: 4.5rem;
	background-image: linear-gradient(in oklab to bottom,#fff 50%,#000 60%);
	clip-path: polygon(100% 0, 100% calc(100% - 1.5rem), calc(50% + 1.75rem) calc(100% - 1.5rem), 50% 100%, calc(50% - 1.75rem) calc(100% - 1.5rem), 0 calc(100% - 1.5rem), 0 0);
	position: relative;
	z-index: 3;
	.product_image_1 {
		width: 100%;
		position: relative;
		z-index: 1;
	}
	.product_image_2 {
		width: 100%;
		margin-top: -2.5rem;
		position: relative;
		z-index: 2;	
	}
	.product_image_3 {
		width: 100%;
		margin-top: -2.5rem;
		position: relative;
		z-index: 3;
	}
	.product_body {
		margin-top: -4rem;
		position: relative;
		z-index: 4;
		.body_lllt {
			width: 90%;
			margin: auto;
			padding: 1rem;
			background: #f3efeb;
			h3 {
				font-size: 1.3125rem;
				font-weight: 500;;
				text-align: center;
				margin-bottom: 1rem;
			}
			.lllt_image {
				width: 100%;
				margin-bottom: 1rem;
			}
			.lllt_text {
				font-size: 0.9375rem;
				margin-bottom: .75rem;
			}
			.lllt_note {
				font-size: 0.75rem;
			}
		}
	}
}



/* --------------------------------------------------------------------------------
#Scene
-------------------------------------------------------------------------------- */
#Scene {
	margin-top: -1.55rem;
	padding: 3.55rem 0 0;
	background-image: linear-gradient(in oklab to bottom, #fff, #ebeef4 60%, transparent 90%);
	position: relative;
	z-index: 2;
	h2 {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1.5rem;
	}
	.scene_morning {
		margin-bottom: .25rem;
		padding: 2.5rem 0 0 5.33%;
		position: relative;
		.morning_text {
			font-size: 1rem;
			text-align: right;
			padding: 1rem 5.33%;
			background: #fff;
			position: absolute;
			top: 0;
			right: 0;
			z-index: 2;
		}
		.morning_note {
			font-size: 0.625rem;
			text-align: right;
			margin-top: .5rem;
			padding-right: 5.33%;
		}
	}
	.scene_night {
		padding: 2.5rem 5.33% 0 0;
		position: relative;
		.night_text {
			font-size: 1rem;
			text-align: left;
			padding: 1rem 5.33%;
			background: #dbd5cb;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 2;
		}
	}
	.scene_face {
		padding: 2rem 0 4rem;
		background: url(../images/scene_bg.webp) center bottom / cover no-repeat;
		clip-path: polygon(0 0, 100% 0%, 100% calc(100% - 2rem), 50% 100%, 0 calc(100% - 2rem));
		h3 {
			font-size: 1.625rem;
			font-weight: 500;
			text-align: center;
			margin-bottom: 1rem;
		}
		.face_flex {
			padding: 0 5.33%;
			display: flex;
			gap: .75rem;
			.flex_text {
				flex: 1;
				font-size: 1.125rem;
				line-height: 1.5;
			}
			.flex_image {
				flex: 1;
				img {
					width: 100%;
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
#News
-------------------------------------------------------------------------------- */
#News {
	padding-bottom: 2.5rem;
	background: #fff;
	.news_head {
		margin-bottom: 1.25rem;
		padding: 1.5rem 0;
		background-image: linear-gradient(in oklab to right,#970010,#dd0030 50%, #970010 100%);
		.head_text {
			font-size: 1.625rem;
			font-weight: 500;
			color: #fff;
			text-align: center;
		}
	}
	.news_title {
		font-size: 1.4375rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1.25rem;
	}
	.news_text {
		font-size: 1rem;
		text-align: center;
		margin-bottom: 1.25rem;
	}
	.news_book {
		width: 80%;
		margin: auto;
	}
}


/* --------------------------------------------------------------------------------
#Voice
-------------------------------------------------------------------------------- */
#Voice {
	padding: 2.5rem 0;
	background: #f7f7f7;
	.voice_title {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1.5rem;
	}
	.voice_block {
		margin-bottom: 1.5rem;
		padding: 1rem 0 1.5rem;
		position: relative;
		&::before {
			content: "";
			width: 90%;
			height: 100%;
			background: #fff;
			position: absolute;
			top: 0;
			left: 50%;
			transform: translateX(-50%);
			z-index: 1;
		}
		.block_user {
			margin-bottom: .75rem;
			position: relative;
			z-index: 2;
			&.user_right {
				.user_image {
					margin: 0 0 0 auto;
				}
				.user_title {
					left: 0;
				}
			}
			&.user_left {
				.user_image {
					margin: 0;
				}
				.user_title {
					right: 0;
					.title_label {
						margin: 0 0 -0.0625rem auto;
					}
				}
			}
			.user_image {
				width: 66.667%;
			}
			.user_title {
				width: 56%;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				.title_label {
					width: 7rem;
					margin-bottom: -0.0625rem;
				}
				.title_box {
					padding: 1.25rem 4%;
					background-image: linear-gradient(in oklab to right,#cba880,#dabe9c);
					.title {
						font-size: 1.1875rem;
						font-weight: 500;
						color: #fff;
						text-align: center;
						line-height: 1.25;
						margin-bottom: .75rem;
						padding-bottom: .75rem;
						position: relative;
						&::after {
							content: "";
							width: 2rem;
							height: 0.0625rem;
							background: #fff;
							position: absolute;
							bottom: 0;
							left: 50%;
							transform: translateX(-50%);
						}
					}
					.name {
						font-size: 0.8125rem;
						color: #fff;
						text-align: center;
					}
				}
			}
		}
		.block_ba {
			width: 67.5%;
			margin: 0 auto 1rem;
			position: relative;
			z-index: 2;
		}
		.block_readmore {
			width: 80%;
			margin: auto;
			position: relative;
			z-index: 2;
			.readmore_text {
				position: relative;
				height: 7rem;
				max-height: 250px;
				transition: all .4s;
				overflow: hidden;
				&::before {
					content: "";
					width: 100%;
					height: 6rem;
					max-height: 160px;
					background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, #fff 80%);
					display: block;
					position: absolute;
					left: 0;
					bottom: 0;
					z-index: 3;
					transition: all .4s;
				}
				&.is-open {
					max-height: initial;
					&::before{
						display: none;
					}
				}
				.text {
					font-size: 0.875rem;
					text-align: left;
					position: relative;
					z-index: 2;
				}
			}
			.readmore_btn {
				width: 62.5%;
				cursor: pointer;
				display: inline-block;
				z-index: 1;
				position: absolute;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);
				z-index: 3;
				transition: all .4s;
				&.is-hide {
					display: none;
				}
				p {
					font-size: 0.875rem;
					color: #fff;
					text-align: center;
					padding: .6rem 0;
					background: #000;
					border-radius: 100px;
					position: relative;
					&::after {
						content: "";
						width: .9rem;
						height: .45rem;
						clip-path: polygon(10% 0, 50% 80%, 90% 0, 100% 0, 50% 100%, 0 0);
						background: #fff;
						position: absolute;
						top: 50%;
						right: 1.5rem;
						transform: translateY(-50%);
					}
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
#Technology
-------------------------------------------------------------------------------- */
#Technology {
	padding: 2.5rem 0 0;
	.tech_title {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1rem;
		padding-left: 5.33%;
	}
	.tech_profile {
		margin-bottom: 1.5rem;
		padding: 0 5.33%;
		.profile_image {
			position: relative;
			z-index: 2;
		}
		.profile_text {
			width: 100%;
			display: block;
			margin-bottom: 1rem;
			padding: 6rem 6% 1rem;
			color: #fff;
			margin-top: -5rem;
			background: #BA0020;
			position: relative;
			right: -6%;
			z-index: 1;
			.text_name {
				font-size: 0.875rem;
    			margin-bottom: 0.75rem;
			}
			.text_description {
				font-size: 0.75rem;
			}
		}
	}
	.tech_text {
		width: 90%;
		font-size: 0.9375rem;
		margin: 0 auto;
	}
	.tech_image {
		width: 89.333%;
		margin: 1.5rem auto;
	}
	.tech_column {
		width: 89.33%;
		margin: 2rem auto 0;
		padding: 2rem 5.33%;
		background: #f6f6f6;
		.column_title {
			margin-bottom: 1rem;
			padding: 0.09375rem 0;
			position: relative;
			border-top: 0.125rem solid #000;
			border-bottom: 0.125rem solid #000;
			.title_text {
				font-size: 1.375rem;
				font-weight: 500;
				text-align: center;
				padding: 0.75rem 0;
				border-top: 0.0625rem solid #000;
				border-bottom: 0.0625rem solid #000;
			}
		}
		.column_profile {
			margin-bottom: 1rem;
			display: flex;
			gap: 1rem;
			.profile_image {
				width: 5.5625rem;
			}
			.profile_text {
				flex: 1;
				font-size: 0.875rem;
			}
		}
		.column_text {
			font-size: 0.9375rem;
			margin-bottom: 1.5rem;
		}
		.column_ba {
			margin-bottom: 1rem;
			padding: 0 1rem;
			display: flex;
			gap: 1rem;
			.ba_inner {
				flex: 1;
				img {
					width: 100%;
					margin-bottom: .5rem;
				}
				.ba_text {
					font-size: 0.8125rem;
					text-align: center;
				}
			}
		}
		.column_note {
			font-size: 0.625rem;
			text-align: right;
			padding-right: 1rem;
		}
	}
}


/* --------------------------------------------------------------------------------
#Faq
-------------------------------------------------------------------------------- */
#Faq {
	padding: 2.5rem 5.33%;
	background: #fff;
	.faq_title {
		font-size: 1.625rem;
		font-weight: 500;
		text-align: center;
		margin-bottom: 1.25rem;
		padding-left: 5.33%;
	}
	.faq_body {
		display: flex;
		flex-direction: column;
		gap: 0.375rem 0;
		.faq_accordion {
			width: 100%;
			margin: auto;
			border-bottom: .03125rem solid #ccc;
			.acd_head {
				width: 100%;
				padding: 1.125rem 0;
				background: #fff;
				border: none;
				display: block;
				cursor: pointer;
				-webkit-tap-highlight-color: transparent;
				position: relative;
				p {
					font-size: 0.9375rem;
					font-weight: 600;
					color: #000;
					text-align: left;
					letter-spacing: 0;
					padding-left: 1.5rem;
					padding-right: 1rem;
					position: relative;
					&::before {
						content: "Q.";
						font-size: 1rem;
						font-weight: 600;
						font-family: "YuGothic","Hiragino Sans","Meiryo","MS PGothic", sans-serif;
						color: #BA0020;
						line-height: 1;
						position: absolute;
						top: 0.25rem;
						left: 0;
					}
				}
				.bar {
					width: 1.5rem;
					height: 1.5rem;
					position: absolute;
					top: 50%;
					right: -0.75rem;
					transform: translateY(-50%);
					z-index: 2;
					&::before {
						content: '';
						width: 0.90625rem;
						height: 0.09375rem;
						background-color: #BA0020;
						display: inline-block;
						position: absolute;
						top: 50%;
						left: 50%;
						transform: translate(-50%, -50%);
						z-index: 2;
						transition: 0.2s;
					}
					&::after {
						content: '';
						width: 0.90625rem;
						height: 0.09375rem;
						background-color: #BA0020;
						display: inline-block;
						position: absolute;
						top: 50%;
						left: 50%;
						transform: translate(-50%, -50%) rotate(90deg);
						z-index: 2;
						transition: 0.2s;
					}
				}
			}
			.acd_body {
				padding-left: 1.5rem;
				overflow: hidden;
				height: 0;
				opacity: 0;
				transition: height 0.3s ease, opacity 0.3s ease;
				position: relative;
				p {
					font-size: 0.875rem;
					letter-spacing: 0.0234375rem;
					margin-bottom: 0.9375rem;
					&::before {
						content: "A.";
						font-size: 1rem;
						font-weight: 600;
						font-family: "YuGothic","Hiragino Sans","Meiryo","MS PGothic", sans-serif;
						color: #000;
						line-height: 1;
						position: absolute;
						top: 0.25rem;
						left: 0;
					}
				}
			}
			&.accordion.open {
				.acd_head {
					.bar {
						&::before { transform: translate(-50%, -50%) rotate(360deg); }
						&::after { transform: translate(-50%, -50%) rotate(180deg); }
					}
				}
				.acd_body { opacity: 1; }
			}
		}
	}
}


/* --------------------------------------------------------------------------------
.Cart
-------------------------------------------------------------------------------- */
.Cart {
	padding:2.5rem 0;
	background: #f3efeb;
	position: relative;
	&.cart1 {
		margin-top: -2.1rem;
		padding-top: 3.6rem;
		.body_set {
			font-size: 0.6875rem;
		}
	}
	&.cart2 {
		.body_set {
			width: 90%;
			font-size: 0.625rem;
			margin: -1rem auto 1rem;
		}
		.body_check {
			width: 90%;
			margin: 0 auto 1rem;
		}
	}
	.cart_title {
		width: 100%;
		margin-bottom: 1rem;
		.title_sub {
			font-size: 1.0625rem;
			font-weight: 600;
			text-align: center;
			margin-bottom: .25rem;
			.sub_text {
				padding: 0 2.5rem;
				position: relative;
				&::before {
					content: "";
					width: 2rem;
					height: 0.0625rem;
					background: #000;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translateY(-50%);
				}
				&::after {
					content: "";
					width: 2rem;
					height: 0.0625rem;
					background: #000;
					position: absolute;
					top: 50%;
					right: 0;
					transform: translateY(-50%);
				}
			}
		}
		.title_text {
			font-size: 1.625rem;
			font-weight: 500;
			color: #ba0020;
			text-align: center;
			.marker {
				color: #fff;
				padding: .35rem .5rem;
				background: #ba0020;
			}
		}
		.item_pococe {
			width: 4.8125rem;
			position: absolute;
			top: 8rem;
			left: 5.3%;
		}
	}
	.cart_body {
		width: 90%;
		margin: auto;
		padding: 1.5rem 1rem;
		background: #fff url(../images/cart_bg.webp) center top / contain no-repeat;
		border: 0.1875rem solid #fff;
		.body_title {
			font-size: 1.5rem;
			font-weight: 500;
			text-align: center;
			line-height: 1.25;
			margin-bottom: 1rem;
			padding: .5rem 0;
			border-top: 0.0625rem solid #000;
			border-bottom: 0.0625rem solid #000;
		}
		/*cart1*/
		.body_flex {
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 1rem;
			.flex_item {
				flex: 1;
				position: relative;
				.item_badge {
					width: 3.75rem;
					position: absolute;
					top: -0.75rem;
					left: -1.25rem;
				}
				.item_image {
					width: 100%;
				}
			}
			.flex_price {
				flex: 1.2;
				.price_first {
					font-size: 0.875rem;
					color: #fff;
					line-height: 1;
					.first_text {
						padding: .25rem .5rem;
						background: #000;
					}
				}
				.price_value {
					color: #BA0020;
					margin-bottom: .5rem;
					.value {
						font-size: 3.125rem;
						line-height: 1.25;
						margin-right: .25rem;
					}
					.yen {
						font-size: 1.5625rem;
					}
				}
				.price_free {
					font-size: 0.9375rem;
					color: #BA0020;
					text-align: center;
					line-height: 1;
					margin-bottom: .75rem;
					padding: .25rem 0;
					background: #fff;
					border: .0625rem solid #BA0020;
				}
				.price_note {
					font-size: 0.6875rem;
				}
			}
		}
		/* cart2 */
		.body_item {
			position: relative;
			.item_image {
				width: 9.0625rem;
				margin: auto;
			}
			.item_badge {
				width: 4.6875rem;
				position: absolute;
				top: 0.5rem;
				left: 1rem;
				z-index: 2;
			}
		}
		.body_price {
			width: 90%;
			margin: 0 auto 1rem;
			display: flex;
			justify-content: space-between;
			align-items: center;
			gap: .75rem;
			.price_first {
				width: 2.8125rem;
				height: 2.8125rem;
				background: #000;
				border-radius: .125rem;
				display: flex;
				justify-content: center;
				align-items: center;
				.first_text {
					font-size: 0.875rem;
					font-weight: 600;
					color: #fff;
					text-align: center;
					line-height: 1.25;
				}
			}
			.price_value {
				color: #BA0020;
				.value {
					font-size: 3.125rem;
					line-height: 1;
					margin-right: .25rem;
				}
				.yen {
					font-size: 1.5625rem;
				}
			}
			.price_free {
				width: 2.8125rem;
				height: 2.8125rem;
				background: #fff;
				border: 0.0625rem solid #BA0020;
				display: flex;
				justify-content: center;
				align-items: center;
				.free_text {
					font-size: 0.9375rem;
					font-weight: 600;
					color: #BA0020;
					text-align: center;
					line-height: 1.25;
				}
			}
		}
		.body_note {
			width: 90%;
			font-size: 0.625rem;
			margin: 0 auto 1rem;
		}
		.body_set {
			margin-bottom: 1rem;
			padding: .75rem;
			background: #fff;
			border: 0.046875rem solid #000;
			position: relative;
			.set_marker {
				font-size: 0.5625rem;
				font-weight: 600;
				color: #fff;
				margin-left: .5rem;
				padding: .175rem .25rem;
				background: #cf4c62;
			}
		}
		.body_btn {
			width: 100%;
			margin-bottom: 1rem;
			background: linear-gradient(to bottom,
				color-mix(in oklab, #c80026 92%, white),
				color-mix(in oklab, #ac001a 92%, white) 100%
			);
			border-radius: 0.3125rem;
			position: relative;
			&::before {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(to bottom,
					color-mix(in oklab, #c80026 95%, black),
					color-mix(in oklab, #ac001a 95%, black) 100%
				);
				border-radius: 0.3125rem;
				opacity: 0;
				transition: opacity 0.5s ease;
				pointer-events: none;
				z-index: 1;
			}
			&:hover::before {
				opacity: 1;
			}
			a {
				font-size: 1.0625rem;
				font-weight: 600;
				color: #fff;
				text-align: center;
				text-decoration: none;
				line-height: 1.25;
				padding: 1.25rem 1.3125rem;
				display: block;
				position: relative;
				z-index: 3;
				&::after{
					content: "";
					width: 0.45rem;
					height: 0.75rem;
					background: #fff;
					clip-path: polygon(0 0, .09375rem 0, 100% 50%, .09375rem 100%, 0 100%, calc(100% - .09375rem) 50%);
					position: absolute;
					top: 50%;
					right: 1rem;
					transform: translateY(-50%);
					z-index: 2;
				}
			}
		}
		.body_check {
			margin-bottom: 1rem;
			li {
				font-size: 0.875rem;
				margin-bottom: .5rem;
				padding-left: 1.5rem;
				position: relative;
				&::before {
					content: "";
					width: 1rem;
					height: 1rem;
					border: .0625rem solid #ccc;
					border-radius: 50%;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translateY(-50%);
					z-index: 1;
				}
				&::after {
					content: "";
					height: 1rem;
					width: 1rem;
					background: #BA0020;
					clip-path: polygon(35% 88%, 94% 12%, 100% 16%, 35% 100%, 0 55%, 6% 50%);
					position: absolute;
					top: 0;
					left: .125rem;
					z-index: 2;
				}
				&:last-child {
					margin-bottom: 0;
				}
			}
		}
		.body_terms {
			padding: 1.25rem;
			background: #f7f7f7;
			.terms_title {
				font-size: 0.875rem;
				text-align: center;
				margin-bottom: .75rem;
			}
			.terms_text {
				list-style-type: disc;
				li {
					font-size: 0.5625rem;
					margin-bottom: .5rem;
					&:last-child {
						margin-bottom: 0;
					}
				}
			}
		}
	}
}

/* --------------------------------------------------------------------------------
footer
-------------------------------------------------------------------------------- */

footer {
	background-color: #000;
	padding: 2rem 5.33%;
	.footer_logo {
		width: 6.25rem;
		margin: 0 auto 2rem;
	}
	.footer_link {
		font-size: 0.625rem;
		color: #fff;
		margin-bottom: 1.5rem;
		display: flex;
		li {
			flex: 1;
			text-align: center;
			padding: 0 .75rem;
			border-left: 0.03125rem solid;
			display: flex;
			justify-content: center;
			align-items: center;
			&:first-child {
				border-left: none;
			}
			a { color: #fff; }
		}
	}
	.footer_copy {
		font-size: 0.625rem;
		color: #fff;
		text-align: center;
	}
}


/* --------------------------------------------------------------------------------
 #floating
-------------------------------------------------------------------------------- */
#floating {
	position: fixed;
	width: 100%;
	max-width: 750px;
	text-align: center;
	line-height: 0;
	margin: 0 auto;
	bottom: 0;
	z-index: 999;
	opacity: 0;
	transform: translateY(120%);
	pointer-events: none; 
	& a {
		display:block;
		cursor: pointer;
		& img {
			width: 100%;
			max-width: 500px;
			margin: 0 auto;
		}
	}
}


#floating.In{
	pointer-events: auto;
    animation: floatingInAnime 1.5s forwards;
}
@keyframes floatingInAnime{
	from {
		opacity: 0;
		transform: translateY(120%);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

#floating.Out{
	animation: floatingOutAnime 0.35s forwards;
}
@keyframes floatingOutAnime{
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(120%);
	}
}