/*
 * base css 
 * pc width 1000px fixed
 */

@media (max-width: 767px) {
}

@media (min-width: 768px) {
}

/* ---------------------------------------- blog common */

#breadcrumbWrap { padding: 0 0 1em; }

/* ---------------------------------------- blog archiveList */

#archiveList h2 { 
	color: var( --baby-blue ); 
}
#archiveList ul li {
	border-bottom: 3px #ccc dotted;
	line-height: 1.6;
}
#archiveList ul li a time { font-weight: 800; }
#archiveList ul li a span { width: 1.5em; }

@media (max-width: 767px) {

	#archiveList ul li a {
		display: block;
		line-height: 2;
		padding: 1em 0;
	}
	#archiveList ul li a span { display: none; }

}

@media (min-width: 768px) {

	#archiveList ul li a {
		display: table;
		width: 100%;
		padding: 1em 0;
		-webkit-transition: all 0.25s ease-out;
		transition: all 0.25s ease-out;
	}
	#archiveList ul li a > * {
		display: table-cell;
		vertical-align: middle;
	}
	#archiveList ul li a time { width: 8em; }
	#archiveList ul li a p { padding: 0 1em 0 0; }

}

#archiveList ul li a:hover {
	color: var( --baby-blue );
}

/* ---------------------------------------- blog singles */


#blog.singles .inner > h2 {
	border-top: 1px #ccc solid;
	border-bottom: 1px #ccc solid;
	padding: .5em 0;
	margin: 0 0 .25em;
}
#blog.singles .inner > h2 + .date {
	text-align: center;
	margin: 0 0 3em;
}

@media (max-width: 767px) {

	#blog.singles .headline > h3 {
		font-size: clamp(1rem, 0.642rem + 1.79vw, 1.5rem);
	}
	#editors { line-height: 2; }
}

@media (min-width: 768px) {

	#blog.singles .inner {
		max-width: 900px;
	}

	#blog.singles .headline > h3 {
		font-size: clamp(1rem, -0.655rem + 3.45vw, 1.5rem);
	}

	#editors { line-height: 2.25; }
}