/* =========================================
   BackShield.jp
   NOTES / BLOG
   ========================================= */

#notes {
	padding-top: 4em;
	padding-bottom: 4em;
}

#notes-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2.5em 3em;
}

#notes-list .note-item {
	margin: 0;
	padding: 0 0 2em 0;
	border-bottom: solid 1px rgba(210, 215, 217, 0.75);
}

#notes-list .note-item p:first-child {
	margin-bottom: 0.7em;
	color: #9fa3a6;
}

#notes-list .note-item h3 {
	margin: 0 0 0.8em 0;
	font-size: 1.1em;
	line-height: 1.55;
}

#notes-list .note-item h3 a {
	border-bottom: 0;
}

#notes-list .note-item h3 a:hover {
	color: #f56a6a;
}

#notes-list .note-item > p:last-child {
	margin: 0;
	font-size: 0.9em;
	line-height: 1.75;
	color: #7f888f;
}

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

	#notes {
		padding-top: 3em;
		padding-bottom: 3em;
	}

	#notes-list {
		grid-template-columns: 1fr;
		gap: 2em;
	}

	#notes-list .note-item h3 {
		font-size: 1em;
		line-height: 1.5;
	}

	#notes-list .note-item > p:last-child {
		font-size: 0.85em;
	}

}