/* CSS Document */

#topics{
	width: var(--wrap);
	margin: var(--space) auto;
	}
	#topics header{}
		#topics header ul{
			display: grid;
			grid-template-columns: 1fr 1fr;
			grid-gap: calc(var(--space) / 2);
			overflow: hidden;
			}
		#topics header li{
			position: relative;
			display: grid;
			place-items: center;
			padding: 1em;
			border: 1px solid currentColor;
			border-bottom-width: 0;
			font-family: var(--font-min);
			font-size: 1.125em;
			}
			#topics header li:before{
				position: absolute;
				bottom: 0;
				width: 50vw;
				border-bottom: 1px solid currentColor;
				}
			#topics header li:nth-of-type(1){
				color: var(--primary-color);
				}
				#topics header li:nth-of-type(1):before{
					left: 100%;
					}
			#topics header li:nth-of-type(2){
				color: var(--secondary-color);
				}
				#topics header li:nth-of-type(2):before{
					right: 100%;
					}
			#topics header li:not(.select){
				cursor: pointer;
				padding-bottom: 0.5em;
				margin-bottom: 0.5em;
				}
			#topics header li.select{}
				#topics header li.select:before{
					content: "";
					}
	#topics h2+div{
		margin-top: var(--space);
		}
	#topics h3{
		display: none;
		}
	#topics h3+div{
		margin-top: var(--space);
		}
	#topics footer{
		display: flex;
		justify-content: center;
		margin-top: var(--space);
		}

.topicsList{}
	.topicsList dl:first-child{
		padding-top: 0;
		}
	.topicsList dl:last-child{
		padding-bottom: 0;
		}
	.topicsList dl+dl{
		border-top: 1px solid #eee;
		}


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


/* Small */
@media (max-width: 575.98px) {
/*575px以下*/
}


/* Medium */
@media (min-width: 576px) {
/*576px以上*/
}
@media (min-width: 576px) and (max-width: 991.98px) {
/*576px～991px*/
}


/* Large */
@media (min-width: 992px) {
/*992px以上*/
}
@media (min-width: 992px) and (max-width: 1199.98px) {
/*992px～1199px*/
}


/* X-Large */
@media (min-width: 1200px) {
/*1200px以上*/
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
/*1200px～1399px*/
}


/* XX-Large */
@media (min-width: 1400px) {
/*1400px以上*/
}