@charset "UTF-8";

/* ===================================================================
CSS information
 file name  :  style.css
 style info : LPスタイル
=================================================================== */
main {
	background-color: #f2f2f2;
	font-family: 'Noto Sans JP', sans-serif, "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, "MS PGothic", sans-serif;
	font-feature-settings: "palt";
}

.content {
	width: 750px;
	max-width: 100%;
	overflow: hidden;
	margin: 0 auto;
	text-align: center;
	background: #fff;
	box-shadow: 0 0 10px 2px #d6d6d6;
}
.content img {
	vertical-align: bottom;
}

.rltv-box {
	position: relative;
}

/* --- ctaスライド ----*/
.slide_qa {
	margin: 0 auto;
	padding: min(calc(60 / 750 * 100vw), 60px) 0;
	text-align: center;
	background: #eef2e6;
	position: relative;
}

.slide_qa .slide_wrap {
	position: relative;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.slide_qa .slick-list {
	width: min(calc(588/750 * 100vw), 588px);
	height: min(calc(647/750 * 100vw), 647px);
	position: relative;
}

.slide_qa .slick-list .slick-track {
	position: absolute;
	top: 0;
	left: 0;
}

.slick-prev::before {
	content: '';
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/arrow_l.png) no-repeat center center;
	background-size: auto;
	background-size: contain;
	width: min(calc(55/750 * 100vw), 55px);
	height: min(calc(70/750 * 100vw), 70px);
	position: absolute;
	opacity: 1;
	left: max(calc(-82/750 * 100vw), -82px);
	bottom: 13%;
}

.slick-next::before {
	content: '';
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/arrow_r.png) no-repeat center center;
	background-size: auto;
	background-size: contain;
	width: min(calc(55/750 * 100vw), 55px);
	height: min(calc(70/750 * 100vw), 70px);
	position: absolute;
	opacity: 1;
	right: max(calc(-82/750 * 100vw), -82px);
	bottom: 13%;
}

.slick-next {
	right: 0;
}

.slick-prev {
	left: 0;
}

.slick-prev,
.slick-next {
	width: min(calc(55/750 * 100vw), 55px);
	height: min(calc(70/750 * 100vw), 70px);
	font-size: unset;
	z-index: 2;
}

.slick-dots li {
	width: min(calc(12/750 * 100vw), 12px);
	height: min(calc(12/750 * 100vw), 12px);
	margin: 2.6%;
}

.slick-dots li button {
	font-size: unset;
	line-height: unset;
	width: min(calc(15/750 * 100vw), 15px);
	height: min(calc(15/750 * 100vw), 15px);
	padding: 0;
}

.slide_qa .slick-dots {
	bottom: max(calc(-50/750 * 100vw), -50px);
}

.slick-dots li button::before {
	content: '';
	width: min(calc(15/750 * 100vw), 15px);
	height: min(calc(15/750 * 100vw), 15px);
	background-color: #dfe1da;
	border-radius: 50%;
	text-align: center;
	opacity: 1;
	top: auto;
	left: auto;
}

.slide_qa .slick-dots li.slick-active button::before {
	opacity: 1;
	background-color: #8c9b2c;
}

.slide_qa .slide_ttl {
	position: relative;
	width: min(calc(750/750 * 100vw), 750px);
	height: min(calc(922/750 * 100vw), 922px);
}

.slide_qa .slide-list {
	width: min(calc(588/750 * 100vw), 588px);
}

.qamenu {
	display: flex;
	list-style: none;
	width: min(calc(588/750 * 100vw), 588px);
	position: absolute;
	top: min(calc(115 / 750 * 100vw), 115px);
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	z-index: 2;
}

.qamenu li {
	width: 50%;
	cursor: pointer;
	background-position: center;
}

.qacontents {
	width: min(calc(588/750 * 100vw), 588px);
	text-align: center;
	margin: 0 auto;
	position: absolute;
	top: min(calc(190/750 * 100vw), 190px);
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	z-index: 2;
}

