@charset "utf-8";

/* common */

.pc-only {
	display: block;
}

.sp-only {
	display: none;
}

.c-red {
	color: #c8102e;
}

.fs-s {
	font-size: 14px;
}

.fs-m {
	font-size: 20px;
}

.fs-l {
	font-size: 30px;
}

.fs-xl {
	font-size: 30px;
}

@media screen and (max-width: 960px) {
	.pc-only {
		display: none;
	}

	.sp-only {
		display: block;
	}

	.fs-s {
		font-size: 3.6vw;
	}

	.fs-m {
		font-size: 4vw;
	}

	.fs-l {
		font-size: 5.4vw;
	}

	.fs-xl {
		font-size: 5.7vw;
	}
}


/* contents */

.campaign .inner {
	max-width: 960px;
    margin: 0 auto;
    padding: 30px 0;
    border: 1px solid #000;
    text-align: center;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 1px;
}

.campaign .flex {
	display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

@media screen and (max-width: 960px) {
	.campaign {
		padding-left: 5.3333333333vw;
		padding-right: 5.3333333333vw;
	}

	.campaign .inner {
		padding-left: 5.3333333333vw;
        padding-right: 5.3333333333vw;
	}

	.campaign img {
		width: 100%;
	}

	.campaign .flex {
		flex-direction: column;
	}
}

/* recommend */

.recommend{
	margin: 80px auto;
}
.recommend01 img,
.recommend02 img {
	width: 465px;
}

.lp-banners-list__3column-list {
    display: grid;
    grid-template-columns: repeat(3, auto);
    gap: 8px;
    justify-content: center;
    max-width: 100%;
}

@media screen and (max-width:960px) {
	.recommend{
		padding: 0 16px;
	}
	.recommend01 img,
	.recommend02 img {
		width: 100%;
	}

	.lp-banners-list__3column-list {
		display: grid;
		grid-template-columns: repeat(2, auto);
		gap: 8px;
		justify-content: center;
		max-width: 100%;
	}
}