@charset "utf-8";
/* ============== 共通 =================== */
#contents {
	background-color: #c4dba9;
	padding: 0 0 10px;
	color: #333;
	text-align: center;
	font-size: 14px;
	line-height: 1.6;
}
#contents * {
	box-sizing: border-box;
}
#contents a {
	color: #0099cc;
	text-decoration: underline;
}
#contents a:hover img {
	transform: translate(0px, 4px);
}
.display-sp {
	display: none;
}
.end_txt {
	margin: 20px auto;
	font-weight: bold;
	color: #FF0004;
	font-size: 180%;
	text-align: center;
	line-height: 1;
}
img {
	width: 100%;
	height: auto;
}
/*コンテンツ幅*/
.sec {
	margin: auto;
	max-width: 970px;
	width:calc(100% - 60px);
}
/* ============== btn =================== */
.btn {
	border-radius: 5px;
	overflow: hidden;
}
.btn_pc {
	margin-bottom: 30px;
}
.btn_wrap a {
	cursor: pointer;
}

/*終了対応*/
#contents .btn_close {
	pointer-events: none;
}
#contents .btn_close::after {
	content:"※本キャンペーンは終了しました";
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 2.2rem;
	font-weight: bold;
	background-color: rgba(0,0,0,0.7); /* 固定 */
	width: 104%;
	height: 120%;
	margin: 0 auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 10;
}
/* ============== LP =================== */
.top_ttl {
	background-color: #fbc600;
}
.top_ttl img {
	max-width: 1200px;
	margin: 0 auto;
}
.main_ttl {
	width: calc(100% - 60px);
	max-width: 970px;
	margin: 65px auto;
}
.sec-01 {
	padding-bottom: 100px;
}
.cover {
	display: flex;
	justify-content: center;
	gap: 30px;
}
.cover_img {
	width: 270px;
	border: 2px solid #c6c6c6;
}
.cover_contents {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.cover_ttl {
	width: 270px;
	margin-bottom: 30px;
}

.calendar {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: min(6.7vw, 80px);
}
.calendar_img {
	margin-bottom: 30px;
	border: 2px solid #c6c6c6;
}

/* コンテンツ（SP：767px以下）
========================================================*/
@media screen and (max-width: 767px) {
	/* ============== 共通 =================== */
	.display-pc {
		display: none;
	}
	.display-sp {
		display: block;
	}
	.end_txt {
		font-size: 150%;
	}
	/*コンテンツ幅*/
	.sec {
		width: calc(100% - 30px);
	}
/* ============== btn =================== */
	.btn {
		width: 100%;
	}
	.btn_pc {
		margin-bottom: 20px;
	}
	/*終了対応*/
	#contents .btn_close::after {
		font-size: 1.8rem;
	}
/* ============== LP =================== */
	.main_ttl {
		width: 100%;
		margin: 45px 0 25px;
	}
	.sec-01 {
		padding-bottom: 35px;
	}
	.cover {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 15px;
	}
	.cover_img {
		width: 100%;
		border-width: 1px;
	}
	.cover_ttl {
		width: 100%;
		margin-bottom: 20px;
	}

	.calendar {
		grid-template-columns: 1fr 1fr;
		gap: 15px;
	}
	.calendar_item {
		margin-bottom: 35px;
	}
	.calendar_img {
		margin-bottom: 20px;
		border-width: 1px;
	}

}