@charset "utf-8";
/* CSS Document */
.main-wrap{
	background: #F6EBEF;
	background: linear-gradient(180deg, rgba(246, 235, 239, 1) 0%, rgba(246, 235, 239, 1) 30%, rgba(248, 248, 248, 1) 70%, rgba(248, 248, 248, 1) 100%);
}

.fv.couple{
	background: #EE8DB2;
	background: linear-gradient(180deg, rgba(238, 141, 178, 0.6) 0%, rgba(238, 141, 178, 0.6) 70%, rgba(246, 235, 239, 1) 100%);
}
.fv.parent{
	background: #B995E6;
	background: linear-gradient(180deg, rgba(185, 149, 230, 0.6) 0%, rgba(185, 149, 230, 0.6) 70%, rgba(246, 235, 239, 1) 100%);
}
.fv.pet{
	background: #6ABDE2;
	background: linear-gradient(180deg, rgba(106, 189, 226, 0.6) 0%, rgba(106, 189, 226, 0.6) 70%, rgba(246, 235, 239, 1) 100%);
}

.fv{
	position: relative;
	overflow: hidden;
	height: 100vh;
}
.fv .txtbox{
	width: 40%;
	padding: 0 5%;
	color: #fff;
	align-items: flex-start;
}
.fv .txtbox > img{
	height: 4vw;
	width: auto;
	max-width: 100%;
}
.fv .imgbox1,.fv .imgbox2{
	position: relative;
	height: 100vh;
}
.fv .imgbox1 img,.fv .imgbox2 img{
	position: absolute;
	border-radius: 10px;
}
.fv .imgbox1{
	width: 25%;
}
.fv .imgbox2{
	width: 35%;
}
.fv .imgbox1 img:nth-of-type(1){
	width: 40%;
	top: 12%;
	left: 0;
	transform: translateX(-40%);
}
.fv .imgbox1 img:nth-of-type(2){
	width: 50%;
	top: 30%;
	left: 50%;
}
.fv .imgbox1 img:nth-of-type(3){
	width: 60%;
	bottom: 8%;
	left: 0;
	transform: translateX(-30%);
}
.fv .imgbox2 img:nth-of-type(1){
	width: 25%;
	top: 5%;
	left: 0;
}
.fv .imgbox2 img:nth-of-type(2){
	width: 50%;
	top: 15%;
	right: 5%;
}
.fv .imgbox2 img:nth-of-type(3){
	width: 25%;
	top: 55%;
	left: 0;
}
.fv .imgbox2 img:nth-of-type(4){
	width: 40%;
	bottom: 5%;
	left: 35%;
}

.planarea{
	background-color: #fff;
	border-radius: 1000px;
	padding: 5%;
	padding-top: 0;
}
.planarea .titlebox{
	transform: translateY(-50%);
}
.planarea .contents .plan_price{
	gap: 15px;
}
.planarea .contents .plan_price .price_txt{
	font-size: clamp(30px, 6vw, 50px);
	font-weight: 900;
	color: #72D9D0;
	letter-spacing: 2px;
	line-height: 1;
}
.planarea .contents .plan_list p{
	padding: 15px 10px;
	border-bottom: 2px solid #C1C1C1;
}
.planarea .contents .plan_list p:first-of-type{
	border-top: 2px solid #C1C1C1;
}

