@charset "utf-8";

.top-of-page {
	display: none;
}

.scroll-y-start .toggle-logo-wrap {
	opacity: 0;
	transition: opacity 0.5s ease;
}

.scroll-y-start .toggle-logo-wrap.-wt {
	opacity: 1;
}

.scroll-y-start .-show .toggle-logo-wrap {
	opacity: 1;
}

.scroll-y-start .-show .toggle-logo-wrap.-wt {
	opacity: 0;
}

.scroll-y-start .site-subheader {
	transition-delay: 0s;
	transition-duration: 0.5s;
	background-color: rgba(255,255,255,0);
	box-shadow: 0 0 0 rgba(0,0,0,0);
}

.scroll-y-start .-show .site-subheader {
	background-color: rgba(255,255,255,1);
}

.scroll-y-start .menu-button,
.scroll-y-start .menu-button a:hover {
	color: #fff;
}
.scroll-y-start .site-subheader__sub-li a {
	color: #fff;
}

.scroll-y-start .menu-button a span,
.scroll-y-start .menu-button a span:before,
.scroll-y-start .menu-button a span:after {
	background: currentColor;
}

.scroll-y-start .-show .menu-button a span:before,
.scroll-y-start .-show .menu-button a span:after {
	background: #000;
}

.scroll-y-start .-show .site-subheader__sub-li a {
	color: inherit;
}

.scroll-y-start .site-subheader__anchor {
	filter: brightness(0%) invert(100%);
}

.scroll-y-start .-show .site-subheader__anchor {
	filter: brightness(100%) invert(0%);
}


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

.home-section {
	margin-bottom: 80px;
	padding: 40px 0;
	border-top: 1px solid rgba(0,0,0,0.1);
	box-sizing: border-box;
}

.home-section:first-of-type {
	
}

.home-section:last-child {
	margin-bottom: 0;
	border-bottom: 1px solid rgba(0,0,0,0.1);
}

.section__header {
	margin-top: 60px;
	margin-bottom: 60px;
	text-align: center;
}

.section__header-ttl {
	font-size: 2rem;
}

.section__header-ttl a {
	text-decoration: none;
}

@media screen and (min-width: 1024px) {
	.section__header-ttl {
		font-size: 2.6rem;
	}
}


/* --------------------------------------------------------- */
/* INFORMATION */

.information {
	
}

.information-index {
	max-width: 1080px;
	border: none;
	padding: 0;
}

.information-index-list {
	width: 100%;
	list-style: none;
	padding: 0;
}

.information-index-list li {
	margin-bottom: 20px;
	padding-top: 20px;
}

.information-index-list li:last-child {
	margin-bottom: 0;
}

.information-index__anchor {
	display: grid;
	grid-template-columns: 6em 1fr;
	text-decoration: none;
}

.information-index__anchor:hover {
	text-decoration: none;
}

.information-index__anchor > * {
	margin: 0;
}

.information__meta-date {
	grid-column: 1 / 2;
	font-weight: 500;
}

.information__meta-cat {
	grid-column: 2;
	grid-row: 1;
	display: flex;
	align-items: center;
	font-size: 90%;
	opacity: 0.5;
	white-space: nowrap;
	font-size: 1.1rem;
}

.information__meta-ttl {
	width: 100%;
	grid-column: 1 / 3;
	grid-row: 2;
	font-size: 1.2rem;
}

.information__meta-icon {
	display: none;
}

.information__meta-icon svg {
	width: 16px;
	height: 16px;
}

.information__nav {
	display: none;
	list-style: none;
	padding: 0;
}

.information__nav li {
	
}

.information__nav a {
	text-decoration: none;
}


@media screen and (min-width: 768px) {
	
	.information-index-list li {
		margin-bottom: 10px;
		padding-top: 0;
	}
	
	.information-index__anchor {
		position: relative;
		display: flex;
		padding: 10px 15px;
		border-radius: 5px;
	}
	
	.information-index__anchor:hover {
		background-color: rgba(101,128,191,0.05);
		stroke-width: 2;
	}
	
	.information__meta-date {
		display: inline-flex;
		align-items: center;
		margin-right: 20px;
	}
	
	.information__meta-date:after {
		display: block;
		content: "";
		width: 20px;
		height: 1px;
		background-color: currentColor;
		margin-left: 20px;
		opacity: 0.2;
	}
	
	.information__meta-cat {
		margin-right: 20px;
		font-size: 1.2rem;
		order: 3;
	}
	
	.information__meta-ttl {
		width: auto;
		margin-right: 20px;
		font-size: 1.4rem;
		order: 2;
	}
	
	.information__meta-icon {
		position: absolute;
		display: block;
		left: auto;
		right: 20px;
		top: 0;
		bottom: 0;
		height: 20px;
		width: 20px;
		margin: auto;
		order: 4;
	}
}

@media screen and (min-width: 1280px) {
	
	.information {
		display: flex;
		justify-content: space-around;
		width: calc(100% - 100px);
		max-width: 1440px;
		margin: auto;
		padding: 120px 0;
	}
	
	.information .section__header {
		margin-top: 5px;
		margin-bottom: 0;
		text-align: left;
	}
	
	.information .h-underline:before {
		right: auto;
		margin: 0;
	}
	
	.information-index {
		width: 80%;
		margin: 0;
	}
	
	.information__nav {
		display: flex;
		font-size: 1.2rem;
	}
	
	.information__nav li {
		margin-right: 15px;
	}
	
	.information__nav a {
		
	}
}