@charset "UTF-8";

#kv {
	width: 1220px;
	height: 620px;
	margin: 0 auto;
	padding: 0;
	position: relative;
}
	#kv .circle {
		position: absolute;
		content: '';
		display: block;
		margin: auto;
		padding: 0;
	}
		#kv .circle.kv1 {
			width: 258px;
			top: 23px;
			right: calc(50% + 382px);
			z-index: 1;
		}
		#kv .circle.kv2 {
			width: 458px;
			top: 0;
			right: calc(50% - 171px);
			z-index: 3;
		}
		#kv .circle.kv3 {
			width: 471px;
			top: 14px;
			left: calc(50% + 180px);
			z-index: 2;
		}
		#kv .circle.kv4 {
			width: 268px;
			bottom: 10px;
			right: calc(50% + 430px);
			z-index: 1;
		}
		#kv .circle.kv5 {
			width: 268px;
			bottom: 0;
			left: calc(50% + 66px);
			z-index: 2;
		}
		#kv .circle.kv6 {
			width: 192px;
			bottom: 14px;
			left: calc(50% + 486px);
			z-index: 1;
		}
		#kv .circle.kv7 {
			width: 119px;
			bottom: 30px;
			right: calc(50% + 62px);
			z-index: 1;
		}
		#kv .circle img {
			width: 100%;
			height: auto;
		}
		#kv .circle.kv_main {
			width: 388px;
			height: 387px;
			background: rgba(255,255,255,0.85);
			border: 5px solid #4FBFC8;
			border-radius: 40% 50% 50% 50%/50% 40% 55% 50%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			bottom: 0;
			right: calc(50% + 115px);
			z-index: 3;
		}
			#kv .circle.kv_main:before {
				position: absolute;
				content: '';
				width: 137px;
				height: 164px;
				background: url(../images/top/kv_camp.png) center no-repeat;
				top: -10px;
				left: -45px;
				z-index: 4;
				animation: expansion 5s ease-in-out infinite;
			}
			#kv .circle.kv_main div {
				margin: 0 auto;
				padding: 0;
				font-size: 32px;
				line-height: 120%;
				color: #4DBFC6;
				font-family: 'RocknRoll One', sans-serif;
				font-weight: 500;
			}
			#kv .circle.kv_main p.camp {
				margin: 30px auto 20px;
				padding: 0;
				font-size: 24px;
				line-height: 160%;
				color: #FC5F96;
			}
			#kv .circle.kv_main p.btm {
				margin: 0 auto;
				padding: 0;
				font-size: 15px;
				line-height: 160%;
				color: #796A54;
			}


/* 私たちにとっても「家族」です */
#first_cont {
	width: 1220px;
	margin: 100px auto 150px;
	padding: 0 0 0 140px;
	text-align: left;
}
	#first_cont h3 {
		margin: 0;
		padding: 0;
		font-size: 32px;
		line-height: 160%;
		color: #4CB0A0;
		text-align: left;
		font-family: 'RocknRoll One', sans-serif;
		font-weight: 500;
	}
		#first_cont h3 span {
			font-size: 18px;
			line-height: 160%;
		}
	#first_cont .first_about {
		margin: 35px 0 0;
		padding: 0;
		display: flex;
		align-items: flex-start;
	}
		#first_cont .first_about .txt {
			width: 670px;
			margin: 0;
			padding: 0;
			line-height: 180%;
		}
			#first_cont .first_about .txt p {
				margin: 30px 0 0;
				padding: 0;
				font-size: 17px;
				line-height: 180%;
			}
				#first_cont .first_about .txt p:first-of-type {
					margin: 0;
				}
		#first_cont .first_about .img {
			margin: 0 0 0 40px;
			padding: 0;
		}

