.strength-page{
    background-image: linear-gradient(to bottom, #f8fafd 0, #eef3f8 100%);
    padding-bottom: 50px;
}

/*---------------------------------------------
	ヒーローセクション
---------------------------------------------*/
.hero-section{
    width: 100%;
}
.hero-section .section-title{
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 220px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    z-index: 1;
}
.hero-section .section-title:after{
    content: "STRENGTH";
    display: inline-block;
    background-image: linear-gradient(0deg, #e4ebf4 0, transparent 100%);
    font-family: 'Montserrat', sans-serif;
    font-size: 200px;
    font-weight: 900;
    line-height: 1.05em;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    transform: translateX(-50%);
    position: absolute;
    bottom: 0;
    left: 50%;
    z-index: -1;
}

@media screen and ( max-width: 810px ){
    .hero-section .section-title{
        min-height: 150px;
		letter-spacing: 0;
    }
    .hero-section .section-title:after{
        font-size: 150px;
        letter-spacing: -0.08em;
    }
}
@media screen and ( max-width: 480px ){
    .hero-section .section-title{
		font-size: 26px;
        min-height: 100px;
    }
    .hero-section .section-title:after{
        font-size: 80px;
    }
}



/* ===================================================
   アンカーリンク
=================================================== */
.anchor-list{
	display: flex;
	gap: 20px;
	max-width: 1280px;
	margin: 0 auto 80px;
}
.anchor-list > li{
	width: calc((100% - 60px) / 4);
}
.anchor-list > li a{
	display: block;
	background-color: #eaebf2;
	background-repeat: no-repeat;
	padding: 30px 30px 220px;
	border-radius: 30px;
	box-shadow: 0 0 0 1px #c9d4e1, 0 5px 10px rgba(201, 212, 225, 0.3);
	transition: all .3s ease;
	position: relative;
}
.anchor-list > li a:after{
	content: "";
	border: 25px solid transparent;
	border-top: 20px solid #dbe4ec;
	transform: translateX(-50%);
	transition: all .3s ease;
	position: absolute;
	left: 50%;
	bottom: -60px;
}

/**/
.anchor-list > li a:hover{
	box-shadow: 0 0 0 3px #c9d4e1, 0 5px 10px rgba(201, 212, 225, 0.3);
}
.anchor-list > li a:hover:after{
	opacity: 1;
	border-top-color: #c3d1dd;
	bottom: -70px;
}

.anchor-list > li p{
	font-size: 14px;
	line-height: 1.8em;
}
.anchor-list > li p.title{
	margin-bottom: 10px;
	color: var(--color-primary);
	font-size: 22px;
	font-weight: 800;
	line-height: 1.5em;
	text-align: center;
}

/**/
.anchor-list > li.schedule a{
	background-image: url(../../_images/strength/schedule-icon.webp);
	background-position: center calc(100% + 30px);
}
.anchor-list > li.staff a{
	background-image: url(../../_images/strength/staff-icon.webp);
	background-position: center calc(100% + 55px);
}
.anchor-list > li.cooperation a{
	background-image: url(../../_images/strength/cooperation-icon.webp);
	background-position: center calc(100%);
}
.anchor-list > li.lineup a{
	background-image: url(../../_images/strength/lineup-icon.webp);
	background-position: center calc(100% + 30px);
}

@media screen and ( max-width: 810px ) {
	.anchor-list{
		flex-wrap: wrap;
		gap: 40px 20px;
		margin: 0 20px 80px;
	}
	.anchor-list > li{
		width: calc((100% - 20px) / 2);
	}
	.anchor-list > li a{
		background-size: auto 150px;
		padding: 15px 15px 120px;
	}
	.anchor-list > li a:after{
		bottom: -46px;
	}
	/**/
	.anchor-list > li a:hover:after{
		bottom: -46px;
	}

	.anchor-list > li p.title{
		font-size: 20px;
		letter-spacing: -0.03em;
	}

	.anchor-list > li.schedule a{
		background-position: center calc(100% + 30px);
	}
	.anchor-list > li.staff a{
		background-position: center calc(100% + 40px);
	}
	.anchor-list > li.cooperation a{
		background-size: auto 120px;
		background-position: center calc(100% + 7px);
	}
	.anchor-list > li.lineup a{
		background-position: center calc(100% + 30px);
	}
}

@media screen and ( max-width: 480px ) {
	.anchor-list{
		flex-wrap: wrap;
		gap: 30px 20px;
		margin: 0 20px 80px;
	}
	.anchor-list > li{
		width: 100%;
	}
	.anchor-list > li a{
		background-size: auto 110px;
		background-position: bottom 100%;
		padding: 15px 15px;
	}
	.anchor-list > li a:after{
		content: "";
		border-width: 20px;
		border-top-width: 15px;
		bottom: -36px;
	}
	/**/
	.anchor-list > li a:hover:after{
		bottom: -36px;
	}

	.anchor-list > li p{
		padding-right: 90px;
	}
	.anchor-list > li p.title{
		padding-right: 0;
		font-size: 18px;
		letter-spacing: -0.03em;
	}
	.anchor-list > li p.title br{
		display: none;
	}

	.anchor-list > li.schedule a{
		background-position: calc(100% + 20px) calc(100% + 30px);
	}
	.anchor-list > li.staff a{
		background-position: calc(100% + 20px) calc(100% + 40px);
	}
	.anchor-list > li.cooperation a{
		background-size: auto 100px;
		background-position: calc(100% + 30px) calc(100% + 10px);
	}
	.anchor-list > li.lineup a{
		background-position: calc(100% + 20px) calc(100% + 30px);
	}

}



/* ===================================================
   下部エリア
=================================================== */
/**/
.strength-box{
    max-width: 1080px;
    background-color: #fff;
    margin: 100px auto;
	border: 1px solid #e2eaf3;
	box-shadow: 0 5px 10px rgba(201, 212, 225, 0.3);
    border-radius: 20px;
	overflow: hidden;
    transition: opacity 0.3s ease;
}

.strength-box .box-title{
	display: flex;
	align-items: center;
	min-height: 200px;
	background-color: #eaebf2;
	background-repeat: no-repeat;
	background-position: right center;
	background-size: auto 100%;
	color: var(--color-primary);
	padding: 30px 30px 30px 200px;
	font-size: 40px;
	font-weight: 700;
	line-height: 1.3em;
	position: relative;
}
.strength-box .box-title:before{
	content: "";
	display: block;
	width: 120px;
	height: 120px;
	background-color: #ffb82a;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70% auto;
	border-radius: 50%;
	transform: translateY(-50%);
	position: absolute;
	top: 50%;
	left: 60px;
}

.strength-box .box-inner{
	padding: 40px;
}
.strength-box .box-inner .inner-title{
	color: var(--color-primary);
	margin: 0 auto 15px;
	font-size: 24px;
	font-weight: 700;
}
.strength-box .box-inner p{
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1.8em;
}

.strength-box .img-box{
	margin-top: 20px;
	text-align: center;
}

/*schedule*/
#schedule .box-title{
	background-image: url(../../_images/strength/schedule-title-bg.webp);
}
#schedule .box-title:before{
	background-image: url(../../_images/strength/schedule-icon.webp);
}

