@charset "UTF-8";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, picture, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	background: #fff;
	box-sizing: border-box;
	overflow-x: hidden;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section {
	display: block;
}
a {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
ul, ol {
	list-style: none;
}
picture {
	display: block;
}
/************************************************
common
************************************************/
.wrapper {
	width: 100%;
	margin: 0;
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, sans-serif;
	font-weight: 500;
	overflow: clip;
}
.wrapper .inner {
	width: 100%;
	margin: 0 auto;
	max-width: 1000px;
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.wrapper .inner {
		padding: 0;
	}
}
.wrapper img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.onlyPC {
	display: none;
}
.pbg {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 140vh;
	transition: .8s ease;
}
.pbg02 {
	min-height: 100vh;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -2;
	width: 100%;
}
.active .pbg02, .active .pbg {
	display: block;
}
/************************************************
header
************************************************/
#header h1 {
	width: calc(750 / 750 * 100vw);
	position: absolute;
	left: 0;
	top: 0;
}
/************************************************
lead
************************************************/
.lead {
	clip-path: polygon(0% 0%, 100% 0%, 100% 92%, 50% 100%, 0% 92%);
}
.lead p.list {
	width: calc(673 / 750 * 100vw);
	position: absolute;
	left: 0;
	top: calc(407 / 750 * 100vw);
}
/************************************************
triple
************************************************/
.triple {
	position: relative;
}
.triple .pbg02 {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_triple_bg.jpg") 50% 50% / cover no-repeat;
}
.triple .cnt {
	padding: 1px 0;
}
.triple h2 {
	width: calc(628 / 750 * 100vw);
	margin: calc(60 / 750 * 100vw) auto calc(55 / 750 * 100vw) 0;
}
.triple ul.effect03 {
	display: flex;
	margin: 0 auto;
	justify-content: center;
}
.triple ul.effect03 li {
	width: calc(233 / 750 * 100vw);
	margin: 0 calc(-18 / 750 * 100vw);
}
.triple dl.effect {
	width: calc(630 / 750 * 100vw);
	margin: 0 auto calc(41 / 750 * 100vw);
	position: relative;
}
.triple dl.effect dd {
	width: calc(630 / 750 * 100vw);
	position: absolute;
	left: 0;
	top: calc(102 / 750 * 100vw);
}
.triple ul.moisturize03 {
	display: flex;
	margin: 0 auto calc(45 / 750 * 100vw);
	justify-content: center;
}
.triple ul.moisturize03 li {
	width: calc(233 / 750 * 100vw);
	margin: 0 calc(-18 / 750 * 100vw);
}
.triple p.result {
	width: calc(676 / 750 * 100vw);
	margin: 0 auto calc(80 / 750 * 100vw);
}
/************************************************
quality
************************************************/
.quality {
	background-color: #fff;
}
.quality .img {
	position: relative;
	z-index: 0;
}
.quality h2 {
	position: absolute;
	left: calc(0 / 750 * 100vw);
	top: calc(0/ 750 * 100vw);
	z-index: 1;
}
.quality p.cpt01 {
	width: calc(146 / 750 * 100vw);
	position: absolute;
	left: calc(542 / 750 * 100vw);
	top: calc(460 / 750 * 100vw);
	z-index: 1;
}
.quality p.cpt02 {
	width: calc(561 / 750 * 100vw);
	position: absolute;
	left: calc(59 / 750 * 100vw);
	top: calc(1459 / 750 * 100vw);
	z-index: 1;
}
.quality p.reason {
	width: calc(710 / 750 * 100vw);
	position: absolute;
	left: calc(20 / 750 * 100vw);
	top: calc(2266 / 750 * 100vw);
	z-index: 1;
}
.quality p.cpt03 {
	width: calc(524 / 750 * 100vw);
	position: absolute;
	left: calc(169 / 750 * 100vw);
	bottom: calc(917 / 750 * 100vw);
	z-index: 1;
}
.quality p.result {
	width: calc(525 / 750 * 100vw);
	position: absolute;
	left: calc(113 / 750 * 100vw);
	bottom: calc(115 / 750 * 100vw);
	z-index: 1;
}
/************************************************
voice
************************************************/
.voice {
	position: relative;
	z-index: 8500;
}
.voice .cnt {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_voice_bg.jpg") center top / 100% auto no-repeat;
	aspect-ratio: 750/1060;
	box-sizing: border-box;
	padding: 1px 0;
}
.voice h2 {
	width: calc(395 / 750 * 100vw);
	margin: calc(99 / 750 * 100vw) auto calc(64 / 750 * 100vw);
}
.voice .slide {
	width: 100%;
	margin: 0 auto;
	position: relative;
}
.voice .swiper {
	position: relative;
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	overflow: hidden;
}
.voice .slide .swipe-prev, .voice .slide .swipe-next {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_voice_arrow.png") left top / auto 100% no-repeat;
	width: calc(50 / 750 * 100vw);
	height: calc(80/ 750 * 100vw);
	position: absolute;
	right: calc(0 / 750 * 100vw);
	top: 50%;
	margin-top: calc(-40 / 750 * 100vw);
	z-index: 20;
}
.voice .slide .swipe-prev {
	right: auto;
	left: calc(0 / 750 * 100vw);
	transform: rotate(180deg);
}
.voice .slide .swiper-button-disabled {
	display: none;
}
.voice .swiper .swiper-slide {
	position: relative;
	width: calc(630 / 750 * 100vw);
	padding: 0 calc(20 / 750 * 100vw) 0 calc(20 / 750 * 100vw);
	box-sizing: border-box;
}
.voice p.atte {
	color: #585d5e;
	font-size: calc(20 / 750 * 100vw);
	line-height: calc(28 / 750 * 100vw);
	letter-spacing: 0.1em;
	margin: calc(80 / 750 * 100vw) calc(40 / 750 * 100vw) 0;
}
.voice .swiper-pagination {
	position: relative;
	width: 100%;
	height: calc(18 / 750 * 100vw);
	top: 0;
	line-height: 0.1;
	margin: calc(60 / 750 * 100vw) auto 0;
}
.voice .swiper-pagination .swiper-pagination-bullet {
	width: calc(18 / 750 * 100vw);
	height: calc(18 / 750 * 100vw);
	background: #b4bdc3;
	opacity: 1;
	margin: 0 calc(11 / 750 * 100vw);
	border-radius: 100px;
}
.voice .swiper-pagination .swiper-pagination-bullet-active {
	background: #bd2240;
}
.voice .evaluation {
	position: relative;
}
/************************************************
nayami
************************************************/
.nayami {}
.nayami .cnt {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_nayami_bg.jpg") center top / 100% auto no-repeat;
	aspect-ratio: 750 /1190;
	padding-top: 1px;
}
.nayami h2 {
	width: calc(377 / 750 * 100vw);
	margin: calc(100 / 750 * 100vw) auto calc(68 / 750 * 100vw);
}
.nayami ul {
	width: calc(670 / 750 * 100vw);
	aspect-ratio: 670 / 600;
	margin: 0 auto;
	position: relative;
}
.nayami ul li {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}
.nayami ul li:nth-child(2) {
	padding-top: calc(210 / 750 * 100vw);
}
.nayami ul li:nth-child(3) {
	padding-top: calc(420 / 750 * 100vw);
}
/************************************************
replace
************************************************/
.replace .cnt {
	position: relative;
	aspect-ratio: 750/1815;
}
.replace .pbg {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_replace_img.jpg") 50% 50% / cover no-repeat;
	height: 150vh;
}
.replace h2 {
	margin: 0 auto calc(89 / 750 * 100vw);
}
.replace dl {
	width: calc(701 / 750 * 100vw);
	margin: 0 auto 0 0;
	position: relative;
}
.replace dl dd {
	width: calc(460 / 750 * 100vw);
	position: absolute;
	left: calc(251 / 750 * 100vw);
	top: calc(241 / 750 * 100vw);
}
.replace dl dd.rep02 {
	padding-top: calc(194 / 750 * 100vw);
}
.replace dl dd.rep03 {
	padding-top: calc(194 * 2 / 750 * 100vw);
}
.replace dl dd.result {
	width: calc(520 / 750 * 100vw);
	position: absolute;
	left: calc(110 / 750 * 100vw);
	top: calc(926 / 750 * 100vw);
}
/************************************************
howto
************************************************/
.howto {
	position: relative;
}
.howto .cnt {
	padding: 0;
}
.howto h2 {}
.howto p.basic {
	width: calc(350 / 750 * 100vw);
	position: absolute;
	left: calc(39 / 750 * 100vw);
	top: calc(483 / 750 * 100vw);
}
.howto p.this {
	width: calc(292 / 750 * 100vw);
	position: absolute;
	left: calc(419 / 750 * 100vw);
	top: calc(483 / 750 * 100vw);
}
/************************************************
smooth
************************************************/
.smooth {
	position: relative;
	z-index: 100;
}
.smooth .cnt {
	padding: 0;
}
.smooth h2 {
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}
.smooth p.result {
	width: 100%;
	position: relative;
	z-index: -1;
}
/************************************************
message
************************************************/
.message {
	z-index: 90;
}
.message .cnt {
	position: relative;
	padding: 1px 0;
}
.message .pbg {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_message_bg.jpg") 50% 50% / cover no-repeat;
}
.message h2 {}
/************************************************
qa
************************************************/
.qa {
	border-top: #fff solid calc(10 / 750 * 100vw);
	background: #ece7d9;
}
.qa .cnt {
	padding: 1px 0 calc(130 / 1000 * 100%);
}
.qa h2 {
	width: calc(371 / 750 * 100vw);
	margin: calc(140 / 750 * 100vw) auto calc(71 / 750 * 100vw);
}
.qa dl {
	max-width: calc(670 / 750 * 100vw);
	margin: 0 auto calc(10 / 750 * 100vw);
}
.qa dl dt {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_qa_icn01.png") calc(26 / 750 * 100vw) center / calc(60 / 750 * 100vw) auto no-repeat #fff;
	color: #222b33;
	font-size: calc(24 / 750 * 100vw);
	line-height: calc(38 / 750 * 100vw);
	letter-spacing: 0.1em;
	font-weight: bold;
	padding: calc(28 / 750 * 100vw) calc(70 / 750 * 100vw) calc(28 / 750 * 100vw) calc(108 / 750 * 100vw);
	position: relative;
}
.qa dl dt::before, .qa dl dt::after {
	content: "";
	display: block;
	background: #342323;
	width: calc(26 / 750 * 100vw);
	height: 1px;
	line-height: .1;
	position: absolute;
	right: calc(30 / 750 * 100vw);
	top: 50%;
}
.qa dl dt::after {
	transform: rotate(-90deg);
	transition: all 0.3s ease;
}
.qa dl dt.active::after {
	transform: rotate(0deg);
}
.qa dl dd {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_qa_icn02.png?up251217") calc(26 / 750 * 100vw) calc(32 / 750 * 100vw) / calc(60 / 750 * 100vw) auto no-repeat;
	color: #222b33;
	font-size: calc(24 / 750 * 100vw);
	line-height: calc(38 / 750 * 100vw);
	letter-spacing: 0.1em;
	padding: calc(40 / 750 * 100vw) calc(30 / 750 * 100vw) calc(35 / 750 * 100vw) calc(110 / 750 * 100vw);
	display: none;
}
.qa dl dd span.atte {
	display: block;
	font-size: calc(18 / 750 * 100vw);
	line-height: calc(30 / 750 * 100vw);
	letter-spacing: 0.1em;
	margin-top: calc(30 / 750 * 100vw);
}
/************************************************
brand
************************************************/
.brand {
	background: #b11620;
}
/************************************************
CV
************************************************/
.cv {
	background: url("../../../../shopping/images/pub/ds_uvhf/b_net03/sp_cv_bg.png?2604") left top / cover no-repeat;
	position: relative;
	z-index: 1;
}
.cv .cnt {
	width: calc(710 / 750 * 100vw);
	padding: calc(80 / 750 * 100vw) 0;
	margin: 0 auto;
	z-index: 100;
}
.cv .voce {
	width: calc(710 / 750 * 100vw);
	margin: 0 auto calc(80 / 750 * 100vw);
}

