/* CSS Document */

#topics{
	padding: 0;
	padding-bottom: 4em;
	}

#topicsList{}
	#topicsList dl{
		position: relative;
		display: flex;
		flex-direction: column;
		border-bottom: 1px solid #ccc;
		}
		#topicsList dl:first-child{
			border-top: 1px solid #ccc;
			}
	#topicsList dt{
		line-height: 1.75em;
		}
	#topicsList dt+dd{
		margin-bottom: 0.5em;
		order: -1;
		}
	#topicsList dd{}
		#topicsList dd time{
			color: #12c2c7;
			font-size: 0.9em;
			}
		#topicsList dd a{
			position: absolute;
			top: 0;
			left: 0;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			width: 100%;
			height: 100%;
			color: transparent;
			fill: #12c2c7;
			}
		#topicsList dd i{
			position: absolute;
			top: calc(50% - 0.5em);
			right: 0;
			display: flex;
			align-items: center;
			width: 1em;
			height: 1em;
			}




/* for all */
@media (max-width: 1199.98px) {
/*1199px以下*/
}
@media (max-width: 991.98px) {
/*991px以下*/
}


/* for mobile */
@media (max-width: 767.98px) {
/*767以下px*/
#topicsList{
	margin-top: 2em;
	}
	#topicsList dl{
		padding: 1em 0;
		padding-right: 2em;
		}
}
@media (max-width: 767.98px) and (orientation:portrait) {
/*767px以下 縦向き*/
}
@media (max-width: 767.98px) and (orientation:landscape) {
/*767px以下 横向き*/
}
@media (max-width: 767.98px) and (orientation:landscape), (min-width: 768px) {
/*767px以下 横向き, 768px以上,*/
}
@media (max-width: 767.98px) and (orientation:landscape), (min-width: 768px) and (max-width: 991.98px) {
/*767px以下 横向き, 768px～991px*/
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/
#topicsList{}
	#topicsList dl{
		padding: 1.5em 0;
		padding-right: 2em;
		}
}
@media (min-width: 768px) and (max-width: 1199.98px) {
/*768px～1199px*/
}
@media (min-width: 768px) and (max-width: 991.98px) {
/*768px～991px*/
#topicsList{
	margin-top: 3em;
	}
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
#topicsList{
	margin-top: 4em;
	}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
/*992px～1199px*/
}
@media (min-width: 1200px) {
/*1200px以上*/
}