@charset "UTF-8";

/*/////-----NEWS-----/////*/

#news{
	background-color:#fff;
	color:#222;
}

#news div.content{
	box-sizing: border-box;
	padding:10px;
	
	width:100%;
	margin:0 auto;
	max-width: 960px;
}

/*----- SINGLE -----*/

.single-post{
	box-sizing: border-box;
	padding:0 10px;
	
	width:100%;
	max-width: 800px;
	margin:0 auto;
	margin-bottom:40px;
}

.single-post header.inner-header h3{
	font-family: 'Noto Serif JP', serif;
	font-size:1.5rem;
	line-height:40px;
	
	font-weight:700;
	font-style: normal;
	
	background:none;
	
	text-align: left;
}

/*----- PAGER-SINGLE -----*/

.pager ul.single{
	display:flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	width:100%;
}

.pager ul.single li{
	width:100px;
	
	box-sizing: border-box;
	padding:0 5px;
}

.pager ul.single li span.note{
	display:block;
	
	background-color:#fff;
	color:#000;
	
	font-size:0.75rem;
	line-height:40px;
	font-weight:bold;
	
	text-align: center;
}

.pager ul.single li a{
	display:block;
	color:#000;
}

.pager ul.single li.btn-index a{
	background-color:#f00;
	color:#fff;
	
	border-radius:5px;
	
	transition:0.25s;
}

.pager ul.single li.btn-prev a{
	background-image: url("../images/icon-arrow-left-black.webp");
	background-repeat: no-repeat;
	background-size:15px;
	background-position: left center;
}

.pager ul.single li.btn-next a{
	background-image: url("../images/icon-arrow-right-black.webp");
	background-repeat: no-repeat;
	background-size:15px;
	background-position: right center;
}

.pager ul.single li a:hover{
	opacity: 0.5;
	text-decoration: none;
}

/*----- SINGLE-POSTDATA -----*/

.postdata{
	width:100%;
	margin-bottom:40px;
}

.postdata ul{
	display:flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: flex-end;
	
	width:100%;
	
	font-size:0.75rem;
	line-height:40px;
}

.postdata ul li{
	display:inline-block;
	
	box-sizing: border-box;
	padding:0 5px;
	
	position: relative;
}

.postdata ul li::after{
	display:block;
	content:"";
	
	width:1px;
	height:12.5px;
	
	background-color:#000;
	
	position: absolute;
	top:0;
	bottom:0;
	right:0;
	
	margin:auto 0;
}

.postdata ul li:last-child::after{
	display:none;
}

/*----- SINGLE-POST-CONTENT -----*/

.post-content{
	margin-bottom:40px;
}

.post-content p.text-block{
	margin-bottom:20px;
}

.post-content p.text-block:last-child{
	margin-bottom:0;
}
	opacity:0.8;
	text-decoration:none;
}

.archiverow div.inner{
	box-sizing: border-box;
	padding:10px;
	
	background-color:#f0f0f0;
	color:#000;
	
	padding-right:30px;
	position: relative;
	
	display:flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: flex-start;
	
	width:100%;
}

.archiverow div.inner:before{
	display:block;
	content:"";
	
	width:30px;
	height:30px;
	
	background-image: url("../images/icon_topix-arrow-right.webp");
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: center;
	
	position: absolute;
	top:0;
	bottom:0;
	right:10px;
	
	margin:auto 0;
}

.archiverow ul{
	display:flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: flex-start;
	
	width:100%;
	margin-bottom:5px;
}

.archiverow ul li.update{
	font-size:0.8rem;
	line-height:20px;
	
	width:95px;
	
	/*background-color:#444;*/
}

.archiverow ul li.category{
	font-size:0.8rem;
	line-height:20px;
	text-align: center;
	
	width:120px;
	
	/*background-color:#888;*/
}

.archiverow ul li.category span.note{
	display:block;
	
	background-color:#000;
	color:#fff;
}

.archiverow ul li.category span.category_a{
	background-color:#f00;
}

.archiverow ul li.category span.category_b{
	background-color:#f80;
}

.archiverow ul li.category span.category_c{
	background-color:#094;
}

.archiverow h4{
	width:100%;
	
	font-weight:500;
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

@media only screen and (min-width: 720px){
	
	.archiverow ul{
		width:230px;
		margin-bottom:0;
	}
	
	.archiverow h4{
		width:calc(100% - 230px);
	}
	
}

/*----- PAGER-ARCHIVE -----*/

.pager ul.archive{
	display:flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	
	width:100%;
	
	margin-top:30px;
}

.pager ul.archive li{
	width:50px;
	
	box-sizing: border-box;
	padding:0 5px;
}

.pager ul.archive li span.note{
	display:block;
	
	background-color:#f0f0f0;
	color:#000;
	
	font-size:0.75rem;
	line-height:40px;
	font-weight:bold;
	
	text-align: center;
	
	border-radius:5px;
}

.pager ul.archive li a{
	display:block;
	
	background-color:#f00;
	color:#fff;
	
	border-radius:5px;
	
	transition:0.25s;
}

.pager ul.archive li a:hover{
	opacity: 0.75;
	text-decoration: none;
}