body.on .fv .txtbox{
	opacity:0;
	-ms-filter: blur(20px);
	filter: blur(20px);
	animation-name: blurin;
	animation-duration: 1.8s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
body.on .fv .txtbox{
	animation-delay: 1.8s;
}

body.on .fv .imgbox1 img,body.on .fv .imgbox2 img{
	opacity:0;
	-ms-filter: blur(20px);
	filter: blur(20px);
	animation-name: blurin;
	animation-duration: 1.0s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
body.on .fv .imgbox1 img:nth-of-type(1){
}
body.on .fv .imgbox1 img:nth-of-type(2){
	animation-delay: 0.3s;
}
body.on .fv .imgbox1 img:nth-of-type(3){
	animation-delay: 0.6s;
}
body.on .fv .imgbox2 img:nth-of-type(1){
	animation-delay: 0.9s;
}
body.on .fv .imgbox2 img:nth-of-type(2){
	animation-delay: 0.3s;
}
body.on .fv .imgbox2 img:nth-of-type(3){
	animation-delay: 0.6s;
}
body.on .fv .imgbox2 img:nth-of-type(4){
	animation-delay: 1.2s;
}

/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1440px ~ ---------- */
@media screen and (max-width: 1440px){
	.fv .imgbox1{
		width: 20%;
	}
	.fv .txtbox{
		width: 45%;
	}
	.fv .imgbox1 img:nth-of-type(1){
		width: 45%;
		top: 12%;
		left: 0;
		transform: translateX(-40%);
	}
	.fv .imgbox1 img:nth-of-type(2){
		width: 60%;
		top: 30%;
		left: 50%;
	}
	.fv .imgbox1 img:nth-of-type(3){
		width: 70%;
		bottom: 8%;
		left: 0;
		transform: translateX(-30%);
	}
	.fv .imgbox2 img:nth-of-type(1){
		width: 30%;
		top: 5%;
		left: 0;
	}
	.fv .imgbox2 img:nth-of-type(2){
		width: 60%;
		top: 15%;
		right: 5%;
	}
	.fv .imgbox2 img:nth-of-type(3){
		width: 30%;
		top: 55%;
		left: 0;
	}
	.fv .imgbox2 img:nth-of-type(4){
		width: 45%;
		bottom: 5%;
		left: 35%;
	}
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){

}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
	.fv .txtbox{
		width: 50%;
		padding-left: 3%;
		padding-right: 3%;
	}
	.fv .txtbox > img{
		height: 6vw;
	}
	.fv .imgbox1{
		width: 20%;
	}
	.fv .imgbox2{
		width: 30%;
	}
	.fv .imgbox1 img:nth-of-type(1){
		width: 70%;
		top: 12%;
		left: 0;
		transform: translateX(-40%);
	}
	.fv .imgbox1 img:nth-of-type(2){
		width: 80%;
		top: 30%;
		left: 20%;
	}
	.fv .imgbox1 img:nth-of-type(3){
		width: 100%;
		bottom: 8%;
		left: 0;
		transform: translateX(-20%);
	}
	.fv .imgbox2 img:nth-of-type(1){
		width: 50%;
		top: 5%;
		left: 0;
	}
	.fv .imgbox2 img:nth-of-type(2){
		width: 80%;
		top: 25%;
		right: 5%;
	}
	.fv .imgbox2 img:nth-of-type(3){
		width: 60%;
		top: 55%;
		left: 0;
	}
	.fv .imgbox2 img:nth-of-type(4){
		width: 80%;
		bottom: 5%;
		left: 25%;
	}

}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){

}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
	.fv .txtbox{
		width: 90%;
		padding: 120px 0 50px;
		padding-left: 5%;
		padding-right: 5%;
		position: relative;
		z-index: 2;
		text-shadow: 0 2px 8px rgba(0,0,0,0.1);
	}
	.fv .txtbox > img{
		height: 10vw;
	}
	.fv .imgbox1{
		position: absolute;
		left: 0;
		top: 0;
		width: 20%;
		z-index: 1;
	}
	.fv .imgbox2{
		position: absolute;
		width: 30%;
		right: 0;
		top: 0;
		z-index: 1;
	}
	.fv .imgbox1 img:nth-of-type(1){
		width: 70%;
		top: 12%;
		left: 0;
		transform: translateX(-40%);
	}
	.fv .imgbox1 img:nth-of-type(2){
		width: 80%;
		top: 30%;
		left: 20%;
	}
	.fv .imgbox1 img:nth-of-type(3){
		width: 100%;
		bottom: 8%;
		left: 0;
		transform: translateX(-20%);
	}
	.fv .imgbox2 img:nth-of-type(1){
		width: 50%;
		top: 5%;
		left: 0;
	}
	.fv .imgbox2 img:nth-of-type(2){
		width: 80%;
		top: 25%;
		right: 5%;
	}
	.fv .imgbox2 img:nth-of-type(3){
		width: 60%;
		top: 55%;
		left: 0;
	}
	.fv .imgbox2 img:nth-of-type(4){
		width: 80%;
		bottom: 5%;
		left: 25%;
	}
	.planarea{
		border-radius: 30px;
		padding: 0 20px 40px;
	}
}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}