/* 私たちができること */
#can_do {
	width: 920px;
	margin: 70px auto 150px;
	padding: 55px 10px;
	background: #fff;
	border-radius: 50px;
}
	#can_do h3 {
		margin: 0;
		padding: 0;
		font-size: 20px;
		line-height: 160%;
		color: #4CB0A1;
		font-weight: 500;
	}
	#can_do h4 {
		margin: 0;
		padding: 0;
		font-size: 20px;
		line-height: 160%;
		font-weight: 500;
	}
	#can_do p {
		width: 700px;
		margin: 20px auto 0;
		padding: 0;
		font-size: 15px;
		line-height: 160%;
		text-align: left;
	}
	#can_do ul.can_do_cont {
		margin: 40px auto 0;
		padding: 0;
		list-style: none;
		display: flex;
		justify-content: center;
		align-items: flex-start;
	}
		#can_do ul.can_do_cont li {
			margin: 0 20px;
			padding: 0;
		}
			#can_do ul.can_do_cont li img {
				width: 90px;
				height: auto;
			}
				#can_do ul.can_do_cont li:nth-child(1) img {
					animation: move1 5s ease-in-out 1s infinite;
				}
				#can_do ul.can_do_cont li:nth-child(2) img {
					animation: move1 5s ease-in-out 1.5s infinite;
				}
				#can_do ul.can_do_cont li:nth-child(3) img {
					animation: move1 5s ease-in-out 2s infinite;
				}
				#can_do ul.can_do_cont li:nth-child(4) img {
					animation: move1 5s ease-in-out 2.5s infinite;
				}
				#can_do ul.can_do_cont li:nth-child(5) img {
					animation: move1 5s ease-in-out 3s infinite;
				}
			#can_do ul.can_do_cont li span {
				height: 3.2em;
				color: #4DB0A2;
				display: flex;
				justify-content: center;
				align-items: center; 
			}

/* ファミーユの特徴について */
#top_about {
	margin: 0 auto;
	padding: 110px 0 30px;
	background: #D7F2E3;
	position: relative;
	z-index: 1;
	transform: translate3d(0,0,0);
}
	#top_about:before {
		position: absolute;
		content: '';
		width: 120%;
		height: 22px;
		display: block;
		margin: 0;
		padding: 0;
		background: url(../images/top/about_top.png) left top repeat-x;
		top: -22px;
		left: 0;
		animation: move2 10s linear infinite;
	}
	#top_about:after {
		position: absolute;
		content: '';
		width: 120%;
		height: 22px;
		display: block;
		margin: 0;
		padding: 0;
		background: url(../images/top/about_btm.png) left top repeat-x;
		bottom: -22px;
		left: 0;
		animation: move2 12s linear infinite;
	}
	#top_about div.about_in {
		width: 1220px;
		margin: 0 auto;
		padding: 0;
		position: relative;
		z-index: 3;
		transform: translateZ(1px);
	}
		#top_about div.about_in h3 {
			opacity: 0;
			width: 555px;
			margin: 0 auto;
			padding: 20px 5px 24px;
			background: rgba(255,255,255,0.5);
			border-radius: 20% 30% 15% 20%/50% 50% 50% 55%;
		}
			#top_about.scrollin div.about_in h3 {
				animation: anim1 0.5s ease 1.0s 1 forwards;
			}
			#top_about div.about_in h3 span {
				margin: 0 auto;
				padding: 0;
				font-size: 14px;
				line-height: 120%;
				color: #4CB0A1;
				font-family: 'Baloo Chettan 2', cursive;
				font-weight: 700;
			}
			#top_about div.about_in h3 p {
				margin: 0 auto;
				padding: 0;
				font-size: 36px;
				line-height: 120%;
				font-family: 'RocknRoll One', sans-serif;
				font-weight: 500;
			}
		#top_about div.about_in ul {
			width: 100%;
			margin: 0 auto;
			padding: 45px 0 0;
			list-style: none;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: flex-start;
		}
			#top_about div.about_in ul li {
				width: 340px;
				padding: 80px 5px 30px;
				background: #fff;
				position: relative;
			}
				#top_about div.about_in ul li span {
					position: absolute;
					content: '';
					width: 107px;
					height: 109px;
					padding: 22px 0 0;
					font-size: 50px;
					line-height: 120%;
					color: #fff;
					font-weight: bold;
					font-family: 'Baloo Chettan 2', cursive;
					background: url(../images/top/about_pop.png) center no-repeat;
					top: -40px;
					left: 10px;
					display: flex;
					justify-content: center;
				}
				#top_about div.about_in ul li:nth-of-type(4) {
					height: 342px;
					margin: 40px 34px 0;
					border-radius: 40% 50% 50% 50%/50% 40% 55% 50%;
				}
				#top_about div.about_in ul li:nth-of-type(1),
				#top_about div.about_in ul li:nth-of-type(6) {
					height: 342px;
					margin: 40px 34px 0 100px;
					border-radius: 40% 50% 50% 50%/50% 40% 55% 50%;
				}
				#top_about div.about_in ul li:nth-of-type(2),
				#top_about div.about_in ul li:nth-of-type(7) {
					height: 339px;
					margin: 40px 100px 0 34px;
					border-radius: 50% 50% 45% 48%/50% 40% 55% 52%;
				}
				#top_about div.about_in ul li:nth-of-type(3) {
					height: 339px;
					margin: 40px 34px 0 0;
					border-radius: 50% 50% 45% 48%/50% 40% 55% 52%;
				}
				#top_about div.about_in ul li:nth-of-type(5) {
					height: 339px;
					margin: 40px 0 0 34px;
					border-radius: 50% 50% 45% 48%/50% 40% 55% 52%;
				}
					#top_about div.about_in ul li.scrollin:nth-of-type(1) span,
					#top_about div.about_in ul li.scrollin:nth-of-type(3) span,
					#top_about div.about_in ul li.scrollin:nth-of-type(6) span {
						animation: move1 4s ease-in-out 1s infinite;
					}
					#top_about div.about_in ul li.scrollin:nth-of-type(2) span,
					#top_about div.about_in ul li.scrollin:nth-of-type(5) span,
					#top_about div.about_in ul li.scrollin:nth-of-type(7) span {
						animation: move1 4s ease-in-out 1.5s infinite;
					}
					#top_about div.about_in ul li.scrollin:nth-of-type(4) span {
						animation: move1 4s ease-in-out 2s infinite;
					}
				#top_about div.about_in ul li img {
					width: 148px;
					height: auto;
				}
				#top_about div.about_in ul li h4 {
					margin: 10px auto 0;
					padding: 0;
					font-size: 22px;
					line-height: 140%;
					font-family: 'RocknRoll One', sans-serif;
					font-weight: 500;
				}
				#top_about div.about_in ul li p {
					margin: 15px auto 0;
					padding: 0;
					font-size: 16px;
					line-height: 160%;
				}
				#top_about div.about_in ul li small {
					display: block;
					margin: 10px auto 0;
					padding: 0;
					font-size: 14px;
					line-height: 160%;
				}
		#top_about div.about_btm {
			margin: 90px auto 0;
			padding: 0;
			display: flex;
			justify-content: flex-end;
		}
			#top_about div.about_btm p {
				margin: 0;
				padding: 0 0 0 1em;
				text-indent: -1em;
				font-size: 14px;
				line-height: 160%;
				text-align: left;
				display: flex;
				justify-content: flex-end;
			}
	#top_about img.bg_circle {
		position: absolute;
		display: block;
		z-index: 2;
		transform: translateZ(1px);
	}
		#top_about img.bg_circle.circle1 {
			top: 0;
			left: calc(50% + 475px);
		}
		#top_about img.bg_circle.circle2 {
			bottom: 680px;
			right: calc(50% + 440px);
		}
		#top_about img.bg_circle.circle3 {
			bottom: 10px;
			right: calc(50% + 600px);
		}
		#top_about img.bg_circle.circle4 {
			top: 180px;
			right: calc(50% + 210px);
		}
		#top_about img.bg_circle.circle5 {
			bottom: -100px;
			left: calc(50% + 320px);
		}
		#top_about img.bg_circle.circle6 {
			bottom: 0;
			left: calc(50% + 650px);
		}