.qacontent {
	display: none;
	text-align: center;
}

.qacontent.active {
	display: block;
}

.notification {
	background: #eef2e6;
	padding-bottom: 5%;
}

.scroll_box{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index: 3;
}

.scroll{
	width: min(calc(200/750 * 100vw), 200px);
}

.scroll_icon{
	position: absolute;
	top: min(calc(20/750 * 100vw), 20px);
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	width: min(calc(67/750 * 100vw), 67px);
	animation: shake-horizontal 1s infinite;
}

@keyframes shake-horizontal {
	0%, 100% {
		transform: translateX(-50%) translateX(0);
	}
	25% {
		transform: translateX(-50%) translateX(-5px);
	}
	75% {
		transform: translateX(-50%) translateX(5px);
	}
}
.scroll_box {
	opacity: 0;
	transition: opacity 0.5s ease;
}

.scroll_box.show {
	opacity: 1;
}

.teiki-btn {
	background-image: url("//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/teiki_off.png");
	width: min(calc(293/750 * 100vw), 293px);
	height: min(calc(74/750 * 100vw), 74px);
	background-size: contain;
	background-repeat: no-repeat;
}

.teiki-btn.active {
	background-image: url("//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/teiki_on.png");
	width: min(calc(295/750 * 100vw), 295px);
	height: min(calc(74/750 * 100vw), 74px);
	max-width: 286px;
}

.product-btn {
	background-image: url("//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/product_off.png");
	width: min(calc(293/750 * 100vw), 293px);
	height: min(calc(74/750 * 100vw), 74px);
	background-size: contain;
	background-repeat: no-repeat;
}

.product-btn.active {
	background-image: url("//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/product_on.png");
	width: min(calc(295/750 * 100vw), 295px);
	height: min(calc(74/750 * 100vw), 74px);
}

/* ------------------------
	cta
------------------------ */
.cta {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/cta_bg.jpg) no-repeat bottom center / 100%;
	background-size: cover;
}

.cta h2 {
	position: relative;
	z-index: 2;
}

.cta a {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	width: min(calc(670 / 750 * 100vw), 670px);
}
.cta a img{
	animation: buttonMove 0.5s ease infinite alternate;
}
@keyframes buttonMove {
	0% {
		transform: scale(0.9, 0.9);
	}

	100% {
		transform: scale(1, 1);
	}
}

.cta_slide {
	z-index: 0;
}

.cta_slide .slick-slide img {
	display: block;
	margin: 0 auto;
	text-align: center;
}

.cta_slide .slick-dots {
	bottom: max(calc(-50/750 * 100vw), -50px);
}

.cta_slide .slick-dots li button::before {
	max-width: min(calc(15/750 * 100vw), 15px);
	max-height: min(calc(15/750 * 100vw), 15px);
	background-color: #dfe1da;
}

.cta_slide .slick-dots li.slick-active button::before {
	background-color: #a8c10e;
}

.cta_slide .slick-dots li {
	width: min(calc(15/750 * 100vw), 15px);
	height: min(calc(15/750 * 100vw), 15px);
	margin: min(calc(15/750 * 100vw), 15px) min(calc(14/750 * 100vw), 14px);
}

.cta_slide .slick-dots li button {
	width: min(calc(15/750 * 100vw), 15px);
	height: min(calc(15/750 * 100vw), 15px);
}

.cta_slide.slick-slider {
	margin: max(calc(-10/750 * 100vw), -10px) auto min(calc(2/750 * 100vw), 0px);
}

.cta_slide.slick-slider img {
	width: min(calc(710/750 * 100vw), 710px);
	margin: 0 auto;
	text-align: center;
}

.cta_slide .slick-prev::before {
	left: 0;
	bottom: 28%;
}

.cta_slide .slick-next::before {
	right: 0;
	bottom: 28%;
}

