@charset "UTF-8";

@media screen and (min-width: 769px){
	#header{
		position: sticky;
	}
}

.key-visual01 .bg{
	background-image: url(../images/benefits-key-visual.jpg);
}

/* +++#sec01+++ */
#sec01{
	padding-top: 14.3rem;
}
.outline{
	border-left: .5rem solid #00763f;
	padding-left: 2rem;
	margin-bottom: 4.6rem;
	font-weight: 400;
}
.outline h2{
	font-size: 2.4rem;
	font-weight: 700;
	margin-bottom: 2rem;
}
#sec01 ul{
	align-items: stretch;
	border-top: 1px solid rgba(255,255,255,.25);
	padding-bottom: 9.4rem;
}
#sec01 li{
	border-bottom: 1px solid rgba(255,255,255,.25);
	padding-block: 3rem 3rem;
}

#sec01 li:nth-of-type(3n+1),
#sec01 li:nth-of-type(3n){
	width: 33%;
}
#sec01 li:nth-of-type(3n+1){
	padding-right: 2rem;
	border-right: 1px solid rgba(255,255,255,.25);
}
#sec01 li:nth-of-type(3n){
	padding-left: 2rem;
}
#sec01 li:nth-of-type(3n+2){
	width: 34%;
	padding-inline: 2rem;
	border-right: 1px solid rgba(255,255,255,.25);
}
#sec01 li h3{
	font-size: 1.8rem;
	text-align: center;
	padding-bottom: 2rem;
	border-bottom: 1px solid rgba(255,255,255,.25);
}
.icon-area{
	width: 100%;
	height: 15.2rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

#sec01 li:nth-of-type(1) img{
	width: 8.3rem;
}
#sec01 li:nth-of-type(2) img{
	width: 7.3rem;
}
#sec01 li:nth-of-type(3) img{
	width: 8.9rem;
}
#sec01 li:nth-of-type(4) img{
	width: 8.2rem;
}
#sec01 li:nth-of-type(5) img{
	width: 8.9rem;
}
#sec01 li:nth-of-type(6) img{
	width: 8.7rem;
}
#sec01 li:nth-of-type(7) img{
	width: 11.8rem;
}
#sec01 li:nth-of-type(8) img{
	width: 9.4rem;
}
#sec01 li:nth-of-type(9) img{
	width: 11.4rem;
}
#sec01 .desc{
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1.785;
	word-break: break-all;
}
#sec01 li:nth-of-type(10){
	width: 100% !important;
	border-right: none !important;
	padding-inline: 0 !important;
	border-bottom: none;
	padding-bottom: 0;
}
#sec01 li:nth-of-type(10) .flex{
	justify-content: center;
	align-items: center;
	padding-top: 2.8rem;
}
#sec01 li:nth-of-type(10) .icon-area{
	width: 21.8340rem;
	margin-right: 5rem;
	height: auto;
}
.insta-link-button{
	width: fit-content;
	margin-inline: auto;
}
.insta-link-button a{
	width: 25rem;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 1.5rem;
	font-size: 3rem;
	border-bottom: 1px solid #fff;
}
.insta-link-button a:before{
	content: "";
	display: block;
	width: 3rem;
	height: 3rem;
	background: url(../images/instagram-icon01.svg) no-repeat;
	background-size: 100% auto;
	margin-right: 1.4rem;
}



@media screen and (max-width: 768px){
	.key-visual01 .bg{
		background-image: url(../images/sp-benefits-key-visual.jpg);
	}

/* +++#sec01+++ */
	#sec01{
		padding-top: 12.3rem;
		padding-inline: 10rem;
	}
	.outline{
/*
		border-left: .4rem solid #00763f;
*/
		padding-left: 4rem;
		margin-bottom: 12.5rem;
	}
	.outline h2{
		font-size: 5rem;
		font-weight: 700;
		margin-bottom: 4rem;
	}
	#sec01 ul{
		display: block;
		border-top: none;
		padding-bottom: 4rem;
		border-bottom: 1px solid rgba(255,255,255,.25);
		margin-bottom: 14rem;
	}
	#sec01 li{
		border-bottom: none;
		padding-block: 0 4rem;
		width: 100% !important;
	}
	#sec01 li:nth-of-type(3n+1){
		padding-right: 0;
		border-right: none;
	}
	#sec01 li:nth-of-type(3n){
		padding-left: 0;
	}
	#sec01 li:nth-of-type(3n+2){
		padding-inline: 0;
		border-right: none;
	}
	#sec01 li h3{
		font-size: 3.2rem;
		font-weight: 600;
		padding-bottom: 0;
		height: 8rem;
		display: flex;
		justify-content: center;
		align-items: center;
		border-top: 1px solid rgba(255,255,255,.25);
		border-bottom: 1px solid rgba(255,255,255,.25);
	}
	.icon-area{
		height: 32.5rem;
	}

	#sec01 li:nth-of-type(1) img{
		width: 20.9rem;
	}
	#sec01 li:nth-of-type(2) img{
		width: 18.2rem;
	}
	#sec01 li:nth-of-type(3) img{
		width: 18.1rem;
	}
	#sec01 li:nth-of-type(4) img{
		width: 20.5rem;
	}
	#sec01 li:nth-of-type(5) img{
		width: 20.7rem;
	}
	#sec01 li:nth-of-type(6) img{
		width: 19.7rem;
	}
	#sec01 li:nth-of-type(7) img{
		width: 29.5rem;
	}
	#sec01 li:nth-of-type(8) img{
		width: 23.6rem;
	}
	#sec01 li:nth-of-type(9) img{
		width: 28.7rem;
	}
	#sec01 li:nth-of-type(10) img{
		width: 32.5rem;
	}
	#sec01 .desc{
		font-size: 2.6rem;
		line-height: 1.730;
	}
	#sec01 li:nth-of-type(10) .flex{
		display: block;
		padding-top: 0;
	}
	#sec01 li:nth-of-type(10) .icon-area{
		width: 100%;
		margin-right: 0;
		height: 32.5rem;
	}
	.insta-link-button a{
		width: 35rem;
		padding-bottom: 2rem;
		font-size: 4.2rem;
	}
	.insta-link-button a:before{
		width: 4.2rem;
		height: 4.2rem;
		margin-right: 1.8rem;
	}
	main{
		padding-bottom: 6.6rem;
	}
}