@charset "utf-8";
/* CSS Document */
body{
	background-color: #F8F8F8;
}
.txt_color1{color: #EB94B6;}

.fv{
	position: relative;
	background: #EE8DB2;
	background: linear-gradient(135deg, rgba(238, 141, 178, 0.6) 0%, rgba(238, 141, 178, 0.6) 20%, rgba(190, 142, 234, 0.6) 55%, rgba(103, 182, 248, 0.6) 100%);
	min-height: 100vh;
	overflow: hidden;
}
.fv .fv_contents{
	position: relative;
	z-index: 2;
	width: 100%;
	padding: 0 5%;
	justify-content: space-around;
	align-items: flex-start;
	max-width: 1440px;
}
.fv .fv_contents .txtbox{
	width: 30%;
	color: #fff;
	flex-direction: column;
	gap: 30px;
}
.fv .fv_contents .fv_iconwrap{
	width: 25%;
	margin-top: 15%;
}
.fv .fv_contents .fv_iconwrap > div{
	width: 48%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	margin-bottom: -15%;
}
.fv .fv_contents .fv_iconwrap > div img{
	height: 18%;
	width: auto;
}
.fv .fv_contents .fv_iconwrap .icon1{
	background-color: #EB94B6;
	margin-left: auto;
	margin-right: 10%;
}
.fv .fv_contents .fv_iconwrap .icon2{
	background-color: #B995E6;
}
.fv .fv_contents .fv_iconwrap .icon3{
	background-color: #68C1E8;
	margin-left: auto;
	margin-right: 0;
}
.fv .fv_contents .sp_area{
	width: 25%;
}
.fv .bg_imgwrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.fv .bg_imgwrap img{
	position: absolute;
	border-radius: 10px;
}
.fv .bg_imgwrap img:nth-of-type(1){
	width: 10%;
	top: 8%;
	left: 5%;
}
.fv .bg_imgwrap img:nth-of-type(2){
	width: 15%;
	bottom: 5%;
	left: 0;
	transform: translateX(-20%);
}
.fv .bg_imgwrap img:nth-of-type(3){
	width: 12%;
	top: 20%;
	left: 50%;
}
.fv .bg_imgwrap img:nth-of-type(4){
	width: 20%;
	top: 3%;
	right: 3%;
}
.fv .bg_imgwrap img:nth-of-type(5){
	width: 12%;
	bottom: 3%;
	right: 15%;
}

body.on .fv .fv_contents .txtbox,body.on .fv .fv_contents .fv_iconwrap,body.on .fv .fv_contents .sp_area{
	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 .fv_contents .txtbox{
	animation-delay: 1.8s;
}
body.on .fv .fv_contents .fv_iconwrap{
	animation-delay: 2.0s;
}
body.on .fv .fv_contents .sp_area{
	animation-delay: 3.0s;
}

body.on .fv .bg_imgwrap 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 .bg_imgwrap img:nth-of-type(1){
}
body.on .fv .bg_imgwrap img:nth-of-type(2){
	animation-delay: 0.3s;
}
body.on .fv .bg_imgwrap img:nth-of-type(3){
	animation-delay: 0.6s;
}
body.on .fv .bg_imgwrap img:nth-of-type(4){
	animation-delay: 0.9s;
}
body.on .fv .bg_imgwrap img:nth-of-type(5){
	animation-delay: 1.2s;
}
.top_contents{
	background: #F6EBEF;
	background: linear-gradient(180deg, rgba(246, 235, 239, 1) 0%, rgba(246, 235, 239, 1) 21%, rgba(242, 229, 255, 1) 55%, rgba(242, 229, 255, 1) 69%, rgba(228, 243, 248, 1) 81%, rgba(228, 243, 248, 1) 100%);	
}
.top_contents .cate_wrap .cate:nth-of-type(even){
	flex-direction: row-reverse;
}
.top_contents .cate_wrap .cate .txtbox{
	width: 40%;
}
.top_contents .cate_wrap .cate .txtbox > img{
	height: 4vw;
	width: auto;
	max-width: 100%;
}
.top_contents .cate_wrap .cate .imgbox{
	position: relative;
	width: 60%;
	aspect-ratio: 1 / 1;
}
.top_contents .cate_wrap .cate .imgbox .sp_area{
	position: relative;
	z-index: 2;
	width: 50%;
	margin: 0 auto;
}
.top_contents .cate_wrap .cate .imgbox .sp_area .spbox .icon{
	position: absolute;
	width: 40%;
	top: 0;
	left: 0;
	z-index: 3;
	transform: translate(-50%,-50%);
	aspect-ratio: 1 / 1;
	border-radius: 50%;
}
.top_contents .cate_wrap .cate:nth-of-type(1) .imgbox .sp_area .spbox .icon{
	background-color: #EB94B6;
}
.top_contents .cate_wrap .cate:nth-of-type(2) .imgbox .sp_area .spbox .icon{
	background-color: #B995E6;
}
.top_contents .cate_wrap .cate:nth-of-type(3) .imgbox .sp_area .spbox .icon{
	background-color: #68C1E8;
}

.top_contents .cate_wrap .cate .imgbox .sp_area .spbox .icon img{
	height: 18%;
	width: auto;
}

.top_contents .cate_wrap .cate .imgbox .imgwrap{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
}
.top_contents .cate_wrap .cate .imgbox .imgwrap img{
	position: absolute;
	border-radius: 10px;
}
.top_contents .cate_wrap .cate .imgbox.on .imgwrap img{
	opacity:0;
	-ms-filter: blur(20px);
	filter: blur(20px);
}
.top_contents .cate_wrap .cate .imgbox.on.active .imgwrap img{
	animation-name: blurin;
	animation-duration: 1.8s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}

.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(1){
	width: 40%;
}
.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(2){
	width: 20%;
	animation-delay: 0.3s;
}
.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(3){
	width: 30%;
	animation-delay: 0.6s;
}
.top_contents .cate_wrap .cate:nth-of-type(odd) .imgbox .imgwrap img:nth-of-type(1){
	top: 0;
	right: -20px;
}
.top_contents .cate_wrap .cate:nth-of-type(odd) .imgbox .imgwrap img:nth-of-type(2){
	left: 0;
	top: 15%;
}
.top_contents .cate_wrap .cate:nth-of-type(odd) .imgbox .imgwrap img:nth-of-type(3){
	bottom: 0;
	left: 7%;
}
.top_contents .cate_wrap .cate:nth-of-type(even) .imgbox .imgwrap img:nth-of-type(1){
	top: 0;
	left: -20px;
}
.top_contents .cate_wrap .cate:nth-of-type(even) .imgbox .imgwrap img:nth-of-type(2){
	right: 0;
	top: 15%;
}
.top_contents .cate_wrap .cate:nth-of-type(even) .imgbox .imgwrap img:nth-of-type(3){
	bottom: 0;
	left: 7%;
}

.link_bt_wrap .title{
}
/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1440px ~ ---------- */
@media screen and (max-width: 1440px){
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
	.fv .fv_contents .sp_area{
		width: 30%;
	}

}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
	.top_contents .cate_wrap .cate .imgbox{
		padding: 10% 5%;
	}
	.top_contents .cate_wrap .cate .imgbox .sp_area{
		width: 70%;
	}
	.top_contents .cate_wrap .cate .txtbox > img{
		height: 5vw;
		width: auto;
		max-width: 100%;
	}
}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
	.fv .fv_contents{
		justify-content: center;
		gap: 50px;
	}
	.fv .fv_contents .txtbox{
		width: 50%;
	}
	.fv .fv_contents .fv_iconwrap{
		width: 30%;
	}
	.fv .fv_contents .sp_area{
		width: 40%;
	}
	.fv .bg_imgwrap img:nth-of-type(1){
		width: 22%;
		top: 8%;
		left: 5%;
	}
	.fv .bg_imgwrap img:nth-of-type(2){
		width: 25%;
		bottom: 5%;
		left: 0;
		transform: translateX(-20%);
	}
	.fv .bg_imgwrap img:nth-of-type(3){
		width: 22%;
		top: 40%;
		left: 50%;
	}
	.fv .bg_imgwrap img:nth-of-type(4){
		width: 30%;
		top: 3%;
		right: 3%;
	}
	.fv .bg_imgwrap img:nth-of-type(5){
		width: 25%;
		bottom: 3%;
		right: 10%;
	}

	.top_contents .cate_wrap .cate .imgbox{
		padding: 15% 5%;
	}
	.top_contents .cate_wrap .cate .imgbox .sp_area{
		width: 80%;
	}
	.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(1){
		width: 50%;
	}
	.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(2){
		width: 30%;
	}
	.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(3){
		width: 40%;
	}
	.top_contents .cate_wrap .cate .txtbox > img{
		height: 6vw;
		width: auto;
		max-width: 100%;
	}

}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
	.fv .fv_contents{
		padding: 100px 5% 50px;
	}
	.fv .fv_contents .txtbox{
		width: 70%;
	}
	.fv .fv_contents .fv_iconwrap{
		width: 60%;
		margin-top: 0;
		margin-bottom: 50px;
		order: 3;
	}
	.fv .fv_contents .sp_area{
		order: 2;
		width: 80%;
	}
	.fv .bg_imgwrap{
		height: 100vh;
	}
	.fv .bg_imgwrap img:nth-of-type(1){
		width: 28%;
		top: 12%;
		left: 5%;
	}
	.fv .bg_imgwrap img:nth-of-type(2){
		width: 35%;
		bottom: 5%;
		left: 0;
		transform: translateX(-20%);
	}
	.fv .bg_imgwrap img:nth-of-type(3){
		width: 33%;
		top: 40%;
		left: 70%;
	}
	.fv .bg_imgwrap img:nth-of-type(4){
		width: 40%;
		top: 3%;
		right: 3%;
	}
	.fv .bg_imgwrap img:nth-of-type(5){
		width: 32%;
		bottom: 3%;
		right: 5%;
	}
	
	.top_contents .cate_wrap .cate .txtbox{
		width: 80%;
		margin-bottom: 50px;
	}
	.top_contents .cate_wrap .cate .imgbox{
		width: 100%;
	}
	.top_contents .cate_wrap .cate .imgbox{
		padding: 20% 5%;
	}
	.top_contents .cate_wrap .cate .imgbox .sp_area{
		width: 90%;
	}
	.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(1){
		width: 50%;
	}
	.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(2){
		width: 30%;
	}
	.top_contents .cate_wrap .cate .imgbox .imgwrap img:nth-of-type(3){
		width: 40%;
	}
	.top_contents .cate_wrap .cate .txtbox > img{
		height: 10vw;
		width: auto;
		max-width: 100%;
	}
}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}