/* ------------------------
	fv
------------------------ */
/* .fv {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/fv_bg.png) no-repeat top center/ 100%;
} */
.fv video {
	vertical-align: bottom;
}

/* ------------------------
	walk
------------------------ */
.walk {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/wa);
}

.walk .video_wrapper {
	z-index: 2;
}

.walk .video_wrapper video {
	position: absolute;
	top: 0;
	left: min(calc(25/ 750 * 100vw), 25px);
	width: min(calc(340 / 750 * 100vw), 340px);
	height: min(calc(440 / 750 * 100vw), 440px);
	z-index: -1;
}

.walk .video_wrapper video:nth-of-type(2) {
	right: min(calc(25/ 750 * 100vw), 25px);
	left: auto;
}

.walk .next {
	position: absolute;
	top: max(calc(-75/ 750 * 100vw), -75px);
	left: 48.8%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	width: min(calc(150/ 750 * 100vw), 150px);
}

/* ------------------------
	week
------------------------ */
.week {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/week_slide_bg.png) no-repeat top center/ 100%;
}

.week .week_slide {
	width: min(calc(710/ 750 * 100vw), 710px);
	margin: 0 auto;
}

.week .week_slide video {
	width: min(calc(710/ 750 * 100vw), 710px);
	margin: 0 auto;
}

.week_slide .slick-prev::before {
	left: max(calc(-20/ 750 * 100vw), -20px);
	top: 27.5%;
	z-index: 2;
}

.week_slide .slick-next::before {
	right: max(calc(-20/ 750 * 100vw), -20px);
	top: 27.5%;
}

.week_slide .slick-dots {
	bottom: max(calc(-57/750 * 100vw), -57px);
}

.week_slide .slick-dots li button::before {
	max-width: min(calc(15/750 * 100vw), 15px);
	max-height: min(calc(15/750 * 100vw), 15px);
	background-color: #fff;
}

.week_slide .slick-dots li.slick-active button::before {
	background-color: #fff370;
}

.week_slide .slick-dots li {
	width: min(calc(15/750 * 100vw), 15px);
	height: min(calc(15/750 * 100vw), 15px);
	margin: min(calc(15/750 * 100vw), 15px) min(calc(14/750 * 100vw), 14px);
}

.week_slide .slick-dots li button {
	width: min(calc(15/750 * 100vw), 15px);
	height: min(calc(15/750 * 100vw), 15px);
}

.week_slide.slick-slider {
	margin-bottom: min(calc(97/750 * 100vw), 97px);
}

/* ------------------------
	nayami
------------------------ */
.nayami_wrap {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/nayami_bg.jpg) no-repeat top center / 100%;
}

.cause .video_wrapper {
	z-index: 1;
}

.cause .kansetsu {
	width: min(calc(710/750 * 100vw), 710px);
	margin: 0 auto;
}

.cause .kansetsu video:nth-of-type(1) {
	position: absolute;
	top: min(calc(70/750 * 100vw), 70px);
	left: min(calc(35/750 * 100vw), 35px);
	width: min(calc(330/750 * 100vw), 330px);
	z-index: -1;
}

.cause .kansetsu video:nth-of-type(2) {
	position: absolute;
	top: min(calc(70/750 * 100vw), 70px);
	right: min(calc(35/750 * 100vw), 35px);
	width: min(calc(330/750 * 100vw), 330px);
	z-index: -1;
}

.cause_gif_wrap {
	z-index: 1;
}

.cause_gif {
	width: min(calc(640/750 * 100vw), 640px);
	top: min(calc(70/750 * 100vw), 70px);
	margin: 0 auto;
	position: relative;
	display: flex;
	justify-content: space-between;
}

.cause_gif p:nth-of-type(1),
.cause_gif p:nth-of-type(2) {
	position: absolute;
	width: min(calc(310/750 * 100vw), 310px);
	z-index: -1;
}

