@charset "utf-8";
/* 下層ページ（ブロックを並べて作る） */

.page_body{
	padding-bottom: 130px;
}

/* ブロックの上の余白は、どの型も同じ（並べ替えても間隔がそろうように） */
.page_body > *{
	margin-top: 90px;
}

/* 見出しのすぐ下は、余白を狭くする */
.page_body > .block_heading + *,
.page_body > .block_subheading + *{
	margin-top: 60px;
}

/* 大見出し（中央） */
.block_heading{
	font-size: 30px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-align: center;
	color: #18293e;
}

/* 小見出し（緑の四角。下に紺の線） */
.media_title{
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding-bottom: 14px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
	border-bottom: 2px solid #29557b;
}

.media_title::before{
	content: "";
	flex-shrink: 0;
	width: 0.7em;
	height: 0.7em;
	background-color: #33aa8f;
	transform: translateY(0.05em);
}

/* 写真と文章とリンク（水色の箱。第2階層の形） */
.block_card{
	display: flex;
	align-items: flex-start;
	gap: 62px;
	padding: 52px 61px 56px 56px;
	background-color: #e9f9ff;
	border-radius: 10px;
}

.card_img,
.media_img{
	width: 483px;
	max-width: 45%;
	flex-shrink: 0;
}

.card_img img,
.media_img img{
	display: block;
	width: 100%;
	aspect-ratio: 483 / 283;
	object-fit: cover;
}

.card_body{
	flex: 1;
	min-width: 0;
}

.card_title{
	padding-bottom: 14px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
	color: #18293e;
	border-bottom: 2px solid #29557b;
}

.card_body p{
	margin-top: 24px;
	font-size: 15px;
}

.card_btn{
	margin-top: 36px;
	text-align: right;
}

/* 写真と文章（左右） */
.block_media{
	display: flex;
	align-items: flex-start;
	gap: 57px;
	padding: 0 60px;
}

.block_media_reverse{
	flex-direction: row-reverse;
}

.media_body{
	flex: 1;
	min-width: 0;
}

.media_body p,
.block_text p{
	margin-top: 24px;
	font-size: 15px;
}

/* 小見出しと文章（幅いっぱい） */
.block_text,
.block_plain{
	padding: 0 60px;
}

.block_plain p{
	font-size: 15px;
}

/* 写真2枚 */
.block_photos{
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 39px;
	padding: 0 60px;
}

.photos_item img{
	display: block;
	width: 100%;
	aspect-ratio: 523 / 283;
	object-fit: cover;
}

.photos_item p{
	margin-top: 20px;
	font-size: 15px;
	font-weight: 700;
	text-align: center;
}

/* ボタン（幅の広い緑のボタン） */
.block_button{
	text-align: center;
}

.btn_wide{
	width: 487px;
	padding-top: 17px;
	padding-bottom: 17px;
}





@media screen and (max-width: 1170px){

	.block_card{
		gap: 30px;
		padding: 36px;
	}

	.block_media{
		gap: 30px;
		padding: 0;
	}

	.block_text,
	.block_plain,
	.block_photos{
		padding: 0;
	}
}




@media screen and (max-width: 750px){

	.page_body{
		padding-bottom: 60px;
	}

	.page_body > *{
		margin-top: 50px;
	}

	.page_body > .block_heading + *,
	.page_body > .block_subheading + *{
		margin-top: 30px;
	}

	.block_heading{
		font-size: 20px;
	}

	.media_title,
	.card_title{
		padding-bottom: 10px;
		font-size: 17px;
	}

	/* 写真の下に文章 */
	.block_card,
	.block_media,
	.block_media_reverse{
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
	}

	.block_card{
		padding: 20px 20px 26px;
	}

	.card_img,
	.media_img{
		width: 100%;
		max-width: none;
	}

	.card_body p,
	.media_body p,
	.block_text p,
	.block_plain p{
		margin-top: 14px;
		font-size: 14px;
	}

	.block_plain p{
		margin-top: 0;
	}

	.card_btn{
		margin-top: 24px;
		text-align: center;
	}

	/* 写真2枚（縦に並べる） */
	.block_photos{
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.photos_item p{
		margin-top: 12px;
		font-size: 13px;
	}

	.btn_wide{
		width: 100%;
		max-width: 320px;
	}
}
