@charset "utf-8";


/*--------------------------------------------------------------
    ニュースリリース表示
  --------------------------------------------------------------*/


.news {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff !important;
	background-color: rgb(var(--main-color) / 1.0) !important;
	border-radius: 1rem;
}

.blog {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff !important;
	background-color: #6ccf6f;
	border-radius: 1rem;
}

.taxonomy.category {
	display: none;
}



/*--------------------------------------------------------------
    リリース表示
  --------------------------------------------------------------*/
#topics-area {
	width: 100%;
	margin: 0;
	padding: 1rem;
}

#topics-area h2 {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;

	font-size: clamp(2.0rem, 2.2vw, 3.2rem);
	line-height: 1.2;
	font-weight: 400;
}

#topics-area h2>* {
	margin: 0;
	padding: 2rem 0 2rem 0;
	font-size: clamp(2.0rem, 2.2vw, 3.2rem);
	line-height: 1.2;
	font-weight: 400;

	color: #666;
}

#topics-area ul,
#topics-area li {
	list-style-type: none;
}

#topics-area a {
	text-decoration: none;
}

#topics-area li.lt-submenu-item {
	text-align: end;
}

#topics-area ul.topicks {
	margin: 0;
	padding: 1rem 3rem 1rem 3rem;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: start;
	align-items: start;
}

#topics-area ul.topicks li {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

#topics-area a.grid-style {
	margin: 0;
	padding: 1rem;
	text-decoration: none;
	display: grid;
	justify-content: center;
	align-items: center;
	grid-template-columns: 45px 5rem 1fr;
	column-gap: 1rem;

	border-top: 1px solid #efefef;
}

#topics-area a.grid-style:last-child {
	border-bottom: 1px solid #efefef;
}


#topics-area a.grid-style:hover {
	background-color: #eee;
}

#topics-area a.grid-style>div:first-child {
	margin: 0;
	padding: 0;
	width: 45px;
	height: 45px;
}

#topics-area a.grid-style>div:first-child img {
	margin: 0;
	padding: 0;
	width: 45px;
	height: 45px;
}

#topics-area a.grid-style>div:nth-child(2) {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#topics-area a.grid-style>div:nth-child(2)>time {
	margin: 0 0 0.5rem 0;
	font-size: 0.7rem;
	line-height: 1.2;
}

#topics-area a.grid-style>div:nth-child(2)>p.category-style {
	width: 100%;
	font-size: 0.7rem;
	line-height: 1.2;
}


#topics-area a.grid-style>p {
	display: flex;
	justify-content: start;
	align-items: center;

	font-size: 1rem;
	line-height: 1.2;
}

#topics-area .catalog-page {
	margin: 0;
	padding: 1rem;
	width: 100%;
	display: flex;
	justify-content: end;
	align-items: center;
}

#topics-area .catalog-page a {
	display: block;
	margin: 0 0 0 1rem;
	padding: 0;
}


@media (max-width: 767.98px) {

	/* sm 以下の画面サイズの場合のスタイル */
	#topics-area ul.topicks {
		margin: 0;
		padding: 1rem;
	}

	#topics-area a.grid-style {
		margin: 0;
		padding: 1rem;
		text-decoration: none;
		display: grid;
		justify-content: center;
		align-items: center;
		grid-template-columns: 20px 3rem 1fr;
		column-gap: 0.5rem;
	}

	#topics-area a.grid-style>div:first-child,
	#topics-area a.grid-style>div:first-child img {
		width: 20px;
		height: 20px;
	}

	#topics-area a.grid-style>div:nth-child(2)>time {
		font-size: 0.6rem;
	}

	#topics-area a.grid-style>div:nth-child(2)>p.category-style {
		width: 100%;
		font-size: 0.6rem;
	}

}

@media (min-width: 768px) and (max-width: 991.98px) {

	/* md の画面サイズの場合のスタイル */
	#topics-area ul.topicks {
		margin: 0;
		padding: 1rem;
	}
}

@media (min-width: 992px) {
	/* lg 以上の画面サイズの場合のスタイル */
}