.cause_gif p:nth-of-type(2) {
	right: 0;
}


/* ------------------------
	ignore
------------------------ */
.ignore div p {
	position: relative;
	z-index: 2;
}

.ignore video {
	position: absolute;
	top: min(calc(124 / 750 * 100vw), 124px);
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	clip-path: circle(50% at 50% 50%);
	width: min(calc(530 / 750 * 100vw), 530px);
	height: min(calc(530 / 750 * 100vw), 530px);
	z-index: 1;
}

/* ------------------------
	approach
------------------------ */
.approach {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/approach_bg.png) no-repeat top center / 100%;
	position: relative;
}

.approach .next_sokode {
	position: absolute;
	width: min(calc(150 / 750 * 100vw), 150px);
	top: max(calc(-78 / 750 * 100vw), -78px);
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}

.approach ul {
	background: #edf8e2;
}

.approach ul li:nth-of-type(1) {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/ap_01_pic.png) no-repeat top center / 100%;
}

.approach ul li:nth-of-type(2) {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/ap_02_pic.png) no-repeat top center / 100%;
}

.approach ul li:nth-of-type(3) {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/ap_03_pic.png) no-repeat top center / 100%;
}

.approach ul li:nth-of-type(4) {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/ap_04_pic.png) no-repeat top center / 100%;
}

.approach ul li:nth-of-type(5) {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/ap_05_pic.png) no-repeat top center / 100%;
}

.approach .video_wrapper video {
	position: absolute;
	top: min(calc(10 / 750 * 100vw), 10px);
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	width: min(calc(710 /750 * 100vw), 710px);
}

/* ------------------------
	simul
------------------------ */
.simul {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/simul_bg.jpg) no-repeat top center / 100%, #edf8e2;
}

.simul .video_wrapper {
	z-index: 1;
}

.simul .video_wrapper video:nth-child(1) {
	position: absolute;
	right: 0;
	top: min(calc(120 / 750 * 100vw), 120px);
	width: min(calc(240 / 750 * 100vw), 240px);
	height: min(calc(310 / 750 * 100vw), 310px);
	z-index: -1;
}

.simul .video_wrapper video:nth-child(2) {
	position: absolute;
	left: 0;
	top: min(calc(543 / 750 * 100vw), 543px);
	width: min(calc(240 / 750 * 100vw), 240px);
	height: min(calc(290 / 750 * 100vw), 290px);
	z-index: -1;
}

.simul .video_wrapper video:nth-child(3) {
	position: absolute;
	left: 0;
	bottom: min(calc(73 / 750 * 100vw), 73px);
	width: min(calc(240 / 750 * 100vw), 240px);
	height: min(calc(310 / 750 * 100vw), 310px);
	z-index: -1;
}

/* ------------------------
	pro
------------------------ */
.pro {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/pro_bg.png) no-repeat top center / 100%;
}

.pro .video_wrapper video {
	position: absolute;
	top: min(calc(200 / 750 *100vw), 200px);
	right: 0;
	width: min(calc(270 / 750 *100vw), 270px);
	height: min(calc(400 / 750 *100vw), 400px);
}

.pro li:nth-child(3) .video_wrapper video {
	top: min(calc(252 / 750 *100vw), 252px);
}

/* ------------------------
	story
------------------------ */
.story {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/story_bg.png) no-repeat top center / 100%;
}

/* ------------------------
	voice
------------------------ */
.voice {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/voice_bg.png) no-repeat top min(calc(1874 / 750 *100vw), 1874px) center / 100%;
}

.voice .video_wrapper video {
	position: absolute;
	top: min(calc(255 / 750 *100vw), 255px);
	right: 0;
	width: min(calc(240 / 750 *100vw), 240px);
	height: min(calc(360 / 750 *100vw), 360px);
}

.voice li:nth-child(3) .video_wrapper video {
	top: min(calc(256 / 750 *100vw), 256px);
}

