/* CSS Document */

#topics{}
	#topics .tabMenu{
		border-bottom: 5px solid #101a63;
		}
		#topics .tabMenu li{
			border: 1px solid #ccc;
			}
			#topics .tabMenu li.select{
				background: #101a63;
				border-color: transparent;
				}
	#topics .tabContents{
		padding-top: 0;
		}

.topicsNone{
	padding: 10% 0;
	text-align: center;
	}

.topicsList{
	list-style: none;
	}
	.topicsList > *{
		position: relative;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		padding: 1em 0;
		border-bottom: 1px solid #ccc;
		}
	.topicsList a{
		color: #1a1a1a;
		fill: #1a1a1a;
		line-height: 1.3em;
		text-decoration: none;
		order: 3;
		}
		.topicsList a:hover{
			color: #101a63;
			fill: #101a63;
			}
	.topicsList time{
		color: #101a63;
		font-weight: bold;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		order: 1;
		}
	.topicsList ul{
		display: flex;
		flex-wrap: wrap;
		list-style: none;
		order: 2;
		}
		.topicsList ul li{
			padding: 0.5em 1em;
			border: 1px solid #1a1a1a;
			color: #1a1a1a;
			font-size: 0.8em;
			}
			.topicsList ul li.pickup{
				background: #e50012;
				border-color: transparent;
				color: #fff;
				}
			.topicsList ul li.new{
				background: #101a63;
				border-color: transparent;
				color: #fff;
				}
		.topicsList ul li+li{
			margin-left: 0.5em;
			}

.pagenation{
	margin-top: 2em;
	overflow: hidden;
	}
	.pagenation ul,
	.pagenation ol{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		list-style: none;
		margin: -0.5em;
		}
	.pagenation li{
		margin: 0.5em;
		}
	.pagenation a{
		position: relative;
		display: block;
		text-decoration: none;
		line-height: 1em;
		text-align: center;
		}
		.pagenation a:not([rel]){
			padding: 0.8em;
			border: 1px solid #666;
			border-radius: 0.4em;
			}
			.pagenation a:not([rel]):hover{
				color: #fff;
				fill: #fff;
				background: #666;
				}
	.pagenation i{
		position: absolute;
		top: calc(50% - 0.5em);
		}
	.pagenation [rel]{
		position: relative;
		color: #1a1a1a;
		fill: #1a1a1a;
		}
	.pagenation [rel="list"]{
		padding: 0.8em;
		border: 1px solid #666;
		border-radius: 0.4em;
		}
		.pagenation [rel="list"]:hover{
			color: #fff;
			fill: #fff;
			background: #666;
			}
	.pagenation [rel="prev"]{
		padding-left: 1.8em;
		}
		.pagenation [rel="prev"] i{
			left: 0.5em;
			transform: scale(-1, 1);
			}
	.pagenation [rel="next"]{
		padding-right: 1.8em;
		}
		.pagenation [rel="next"] i{
			right: 0.5em;
			}
	.pagenation .lsc-current-page{
		background: #223a70;
		color: #fff;
		fill: #fff;
		}




/* for all */
@media (max-width: 1199px) {
/*1199px以下*/
}
@media (max-width: 991px) {
/*991px以下*/
.tabMenu{
	padding-bottom: 1em;
	}
	.tabMenu ul{
		flex-wrap: wrap;
		}
	.tabMenu li{
		border-radius: 0.4em;
		}
}


/* for mobile */
@media (max-width: 767px) {
/*767以下px*/
#topics{}
	#topics .topicsNone{
		margin-top: 2em;
		}
.topicsList{}
	.topicsList a{
		position: relative;
		width: 100%;
		margin-top: 0.8em;
		padding-left: 1.4em;
		}
		.topicsList a i{
			position: absolute;
			top: 0;
			left: 0;
			}
	.topicsList ul{
		margin-left: 1em;
		}
}
@media (max-width: 767px) and (orientation:portrait) {
/*767px以下 縦向き*/
.tabMenu{}
	.tabMenu li{
		width: calc(50% - 0.25em);
		}
		.tabMenu li:nth-child(n+3){
			margin-top: 0.5em;
			}
}
@media (max-width: 767px) and (orientation:landscape) {
/*767px以下 横向き*/
.tabMenu{}
	.tabMenu li{
		width: calc(33.33% - 0.33em);
		}
		.tabMenu li:nth-child(n+4){
			margin-top: 0.5em;
			}
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/
.topicsList{}
	.topicsList > *{
		padding: 1.5em 2em;
		padding-left: 7em;
		}
	.topicsList a{
		font-size: 1.2em;
		line-height: 1.4em;
		}
		.topicsList a i{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			line-height: 1em;
			}
		.topicsList a svg{
			position: absolute;
			top: calc(50% - 0.5em);
			right: 0;
			}
	.topicsList time{
		position: absolute;
		top: 1.7em;
		left: 0;
		width: 6em;
		}
	.topicsList ul{
		width: 100%;
		}
		.topicsList ul li{
			margin-bottom: 1em;
			}
}
@media (min-width: 768px) and (max-width: 1199px) {
/*768px～1199px*/
}
@media (min-width: 768px) and (max-width: 991px) {
/*768px～991px*/
#topics{}
	#topics .tabMenu{}
		#topics .tabMenu li{
			width: calc(33.33% - 0.33em);
			}
			#topics .tabMenu li:nth-child(n+4){
				margin-top: 0.5em;
				}
	#topics .topicsNone{
		margin-top: 3em;
		}
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
#topics{}
	#topics .tabMenu{}
		#topics .tabMenu ul{
			display: table;
			width: calc(100% + 1.6em);
			margin: 0 -0.8em;
			border-spacing: 0.8em 0;
			table-layout: fixed;
			}
		#topics .tabMenu li{
			display: table-cell;
			vertical-align: middle;
			border-bottom: none;
			}
		#topics .tabMenu li+li{
			margin-left: 0.8em;
			}
}
@media (min-width: 992px) and (max-width: 1199px) {
/*992px～1199px*/
}
@media (min-width: 1200px) {
/*1200px以上*/
}


/* Edge */
@supports (-ms-ime-align:auto) {
}


/* ie */
@media all and (-ms-high-contrast: none) {
}


