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

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



/* --------------------------------------------------------------------------------
 pc_sp
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.hidden-xs {
		display: block;
		@media (max-width: 500px) {
			display: none;
		}
	}
	.visible-xs {
		display: none;
		@media (max-width: 500px) {
			display: none;
		}
	}
}

/* --------------------------------------------------------------------------------
 FONT text_align color
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.f_goth {
		font-family: "YuGothic","Hiragino Sans","Meiryo","MS PGothic", sans-serif;
		font-weight: 400;
	}
	.f_min {
		font-family: "Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
		font-weight: 400;
	}
	h1 {
		font-weight: 400;
		text-align: center ;
		margin-bottom: 0;
	}
	h2 {
		font-weight: 400;
		text-align: center ;
		margin-bottom: 0;
	}
	h3 {
		font-weight: 400;
		margin-bottom: 0;
	}
	/*font-size*/
	.fs_20 { font-size: clamp(8.5px, 2.7vw, 17.1px); }
	.fs_36 { font-size: clamp(15.4px, 4.8vw, 30.7px); }
	.fs_40 { font-size: clamp(17.1px, 5.3vw, 34.1px); }
	.fs_48 { font-size: clamp(20.5px, 6.4vw, 41px); }
	.fs_50 { font-size: clamp(21.3px, 6.7vw, 42.7px); }
	.fs_52 { font-size: clamp(22.2px, 6.9vw, 44.4px); }
	.fs_54 { font-size: clamp(23px, 7.2vw, 46.1px); }
	.fs_56 { font-size: clamp(23.9px, 7.5vw, 47.8px); }
	.fs_64 { font-size: clamp(27.3px, 8.5vw, 54.6px); }
	.fs_70 { font-size: clamp(29.9px, 9.3vw, 59.7px); }
	.fs_96 { font-size: clamp(41px, 12.8vw, 81.9px); }
	/*font-weight*/
	.fw_200 { font-weight: 200; }
	.fw_400 { font-weight: 400; }
	.fw_700 { font-weight: 700; }
	/*alignment*/
	.al_C { text-align: center; }
	.al_R { text-align: right; }
	.al_L { text-align: left; }
	/*etc*/
	sup {
		font-size: clamp(6.8px, 2.1vw, 13.7px);
		letter-spacing: 0;
	}
	.kome {
		font-size: clamp(8.5px, 2.7vw, 17.1px);
	}
}


/* --------------------------------------------------------------------------------
 padding/margin
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.pL_04 {
		padding-left: 4%
	}
	.pR_04 {
		padding-right: 4%;
	}
}

/* --------------------------------------------------------------------------------
 marker
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.js-line {
		display: inline;
		position: relative;
		background-repeat: no-repeat;
		background-position: bottom left;
		background-size: 0 1px; 
		transition: all 2.5s ease-in-out;
		padding-bottom: clamp(2.8px, 0.9vw, 5.5px);
		&.is-inview {
			background-size: 100% 1px; 
		}
	}
	.js-line-readmore {
		display: inline;
		position: relative;
		background-repeat: no-repeat;
		background-position: bottom left;
		background-size: 0 1px; 
		transition: all 2.5s ease-in-out;
		padding-bottom: clamp(2.8px, 0.9vw, 5.5px);
		&.is-inview {
			background-size: 100% 1px; 
		}
	}
	#Concept .block_concept .text_concept .js-line {
		background-image: linear-gradient(90deg, #000, #000);
	}
	#Attraction {
		.block_1 .text_box .js-line {
			background-image: linear-gradient(90deg, #000, #000);
		}
		.block_1 .column_box .js-line-rm1 {
			font-weight: 700;
			background-image: linear-gradient(90deg, #000, #000);
		}
		.block_1 .column_box .js-line-rm2 {
			font-weight: 700;
			color: #c06d6d;
			background-image: linear-gradient(90deg, #c06d6d, #c06d6d);
		}
		.block_2 .trouble_head .js-line {
			background-image: linear-gradient(90deg, #000, #000);
		}
		.block_3 .spatula_box .balloon .js-line {
			background-image: linear-gradient(90deg, #000, #000);
		}
	}
	.js-marker {
		display: inline;
		position: relative;
		background-repeat: no-repeat;
		background-position: bottom left;
		background-size: 0 100%; 
		transition: all 2.5s ease-in-out;
		padding: clamp(0.9px, 0.3vw, 1.7px);
		&.is-inview {
			background-size: 100% 100%; 
		}
	}
	#Pococe .body .text {
		.js-marker-red {
			background-image: linear-gradient(90deg, #f3e1db, #f3e1db);
		}
		.js-marker-gold {
			background-image: linear-gradient(90deg, #eeeac5, #eeeac5);
		}
	}
	#Recommend ul li .js-marker {
		background-image: linear-gradient(90deg, #fff, #fff);
	}
}


/* --------------------------------------------------------------------------------
 filter
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.shadow {
		filter: drop-shadow(0 10px 10px rgba(0,0,0,0.125));
		transform: translateZ(0);
		z-index: 6;
		@media (min-width: 750px) {
			filter: drop-shadow(0 20px 20px rgba(0,0,0,0.125));
		}
	}
	.glow {
		filter: drop-shadow(0 0 8px rgba(255,255,255,1)) drop-shadow(0 0 10px rgba(255,255,255,1)) drop-shadow(0 0 12px rgba(255,255,255,1));
		transform: translateZ(0);
		@media (min-width: 750px) {
			filter: drop-shadow(0 0 16px rgba(255,255,255,1)) drop-shadow(0 0 20px rgba(255,255,255,1)) drop-shadow(0 0 24px rgba(255,255,255,1));
		}
	}
}


/* --------------------------------------------------------------------------------
 .wrap
-------------------------------------------------------------------------------- */

#sleepingmaskcp {
	width: 100%;
	max-width: 640px;
	font-weight: 200;
	font-family: "Hiragino Mincho ProN W3", 'Yu Mincho',YuMincho, 'Hiragino Mincho ProN','Hiragino Mincho Pro', Meiryo,serif;
	color: #000;
	font-feature-settings: "palt";
	letter-spacing: 0.5px;
	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;
		}
	}
}