/* ------------------------
	user_movie
------------------------ */
.user_movie {
	height: min(calc(1200 / 750 * 100vw), 1200px);
}
.user_movie video{
	width: min(calc(750 / 750 * 100vw), 750px);
	height: min(calc(1200 / 750 * 100vw), 1200px);
}

/* ------------------------
	kodawari
------------------------ */
.kodawari {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/kodawari_bg.jpg) no-repeat top center / 100%;
}

.kdwr_slide_wrap {
	position: relative;
}

.kdwr_slide {
	width: min(calc(710 / 750 *100vw), 710px);
	background: #fff;
}

.kdwr_slide_wrap .kdwr_slide {
	position: absolute;
	top: 0;
	right: 0;
}

.kdwr_list01_note {
	z-index: 2;
}


.kdwr_slide h3 {
	width: min(calc(750 / 750 *100vw), 750px);
	position: relative;
	left: 47%;
	transform: translateX(-50%);
}

li:nth-of-type(2) .kdwr_slide h3 {
	right: 47%;
	left: auto;
}

li:nth-of-type(2) .kdwr_slide {
	left: 0;
	right: auto;
}

.kdwr_slide video {
	width: min(calc(710 / 750 *100vw), 710px);
	height: auto;
}

.kdwr_slide .slick-dots {
	bottom: max(calc(-20 / 750 * 100vw), -25px);
}

.kdwr_slide .slick-dots li button::before {
	background-color: #dfe1da;
}

.kdwr_slide .slick-dots li {
	margin: min(calc(15 / 750 *100vw), 15px) min(calc(26 / 750 *100vw), 26px) 0 0;
}

.kdwr_slide .slick-dots li.slick-active button::before {
	background-color: #a0b618;
}

/* ------------------------
	kodawari_point
------------------------ */
.kodawari_point {
	background: url(//images.vitabrid.co.jp/sp/imgs/lp/arv/v1/kodawari_point_bg.jpg) no-repeat top center / 100%;
}

/* ------------------------
	video
------------------------ */
.video_wrapper {
	position: relative;
}

/* ------------------------
	float_btn
------------------------ */
.float_btn {
	display: none;
	position: fixed;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	padding-bottom: min(calc(10/750 * 100vw), 10px);
	z-index: 99;
	width: min(calc(640 / 750 *100vw), 640px);
	margin: 0 auto;
}

/* 商品詳細 */
.ispec *{
	box-sizing: border-box;
}
.ispec h3 span {
	font-family: var(--Fyg);
	font-size: .7em;
}
.ispec .brB {
	margin-left: 10px;
	padding: 5px;
	border: 1px solid #999;
}
.ispec p {
	margin-left: 14px;
	font-size: .9em;
}
.ispec .compo{
	margin: 0 auto 15px;
	display: flex;
	width: 380px;
}
.compo dl{
	padding: 0 10px;
	display: flex;
	width:100%;
	flex-wrap: wrap;
	justify-content: space-between;
	border-right: 1px solid #ccc;
}
.compo dt,.compo dd{
	padding: 7px 0;
	line-height: 1.4;
}
.compo dt{
	width: 50%;
	background: none;
	margin: 0;
	font-weight: normal;
}
.compo dt:before{
	content: none;
}

.compo.kanyo {
	width: 400px;
}
.compo.kanyo dt {
  padding-right: 13px;
  width: 320px;
}
.compo.kanyo dd {
  width: 45px;
  background: none;
  border-right: none;
}
.compo.kanyo dd:last-of-type {
  border-bottom: none;
}
.kanyo .fle {
  align-items: center;
  justify-content: flex-end;
}

.compo2 dl{
	margin-bottom: 10px;
	border: 1px solid #ccc;
	background: #fff;
}
.compo2 dt,.compo2 dd{
	margin: 0;
	padding: 5px 3px;
}
.compo2 dt{
	background: #e1e1e1;
}
.compo2 dt:before{
	content: none;
}