@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

.sponsorsSquare {
	height: 480px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #def4fa url(/kifu/type/images/bg_1.png) no-repeat 0 100% / 100%
	auto;
	.btn a {
		align-items: unset;
		font-size: 4.8rem;
		border-radius: 26px;
		padding: 32px;
		line-height: 1;
		width: 576px;
	}
	.btnA a::before {
		width: 32px;
		right: 32px;
		height: inherit;
	}
	.waiting {
		font-size: 2.4rem;
	}
	.waiting::before {
		height: 19px;
		width: 7px;
	}
	.waiting::after {
		height: 19px;
		width: 7px;
	}
}
.frame2 {
	display: flex;
	height: 480px;
	padding: 80px 32px;
	flex-direction: column;
	align-items: center;
	gap: 80px;
	border-radius: 16px;
	border: 4px solid var(--LightBlue, #58cae7);
	background: linear-gradient(
		180deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0.5) 81.04%
	),
	#c3f2ff;
	.frameQ {
		display: flex;
		flex-direction: column;
		gap: 24px;
		align-self: stretch;
		h2 {
			font-size: 2.4rem;
			line-height: 1.5;
			font-weight: 600;
			margin: 0;
		}
		.frameContent {
			.iconQ {
			width: 40px;
			height: 40px;
			background: url(/kifu/type/images/Q.png) no-repeat 0 100% / 100%;
			}
			display: flex;
			align-items: center;
			gap: 24px;
			h3 {
			margin: unset;
			}
		}
	}
	.frameBtn {
		display: flex;
		padding: 0px 32px;
		justify-content: center;
		align-items: flex-start;
		gap: 40px;
		align-self: stretch;
		.btn a {
			align-items: unset;
			font-size: 3.2rem;
			width: 516px;
			border-radius: 26px;
			padding: 20px 29px;
			line-height: 150%;
		}
		.btn {
			margin: unset;
		}
		p.btn + *,
		.btnGroup + * {
			margin: unset;
		}
	}
}
.frame5 {
	display: flex;
	padding: 48px;
	justify-content: center;
	align-items: flex-start;
	gap: 48px;
	border-radius: 16px;
	background: linear-gradient(
		180deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0.5) 81.04%
	),
	#c3f2ff;
	.frameContent {
		margin: 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 32px;
		flex: 1 0 0;
		align-self: stretch;
		.mid {
			font-size: 3.8rem;
			line-height: 135%;
			letter-spacing: 1.52px;
			text-align: center;
		}
		span {
			display: inline-block;
			margin: 0;
			position: relative;
			font-weight: 600;
			font-size: 3.2rem;
			line-height: 150%;
			letter-spacing: 1.28px;
		}

		.iconBg::before {
			content: "";
			position: absolute;
			top: -72px;
			left: -86px;
			width: 114px;
			height: 114px;
			background: url(/kifu/type/images/bg_1.svg) no-repeat 0 0 /100%;
		}
	}
}
.step-title {
	padding-top: 64px;
	display: flex;
	align-items: flex-start;
	gap: 28px;
	align-self: stretch;
	height: auto;
	.step {
		margin: 0;
		display: flex;
		gap: 10px;
		position: relative;
		.step-txt {
			color: #243c4b;
			font-size: 2rem;
			font-family: Hiragino Kaku Gothic Std;
			font-weight: 600;
			line-height: 30px;
			letter-spacing: 0.8px;
			word-wrap: break-word;
		}
		.step-number {
			color: #243c4b;
			font-size: 4rem;
			font-family: Poppins;
			font-weight: 600;
			line-height: 30px;
			letter-spacing: 1.6px;
			word-wrap: break-word;
		}
	}
	.step::after {
		content: "";
		width: 1px;
		height: 28px;
		align-self: stretch;
		background: var(--border-LightGray, #d9d9d6);
		position: absolute;
		right: -14px;
	}
	.step-text {
		color: #1b1b1b;
		font-size: 2.4rem;
		font-family: Hiragino Kaku Gothic Std;
		font-weight: 600;
		line-height: 36px;
		letter-spacing: 0.96px;
		word-wrap: break-word;
	}
}
@media screen and (max-width: 768px) {
	.sponsorsSquare {
		height: auto;
		background-image: url(/kifu/type/images/bg_2.png);
		align-items: start;
		padding-top: 40px;
		padding-bottom: 144px;
		.btn a {
			align-items: unset;
			font-size: 3.4rem;
			padding: 32px 50px 32px 24px;
			width: 100%;
		}
		.btnA a::before {
			right: 18px;
		}
		.waiting {
			font-size: 2rem;
			line-height: 1.5;
			margin-bottom: 24px;
		}
		.waiting::before {
			height: 2.5em;
		}
		.waiting::after {
			height: 2.5em;
		}
		p.btn {
			width: 100%;
		}
	}
	.frame2 {
		display: flex;
		width: 100%;
		height: auto;
		padding: 40px 20px 0px 20px;
		gap: 32px;
		border-radius: 16px;
		border: unset;
		.frameQ {
			gap: 12px;
			h2 {
				font-size: 2.0rem;
			}
			.sp {
			display: flex;
			align-items: center;
			gap: 12px;
			align-self: stretch;
			.iconQ {
				width: 40px;
				height: 40px;
				background: url(/kifu/type/images/Q.png) no-repeat 100% / 100%;
			}
			h3 {
				width: 80%;
				margin: unset;
			}
		}
	}
	.frameBtn {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 16px;
		padding: unset;
		margin-bottom: 40px;
		.btn a {
			align-items: unset;
			font-size: 2rem;
			width: 100%;
			border-radius: 26px;
			padding: 32px;
			line-height: 150%;
			}
			.btn {
			margin: unset;
			}
			p.btn + *,
			.btnGroup + * {
			margin: unset;
			}
		}
	}
	.frame5 {
		padding: 40px 20px;
		flex-direction: column;
		justify-content: unset;
		align-items: center;
		gap: 32px;
		align-self: stretch;
		border-radius: 16px;
		background: linear-gradient(
		180deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0.5) 81.04%
		),
		#c3f2ff;
		.frameContent {
			justify-content: unset;
			gap: 20px;
			flex: unset;
			align-self: stretch;
			.mid {
				font-size: 2.8rem;
				line-height: 135%;
				letter-spacing: 1.12px;
			}
			span {
				font-size: 2rem;
				line-height: 150%;
				letter-spacing: 0.8px;
			}
			.iconBg::before {
				top: -46px;
				left: -53px;
				width: 70px;
				height: 100px;
			}
		}
	}
}
.step-title {
	flex-direction: column;
	gap: 20px;
	.step {
		display: flex;
		gap: 8px;
		.step-txt {
			font-size: 1.8rem;
		}
	}
	.step::after {
		content: unset;
	}
	.step-text {
		font-size: 2rem;
	}
}
/* 榎追加 */
/* グリッドバージョン */
.frame2 {
	height: auto;
	.frameBtn {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		.btn a {
			width: auto;
			font-size: 2.4rem;
		}
	}
	p.btn {
		min-width: auto;
	}
	.btn {
		width: auto;
		height: 100%;
	}
}
@media screen and (max-width: 900px) {
	.frame2 {
        .frameBtn {
			grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
        }
		.dp-l {
			display: none;
		}
		.dp-s {
		display: block;
		}
    }
}
@media screen and (min-width: 901px) {
	.dp-l {
		display: block;
	}
	.dp-s {
		display: none;
	}
}
@media screen and (max-width: 768px) {
    .frame2 {
        .frameBtn {
			grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
            .btn a {
                align-items: unset;
                font-size: 1.8rem;
                width: 100%;
                border-radius: 26px;
                padding: 28px;
                line-height: 150%;
				text-align: left;
            }
        }
    }
}

.sns-list {
	display: flex;
	gap: 32px;
	justify-content: center;
}

@media screen and (min-width: 500px) {
	.min-w500 {
		display: block;
	}
}
@media screen and (max-width: 490px) {
	.min-w500 {
		display: none;
	}
}