/* 料金について */
#top_price {
	width: 1220px;
	margin: 160px auto 0;
	padding: 0;
	display: flex;
	flex-direction: row-reverse;
}
	#top_price .img {
		width: 605px;
		height: 500px;
		margin: 0;
		padding: 0;
		border-radius: 60px;
	}
		#top_price .img img {
			border-radius: 0 60px 60px 0;
		}
	#top_price .txt {
		width: 615px;
		height: 500px;
		margin: 0;
		padding: 90px 48px 0;
		background: #fff;
		border-top: 7px solid #F4F4F2;
		border-bottom: 7px solid #F4F4F2;
		border-left: 7px solid #F4F4F2;
		border-radius: 60px 0 0 60px;
	}
		#top_price .txt h3 {
			margin: 0;
			padding: 0;
			font-size: 36px;
			line-height: 120%;
			text-align: left;
			font-family: 'RocknRoll One', sans-serif;
			font-weight: 500;
		}
		#top_price .txt p {
			margin: 30px 0 0;
			padding: 0;
			font-size: 16px;
			line-height: 160%;
			text-align: left;
		}
			#top_price .txt p:first-of-type {
				margin: 40px 0 0;
			}

/* 商品/ブログ */
#top_productsblog {
	width: 1220px;
	margin: 100px auto 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
	#top_productsblog div.productsblog_box {
		width: 580px;
		margin: 0;
		padding: 0;
	}
		#top_productsblog div.productsblog_box .img {
			width: 100%;
			height: 210px;
			margin: 0;
			padding: 0;
			border-radius: 60px;
		}
			#top_productsblog div.productsblog_box .img img {
				border-radius: 60px 60px 0 0;
			}
		#top_productsblog div.productsblog_box .txt {
			width: 100%;
			margin: 0;
			padding: 35px 40px 45px;
			background: #fff;
			border-right: 7px solid #F4F4F2;
			border-bottom: 7px solid #F4F4F2;
			border-left: 7px solid #F4F4F2;
			border-radius: 0 0 60px 60px;
		}
			#top_productsblog div.productsblog_box .txt h3 {
				margin: 0;
				padding: 0;
				font-size: 24px;
				line-height: 120%;
				font-family: 'RocknRoll One', sans-serif;
				font-weight: 500;
			}
			#top_productsblog div.productsblog_box .txt p {
				height: 90px;
				margin: 25px 0 0;
				padding: 0;
				font-size: 16px;
				line-height: 160%;
				text-align: left;
			}
		#top_productsblog div.productsblog_box .btm_txt {
			margin: 5px 0 0;
			padding: 0;
			font-size: 14px;
			line-height: 160%;
		}