/*staff*/
#staff .box-title{
	background-image: url(../../_images/strength/staff-title-bg.webp);
}
#staff .box-title:before{
	background-image: url(../../_images/strength/staff-icon.webp);
}

/*cooperation*/
#cooperation .box-title{
	background-image: url(../../_images/strength/cooperation-title-bg.webp);
}
#cooperation .box-title:before{
	background-image: url(../../_images/strength/cooperation-icon.webp);
}

/*lineup*/
#lineup .box-title{
	background-image: url(../../_images/strength/lineup-title-bg.webp);
}
#lineup .box-title:before{
	background-image: url(../../_images/strength/lineup-icon-wh.webp);
}

@media screen and ( max-width: 1200px ){
	.strength-box .img-box img{
		height: auto;
	}
}
@media screen and ( max-width: 810px ){
	/**/
	.strength-box{
		margin: 80px 20px;
	}

	.strength-box .box-title{
		min-height: 150px;
		padding: 3% 30px 3% 160px;
		font-size: 32px;
		text-shadow: 0 0 5px #eaebf2;
	}
	.strength-box .box-title:before{
		width: 100px;
		height: 100px;
		left: 40px;
	}

	.strength-box .box-inner{
		padding: 30px;
	}
	.strength-box .box-inner .inner-title{
		font-size: 22px;
	}
	.strength-box .img-box img{
		width: 100%;
		height: auto;
	}

}
@media screen and ( max-width: 480px ){
	/**/
	.strength-box{
		margin: 50px 20px;
	}

	.strength-box .box-title{
		min-height: 100px;
		background-position: 40% 50%;
		padding: 3% 5% 3% 80px;
		font-size: 24px;
	}
	.strength-box .box-title:before{
		width: 60px;
		height: 60px;
		left: 10px;
	}

	.strength-box .box-inner{
		padding: 5%;
	}
	.strength-box .box-inner .inner-title{
		font-size: 18px;
	}
	.strength-box .img-box img{
		width: 100%;
		height: auto;
	}

}