@charset 'UTF-8';
/*----------------------------------------

	- topics

-----------------------------------------*/

/*----------------------------------------
	topics
-----------------------------------------*/
.topics {
	display: grid;
	gap: 0 32px;
	grid-template-columns: auto minmax(71.42%, 800px);
	grid-template-areas: 'topicsTitle sns'
	'topicsTitle topicsTxt'
	'topicsTitle topicsList';
	inline-size: min(80%, 1120px);
	margin-block-start: 192px;
	margin-inline: auto;
}

.topics h1 {
	grid-area: topicsTitle;
	font-weight: var(--font-weight-medium);
	font-size: var(--font-size52);
	line-height: var(--line-height15);
}

.topics .sns {
	display: grid;
	gap: 0 24px;
	grid-template-columns: repeat(2, 40px);
	grid-area: sns;
	margin-block-start: 18px;
}

.topics .topicsTxt {
	grid-area: topicsTxt;
	margin-block-start: 84px;
}

.topics .topicsTxt .btn01 {
	grid-area: topicsTxt;
	margin-block-start: 64px;
}

.topics .topicsList {
	grid-area: topicsList;
	margin-block-start: 160px;
}

.topics .topicsList li {
	border-block-start: var(--border-width1) solid var(--color-black01);
}

.topics .topicsList li a {
	display: block;
	padding-block: 32px;
}

.topics .topicsList li a time {
	font-size: var(--font-size16);
	line-height: var(--line-height15);
	font-family: var(--font-family-mincho);
}

.topics .topicsList li a .topicsStatus {
	margin-inline-start: 12px;
	padding-block: 3px;
	padding-inline: 8px;
	background: var(--color-mediumgray01);
	color: var(--color-white01);
	font-size: var(--font-size14);
	line-height: var(--line-height125);
}

.topics .topicsList li a .topicsStatus.ritual {
	background: var(--color-about01);
}

.topics .topicsList li a .topicsTitle {
	display: block;
	margin-block-start: 17px;
	font-weight: var(--font-weight-medium);
	font-size: var(--font-size24);
	line-height: var(--line-height15);
}

.topics .topicsList li a:is(.external, .pdf) .topicsTitle span {
	position: relative;
	margin-inline-end: calc(0.6em + 17px);
}

.topics .topicsList li a.external .topicsTitle span::after {
	content: '';
	display: inline-block;
	position: absolute;
	inset-block-end: 0.3em;
	inset-inline-end: calc((0.6em + 17px)* -1);
	block-size: 17px;
	inline-size: 17px;
	background: url(/asset/img/common/ic_external01_m.svg) no-repeat center center;
	background-size: cover;
}

.topics .topicsList li a.pdf .topicsTitle span::after {
	content: '';
	display: inline-block;
	position: absolute;
	inset-block-end: 0.3em;
	inset-inline-end: calc((0.6em + 17px)* -1);
	block-size: 17px;
	inline-size: 17px;
	background: url(/asset/img/common/ic_pdf01_m.svg) no-repeat center center;
	background-size: cover;
}

@media (width <=1366px) {
	.topics {
		gap: 0 0;
		grid-template-columns: repeat(2, 1fr);
		grid-template-areas: 'topicsTitle sns'
		'topicsTxt topicsTxt'
		'topicsList topicsList';
		align-items: center;
	}

	.topics .sns {
		margin-block-start: unset;
		margin-inline-start: auto;
	}
}

@media (width <=800px) {
	.topics {
		inline-size: 88%;
		margin-block-start: 100px;
	}

	.topics h1 {
		font-size: var(--font-size32);
	}

	.topics .sns {
		grid-template-columns: repeat(2, 32px);
	}

	.topics .topicsTxt {
		margin-block-start: 65px;
	}

	.topics .topicsTxt .btn01 {
		margin-inline: auto;
	}

	.topics .topicsList {
		inline-size: 95.45%;
		margin-block-start: 128px;
		margin-inline: auto;
	}

	.topics .topicsList li a time {
		font-size: var(--font-size14);
	}

	.topics .topicsList li a .topicsStatus {
		font-size: var(--font-size12);
	}

	.topics .topicsList li a .topicsTitle {
		margin-block-start: 13px;
		font-size: var(--font-size16);
	}

	.topics .topicsList li a:is(.external, .pdf) .topicsTitle span {
		position: relative;
		margin-inline-end: calc(0.5em + 12px);
	}

	.topics .topicsList li a.external .topicsTitle span::after {
		inset-inline-end: calc((0.5em + 12px)* -1);
		block-size: 12px;
		inline-size: 12px;
		background-image: url(/asset/img/common/ic_external01_s.svg);
	}

	.topics .topicsList li a.pdf .topicsTitle span::after {
		inset-inline-end: calc((0.5em + 12px)* -1);
		block-size: 12px;
		inline-size: 12px;
		background-image: url(/asset/img/common/ic_pdf01_s.svg);
	}
}