/* 送迎サービス */
#top_transfer {
	width: 920px;
	margin: 135px auto 0;
	padding: 65px 30px 25px 55px;
	background: #D7F2E3;
	border-radius: 50px;
	display: flex;
	justify-content: space-between;
}
	#top_transfer .txt {
		width: 480px;
		margin: 0;
		padding: 0;
		position: relative;
	}
		#top_transfer .txt div {
			position: absolute;
			display: block;
			content: '';
			width: 344px;
			height: 77px;
			margin: 0 auto;
			padding: 20px 0 0;
			font-size: 20px;
			line-height: 120%;
			font-family: 'RocknRoll One', sans-serif;
			font-weight: 500;
			background: url(../images/top/transfer_ttl.png) center no-repeat;
			top: -90px;
			left: -20px;
			animation: expansion 5s ease-in-out 1s infinite;
		}
		#top_transfer .txt h3 {
			margin: 0;
			padding: 0;
			font-size: 30px;
			line-height: 120%;
			text-align: left;
			font-family: 'RocknRoll One', sans-serif;
			font-weight: 500;
		}
		#top_transfer .txt p {
			margin: 8px 0 0;
			padding: 0;
			font-size: 16px;
			line-height: 160%;
			text-align: left;
		}
	#top_transfer .transfer_btn {
		width: 312px;
		margin: 75px 0 0;
		padding: 0;
		position: relative;
		z-index: 1;
	}
		#top_transfer .transfer_btn img {
			position: absolute;
			display: block;
			width: 318px;
			height: auto;
			top: -165px;
			left: -18px;
			z-index: -1;
			animation: move3 2s ease-in-out 1s infinite;
		}

/* 各種決済（トップ） */
#credit_cont {
	margin: 103px auto 150px;
}

/* お知らせ・インスタグラム */
#top_infoinsta {
	width: 100%;
	margin: 0 auto;
	padding: 105px 0 110px;
	background: #fff;
}
	#top_infoinsta div.info_cont {
		width: 680px;
		margin: 0 auto;
		padding: 10px 0 0;
		text-align: left;
	}
		#top_infoinsta div.info_cont dl {
			width: 100%;
			margin: 0;
			padding: 0;
		}
			#top_infoinsta div.info_cont dl dt {
				margin: 15px 0 0;
				padding: 0;
				color: #4CB0A1;
			}
			#top_infoinsta div.info_cont dl dd {
				margin: 0;
				padding: 0;
			}

/* 共通 */
div.link_btn {
	padding: 0;
}
	div.link_btn a {
		display: block;
		width: 312px;
		margin: 0 auto;
		padding: 0;
		font-size: 18px;
		line-height: 60px;
		text-decoration: none;
		color: #fff;
		background: #4DB0A2;
		border: 3px solid #4DB0A2;
		border-radius: 30px;
		transition: 0.2s linear;
	}
		div.link_btn a:hover {
			color: #796A53;
			background: #fff;
		}
/* コンテンツタイトル */
h3.cont_ttl {
	width: 388px;
	padding: 15px 5px 18px;
	background: rgba(235,249,241,0.5);
	border-radius: 20% 30% 15% 20%/50% 50% 50% 55%;
}
	h3.cont_ttl span {
		margin: 0 auto;
		padding: 0;
		font-size: 14px;
		line-height: 120%;
		color: #4CB0A1;
		font-family: 'Baloo Chettan 2', cursive;
		font-weight: 700;
	}
	h3.cont_ttl p {
		margin: 0 auto;
		padding: 0;
		font-size: 24px;
		line-height: 120%;
		font-family: 'RocknRoll One', sans-serif;
		font-weight: 500;
	}