.cv .panel {
	position: relative;
	padding: 0;
	margin: 0 auto calc(30 / 750 * 100vw);
}
.cv .panel h3 {
	margin-left: calc(-14 / 750 * 100vw);
}
.cv .cv-btn-new {
	width: calc(622 / 750 * 100vw);
	margin: 0 auto;
	animation: btnslide 3s ease 0s infinite;
	position: absolute;
	left: calc(54 / 750 * 100vw);
	bottom: calc(170 / 750 * 100vw);
}
.cv .cv-service {
	width: calc(710 / 750 * 100vw);
	margin: calc(80 / 750 * 100vw) auto 0;
}
.cv .store {
	width: calc(710 / 750 * 100vw);
	position: relative;
	margin: calc(70 / 750 * 100vw) auto 0;
}
.cv .store ul.links {
	display: flex;
	justify-content: center;
	width: 100%;
	position: absolute;
	left: 0;
	top: calc(356 / 750 * 100vw);
	flex-wrap: wrap;
}
.cv .store ul.links li {
	width: calc(310 / 750 * 100vw);
	margin: 0 calc(5 / 750 * 100vw) calc(10 / 750 * 100vw);
}
.cv .store a.btn {
	display: block;
	width: calc(510 / 750 * 100vw);
	position: absolute;
	left: calc(100 / 750 * 100vw);
	bottom: calc(167 / 750 * 100vw);
}
.cv p.atte {
	color: #50545a;
	font-size: calc(18 / 750 * 100vw);
	line-height: calc(30 / 750 * 100vw);
	letter-spacing: 0.05em;
	width: calc(710 / 750 * 100vw);
	margin: 0 auto;
}
.cv p.atte span {
	display: none;
}
#b_net01 .cv p.atte span {
	display: inline;
}
#b_net01 .cv p.atte strong {
	color: #a22147;
}
.cv .cv-service + p.atte {
	margin-top: calc(25 / 750 * 100vw);
}
@keyframes btnslide {
	0% {
		transform: translateX(0);
	}
	5% {
		transform: translateX(calc(10 / 750 * 100vw));
	}
	10% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(0);
	}
}
/************************************************
fixedBtn
************************************************/
.fixedBtn {
	display: none;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 10000;
	background-color: rgba(255, 255, 255, .6);
	padding: calc(29 / 750 * 100vw) 0 calc(10 / 750 * 100vw);
	backdrop-filter: blur(8px);
}
.fixedBtn a {
	display: block;
	width: calc(702 / 750 * 100vw);
	margin: 0 auto 0 calc(34 / 750 * 100vw);
}
/************************************************
footer
************************************************/
#footer {
	background-color: #606971;
	padding: calc(50 / 750 * 100vw) 0 0;
	;
}
#footer ul {
	list-style: none;
	text-align: center;
	font-size: 0;
	padding-bottom: calc(50 / 750 * 100vw);
}
#footer ul li {
	display: inline-block;
	padding: 0 calc(16 / 750 * 100vw);
	position: relative;
	line-height: 1.1;
}
#footer ul li + li {
	border-left: 1px solid #fff;
}
#footer ul li:nth-child(4n) {
	border: 0;
}
#footer ul li a {
	font-size: calc(20 / 750 * 100vw);
	line-height: calc(36 / 750 * 100vw);
	text-decoration: none;
	color: #fff;
}
#footer p {
	display: block;
	background: #343d45;
	color: #fff;
	text-align: center;
	font-size: calc(18 / 750 * 100vw);
	line-height: 1;
	padding: calc(22 / 750 * 100vw) 0 calc(21 / 750 * 100vw);
}