/* --------------------------------------------------------------------------------
 .cart
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.cv_area {
		margin-bottom: clamp(27.3px, 8.5vw, 54.6px);
		padding-bottom: clamp(13.7px, 4.3vw, 27.3px);
		background: #ead8c7;
		position: relative;
		.block_logo {
			padding: clamp(7.7px, 2.4vw, 15.4px);
			background: #fff;
			position: relative;
			z-index: 5;
			.logo {
				width: clamp(64px, 20vw, 128px);
				margin: auto;
			}
		}
		.block_banner {
			font-size: clamp(15.4px, 4.8vw, 30.7px);
			font-weight: 700;
			text-align: center;
			padding: clamp(10.9px, 3.4vw, 21.8px);
			background: #ced1bd;
			display: flex;
			justify-content: space-between;
			align-items: center;
			gap: clamp(17.1px, 5.3vw, 34.1px);
			position: relative;
			z-index: 5;
			.f_goth {
				font-size: clamp(11.9px, 3.7vw, 23.9px);
				font-weight: 400;
			}
			.logo {
				width: clamp(58.9px, 18.4vw, 117.8px);
			}
			p {
				flex: 1;
			}
		}
		.block_single {
			margin-top: clamp(-382.3px, -59.7vw, -191.2px);
			position: relative;
			z-index: 2;
			.single_head {
				width: 100%;
				text-align: center;
				position: absolute;
				top: clamp(17.1px, 5.3vw, 34.1px);
				left: 0;
				.subtitle {
					font-size: clamp(11.9px, 3.7vw, 23.9px);
					font-weight: 700;
					margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
				}
				h1 {
					font-size: clamp(27.3px, 8.5vw, 54.6px);
					line-height: 1.4;
					margin: 0 0 clamp(3.4px, 1.1vw, 6.8px);
				}
				.pococe {
					padding: 0 6.67%;
					display: flex;
					flex-direction: column;
					gap: clamp(3.4px, 1.1vw, 6.8px);
					.pococe_1 { width: clamp(51.2px, 16vw, 102.4px); padding: clamp(1.7px, 0.5vw, 3.4px); background: #fbf8f6; border-radius: 50%; position: relative; }
					.pococe_2 { width: clamp(51.2px, 16vw, 102.4px); position: relative; }
					.pococe_3 { width: clamp(51.2px, 16vw, 102.4px); position: relative; }
				}
			}
			.single_body {
				width: 100%;
				text-align: center;
				position: relative;
				.glow {
					filter: drop-shadow(0 0 clamp(17.1px, 5.3vw, 34.1px) rgba(255,255,255,1)) drop-shadow(0 0 clamp(21.3px, 6.7vw, 42.7px) rgba(255,255,255,1)) drop-shadow(0 0 clamp(25.6px, 8vw, 51.2px) rgba(255,255,255,1)) drop-shadow(0 0 clamp(29.9px, 9.3vw, 59.7px) rgba(255,255,255,1)) ;
				}
				.name {
					font-size: clamp(15.4px, 4.8vw, 30.7px);
					font-weight: 700;
					margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
				}
				.capacity {
					font-size: clamp(10.2px, 3.2vw, 20.5px);
					margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
				}
				.price {
					font-size: clamp(17.9px, 5.6vw, 35.8px);
					margin-bottom: 1.5%;
					.regular {
						font-size: clamp(15.7px, 4.9vw, 31.4px);
						text-decoration: line-through;
					}
					.yen {
						font-size: clamp(10.2px, 3.2vw, 20.5px);
					}
					.tax {
						font-size: clamp(9.4px, 2.9vw, 18.8px);
					}
				}
			}/*single_body*/
		}/*block_single*/
		.block_double {
			width: 92%;
			margin: clamp(20.5px, 6.4vw, 41px) auto 0;
			padding: 3.5%;
			border: 1px solid #ec7e8b;
			border-radius: clamp(6.8px, 2.1vw, 13.7px);
			background: #fff;
			position: relative;
			.double_head {
				display: flex;
				justify-content: center;
				align-items: center;
				margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
				.left {
					width: clamp(70px, 21.9vw, 140px);
					height: clamp(70px, 21.9vw, 140px);
					background: #ec7e8b;
					border-radius: 50%;
					display: flex;
					justify-content: center;
					align-items: center;
					p {
						font-size: clamp(25.6px, 8vw, 51.2px);
						font-weight: 700;
						color: #fff;
						text-align: center;
						line-height: .6;
						.per {
							font-size: clamp(12.8px, 4vw, 25.6px);
						}
						.off {
							font-size: clamp(15.4px, 4.8vw, 30.7px);
						}
					}
				}
				.right {
					text-align: center;
					flex: 1;
					display: flex;
					flex-wrap: wrap;
					align-items: center;
					gap: 0 clamp(13.7px, 4.3vw, 27.3px);
					.name {
						width: 100%;
						font-size: clamp(14.5px, 4.5vw, 29px);
						font-weight: 700;
					}
					.regular {
						text-align: right;
						flex: 1;
						position: relative;
						&::after {
							content: "";
							width: clamp(4px, 1.3vw, 8px);
							height: clamp(9px, 2.8vw, 18px);
							background: #000;
							clip-path: polygon(0 0, 0% 100%, 100% 50%);
							position: absolute;
							top: 50%;
							right: clamp(-13.7px, -2.1vw, -6.8px);
							transform: translateY(-50%);
						}
						.value {
							font-size: clamp(11.9px, 3.7vw, 23.9px);
							text-decoration: line-through;
						}
						.yen {
							font-size: clamp(7.7px, 2.4vw, 15.4px);
						}
						.tax {
							font-size: clamp(6.8px, 2.1vw, 13.7px);
						}
					}
					.discount {
						text-align: left;
						flex: 1.25;
						.value {
							font-size: clamp(17.1px, 5.3vw, 34.1px);
							font-weight: 700;
							color: #dc7480;
						}
						.yen {
							font-size: clamp(11.9px, 3.7vw, 23.9px);
						}
						.tax {
							font-size: clamp(10.2px, 3.2vw, 20.5px);
						}
					}
				}
			}/*double_head*/
			.double_item {
				width: 80%;
				margin: auto;
			}
			.double_bnr {
				margin: 0 auto clamp(13.7px, 4.3vw, 27.3px);
			}
			.plus {
				width: clamp(25.6px, 8vw, 51.2px);
				height: clamp(25.6px, 8vw, 51.2px);
				font-size: clamp(21.3px, 6.7vw, 42.7px);
				color: #fff;
				text-align: center;
				line-height: 1;
				background: #ec7e8b;
				border-radius: 50%;
				display: flex;
				justify-content: center;
				align-items: center;
				margin: clamp(-41px, -6.4vw, -20.5px) auto clamp(6.8px, 2.1vw, 13.7px);
				position: relative;
				z-index: 2;
			}
			.cheers {
				font-size: clamp(13.7px, 4.3vw, 27.3px);
				font-weight: 700;
				color: #ec7e8b;
				text-align: center;
				margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
				span {
					position: relative;
					&::before {
						content: "";
						width: clamp(1.3px, 0.4vw, 2.6px);
						height: 100%;
						background: #ec7e8b;
						position: absolute;
						top: 50%;
						left: clamp(-20.5px, -3.2vw, -10.2px);
						transform: translateY(-50%) rotate(-15deg);
					}
					&::after {
						content: "";
						width: clamp(1.3px, 0.4vw, 2.6px);
						height: 100%;
						background: #ec7e8b;
						position: absolute;
						top: 50%;
						right: clamp(-20.5px, -3.2vw, -10.2px);
						transform: translateY(-50%) rotate(15deg);
					}
				}
			}
		}/*block_double*/
		.cv_btn {
			width: 100%;
			font-size: clamp(13.7px, 4.3vw, 27.3px);
			font-weight: 700;
			color: #fff;
			text-align: center;
			margin: 0 auto 7%;
			padding: 3% 0 4%;
			background-size: 100% 200%;
			border-radius: clamp(6.8px, 2.1vw, 13.7px);
			display: block;
			filter: drop-shadow(0 8px 8px rgba(0,0,0,0.1));
			transform: translateZ(0);
			position: relative;
			@media (min-width: 750px) {
				filter: drop-shadow(0 16px 16px rgba(0,0,0,0.1));
			}
			&::after {
				position: absolute;
				content: "";
				width: clamp(11px, 3.4vw, 22px);
				height: clamp(13px, 4.1vw, 26px);
				clip-path: polygon(0 10%, 0 0, 100% 50%, 0 100%, 0 90%, 80% 50%);
				background: #fff;
				right: 3.5%;
				top: 50%;
				transform: translateY(-50%);
			}
			&:hover {
				color: #fff;
				background-position: 0 0;
				&::after {
					right: 2.75%;
				}
			}
			.balloon {
				width: 100%;
				font-size: clamp(10.2px, 3.2vw, 20.5px);
				color: #000;
				text-align: center;
				line-height: 1;
				position: absolute;
				bottom: -10%;
				left: 0;
				filter: drop-shadow(0px 4px 2px rgba(0,0,0,0.2));
				transform: translateZ(0);
				span {
					padding: clamp(4.8px, 1.5vw, 9.6px) clamp(13.7px, 4.3vw, 27.3px);
					border-radius: 50px;
					background: #fff;
				}
			}
			&.single_btn {
				width: 80%;
				background: linear-gradient(to bottom, #dba494, #d2917d 50%, #b07361 100%);
				background-size: 100% 200%;
				background-position: 0 98%;
				&:hover {
					background-position: 0 2%;
				}
			}
			&.double_btn {
				width: 87.25%;
				background: linear-gradient(to bottom, #e1a1a6, #df8c92 50%, #c17379 100%);
				background-size: 100% 200%;
				background-position: 0 98%;
				margin-bottom: 0;
				position: absolute;
				bottom: clamp(-68.3px, -10.7vw, -34.1px);
				left: 50%;
				transform: translateX(-50%);
				&:hover {
					background-position: 0 2%;
				}
			}
		}
		.block_spm {
			padding-bottom: 8%;
			position: relative;
			.single_head {
				width: 100%;
				text-align: center;
				position: absolute;
				top: 3%;
				left: 0;
				.subtitle {
					font-size: clamp(11.9px, 3.7vw, 23.9px);
					font-weight: 700;
					margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
				}
				h1 {
					font-size: clamp(27.3px, 8.5vw, 54.6px);
					line-height: 1.4;
					margin: 0 0 clamp(3.4px, 1.1vw, 6.8px);
				}
				.pococe {
					padding: 0 6.67%;
					display: flex;
					flex-direction: column;
					gap: clamp(6.8px, 2.1vw, 13.7px);
					.pococe_1 {
						width: clamp(51.2px, 16vw, 102.4px);
						padding: clamp(1.7px, 0.5vw, 3.4px);
						background: #fbf8f6;
						border-radius: 50%;
						position: relative;
						.js-shiny {
							width: 100%;
							height: 100%;
							border-radius: 50%;
							display: block;
							position: absolute;
							top: 0;
							left: 0;
							z-index: 20;
						}
					}
					.pococe_2 { width: clamp(51.2px, 16vw, 102.4px); position: relative; }
					.pococe_3 { width: clamp(51.2px, 16vw, 102.4px); position: relative; }
				}
			}
			.bnr_outer {
				width: 92%;
				position: absolute;
				bottom: 2%;
				left: 50%;
				transform: translateX(-50%);
				.cheers {
					font-size: clamp(16.2px, 5.1vw, 32.4px);
					font-weight: 700;
					text-align: center;
					margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
					span {
						position: relative;
						&::before {
							content: "";
							width: clamp(1.3px, 0.4vw, 2.6px);
							height: 100%;
							background: #000;
							position: absolute;
							top: 50%;
							left: clamp(-20.5px, -3.2vw, -10.2px);
							transform: translateY(-50%) rotate(-15deg);
						}
						&::after {
							content: "";
							width: clamp(1.3px, 0.4vw, 2.6px);
							height: 100%;
							background: #000;
							position: absolute;
							top: 50%;
							right: clamp(-20.5px, -3.2vw, -10.2px);
							transform: translateY(-50%) rotate(15deg);
						}
					}
					&.glow {
						filter: drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 6px rgba(255,255,255,1)) drop-shadow(0 0 8px rgba(255,255,255,1));
						transform: translateZ(0);
						@media (min-width: 750px) {
							filter: drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 8px rgba(255,255,255,1)) drop-shadow(0 0 12px rgba(255,255,255,1)) drop-shadow(0 0 16px rgba(255,255,255,1));
						}
					}
				}
				.bnr_inner {
					padding: clamp(27.3px, 8.5vw, 54.6px) clamp(6.8px, 2.1vw, 13.7px) clamp(10.2px, 3.2vw, 20.5px);
					background: #fff;
					position: relative;
					.bnr_label {
						width: 100%;
						text-align: center;
						position: absolute;
						top: -5%;
						left: 0;
						.label {
							font-size: clamp(13.7px, 4.3vw, 27.3px);
							font-weight: 700;
							color: #fff;
							background: #ec7e8b;
							padding: clamp(4.8px, 1.5vw, 9.6px) clamp(13.7px, 4.3vw, 27.3px) clamp(4.8px, 1.5vw, 9.6px) clamp(20.5px, 6.4vw, 41px);
							line-height: 1;
							margin-left: 8%;
							display: inline-block;
							position: relative;
							.circle {
								width: clamp(34.1px, 10.7vw, 68.3px);
								height: clamp(34.1px, 10.7vw, 68.3px);
								font-size: clamp(7.9px, 2.5vw, 15.7px);
								font-weight: 700;
								color: #000;
								text-align: center;
								line-height: 1;
								background: #faedab;
								border-radius: 50%;
								display: flex;
								justify-content: center;
								align-items: center;
								position: absolute;
								top: 50%;
								left: clamp(-54.6px, -8.5vw, -27.3px);
								transform: translateY(-50%) rotate(-5deg);
							}
						}
					} /* bnr_label */
					.bnr_body {
						margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
						position: relative;
						.bnr_name {
							font-size: clamp(15.4px, 4.8vw, 30.7px);
							font-weight: 700;
							color: #ec7e8b;
							text-align: center;
							line-height: 1.25;
							position: absolute;
							top: -6%;
							left: 6%;
						}
						.bnr_kome {
							position: absolute;
							bottom: 0;
							left: 2%;
						}
					}
					.bnr_notice {
						font-size: clamp(8.5px, 2.7vw, 17.1px);
						font-weight: 700;
						text-align: center;
						line-height: 1;
						padding: clamp(3.4px, 1.1vw, 6.8px);
						border: clamp(0.9px, 0.3vw, 1.7px) dotted #000;
					}
				}
			}/*bnr_outer*/
		}
		.double_kome {
			width: 100%;
			text-align: center;
			position: absolute;
			bottom: clamp(13.7px, 4.3vw, 27.3px);
			left: 0;
		}
		.block_cheers {
			font-size: clamp(22.2px, 6.9vw, 44.4px);
			font-weight: 600;
			text-align:center;
			margin: clamp(13.7px, 4.3vw, 27.3px) 0 clamp(6.8px, 2.1vw, 13.7px);
			span {
				padding: 0 clamp(10.2px, 3.2vw, 20.5px);
				position: relative;
				&::before {
					content: "";
					width: clamp(0.9px, 0.3vw, 1.7px);
					height: 130%;
					background: #333;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translateY(-50%) rotate(-40deg);
				}
				&::after {
					content: "";
					width: clamp(0.9px, 0.3vw, 1.7px);
					height: 130%;
					background: #333;
					position: absolute;
					top: 50%;
					right: 0;
					transform: translateY(-50%) rotate(40deg);
				}
			}
		}/*block_cheers*/
		.block_cart {
			width: 92%;
			letter-spacing: 0;
			margin: 0 auto clamp(13.7px, 4.3vw, 27.3px);
			padding: 0 clamp(4.3px, 1.3vw, 8.5px) clamp(4.3px, 1.3vw, 8.5px);
			background: #c2a284;
			border-radius: clamp(8.5px, 2.7vw, 17.1px);
			.head {
				padding: clamp(13.7px, 4.3vw, 27.3px) 0 clamp(6.8px, 2.1vw, 13.7px);
				background: linear-gradient(to right, #c2a284, #ddcaa8 25%, #fcf3e2 50%, #ddcaa8 75%, #c2a284);
				border-radius: clamp(5.7px, 1.8vw, 11.3px) clamp(5.7px, 1.8vw, 11.3px) 0 0;
				.ribbon_outer {
					font-size: clamp(15.4px, 4.8vw, 30.7px);
					font-weight: 700;
					text-align: center;
					line-height: 1;
					position: relative;
					.ribbon {
						padding: clamp(6.8px, 2.1vw, 13.7px) clamp(20.5px, 6.4vw, 41px);
						background: linear-gradient(to right, #cd9425, #f5ce50 15%, #f1e1a5 50%, #f5ce50 85%, #cd9425);
						clip-path: polygon(0 0, 100% 0, 90% 50%, 100% 100%, 0 100%, 10% 50%);
						display: inline-block;
					}
					.kome {
						font-size: clamp(6.8px, 2.1vw, 13.7px);
						color: #231815;
						position: absolute;
						top: 50%;
						right: 8%;
						transform: translateY(-50%);
					}
				}
				h2 {
					font-size: clamp(23.9px, 7.5vw, 47.8px);
					font-weight: 400;
					.special {
						width: clamp(96px, 30vw, 192px);
						display: inline-block !important;
						vertical-align: text-top;
					}
				}
			}
			.body {
				padding: clamp(27.3px, 8.5vw, 54.6px) 0 0;
				background: #fff;
				border-radius: 0 0 clamp(4.3px, 1.3vw, 8.5px) clamp(4.3px, 1.3vw, 8.5px);
				.block_title {
					padding-top: clamp(23.9px, 7.5vw, 47.8px);
					margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
					position: relative;
					.balloon {
						width: 100%;
						font-weight: 700;
						color: #fff;
						text-align: center;
						line-height: 1;
						position: absolute;
						top: clamp(-13.7px, -2.1vw, -6.8px);
						left: 0;
						span {
							padding: clamp(6.8px, 2.1vw, 13.7px) clamp(10.2px, 3.2vw, 20.5px);
							background: #d2917d;
							border-radius: 50px;
							position: relative;
							&::before {
								content: "";
								width: clamp(6px, 1.9vw, 11.9px);
								height: clamp(6px, 1.9vw, 11.9px);
								background: #d2917d;
								clip-path: polygon(0 0, 50% 100%, 100% 0);
								position: absolute;
								top: calc(100% - clamp(0.9px, 0.3vw, 1.7px));
								left: 50%;
								transform: translateX(-50%);
							}
						}
					}
					.text {
						font-size: clamp(17.1px, 5.3vw, 34.1px);
						font-weight: 700;
						color: #dc7480;
						text-align: center;
						line-height: 1;
						.f_min {
							font-size: clamp(27.3px, 8.5vw, 54.6px);
							font-style: italic;
							margin-right: clamp(1.7px, 0.5vw, 3.4px);
						}
					}
				}
				.block_item {
					padding-bottom: clamp(27.3px, 8.5vw, 54.6px);
					margin: 0 clamp(20.5px, 6.4vw, 41px) clamp(12.8px, 4vw, 25.6px);
					border-bottom: clamp(0.9px, 0.3vw, 1.7px) solid #d2917d;
					display: flex;
					justify-content: start;
					align-items: center;
					gap: clamp(10.2px, 3.2vw, 20.5px);
					.item_box {
						display: flex;
						justify-content: center;
						position: relative;
						&.item {
							img { width: clamp(106.7px, 33.3vw, 213.3px); }
						}
						&.gift {
							img { width: clamp(76.8px, 24vw, 153.6px); }
						}
						div {
							width: 100%;
							img { width: 100%; }
						}
						p {
							width: 200%;
							font-size: clamp(7.7px, 2.4vw, 15.4px);
							text-align: center;
							position: absolute;
							top: 94%;
							left: 50%;
							transform: translateX(-50%);
						}
					}
					.plus {
						width: clamp(27.3px, 8.5vw, 54.6px);
						height: clamp(27.3px, 8.5vw, 54.6px);
						font-size: clamp(20.5px, 6.4vw, 41px);
						color: #fff;
						line-height: 1;
						background: #d2917d;
						border-radius: 50%;
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}
				.block_price {
					margin-bottom: clamp(17.1px, 5.3vw, 34.1px);
					.name {
						font-size: clamp(14.5px, 4.5vw, 29px);
						font-weight: 700;
						margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
						.free {
							font-size: clamp(11.9px, 3.7vw, 23.9px);
							color: #b45560;
							padding: clamp(4.8px, 1.5vw, 9.6px) clamp(6.8px, 2.1vw, 13.7px);
							background: #f8ddde;
							border-radius: 50px;
							margin-left: clamp(3.4px, 1.1vw, 6.8px);
						}
					}
					.box_price {
						display: flex;
						justify-content: center;
						gap: clamp(6.8px, 2.1vw, 13.7px);
						.label {
							font-weight: 700;
							color: #fff;
							text-align: center;
							line-height: 1;
							padding: clamp(3.4px, 1.1vw, 6.8px) clamp(17.1px, 5.3vw, 34.1px) clamp(3.4px, 1.1vw, 6.8px) clamp(6.8px, 2.1vw, 13.7px);
							background: #dc7480;
							clip-path: polygon(85% 0, 100% 50%, 85% 100%, 0 100%, 0 0);
							display: flex;
							align-items: center;
							gap: clamp(1.7px, 0.5vw, 3.4px);
							.value {
								font-size: clamp(27.3px, 8.5vw, 54.6px);
							}
							.per {
								text-align: left;
								display: flex;
								flex-direction: column;
								.upper {
									font-size: clamp(10.2px, 3.2vw, 20.5px);
								}
								.lower {
									font-size: clamp(15.4px, 4.8vw, 30.7px);
								}
							}
						}
						.free {
							width: clamp(42.7px, 13.3vw, 85.3px);
							height: clamp(42.7px, 13.3vw, 85.3px);
							font-size: clamp(13.7px, 4.3vw, 27.3px);
							color: #b45560;
							text-align: center;
							line-height: 1.25;
							padding: clamp(6.8px, 2.1vw, 13.7px);
							background: #f8ddde;
							border-radius: clamp(1.7px, 0.5vw, 3.4px);
							display: flex;
							justify-content: center;
							align-items: center;
						}
						.price {
							color: #dc7480;
							line-height: 1;
							margin-bottom: 0;
							display: flex;
							align-items: end;
							gap: clamp(1.7px, 0.5vw, 3.4px);
							.value {
								font-size: clamp(42.7px, 13.3vw, 85.3px);
								font-weight: 700;
							}
							.yen {
								text-align: center;
								display: flex;
								flex-direction: column;
								.upper {
									font-size: clamp(7.7px, 2.4vw, 15.4px);
								}
								.lower {
									font-size: clamp(25.6px, 8vw, 51.2px);
									font-weight: 600;
									padding-bottom: clamp(3.4px, 1.1vw, 6.8px);
								}
							}
						}
					}
				}
				.block_btn {
					margin: 0 clamp(20.5px, 6.4vw, 41px) clamp(20.5px, 6.4vw, 41px);
					position: relative;
					a {
						display: block;
					}
					.circle {
						width: clamp(76.8px, 24vw, 153.6px);
						height: clamp(76.8px, 24vw, 153.6px);
						color: #553c24;
						text-align: center;
						background: linear-gradient(58deg, #dab766 10%, #f2efc4 48%, #d9b664);
						border-radius: 50%;
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						gap: clamp(3.4px, 1.1vw, 6.8px);
						position: absolute;
						top: 50%;
						left: clamp(-54.6px, -8.5vw, -27.3px);
						transform: translateY(-50%) translateZ(0);
						z-index: 11;
						span {
							line-height: 1.125;
							&.f_min {
								text-align: left;
								padding-left: clamp(3.4px, 1.1vw, 6.8px);
							}
						}
					}
					.btn {
						width: 100%;
						font-size: clamp(17.1px, 5.3vw, 34.1px);
						font-weight: 700;
						color: #fff;
						text-align: center;
						line-height: 1;
						padding: clamp(17.1px, 5.3vw, 34.1px) 0;
						border: clamp(1.7px, 0.5vw, 3.4px) solid #fff;
						border-radius: clamp(8.5px, 2.7vw, 17.1px);
						background: linear-gradient(to bottom, #f5919d, #d54a5a 90%);
						display: block;
						position: relative;
						&::before {
							content: "";
							width: clamp(10.2px, 3.2vw, 20.5px);
							height: clamp(14.5px, 4.5vw, 29px);
							display: inline-block;
							clip-path: polygon(0 10%, 0 0, 100% 50%, 0 100%, 0 90%, 80% 50%);
							background: #fff;
							display: block;
							position: absolute;
							top: 50%;
							right: clamp(13.7px, 4.3vw, 27.3px);
							transform: translateY(-50%);
							z-index: 2;
						}
					}
				}
				.g365 {
					font-size: clamp(11.9px, 3.7vw, 23.9px);
					font-weight: 600;
					color: #dc7480;
					text-align: center;
					line-height: 1;
					margin-bottom: clamp(20.5px, 6.4vw, 41px);
					span {
						padding: clamp(6.8px, 2.1vw, 13.7px) clamp(13.7px, 4.3vw, 27.3px);
						border: clamp(0.9px, 0.3vw, 1.7px) solid #dc7480;
						border-radius: 50px;
					}
				}
				.block_guarantee {
					width: 100%;
					padding: clamp(6.8px, 2.1vw, 13.7px) 0 clamp(20.5px, 6.4vw, 41px);
					background: #f8f5f1;
					border-radius: 0 0 clamp(4.3px, 1.3vw, 8.5px) clamp(4.3px, 1.3vw, 8.5px);
					h3 {
						font-size: clamp(14.5px, 4.5vw, 29px);
						font-weight: 400;
						color: #000;
						text-align: center;
						margin-bottom: clamp(10.2px, 3.2vw, 20.5px);
					}
					.guarantee_outer {
						display: flex;
						flex-direction: column;
						gap: clamp(10.2px, 3.2vw, 20.5px);
						padding: 0 clamp(17.1px, 5.3vw, 34.1px);
						.guarantee_inner {
							width: 100%;
							display: flex;
							background-color: #fff;
							.left {
								width: 20%;
								display: flex;
								justify-content: center;
								align-items: center;
								position: relative;
								.num {
									width: clamp(27.3px, 8.5vw, 54.6px);
									font-size: clamp(16.2px, 5.1vw, 32.4px);
									font-weight: 600;
									font-style: italic;
									color: #966f4a;
									line-height: 1;
									position: absolute;
									top: clamp(-8.2px, -1.3vw, -4.1px);
									left: clamp(-9.6px, -1.5vw, -4.8px);
									opacity: .4;
								}
								img {
									width: clamp(29.9px, 9.3vw, 59.7px);
								}
							}
							.right {
								letter-spacing: clamp(0.5px, 0.1vw, 0.9px);
								flex: 1;
								text-align: left;
								padding: clamp(6.8px, 2.1vw, 13.7px) clamp(6.8px, 2.1vw, 13.7px) clamp(6.8px, 2.1vw, 13.7px) 0;
								.guarantee_title {
									font-size: clamp(11.1px, 3.5vw, 22.2px);
									font-weight: 600;
									color: #966f4a;
									margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
									.border {
										border: clamp(0.9px, 0.3vw, 1.7px) solid #d0bead;
										border-radius: clamp(1.7px, 0.5vw, 3.4px);
										padding: clamp(1.7px, 0.5vw, 3.4px) clamp(3.4px, 1.1vw, 6.8px);
									}
								}
								.guarantee_text {
									font-size: clamp(8.5px, 2.7vw, 17.1px);
									color: #000;
									line-height: 1.5;
								}
							}
						}
					}
				}/*block_guarantee*/
			}
		}/*block_cart*/
		.set {
			font-size: clamp(8.5px, 2.7vw, 17.1px);
			text-align: left;
			margin: 0 4%;
		}
		&.cv_2 {
			margin-top: clamp(-191.1px, -29.9vw, -95.6px);
			.block_spm {
				.single_head {
					top: 20%;
				}
			}
		}
		&.azelaic {	/* アゼライン酸 */
			.block_banner {
				font-size: clamp(18.8px, 5.9vw, 37.5px);
				color: #fff;
				padding: clamp(3.4px, 1.1vw, 6.8px) 0;
				background: #a5aa87;
			}
			.block_spm {
				.single_head {
					top: clamp(13.7px, 4.3vw, 27.3px);
					.subtitle {
						font-size: clamp(13.7px, 4.3vw, 27.3px);
						margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
					}
					h1 { font-size: clamp(23.9px, 7.5vw, 47.8px); }
				}
			}
			.block_cart {
				.body {
					.block_title {
						.balloon {
							span {
								width: 88%;
								display: inline-block;
							}
						}
					}
				}
			}
			&.model {
				.block_banner {
					background: linear-gradient(to right, #989d79 20%, #d2917d);
				}
				.block_title {
					.balloon { font-size: clamp(15.4px, 4.8vw, 30.7px); }
					.text { line-height: 1.5; }
				}
				.block_spm {
					.spm_title {
						-ms-writing-mode: tb-rl;
						writing-mode: vertical-rl;
						position: absolute;
						top: clamp(20.5px, 6.4vw, 41px);
						right: 4%;
						z-index: 5;
						h1 {
							font-size: clamp(30.7px, 9.6vw, 61.4px);
							font-weight: 400;
							font-feature-settings: initial;
							color: #fff;
							text-align: left;
							line-height: 1.25;
							.shadow {
								filter: drop-shadow(0 0 clamp(1.7px, 0.5vw, 3.4px) rgba(5,35,68,0.25)) drop-shadow(0 0 clamp(3.4px, 1.1vw, 6.8px) rgba(5,35,68,0.25));
								transform: translateZ(0);
							}
						}
					}
					.single_head {
						top: clamp(240px, 75vw, 480px);
						z-index: 5;
						&.head2 { top: clamp(-27.3px, -4.3vw, -13.7px); }
						.pococe_1 { width: clamp(53.8px, 16.8vw, 107.5px); }
						.pococe_2 { width: clamp(53.8px, 16.8vw, 107.5px); }
						.pococe_3 { width: clamp(53.8px, 16.8vw, 107.5px); }
					}
					.spm_item {
						width: 100%;
						position: relative;
						transform: translateY(clamp(-95.6px, -14.9vw, -47.8px));
						z-index: 3;
					}
					.spm_model {
						width: clamp(365.3px, 114.1vw, 730.5px);
						position: absolute;
						top: clamp(-68.3px, -10.7vw, -34.1px);
						left: -30%;
						z-index: 2;
						.js-fadeIn {
							transform: scale(0.9);
							&.is-inview { transform: scale(1); }
						}
					}
					.spm_night {
						width: 100%;
						position: relative;
						z-index: 1;
					}
				}
				.block_single {
					margin-top: clamp(-464.2px, -72.5vw, -232.1px);
					z-index: 4;
					.sachi { /* SACHIさんCP */
						margin-top: clamp(20.5px, 6.4vw, 41px);
						.block_cart {
							padding-top: clamp(4.3px, 1.3vw, 8.5px);
							position: relative;
							.icon_sachi {
								width: clamp(100.7px, 31.5vw, 201.4px);
								height: clamp(100.7px, 31.5vw, 201.4px);
								background: linear-gradient(to bottom, #fef1ca, #b28256 20%, #f2e0cd 45%, #d9b28b 72%, #e3c19c 90%, #fffcf4 100%);
								clip-path: circle(50% at 50% 50%);
								position: absolute;
								top: calc(clamp(-201.4px, -31.5vw, -100.7px) / 1.75);
								left: 50%;
								transform: translateX(-50%);
								z-index: 2;
								.sachi_photo {
									width: clamp(93.9px, 29.3vw, 187.7px);
									height: clamp(93.9px, 29.3vw, 187.7px);
									clip-path: circle(50% at 50% 50%);
									position: absolute;
									top: 50%;
									left: 50%;
									transform: translate(-50%, -50%);
								}
							}
							.head {
								padding-top: clamp(47.8px, 14.9vw, 95.6px);
								padding-bottom: clamp(20.5px, 6.4vw, 41px);
								background: url("../../../img/sp/sleepingmaskcp/_20250705/cart_head_sachi.webp") center top / cover no-repeat;
								h2 {
									font-size: clamp(17.1px, 5.3vw, 34.1px);
									color: #fff;
									filter: drop-shadow(0 0 clamp(1.7px, 0.5vw, 3.4px) #e84154) drop-shadow(0 0 clamp(2.6px, 0.8vw, 5.1px) #e84154) drop-shadow(0 0 clamp(3.4px, 1.1vw, 6.8px) #e84154);
									transform: translateZ(0);
								}
								.head_text {
									font-size: clamp(20.5px, 6.4vw, 41px);
									font-weight: 700;
									color: #fff;
									filter: drop-shadow(0 0 clamp(1.7px, 0.5vw, 3.4px) rgba(228,31,144,1)) drop-shadow(0 0 clamp(1.7px, 0.5vw, 3.4px) rgba(228,31,144,1)) drop-shadow(0 0 clamp(3.4px, 1.1vw, 6.8px) rgba(228,31,144,1));
									transform: translateZ(0);
								}
								.head_balloon {
									width: clamp(99px, 30.9vw, 198px);
									position: absolute;
									top: clamp(13.7px, 4.3vw, 27.3px);
									left: clamp(-13.7px, -2.1vw, -6.8px);
									z-index: 2;
									filter: drop-shadow(0 0 clamp(1.7px, 0.5vw, 3.4px) rgba(228,31,144,1)) drop-shadow(0 0 clamp(1.7px, 0.5vw, 3.4px) rgba(228,31,144,1)) drop-shadow(0 0 clamp(3.4px, 1.1vw, 6.8px) rgba(228,31,144,1));
									transform: translateZ(0);
								}
							}
							.body {
								padding-top: clamp(20.5px, 6.4vw, 41px);
								position: relative;
								.block_ribbon {
									width: 100%;
									font-size: clamp(17.1px, 5.3vw, 34.1px);
									font-weight: 700;
									text-align: center;
									line-height: 1;
									position: absolute;
									top: clamp(-27.3px, -4.3vw, -13.7px);
									left: 0;
									z-index: 3;
									.ribbon_text {
										color: #d32f81;
										padding: clamp(4.8px, 1.5vw, 9.6px) clamp(20.5px, 6.4vw, 41px);
										background: linear-gradient(to right, #dfb98f, #fdf8f1 50%, #dfb98f 100%);
										clip-path: polygon(0 0, 100% 0, 94% 50%, 100% 100%, 0 100%, 6% 50%);
										display: inline-block;
									}
								}
								.block_cheers {
									margin-top: 0;
									.cheers_text {
										font-size: clamp(20.5px, 6.4vw, 41px);
										color: #a07b65;
										padding: 0 clamp(13.7px, 4.3vw, 27.3px);
										&::before {
											height: 100%;
											background: #a07b65;
										}
										&::after {
											height: 100%;
											background: #a07b65;
										}
									}
								}
								.block_item {
									justify-content: center;
									padding-bottom: 0;
									margin-bottom: 0;
									.box_inner {
										width: clamp(122.9px, 38.4vw, 245.8px);
										position: relative;
										img {
											width: 100%;
											position: relative;
											z-index: 2;
										}
										.circle_discount {
											font-size: clamp(22.2px, 6.9vw, 44.4px);
											background: linear-gradient(to bottom, #feefb9, #fdf8f1 50%, #feefb9 100%); 
											-webkit-background-clip: text;
											-webkit-text-fill-color: transparent;
											line-height: 1;
											position: absolute;
											top: clamp(27.3px, 8.5vw, 54.6px);
											right: 0;
											&::before {
												content: "";
												width: clamp(96.5px, 30.1vw, 192.9px);
												height: clamp(96.5px, 30.1vw, 192.9px);
												background: #e34091;
												clip-path: circle(50% at 50% 50%);
												position: absolute;
												top: 50%;
												left: 50%;
												transform: translate(-50%, -50%);
												z-index: -1;
											}
										}
										.kome {
											width: 100%;
											text-align: right;
											position: absolute;
											top: 68%;
											right: clamp(-13.7px, -2.1vw, -6.8px);
										}
									}
								}
								.block_price {
									margin-top: clamp(-54.6px, -8.5vw, -27.3px);
									margin-bottom: clamp(10.2px, 3.2vw, 20.5px);
									.price_regular {
										font-size: clamp(12.8px, 4vw, 25.6px);
										.through {
											position: relative;
											&::after {
												content: "";
												width: 100%;
												height: 100%;
												background: #d85060;
												clip-path: polygon(calc(100% - clamp(-1.7px, -0.3vw, -0.9px)) 0, 100% clamp(-1.7px, -0.3vw, -0.9px), clamp(-1.7px, -0.3vw, -0.9px) 100%, 0 calc(100% - clamp(-1.7px, -0.3vw, -0.9px)));
												position: absolute;
												top: 0;
												left: 0;
											}
										}
									}
								}
							}
						}
					}
					h2 {
						font-size: clamp(22.2px, 6.9vw, 44.4px);
						font-weight: 700;
					}
				}
				.block_item {
					border-bottom: none;
					padding-bottom: clamp(13.7px, 4.3vw, 27.3px);
				}
			}/* &.model */
		}/* &.azelaic */
	}
}


/* --------------------------------------------------------------------------------
 #Concept
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Concept {
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		background: #fff;
		.head {
			margin-bottom: 5%;
			.label {
				font-size: clamp(10.2px, 3.2vw, 20.5px);
				font-family: Times, serif;
				text-align: center;
				margin-bottom: clamp(27.3px, 8.5vw, 54.6px);
				span {
					position: relative;
					&::after {
						content: "";
						width: clamp(75px, 23.4vw, 150px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						bottom: clamp(-34.1px, -5.3vw, -17.1px);
						left: 50%;
						transform: translateX(-50%);
					}
				}
			}
			h2 {
				font-size: clamp(34.1px, 10.7vw, 68.3px);
			}
		}
		.model {
			width: 93.334%;
			margin: 0 0 8% auto;
			position: relative;
			z-index: 2;
		}
		.block_concept {
			position: relative;
			&::before {
				content: "";
				width: 100%;
				height: 122%;
				background: #ced1bd;
				position: absolute;
				top: -38%;
				left: 0;
				z-index: 1;
			}
			h3 {
				font-size: clamp(29px, 9.1vw, 58px);
				line-height: 1.35;
				padding-left: 6.67%;
				margin-bottom: 6%;
				position: relative;
				z-index: 2;
			}
			.text_concept {
				font-size: clamp(13.7px, 4.3vw, 27.3px);
				line-height: 1.65;
				padding-left: 6.67%;
				margin-bottom: clamp(34.1px, 10.7vw, 68.3px);
				position: relative;
				z-index: 2;
			}
			.photo_1 {
				width: clamp(111px, 34.7vw, 221.9px);
				position: relative;
				z-index: 2;
			}
			.photo_2 {
				width: clamp(170.7px, 53.3vw, 341.3px);
				position: absolute;
				bottom: 3.5%;
				right: 6.67%;
				z-index: 2;
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Pococe
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Pococe {
		text-align: center;
		padding-bottom: 15%;
		margin-bottom: 14%;
		position: relative;
		&::before {
			content: "";
			width: 92%;
			height: 100%;
			border: 1px solid #afac8e;
			position: absolute;
			top: .75%;
			left: 50%;
			transform: translateX(-50%);
		}
		&::after {
			content: "";
			width: calc(92% - clamp(13.7px, 4.3vw, 27.3px));
			height: calc(100% - clamp(13.7px, 4.3vw, 27.3px));
			border: clamp(0.9px, 0.3vw, 1.7px) solid #afac8e;
			position: absolute;
			top: calc(.75% + clamp(6.8px, 2.1vw, 13.7px));
			left: 50%;
			transform: translateX(-50%);
		}
		.body {
			position: relative;
			z-index: 2;
			.label {
				font-size: clamp(11.9px, 3.7vw, 23.9px);
				font-family: Times, serif;
				margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
				span {
					padding: clamp(3.4px, 1.1vw, 6.8px) clamp(20.5px, 6.4vw, 41px);
					background: #afac8e;
				}
			}
			.subtitle {
				font-size: clamp(15.4px, 4.8vw, 30.7px);
				font-weight: 700;
				color: #87824b;
				padding-bottom: 3%;
				margin-bottom: 3%;
				position: relative;
				&::after {
					content: "";
					width: 78.4%;
					height: clamp(0.9px, 0.3vw, 1.7px);
					background: #afac8e;
					position: absolute;
					bottom: 0;
					left: 50%;
					transform: translateX(-50%);
				}
			}
			h2 {
				font-size: clamp(25.6px, 8vw, 51.2px);
				line-height: 1.35;
				.god {
					font-size: clamp(29.9px, 9.3vw, 59.7px);
				}
			}
			.block_badge {
				width: calc(90% - clamp(27.3px, 8.5vw, 54.6px));
				display: flex;
				justify-content: center;
				align-items: center;
				gap: clamp(20.5px, 6.4vw, 41px);
				margin: 0 auto 5%;
				div {
					flex: 1;
					position: relative;
					&.pococe1 { flex: 1.125; }
					img {
						width: 100%;
						margin: auto;
					}
				}
			}
			.text {
				font-size: clamp(11.9px, 3.7vw, 23.9px);
				font-weight: 700;
				line-height: 1.8;
				margin-bottom: 5%
			}
			.block_magazine {
				width: 100%;
				position: relative;
				.cover {
					width: 54.53%;
					position: relative;
					z-index: 2;
				}
				.inside {
					width: 47.1%;
					position: absolute;
					top: 22%;
					right: 0;
					z-index: 1;
				}
				.annotation_cover {
					position: absolute;
					top: 0;
					left: 60%;
					p {
						font-size: clamp(8.5px, 2.7vw, 17.1px);
						text-align: left;
						position: relative;
						&::before {
							content: "";
							width: clamp(5px, 1.6vw, 10px);
							height: clamp(7px, 2.2vw, 14px);
							background: #000;
							clip-path: polygon(100% 0, 0 50%, 100% 100%);
							position: absolute;
							top: 14%;
							left: -10%;
						}
					}
				}
				.annotation_inside {
					position: absolute;
					top: 15%;
					right: 10%;
					p {
						font-size: clamp(8.5px, 2.7vw, 17.1px);
						text-align: left;
						position: relative;
						&::before {
							content: "";
							width: clamp(7px, 2.2vw, 14px);
							height: clamp(5px, 1.6vw, 10px);
							background: #000;
							clip-path: polygon(0 0, 50% 100%, 100% 0);
							position: absolute;
							top: 50%;
							left: -20%;
							transform: translateY(-50%);
						}
					}
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Voice
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Voice {
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		background: #fff;
		.head {
			margin-bottom: 5%;
			.label {
				font-size: clamp(10.2px, 3.2vw, 20.5px);
				font-family: Times, serif;
				text-align: center;
				margin-bottom: clamp(20.5px, 6.4vw, 41px);
				span {
					position: relative;
					&::after {
						content: "";
						width: clamp(75px, 23.4vw, 150px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						bottom: clamp(-34.1px, -5.3vw, -17.1px);
						left: 50%;
						transform: translateX(-50%);
					}
				}
			}
			h2 {
				font-size: clamp(30.7px, 9.6vw, 61.4px);
				line-height: 1.25;
				.subtitle {
					font-size: clamp(13.7px, 4.3vw, 27.3px);
					font-weight: 700;
				}
			}
		}
		.block_balloon {
			margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
			p {
				font-size: clamp(14.5px, 4.5vw, 29px);
				margin-bottom: 6%;
				padding: 2.5% 5%;
				background: #ffeef1;
				display: inline-block;
				position: relative;
				&::before {
					content: "";
					width: .78125em;
					height: .9375em;
					background: #ffeef1;
					position: absolute;
					bottom: -0.9em;
				}
				&.balloon_1 {
					margin-left: 8.93%;
					&::before {
						clip-path: polygon(0 0, 100% 100%, 75% 0);
						left: 10%;
					}
				}
				&.balloon_2 {
					margin-left: 24%;
					&::before {
						clip-path: polygon(25% 0, 0 100%, 100% 0);
						right: 10%;
					}
				}
				&.balloon_3 {
					margin-left: 4.93%;
					&::before {
						clip-path: polygon(0 0, 100% 100%, 75% 0);
						left: 10%;
					}
				}
			}
		}
		.cheers {
			font-size: clamp(17.1px, 5.3vw, 34.1px);
			font-weight: 700;
			text-align: center;
			margin-bottom: 2%;
			span {
				padding: 0 4%;
				position: relative;
				&::before {
					content: "";
					width: clamp(0.9px, 0.3vw, 1.7px);
					height: 120%;
					background: #000;
					position: absolute;
					top: 50%;
					left: 0;
					transform: translateY(-50%) rotate(-40deg);
				}
				&::after {
					content: "";
					width: clamp(0.9px, 0.3vw, 1.7px);
					height: 120%;
					background: #000;
					position: absolute;
					top: 50%;
					right: 0;
					transform: translateY(-50%) rotate(40deg);
				}
			}
		}
		.block_slider {
			padding: clamp(16.2px, 5.1vw, 32.4px) 0 clamp(32.4px, 10.1vw, 64.9px);
			background: #d2917d;
			h3 {
				font-size: clamp(17.1px, 5.3vw, 34.1px);
				font-weight: 700;
				color: #fff;
				text-align: center;
				margin-bottom: 4%;
			}
			.slider {
				padding-bottom: 5%;
				li {
					margin: 0 .25%;
				}
				.slick-dots {
					li button:before {
						color: #fff;
						opacity: 1;
					}
					li.slick-active button:before {
						color: #000;
						opacity: 1;
					}
				} 
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Recommend
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Recommend {
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		.head {
			margin-bottom: 5%;
			.label {
				font-size: clamp(10.2px, 3.2vw, 20.5px);
				font-family: Times, serif;
				text-align: center;
				margin-bottom: clamp(20.5px, 6.4vw, 41px);
				span {
					position: relative;
					&::after {
						content: "";
						width: clamp(75px, 23.4vw, 150px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						bottom: clamp(-34.1px, -5.3vw, -17.1px);
						left: 50%;
						transform: translateX(-50%);
					}
				}
			}
			h2 {
				font-size: clamp(30.7px, 9.6vw, 61.4px);
			}
		}
		.block_list {
			position: relative;
			ul {
				width: 94%;
				font-size: clamp(14.5px, 4.5vw, 29px);
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				li {
					line-height: 1.8;
					margin-bottom: 5%;
					padding-left: clamp(20.5px, 6.4vw, 41px);
					position: relative;
					&:last-child {
						margin-bottom: 0;
					}
					&::before {
						content: "";
						width: clamp(12.8px, 4vw, 25.6px);
						height: clamp(12.8px, 4vw, 25.6px);
						background: #fff;
						border: clamp(0.9px, 0.3vw, 1.7px) solid #000;
						position: absolute;
						top: .35em;
						left: 0;
					}
					&::after {
						content: "";
						width: clamp(14.4px, 4.5vw, 28.7px);
						height: clamp(14.4px, 4.5vw, 28.7px);
						background: #000;
						clip-path: polygon(35% 82%, 94% 6%, 100% 16%, 35% 100%, 0 55%, 7% 46%);
						position: absolute;
						top: clamp(1.3px, 0.4vw, 2.6px);
						left: clamp(2.1px, 0.6vw, 4.1px);
					}
				}
			}
		}
		&.azelaic {
			.block_list {
				li {
					line-height: 1.25;
					margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
					}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Attraction
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Attraction {
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		.block_intro {
			position: relative;
			.intro_head {
				width: 100%;
				position: absolute;
				top: clamp(37.6px, 11.7vw, 75.1px);
				left: 0;
				.label {
					font-size: clamp(10.2px, 3.2vw, 20.5px);
					font-family: Times, serif;
					color: #fff;
					text-align: center;
					line-height: 1;
					margin-bottom: clamp(41px, 12.8vw, 81.9px);
					span {
						position: relative;
						&::after {
							content: "";
							width: clamp(75px, 23.4vw, 150px);
							height: clamp(0.9px, 0.3vw, 1.7px);
							background: #fff;
							position: absolute;
							top: calc(100% + clamp(19.1px, 6vw, 38.2px));
							left: 50%;
							transform: translateX(-50%);
						}
					}
				}
				h2 {
					font-size: clamp(30.7px, 9.6vw, 61.4px);
					color: #fff;
					line-height: 1;
				}
			}
			.intro_body {
				width: 100%;
				position: absolute;
				top: clamp(163.9px, 51.2vw, 327.7px);
				left: 0;
				.cheers_intro {
					font-size: clamp(13.7px, 4.3vw, 27.3px);
					font-weight: 700;
					color: #fff;
					text-align: center;
					margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
					span {
						padding: 0 4%;
						position: relative;
						&::before {
							content: "";
							width: clamp(0.9px, 0.3vw, 1.7px);
							height: 120%;
							background: #fff;
							position: absolute;
							top: 50%;
							left: 0;
							transform: translateY(-50%) rotate(-40deg);
						}
						&::after {
							content: "";
							width: clamp(0.9px, 0.3vw, 1.7px);
							height: 120%;
							background: #fff;
							position: absolute;
							top: 50%;
							right: 0;
							transform: translateY(-50%) rotate(40deg);
						}
					}
				}
				.charm_box {
					display: flex;
					justify-content: center;
					align-items: center;
					gap: clamp(13.7px, 4.3vw, 27.3px);
					.left {
						width: clamp(53.8px, 16.8vw, 107.5px);
						img {
							margin: 0 0 0 auto;
						}
					}
					.right {
						text-align: left;
						.cica {
							font-size: clamp(12.8px, 4vw, 25.6px);
							font-weight: 700;
							color: #fff;
							margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
						}
						.charm {
							font-size: clamp(29.9px, 9.3vw, 59.7px);
							font-weight: 700;
							color: #f7c6c8;
							line-height: 1;
						}
					}
				}
			}
			.intro_item {
				width: clamp(182.6px, 57.1vw, 365.2px);
				position: absolute;
				bottom: clamp(-88.7px, -13.9vw, -44.4px);
				left: 19%;
				z-index: 3;
			}
			.kome {
				width: 32%;
				position: absolute;
				bottom: 5%;
				right: 4%
			}
		}/*block_intro*/
		.kome_intro {
			text-align: right;
			margin: clamp(13.7px, 4.3vw, 27.3px) 0;
			span {
				text-align: left;
				display: inline-block;
			}
		}
		.block_attraction {
			margin-bottom: clamp(27.3px, 8.5vw, 54.6px);
			.vline {
				width: 100%;
				height: clamp(34.1px, 10.7vw, 68.3px);
				margin-bottom: clamp(27.3px, 8.5vw, 54.6px);
				position: relative;
				&::before {
					content: "";
					width: clamp(0.9px, 0.3vw, 1.7px);
					height: 100%;
					margin: auto;
					background-color: #000;
					position: relative;
					display: block;
				}
			}
			.attraction_head {
				text-align: center;
				margin-bottom: 5%;
				position: relative;
				.subtitle {
					font-size: clamp(11.9px, 3.7vw, 23.9px);
					font-weight: 700;
					position: relative;
					z-index: 2;
				}
				h2 {
					font-size: clamp(22.2px, 6.9vw, 44.4px);
					font-weight: 700;
					position: relative;
					z-index: 2;
				}
				.kome {
					position: absolute;
					bottom: -20%;
					right: 4%;
				}
				.num {
					height: clamp(64px, 20vw, 128px);
					position: absolute;
					top: 50%;
					left: 4%;
					transform: translateY(-50%);
					z-index: 1;
				}
			}
			&.block_1 {
				.attraction_head {
					h2 {
						.c_off { color: #c58270; }
						.c_def { color: #687760; }
					}
					img {
						width: clamp(29px, 9.1vw, 58px);
					}
				}
				.text_box {
					padding: 6.67%;
					margin-right: 6.67%;
					background: #ced1bd;
					transform: translateY(-22%);
					position: relative;
					p {
						font-size: clamp(10.2px, 3.2vw, 20.5px);
						line-height: 1.8;
					}
					.qusome {
						width: clamp(147px, 45.9vw, 294px);
						height: clamp(176px, 55vw, 352px);
						position: absolute;
						top: -48%;
						right: -2%;
					}
				}
				.column_box {
					width: 92%;
					margin: 0 auto clamp(13.7px, 4.3vw, 27.3px);
					border: clamp(0.9px, 0.3vw, 1.7px) solid #d2917d;
					.column_head {
						padding: clamp(17.1px, 5.3vw, 34.1px) 0 clamp(8.5px, 2.7vw, 17.1px);
						border-bottom: clamp(0.9px, 0.3vw, 1.7px) solid #d2917d;
						position: relative;
						.column_label {
							width: 100%;
							text-align: center;
							position: absolute;
							top: -15%;
							left: 0;
							span {
								font-size: clamp(11.9px, 3.7vw, 23.9px);
								color: #fff;
								padding: clamp(6.8px, 2.1vw, 13.7px) clamp(10.2px, 3.2vw, 20.5px);
								background: #d2917d;
							}
						}
						.column_cheers {
							font-size: clamp(11.9px, 3.7vw, 23.9px);
							font-weight: 700;
							color: #000;
							text-align: center;
							span {
								padding:  0 clamp(10.2px, 3.2vw, 20.5px);
								position: relative;
								&::before {
									content: "";
									width: clamp(0.9px, 0.3vw, 1.7px);
									height: 120%;
									background: #000;
									position: absolute;
									top: 50%;
									left: 0;
									transform: translateY(-50%) rotate(-40deg);
								}
								&::after {
									content: "";
									width: clamp(0.9px, 0.3vw, 1.7px);
									height: 120%;
									background: #000;
									position: absolute;
									top: 50%;
									right: 0;
									transform: translateY(-50%) rotate(40deg);
								}
							}
						}
						h3 {
							font-size: clamp(15.4px, 4.8vw, 30.7px);
							font-weight: 700;
							text-align: center;
							line-height: 1;
						}
					}/*column_head*/
					.column_body {
						padding: clamp(17.1px, 5.3vw, 34.1px);
						.title {
							display: flex;
							justify-content: space-between;
							margin-bottom: clamp(17.1px, 5.3vw, 34.1px);
							.left{
								flex: 1;
								h4 {
									font-size: clamp(16.2px, 5.1vw, 32.4px);
									font-weight: 700;
									line-height: 1.5;
									margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
								}
								.name {
									font-size: clamp(10.2px, 3.2vw, 20.5px);
								}
							}
							.right {
								width: 26%;
							}
						}
						.readmore_outer {
							position: relative;
							.readmore_inner {
								position: relative;
								height: 18vw;
								max-height: 125px;
								transition: all .4s;
								overflow: hidden;
								&::before {
									content: "";
									width: 100%;
									height: 23vw;
									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: 2;
									transition: all .4s;
								}
								&.is-open {
									max-height: initial;
									&::before{
										display: none;
									}
								}
								p {
									font-size: clamp(11.9px, 3.7vw, 23.9px);
								}
							}
							.readmore_btn {
								width: 62.3%;
								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: clamp(11.1px, 3.5vw, 22.2px);
									font-weight: 700;
									text-align: center;
									padding: clamp(8.2px, 2.6vw, 16.4px) 0;
									background: #ced1bd;
									position: relative;
									&::after {
										content: "";
										width: clamp(12.3px, 3.8vw, 24.6px);
										height: clamp(8.2px, 2.6vw, 16.4px);
										clip-path: polygon(10% 0, 50% 80%, 90% 0, 100% 0, 50% 100%, 0 0);
										background: #000;
										position: absolute;
										top: 50%;
										right: 6%;
										transform: translateY(-50%);
									}
								}
							  }
						}
					}
				}/*column_box*/
			}/*block_1*/
			&.block_2 {
				.attraction_head {
					img {
						width: clamp(46.4px, 14.5vw, 92.8px);
					}
				}
				.attraction_body {
					.trouble_outer {
						margin-top: -28%;
						padding: 0 4%;
						.trouble_cheers {
							font-size: clamp(25.6px, 8vw, 51.2px);
							font-weight: 700;
							color: #fff;
							text-align: center;
							span {
								padding: 0 8%;
								position: relative;
								&::before {
									content: "";
									width: clamp(0.9px, 0.3vw, 1.7px);
									height: 120%;
									background: #fff;
									position: absolute;
									top: 50%;
									left: 0;
									transform: translateY(-50%) rotate(-40deg);
								}
								&::after {
									content: "";
									width: clamp(0.9px, 0.3vw, 1.7px);
									height: 120%;
									background: #fff;
									position: absolute;
									top: 50%;
									right: 0;
									transform: translateY(-50%) rotate(40deg);
								}
							}
						}
						.trouble_inner {
							width: 100%;
							text-align: center;
							padding: 5% 4%;
							margin: 0 auto 5%;
							background: linear-gradient(-45deg, #e9dad0 15%, #dacdd6 50%, #dcc9cf 70%, #c9becf 85%, #abafce);
							position: relative;
							overflow: hidden;
							&::before {
								content: "";
								width: 92vw;
								height: 92vw;
								background-image: radial-gradient(circle,rgba(255,255,255,1),transparent 70%);
								display: block;
								position: absolute;
								top: -15%;
								left: 50%;
								transform: translateX(-50%);
								z-index: 1;
							}
							h3 {
								font-size: clamp(15.4px, 4.8vw, 30.7px);
								font-weight: 700;
								margin-bottom: 4%;
								position: relative;
								z-index: 2;
							}
							.trouble_box {
								margin-bottom: 8%;
								position: relative;
								z-index: 2;
								.trouble_head {
									width: 71%;
									font-size: clamp(17.1px, 5.3vw, 34.1px);
									font-weight: 700;
									text-align: center;
									margin: 0 auto clamp(-41px, -6.4vw, -20.5px);
									padding: clamp(5.5px, 1.7vw, 10.9px) 0;
									border: 1px solid #fff;
									border-radius: clamp(3.4px, 1.1vw, 6.8px);
									position: relative;
									z-index: 2;
								}
								.trouble_body {
									background: #fff;
									border-radius: clamp(5.5px, 1.7vw, 10.9px);
									padding: clamp(31.4px, 9.8vw, 62.8px) 0 clamp(16.4px, 5.1vw, 32.8px);
									.text {
										font-size: clamp(11.1px, 3.5vw, 22.2px);
										margin-bottom: clamp(10.9px, 3.4vw, 21.8px);
										&.glow {
											filter: drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1));
											transform: translateZ(0);
											@media (min-width: 750px) {
												filter: drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1));
											}
										}
									}
									.ingredient {
										font-size: clamp(10.2px, 3.2vw, 20.5px);
										font-weight: 700;
										color: #fff;
										line-height: 1;
										span {
											padding: clamp(4.1px, 1.3vw, 8.2px) clamp(13.7px, 4.3vw, 27.3px);
										}
									}
								}
								&.trouble_damage {
									.trouble_head {
										background: #ebefe8;
										border-color: #687760;
									}
									.trouble_body {
										background: url("../../../img/sp/sleepingmaskcp/_20250705/attraction_2_damege.jpg") #fff left top / contain no-repeat;
										.ingredient span { background: #687760; }
									}
								}
								&.trouble_lift {
									.trouble_head {
										background: #f1ece3;
										border-color: #ac9d7e;
									}
									.trouble_body {
										background: url("../../../img/sp/sleepingmaskcp/_20250705/attraction_2_lift.jpg") #fff right top / contain no-repeat;
										.ingredient span { background: #ac9d7e; }
									}
								}
								&.trouble_line {
									.trouble_head {
										background: #f6efed;
										border-color: #d39587;
									}
									.trouble_body {
										background: url("../../../img/sp/sleepingmaskcp/_20250705/attraction_2_line.jpg") #fff left top / contain no-repeat;
										.ingredient span { background: #d39587; }
									}
								}
								&.trouble_swelling {
									.trouble_head {
										background: #fef2f4;
										border-color: #bf8790;
									}
									.trouble_body {
										background: url("../../../img/sp/sleepingmaskcp/_20250705/attraction_2_swelling.jpg") #fff right top / contain no-repeat;
										.ingredient span { background: #bf8790; }
									}
								}
								&.trouble_dry {
									.trouble_head {
										background: #ecf0f5;
										border-color: #697f9b;
									}
									.trouble_body {
										background: url("../../../img/sp/sleepingmaskcp/_20250705/attraction_2_dry.jpg") #fff left top / contain no-repeat;
										.ingredient span { background: #697f9b; }
									}
								}
							}/*trouble_box*/
							.message {
								font-size: clamp(17.9px, 5.6vw, 35.8px);
								font-weight: 700;
							}
						}/*inner_trouble*/
					}
				}
			}/*block_2*/
			&.block_3 {
				.attraction_head {
					margin-bottom: clamp(32.4px, 10.1vw, 64.9px);
					img {
						width: clamp(42.7px, 13.3vw, 85.3px);
					}
				}
				.attraction_body {
					.spatula_box {
						position: relative;
						.title_spatula {
							width: calc(100% - 6.67%);
							font-size: clamp(22.2px, 6.9vw, 44.4px);
							font-weight: 700;
							color: #fff;
							text-align: center;
							background: #c58270;
							position: absolute;
							top: -4%;
							left: 0;
						}
						.item_spatula {
							width: clamp(338.5px, 105.8vw, 677px);
							height: clamp(433.5px, 135.5vw, 867px);
							position: absolute;
							top: 20%;
							left: 10%;
							z-index: 3;
							&.shadow {
								filter: drop-shadow(0 10px 10px rgba(97,49,10,.5)) drop-shadow(0 20px 20px rgba(97,49,10,.5)) drop-shadow(0 20px 20px rgba(97,49,10,.25));
								transform: translateZ(0);
								z-index: 10;
								@media (min-width: 750px) {
									filter: drop-shadow(0 20px 20px rgba(97,49,10,.5)) drop-shadow(0 40px 40px rgba(97,49,10,.5)) drop-shadow(0 40px 40px rgba(97,49,10,.25));
								}
							}
						}
						.balloon {
							padding: clamp(11.1px, 3.5vw, 22.2px) clamp(11.1px, 3.5vw, 22.2px) clamp(11.1px, 3.5vw, 22.2px) clamp(29px, 9.1vw, 58px);
							background: #fff;
							position: absolute;
							z-index: 2;
							p {
								font-size: clamp(13.7px, 4.3vw, 27.3px);
								text-align: left;
								letter-spacing: 0;
								position: relative;
								&::before {
									position: absolute;
									top: 0;
								}
							}
							&.balloon_1 {
								top: 14%;
								right: 4.5%;
								p::before {
									content: "❶";
									left: -11%;
								}
							}
							&.balloon_2 {
								top: 38%;
								right: 0;
								p::before {
									content: "❷";
									left: -15%;
								}
							}
							&.balloon_3 {
								background: rgba(255,255,255,.85);
								top: 62%;
								left: 0;
								p::before {
									content: "❸";
									left: -12%;
								}
							}
						}
					}/*spatula_box*/
					video {
						width: 82%;
						margin: clamp(-128px, -20vw, -64px) auto clamp(16.2px, 5.1vw, 32.4px);
						display: block;
						position: relative;
						z-index: 3;
					}
					.text {
						font-size: clamp(10.2px, 3.2vw, 20.5px);
						padding: 0 4%;
					}
				}
			}/*block_3*/
			&.block_end {
				.end_head {
					.end_cheers {
						font-size: clamp(17.1px, 5.3vw, 34.1px);
						font-weight: 700;
						color: #000;
						text-align: center;
						margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
						span {
							padding: 0 6%;
							position: relative;
							&::before {
								content: "";
								width: clamp(0.9px, 0.3vw, 1.7px);
								height: 120%;
								background: #000;
								position: absolute;
								top: 50%;
								left: 0;
								transform: translateY(-50%) rotate(-40deg);
							}
							&::after {
								content: "";
								width: clamp(0.9px, 0.3vw, 1.7px);
								height: 120%;
								background: #000;
								position: absolute;
								top: 50%;
								right: 0;
								transform: translateY(-50%) rotate(40deg);
							}
						}
					}
					.subtitle {
						font-size: clamp(13.7px, 4.3vw, 27.3px);
						font-weight: 700;
						color: #dc7480;
						text-align: center;
						margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
					}
					h2 {
						font-size: clamp(27.3px, 8.5vw, 54.6px);
						line-height: 1.35;
						margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
					}
				}
				.end_body {
					padding: clamp(38.4px, 12vw, 76.8px) 0;
					background: #f7c6c8;
					.model_box {
						margin-bottom: clamp(25.6px, 8vw, 51.2px);
						padding: 0 5%;
						position: relative;
						.model_after {
							width: clamp(195.9px, 61.2vw, 391.7px);
							height: clamp(195.9px, 61.2vw, 391.7px);
							border: clamp(4.1px, 1.3vw, 8.2px) solid #ce777a;
							border-radius: 50%;
							position: absolute;
							top: -74%;
							right: 2%;
						}
						.arrow {
							width: clamp(56.8px, 17.7vw, 113.5px);
							height: clamp(23.9px, 7.5vw, 47.8px);
							position: absolute;
							top: 90%;
							left: 32%;
						}
						.model_before {
							width: clamp(111.8px, 34.9vw, 223.6px);
							height: clamp(111.8px, 34.9vw, 223.6px);
							border-radius: 50%;
						}
					}
					.ba_box {
						width: 100%;
						display: flex;
						gap: 6%;
						padding: 0 6.67%;
						.ba_inner {
							flex: 1;
							display: flex;
							flex-direction: column;
							gap: clamp(6.8px, 2.1vw, 13.7px);
							.ba_title {
								font-size: clamp(11.9px, 3.7vw, 23.9px);
								font-family: Times,serif;
								color: #fff;
								text-align: center;
							}
							&.before {
								.ba_title { background: #a09f96; }
							}
							&.after {
								.ba_title { background: #ce777a; }
							}
							.photo {
								position: relative;
								.balloon_outer {
									width: clamp(61px, 19.1vw, 122px);
									height: clamp(61px, 19.1vw, 122px);
									position: absolute;
									top: 50%;
									left: -8%;
									transform: translateY(-50%);
									.balloon_inner {
										width: 100%;
										height: 100%;
										position: relative;
										p {
											width: 100%;
											font-size: clamp(11.9px, 3.7vw, 23.9px);
											text-align: left;
											line-height: 1.25;
											position: absolute;
											top: 50%;
											left: 12%;
											transform: translateY(-50%) rotate(-15deg);
											z-index: 2;
										}
										.balloon {
											width: 100%;
											height: 100%;
											background: #fff;
											border-radius: 50%;
											display: block;
											position: relative;
											transform: rotate(-60deg);
											opacity: .8;
											&::after {
												content: "";
												width: clamp(13.7px, 4.3vw, 27.3px);
												height: clamp(10.9px, 3.4vw, 21.8px);
												background: #fff;
												clip-path: polygon(0 0, 50% 100%, 100% 0);
												position: absolute;
												bottom: clamp(-20.5px, -3.2vw, -10.2px);
												left: 50%;
												transform: translateX(-50%);
											}
										}
									}
								}
							}
						}
					}
				}
			}
		}
		&.azelaic {
			.block_1 {
				.attraction_body {
					padding-bottom: clamp(13.7px, 4.3vw, 27.3px);
					background: #f4f4f4;
					position: relative;
					.block1_contents {
						position: relative;
						.block1_title {
							color: #fff;
							margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
							position: relative;
							z-index: 3;
							.title_inner {
								padding: clamp(12.8px, 4vw, 25.6px);
								display: inline-block;
								p {
									font-size: clamp(11.9px, 3.7vw, 23.9px);
									font-weight: 700;
									margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
								}
								h3 {
									font-size: clamp(22.2px, 6.9vw, 44.4px);
									line-height: 1;
								}
							}
						}
						.block1_detail {
							position: relative;
							z-index: 3;
							h4 {
								font-size: clamp(15.4px, 4.8vw, 30.7px);
								margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
							}
							ul {
								margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
								list-style: none;
								li {
									font-size: clamp(10.2px, 3.2vw, 20.5px);
									padding-left: clamp(13.7px, 4.3vw, 27.3px);
									margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
									position: relative;
									&::before {
										content: "●";
										font-size: clamp(10.2px, 3.2vw, 20.5px);
										position: absolute;
										top: 0;
										left: 0;
									}
									&:last-child { margin-bottom: 0; }
								}
							}
						}
						.block1_capsule {
							position: absolute;
							z-index: 2;
						}
						.block1_petri {
							position: absolute;
							z-index: 1;
						}
						&.cnt_azelaic {
							padding-top: clamp(34.1px, 10.7vw, 68.3px);
							.title_inner {
								background: #c58270;
							}
							.block1_detail {
								padding-left: 4%;
								h4 {
									color: #c58270;
								}
								ul {
									width: 55%;
									li::before { color: #c58270; }
								}
							}
							.block1_capsule {
								width: clamp(121.2px, 37.9vw, 242.3px);
								top: clamp(157px, 49.1vw, 314px);
								right: 4%;
							}
							.block1_petri {
								width: clamp(257.7px, 80.5vw, 515.4px);
								top: clamp(27.3px, 8.5vw, 54.6px);
								right: -16%;
							}
						}
						&.cnt_cica {
							.block1_title {
							text-align: right;
								.title_inner {
									background: #687760;
								}
							}
							.block1_detail {
								padding: 0 4% 0 50%;
								h4 {
									color: #687760;
								}
								ul {
									li::before { color: #687760; }
								}
							}
							.block1_capsule {
								width: clamp(121.2px, 37.9vw, 242.3px);
								top: clamp(116.1px, 36.3vw, 232.1px);
								left: 4%;
							}
							.block1_petri {
								width: clamp(257.7px, 80.5vw, 515.4px);
								top: clamp(-27.3px, -4.3vw, -13.7px);
								left: -26%;
							}
						}
					}/* block1_contents */
					.cross {
						width: clamp(51.2px, 16vw, 102.4px);
						height: clamp(51.2px, 16vw, 102.4px);
						margin: clamp(13.7px, 4.3vw, 27.3px) auto;
						position: relative;
						z-index: 4;
						&::before {
							content: "";
							width: clamp(0.9px, 0.3vw, 1.7px);
							height: 100%;
							background: #000;
							position: absolute;
							top: 50%;
							left: 50%;
							transform: translate(-50%, -50%) rotate(45deg);
						}
						&::after {
							content: "";
							width: clamp(0.9px, 0.3vw, 1.7px);
							height: 100%;
							background: #000;
							position: absolute;
							top: 50%;
							left: 50%;
							transform: translate(-50%, -50%) rotate(-45deg);
						}
					}
					.message {
						font-size: clamp(17.9px, 5.6vw, 35.8px);
						font-weight: 700;
						text-align: center;
						margin: clamp(27.3px, 8.5vw, 54.6px) 0 clamp(54.6px, 17.1vw, 109.2px);
					}
					.column_box {
						padding: clamp(12.8px, 4vw, 25.6px);
						background: #dcdecf;
						border: none;
						position: relative;
						.column_head {
							width: 100%;
							padding: 0;
							border-bottom: none;
							position: absolute;
							top: clamp(-75.1px, -11.7vw, -37.6px);
							left: 0;
							z-index: 2;
							.column_label {
								position: relative;
								top: initial;
								left: 0;
								span {
									background: #c58270;
								}
							}
							.column_cheers {
								font-size: clamp(15.4px, 4.8vw, 30.7px);
								color: #c58270;
								margin-bottom: clamp(3.4px, 1.1vw, 6.8px);
								span {
									&::before { background: #c58270; }
									&::after { background: #c58270; }
								}
							}
						}/*column_head*/
						.column_body {
							padding: 0;
							.title {
								padding-top: clamp(17.1px, 5.3vw, 34.1px);
								margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
								.left{
									position: relative;
									h3 {
										font-size: clamp(15.4px, 4.8vw, 30.7px);
										font-weight: 700;
										line-height: 1.35;
										margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
									}
									.name {
										padding-left: 40%;
									}
									.doctor {
										width: clamp(95.6px, 29.9vw, 191.1px);
										position: absolute;
										top: clamp(-102.4px, -16vw, -51.2px);
										right: clamp(-25.6px, -4vw, -12.8px);
									}
								}
							}
							.column {
								margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
								background: #fff;
								border-radius: clamp(4.3px, 1.3vw, 8.5px);
								overflow: hidden;
								position: relative;
								z-index: 2;
								.column_label {
									font-size: clamp(13.7px, 4.3vw, 27.3px);
									font-weight: 700;
									color: #fff;
									text-align: center;
									line-height: 1;
									padding: clamp(6.8px, 2.1vw, 13.7px) 0;
								}
								.column_inner {
									padding: clamp(12.8px, 4vw, 25.6px);
									position: relative;
									h4 {
										font-size: clamp(16.2px, 5.1vw, 32.4px);
										margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
										position: relative;
										z-index: 2;
									}
									.column_bg {
										position: absolute;
										top: 0;
										right: 0;
										z-index: 1;
									}
								}
								.readmore_outer {
									z-index: 2;
									.readmore_inner {
										position: relative;
										height: 18vw;
										max-height: 125px;
										transition: all .4s;
										overflow: hidden;
										&::before {
											content: "";
											width: 100%;
											height: clamp(68.3px, 21.3vw, 136.5px);
											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: 2;
											transition: all .4s;
										}
										&.is-open {
											max-height: initial;
											&::before{
												display: none;
											}
										}
										ul {
											list-style: none;
											list-style-position: inside;
											li {
												font-size: clamp(11.9px, 3.7vw, 23.9px);
												padding-left: clamp(13.7px, 4.3vw, 27.3px);
												margin-bottom: clamp(11.9px, 3.7vw, 23.9px);
												position: relative;
												&::before {
													font-size: clamp(11.9px, 3.7vw, 23.9px);
													position: absolute;
													top: 0;
													left: 0;
												}
												&.num1::before { content: "❶"; }
												&.num2::before { content: "❷"; }
												&.num3::before { content: "❸"; }
												&.num4::before { content: "❹"; }
											}
										}
									}
								}
								&.column_azelaic {
									.column_label { background: #c58270; }
									h4 { color: #c58270; }
									.column_bg { width: clamp(54.6px, 17.1vw, 109.2px); }
									.readmore_btn p { background: #e4cdb9; }
								}
								&.column_cica {
									.column_label { background: #687760; }
									h4 { color: #687760; }
									.column_bg { width: clamp(106.7px, 33.3vw, 213.3px); }
									.readmore_btn p { background: #ced1bd; }
								}
							}
						}
					}/*column_box*/
				}
			}/* block_1 */
		}
	}
}


/* --------------------------------------------------------------------------------
 #User
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#User {
		padding: clamp(42.7px, 13.3vw, 85.3px) 0 clamp(34.1px, 10.7vw, 68.3px);
		margin-bottom: 0;
		background: #faf7f4;
		.head {
			margin-bottom: clamp(16.2px, 5.1vw, 32.4px);
			.label {
				font-size: clamp(10.2px, 3.2vw, 20.5px);
				font-family: Times, serif;
				text-align: center;
				margin-bottom: clamp(20.5px, 6.4vw, 41px);
				span {
					position: relative;
					&::after {
						content: "";
						width: clamp(64px, 20vw, 128px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						bottom: clamp(-34.1px, -5.3vw, -17.1px);
						left: 50%;
						transform: translateX(-50%);
					}
				}
			}
			h2 {
				font-size: clamp(27.3px, 8.5vw, 54.6px);
			}
		}
		.block_user {
			.user_head {
				display: flex;
				align-items: center;
				.user_photo {
					flex: 1;
				}
				.user_title {
					flex: 1;
					padding: 0 6.67% 0 6%;
					h3 {
						font-size: clamp(17.1px, 5.3vw, 34.1px);
						font-weight: 700;
						margin-bottom: clamp(6.8px, 2.1vw, 13.7px);
					}
					p {
						font-size: clamp(10.2px, 3.2vw, 20.5px);
						margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
					}
				}
			}
			.user_body {
				font-size: clamp(11.9px, 3.7vw, 23.9px);
				line-height: 1.8;
				padding: clamp(19.6px, 6.1vw, 39.3px);
				margin-top: clamp(-39.3px, -6.1vw, -19.6px);
				background: #f7d6d7;
				position: relative;
				z-index: 2;
			}
			&.user_1 {
				margin-bottom: clamp(25.6px, 8vw, 51.2px);
				.user_body {
					margin-left: 6.67%;
				}
			}
			&.user_2 {
				.user_body {
					margin-right: 6.67%;
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Sleep
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Sleep {
		padding: clamp(44.8px, 14vw, 89.6px) 0 clamp(19.2px, 6vw, 38.4px);
		margin-bottom: 0;
		position: relative;
		z-index: 3;
		.head {
			margin-bottom: clamp(27.3px, 8.5vw, 54.6px);
			.block_start {
				font-size: clamp(30.7px, 9.6vw, 61.4px);
				text-align: center;
				margin-bottom: clamp(27.3px, 8.5vw, 54.6px);
			}
			.block_title {
				font-size: clamp(18.8px, 5.9vw, 37.5px);
				color: #fff;
				text-align: center;
				line-height: 1.25;
				padding: clamp(10.2px, 3.2vw, 20.5px) 0;
				background: linear-gradient(to right, #989d79 20%, #d2917d);
			}
		}
		.body {
			width: 100%;
			position: relative;
			.block_object {
				width: 100%;
				margin: 0;
				padding: 0;
				display: block;
				.object_greige {
					width: clamp(192px, 60vw, 384px);
					height: clamp(192px, 60vw, 384px);
					margin: 0 0 0 auto;
					background: #ced1bd;
					display: block;
					position: relative;
					z-index: 1;
				}
				.object_pink {
					width: clamp(192px, 60vw, 384px);
					height: clamp(17.9px, 5.6vw, 35.8px);
					margin: 0;
					background: #df8c92;
					display: block;
					position: relative;
					z-index: 1;
				}
			}
			.block_text {
				font-feature-settings: initial;
				writing-mode: vertical-rl;
				text-orientation: upright;
				position: absolute;
				top: clamp(27.3px, 8.5vw, 54.6px);
				right: 7.87%;
				z-index: 4;
				p {
					font-size: clamp(20.5px, 6.4vw, 41px);
				}
				h2 {
					font-size: clamp(36.7px, 11.5vw, 73.4px);
					font-weight: 400;
					text-align: left;
					line-height: 1.35;
					padding-top: clamp(51.2px, 16vw, 102.4px);
				}
			}
			.block_balloon {
				width: clamp(134.4px, 42vw, 268.8px);
				position: absolute;
				top: clamp(3.4px, 1.1vw, 6.8px);
				left: 28%;
				z-index: 6;
				.balloon_text {
					font-size: clamp(10.2px, 3.2vw, 20.5px);
					font-weight: 700;
					text-align: center;
					line-height: 1.25;
					.italic { font-style: italic; }
				}
				.balloon_img {
					width: 100%;
					position: absolute;
					top: clamp(-34.1px, -5.3vw, -17.1px);
					left: 0;
					z-index: -1;
				}
			}
			.block_model {
				width: clamp(277.4px, 86.7vw, 554.7px);
				margin-top: clamp(-300.4px, -46.9vw, -150.2px);
				position: relative;
				z-index: 3;
				img { width: 100%; }
			}
		}
		&.model {
			margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
			.body {
				.block_object {
					.object_greige { width: clamp(76.8px, 24vw, 153.6px); }
				}
				.block_text {
					top: clamp(41px, 12.8vw, 81.9px);
				}
				.block_model {
					width: clamp(307.2px, 96vw, 614.4px);
					margin-top: clamp(-341.3px, -53.3vw, -170.7px);
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Step
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Step {
		margin-top: clamp(47.8px, 14.9vw, 95.6px);
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		background: #fff;
		.head {
			margin-bottom: 8%;
			.label {
				font-size: clamp(10.2px, 3.2vw, 20.5px);
				font-family: Times, serif;
				text-align: center;
				margin-bottom: clamp(20.5px, 6.4vw, 41px);
				span {
					position: relative;
					&::after {
						content: "";
						width: clamp(75px, 23.4vw, 150px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						bottom: clamp(-34.1px, -5.3vw, -17.1px);
						left: 50%;
						transform: translateX(-50%);
					}
				}
			}
			h2 {
				font-size: clamp(27.3px, 8.5vw, 54.6px);
				margin-bottom: clamp(15.4px, 4.8vw, 30.7px);
			}
			.description {
				font-size: clamp(13.7px, 4.3vw, 27.3px);
				text-align: center;
			}
		}
		.body {
			video {
				width: 79.5%;
				margin: 0 auto 8%;
				display: block;
				position: relative;
				z-index: 3;
			}
			h3 {
				font-size: clamp(13.7px, 4.3vw, 27.3px);
				font-weight: 700;
				text-align: center;
				margin-bottom: clamp(16.2px, 5.1vw, 32.4px);
				span {
					padding: 0 8%;
					position: relative;
					&::before {
						content: "";
						width: clamp(12.8px, 4vw, 25.6px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						top: 50%;
						left: 0;
					}
					&::after {
						content: "";
						width: clamp(12.8px, 4vw, 25.6px);
						height: clamp(0.9px, 0.3vw, 1.7px);
						background: #000;
						position: absolute;
						top: 50%;
						right: 0;
					}
				}
			}
			.block_step {
				width: 100%;
				position: relative;
				.text_box {
					position: absolute;
					z-index: 2;
					.steps {
						font-size: clamp(15.4px, 4.8vw, 30.7px);
						font-family: Times, serif;
						line-height: .6;
						padding: 0 8%;
						.num {
							font-size: clamp(25.6px, 8vw, 51.2px);
						}
					}
					.text {
						width: clamp(190px, 59.4vw, 380px);
						font-size: clamp(10.2px, 3.2vw, 20.5px);
						padding: 12%;
						background: #ced1bd;
					}
				}
				.img_step {
					width: 46.667%;
				}
				&.step_1 {
					.text_box {
						top: 50%;
						right: 6.67%;
						transform: translateY(-50%);
						.steps { text-align: right; }
					}
					.img_step { margin-left: 0; }
				}
				&.step_2 {
					.text_box {
						top: 50%;
						left: 6.67%;
						transform: translateY(-50%);
						.steps { text-align: left; }
					}
					.img_step { margin: 0 0 0 auto; }
				}
				&.step_3 {
					padding-bottom: 10%;
					margin-bottom: 10%;
					.text_box {
						bottom: 0;
						right: 6.67%;
						.steps { text-align: right; }
					}
					.img_step { margin-left: 0; }
				}
			}
			.block_detail {
				width: 92%;
				margin: 0 auto clamp(7.7px, 2.4vw, 15.4px);
				.detail_head {
					font-size: clamp(11.1px, 3.5vw, 22.2px);
					font-weight: 700;
					text-align: center;
					padding: clamp(14.5px, 4.5vw, 29px) 0;
					background: #ced1bd;
				}
				.detail_body {
					padding: clamp(14.5px, 4.5vw, 29px);
					background: #f3f1ee;
					display: flex;
					flex-direction: column;
					gap: clamp(17.1px, 5.3vw, 34.1px) 0;
					p {
						font-size: clamp(10.2px, 3.2vw, 20.5px);
						text-align: left;
					}
					img {
						width: 50%;
						max-width: 500px;
						margin: auto;
					}
					.detail_text {
						li {
							font-size: clamp(10.2px, 3.2vw, 20.5px);
							margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
						}
					}
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 #Faq
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Faq {
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		background: #fff;
		h2 {
			font-size: clamp(27.3px, 8.5vw, 54.6px);
			margin-bottom: clamp(16.2px, 5.1vw, 32.4px);
		}
		.body {
			.block_faq {
				display: flex;
				flex-direction: column;
				gap: clamp(13.7px, 4.3vw, 27.3px) 0;
				margin-bottom: clamp(32.4px, 10.1vw, 64.9px);
				.faq_box {
					width: 86.67%;
					margin: auto;
					background: #f2efec;
					.faq_head {
						font-size: clamp(11.1px, 3.5vw, 22.2px);
						font-weight: 700;
						text-align: left;
						padding: clamp(19.6px, 6.1vw, 39.3px) clamp(50.4px, 15.7vw, 100.7px) clamp(19.6px, 6.1vw, 39.3px) 0;
						p {
							padding-left: clamp(54.6px, 17.1vw, 109.2px);
							position: relative;
							&::before {
								content: "Q";
								font-size: clamp(25.6px, 8vw, 51.2px);
								font-weight: 400;
								font-family: "Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
								position: absolute;
								top: 50%;
								left: 8%;
								transform: translateY(-50%);
							}
						}
					}
					.faq_body {
						position: relative;
						&::before {
							content: "";
							width: 90%;
							height: clamp(0.9px, 0.3vw, 1.7px);
							background: #000;
							position: absolute;
							top: 0;
							left: 50%;
							transform: translateX(-50%);
						}
						p {
							font-size: clamp(10.2px, 3.2vw, 20.5px);
							padding: clamp(13.7px, 4.3vw, 27.3px);
						}
					}
				}
			}
			.block_ingredient {
				width: 86.67%;
				padding: clamp(16.2px, 5.1vw, 32.4px);
				margin: auto;
				border: clamp(0.9px, 0.3vw, 1.7px) solid #000;
				h3 {
					font-size: clamp(17.1px, 5.3vw, 34.1px);
					font-weight: 700;
					text-align: center;
					margin-bottom: clamp(11.9px, 3.7vw, 23.9px);
				}
				p {
					font-size: clamp(10.2px, 3.2vw, 20.5px);
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
 Accordion
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	.accordion {
		.acd_head {
			display: block;
			cursor: pointer;
			position: relative;
			&::-webkit-details-marker {
				display: none;
			}
			&::before {
				content: '';
				display: inline-block;
				width: clamp(13.7px, 4.3vw, 27.3px);
				height: clamp(0.9px, 0.3vw, 1.7px);
				background-color: #000;
				position: absolute;
				right: 5%;
				top: 50%;
				transform: translateY(-50%);
				transition: 0.2s;
			}
			&::after {
				content: '';
				display: inline-block;
				width: clamp(13.7px, 4.3vw, 27.3px);
				height: clamp(0.9px, 0.3vw, 1.7px);
				background-color: #000;
				position: absolute;
				right: 5%;
				top: 50%;
				transform: translateY(-50%) rotate(90deg);
				transition: 0.2s;
			}
		}
	}
}


/* --------------------------------------------------------------------------------
#Change
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Change {
		margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
		background: #fff;
		.head {
			.balloon {
				font-size: clamp(23.9px, 7.5vw, 47.8px);
				font-weight: 400;
				color: #fff;
				text-align: center;
				margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
				span {
					padding: clamp(6.8px, 2.1vw, 13.7px) clamp(23.9px, 7.5vw, 47.8px);
					background: #dc7480;
					border-radius: 50px;
					position: relative;
					&::before {
						content: "";
						width: clamp(11.9px, 3.7vw, 23.9px);
						height: clamp(11.9px, 3.7vw, 23.9px);
						background: #dc7480;
						clip-path: polygon(0 0, 50% 100%, 100% 0);
						position: absolute;
						bottom: clamp(-23.5px, -3.7vw, -11.8px);
						left: 50%;
						transform: translateX(-50%);
					}
				}
			}
			.subtitle {
				font-size: clamp(20.5px, 6.4vw, 41px);
				font-weight: 400;
				color: #000;
				text-align: center;
				margin-bottom: 2%;
			}
			h2 {
				font-size: clamp(27.3px, 8.5vw, 54.6px);
				color: #dc7480;
				line-height: 1.35;
				margin-bottom: clamp(47.8px, 14.9vw, 95.6px);
			}
		}
		.body {
			padding: 12% 0;
			background: #f7c6c8;
			.model_box {
				margin-bottom: 8%;
				padding: 0 5%;
				position: relative;
				.model_after {
					width: clamp(229.5px, 71.7vw, 459px);
					height: clamp(229.5px, 71.7vw, 459px);
					border: 1px solid #ce777a;
					border-radius: 50%;
					position: absolute;
					top: -74%;
					right: 2%;
				}
				.arrow {
					width: clamp(66.5px, 20.8vw, 133px);
					height: clamp(28px, 8.8vw, 56px);
					position: absolute;
					top: 90%;
					left: 32%;
				}
				.model_before {
					width: clamp(131px, 40.9vw, 262px);
					height: clamp(131px, 40.9vw, 262px);
					border-radius: 50%;
				}
			}
			.ba_box {
				width: 100%;
				display: flex;
				gap: 6%;
				padding: 0 6.67%;
				.ba_inner {
					flex: 1;
					display: flex;
					flex-direction: column;
					gap: clamp(6.8px, 2.1vw, 13.7px);
					.ba_title {
						font-size: clamp(11.9px, 3.7vw, 23.9px);
						font-family: Times,serif;
						color: #fff;
						text-align: center;
					}
					&.before {
						.ba_title { background: #a09f96; }
					}
					&.after {
						.ba_title { background: #ce777a; }
					}
					.photo {
						position: relative;
						.balloon_outer {
							width: clamp(61px, 19.1vw, 122px);
							height: clamp(61px, 19.1vw, 122px);
							position: absolute;
							top: 50%;
							left: -8%;
							transform: translateY(-50%);
							.balloon_inner {
								width: 100%;
								height: 100%;
								position: relative;
								p {
									width: 100%;
									font-size: clamp(11.9px, 3.7vw, 23.9px);
									text-align: left;
									line-height: 1.25;
									position: absolute;
									top: 50%;
									left: 12%;
									transform: translateY(-50%) rotate(-15deg);
									z-index: 2;
								}
								.balloon {
									width: 100%;
									height: 100%;
									background: #fff;
									border-radius: 50%;
									display: block;
									position: relative;
									transform: rotate(-60deg);
									opacity: .8;
									&::after {
										content: "";
										width: clamp(13.7px, 4.3vw, 27.3px);
										height: clamp(10.9px, 3.4vw, 21.8px);
										background: #fff;
										clip-path: polygon(0 0, 50% 100%, 100% 0);
										position: absolute;
										bottom: clamp(-20.5px, -3.2vw, -10.2px);
										left: 50%;
										transform: translateX(-50%);
									}
								}
							}
						}
					}
				}
			}
		}
	}
}


/* --------------------------------------------------------------------------------
#Qusome
-------------------------------------------------------------------------------- */
#sleepingmaskcp {
	#Qusome {
		margin-bottom: clamp(34.1px, 10.7vw, 68.3px);
		.head {
			padding: 0 0 clamp(34.1px, 10.7vw, 68.3px);
			background: linear-gradient(to bottom, #faf7f4 75%, #f7d6d7);
			clip-path: polygon(100% 0, 100% calc(100% - clamp(34.1px, 10.7vw, 68.3px) ), 50% 100%, 0 calc(100% - clamp(34.1px, 10.7vw, 68.3px) ), 0 0);
			position: relative;
			z-index: 2;
			.title {
				font-size: clamp(25.6px, 8vw, 51.2px);
				color: #fff;
				text-align: center;
				padding: clamp(6.8px, 2.1vw, 13.7px) 0;
				margin-bottom: clamp(13.7px, 4.3vw, 27.3px);
				background: #dc7480;
			}
			.secret {
				font-size: clamp(34.1px, 10.7vw, 68.3px);
				color: #dc7480;
				text-align: center;
			}
		}
		.body {
			margin-top: clamp(-71px, -11.1vw, -35.5px);
			padding: clamp(47.8px, 14.9vw, 95.6px) 0 clamp(20.5px, 6.4vw, 41px);
			background: url("../../../img/sp/sleepingmaskcp/_20250705/qusome_bg.webp") center top / cover no-repeat;
			h2 {
				font-size: clamp(30.7px, 9.6vw, 61.4px);
				margin-bottom: clamp(10.2px, 3.2vw, 20.5px);
			}
			.balloon {
				color: #fff;
				text-align: center;
				line-height: 1;
				margin-bottom: clamp(23.9px, 7.5vw, 47.8px);
				span {
					padding: clamp(6.8px, 2.1vw, 13.7px) clamp(13.7px, 4.3vw, 27.3px);
					background: #437fc8;
					border-radius: 50px;
				}
			}
			.object {
				width: clamp(237.3px, 74.1vw, 474.5px);
				margin: 0 4% clamp(13.7px, 4.3vw, 27.3px) auto;
			}
			.text {
				font-size: clamp(11.9px, 3.7vw, 23.9px);
				text-align: center;
				line-height: 1.8;
				.line-blue {
					color: #437fc8;
				}
			}
		}
	}
}