@charset "utf-8";

/* =====================================
	base
===================================== */
/* root */
:root {
	scroll-behavior: smooth;
}

/* body */
body {
	container-type: inline-size;
	margin: 0;
}


/* =====================================
	header
===================================== */
/* header */
.header {
	position: relative;
	z-index: 100;
}
@media (min-width: 1025px) {
	.header {
		display: flex;
		gap: 45px;
		align-items: center;
		justify-content: space-between;
		min-height: 120px;
		padding: 25px 25px 25px 43px;
	}
}

/* header-brand */
.header-brand {
	margin: 0;
	line-height: var(--line-height-min);
}
.header-brand__link {
	display: inline-block;
}
@media (max-width: 1024px) {
	.header-brand {
		display: flex;
		align-items: center;
		min-height: 85px;
		padding: 0 76px 0 15px;
	}
	.header-brand__image {
		width: 280px;
	}
}
@media (min-width: 1025px) {
	.header-brand {
		flex: 1;
		min-width: 265px;
	}
}

/* header-hamburger */
.header-hamburger {
	position: absolute;
	top: 29px;
	right: 25px;
	width: 26px;
	height: 26px;
	padding: 0;
	border: none;
	border-radius: 0;
	background-color: transparent;
}
.header-hamburger__line,
.header-hamburger__line::before,
.header-hamburger__line::after {
	position: absolute;
	display: block;
	width: 26px;
	height: 2px;
	content: "";
	transition: top 0.3s, transform 0.3s, background-color 0.3s;
	background-color: var(--color-black);
}
.header-hamburger__line {
	top: 12px;
	left: 0;
}
.header-hamburger__line::before {
	top: -9px;
}
.header-hamburger__line::after {
	top: 9px;
}
.header-hamburger[aria-expanded="true"] .header-hamburger__line {
	background-color: transparent;
}
.header-hamburger[aria-expanded="true"] .header-hamburger__line::before {
	top: 0;
	transform: rotate(45deg);
	background-color: var(--color-blue);
}
.header-hamburger[aria-expanded="true"] .header-hamburger__line::after {
	top: 0;
	transform: rotate(-45deg);
	background-color: var(--color-blue);
}
@media (min-width: 1025px) {
	.header-hamburger {
		display: none;
	}
}

/* header-body */
@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@media (max-width: 1024px) {
	.header-body {
		display: none;
		padding: 45px;
		color: var(--color-white);
		background-color: var(--color-blue);
	}
	.header-hamburger[aria-expanded="true"] + .header-body {
		display: block;
		animation: fadeIn 0.3s forwards;
	}
}

/* header-navi */
.header-navi {
	margin: 0;
	padding: 0;
	list-style: none;
}
.header-navi__item {
	position: relative;
}
.header-navi__link,
.header-navi__button {
	display: inline-flex;
	align-items: center;
	height: 100%;
	padding: 0;
	text-decoration: none;
	text-underline-offset: 0.5em;
	color: inherit !important;
	border: none;
	border-radius: 0;
	background-color: transparent;
	font-family: var(--font-inter);
	font-size: 1rem;
	font-weight: var(--weight-semibold);
}
.header-navi__link[aria-current],
.header-navi__button[aria-expanded="true"] {
	text-decoration: 2px underline;
}
.header-navi__button::after {
	width: 16px;
	height: 16px;
	margin-left: 5px;
	content: "";
	transition: transform 0.3s;
	background: no-repeat url("../.assets/ico_chevron_blue_down_01.svg") center center;
}
.header-navi__button[aria-expanded="true"]::after {
	transform: rotate(180deg);
}
@media (max-width: 1024px) {
	.header-navi {
		display: grid;
		gap: 25px;
		align-items: start;
	}
	.header-navi__item--pc {
		display: none;
	}
}
@media (min-width: 1025px) {
	.header-navi {
		display: flex;
		gap: min(2.2vw, 30px);
	}
	.header-navi__item--sp {
		display: none;
	}
	.header-navi__link[aria-current] {
		color: var(--color-blue) !important;
	}
	@media (hover: hover) {
		.header-navi__link:hover,
		.header-navi__button:hover {
			color: var(--color-blue) !important;
		}
	}
}
@media (hover: hover) {
	.header-navi__link:hover,
	.header-navi__button:hover {
		text-decoration: 2px underline;
	}
}

/* header-subnavi */
.header-subnavi {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}
.header-subnavi__link {
	text-decoration: none;
	text-underline-offset: 0.5em;
	color: inherit !important;
}
@media (max-width: 1024px) {
	.header-subnavi {
		gap: 15px;
		margin-top: 25px;
		margin-left: 14px;
		font-size: calc(14rem / 16);
		font-weight: var(--weight-medium);
	}
	.header-subnavi__link[aria-current] {
		text-decoration: 1px underline;
	}
	@media (hover: hover) {
		.header-subnavi__link:hover {
			text-decoration: 1px underline;
		}
	}
}
@media (min-width: 1025px) {
	.header-subnavi {
		position: absolute;
		left: calc(50% - 75px);
		visibility: hidden;
		gap: 20px;
		width: 150px;
		margin-top: 10px;
		padding: 30px;
		transition: visibility 0.3s, opacity 0.3s, transform 0.3s;
		transform: translateY(-10px);
		opacity: 0;
		color: var(--color-white);
		border-radius: 10px;
		background-color: var(--color-blue);
		font-size: 1rem;
		font-weight: var(--weight-bold);
	}
	.header-navi__button[aria-expanded="true"] + .header-subnavi {
		visibility: visible;
		transform: translateY(0);
		opacity: 1;
	}
	.header-subnavi--sp {
		display: none;
	}
	@media (hover: hover) {
		.header-subnavi__link:hover {
			text-decoration: 2px underline;
		}
	}
}


/* =====================================
	main
===================================== */
/* breadcrumb */
.breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: calc(12rem / 16);
}
.breadcrumb__item:not(:last-child)::after {
	margin: 0 10px;
	content: url("../.assets/ico_chevron_gray_right_01.svg");
	vertical-align: middle;
	line-height: var(--line-height-min);
}
@media (max-width: 1024px) {
	.breadcrumb {
		padding: 0 15px 15px 15px;
	}
	body:has(.header-hamburger[aria-expanded="true"]) .breadcrumb {
		padding-top: 15px;
	}
}
@media (min-width: 1025px) {
	.breadcrumb {
		padding: 0 var(--inner-padding) 25px var(--inner-padding);
	}
}

/* cover */
.cover {
	display: grid;
	align-content: center;
	background: var(--color-blue-alpha) no-repeat url("../.assets/bg_cover_01.svg");
}
@media (max-width: 1024px) {
	.cover {
		min-height: 200px;
		padding: 60px var(--inner-padding-narrow);
		background-position: right bottom;
		background-size: auto 200px;
	}
}
@media (min-width: 1025px) {
	.cover {
		min-height: 280px;
		padding: 85px var(--inner-padding-narrow);
		background-position: right var(--inner-padding-narrow) bottom;
	}
}

/* cover-heading */
.cover-heading {
	display: grid;
	margin: 0;
	line-height: var(--line-height-tight);
}
.cover-heading__sub {
	margin-bottom: -0.25em;
	font-family: var(--font-mixed);
	font-size: 1rem;
	font-weight: var(--weight-medium);
}
.cover-heading__main {
	font-family: var(--font-mixed);
	font-weight: var(--weight-semibold);
}
@media (max-width: 1024px) {
	.cover-heading {
		font-size: calc(34rem / 16);
	}
	.cover-heading__main {
		font-size: min(9vw, calc(40rem / 16));
	}
}
@media (min-width: 1025px) {
	.cover-heading {
		font-size: calc(40rem / 16);
	}
	.cover-heading__main {
		font-size: calc(54rem / 16);
	}
}

/* cover-date */
.cover-date {
	margin-top: 10px;
	font-weight: var(--weight-medium);
}

/* content */
.content {
	padding: 90px var(--inner-padding-narrower);
}
.content:has(.content__sub) {
	display: flex;
	gap: 60px;
	padding-right: var(--inner-padding);
	padding-left: var(--inner-padding);
}
.content > :first-child,
.content__main > :first-child {
	margin-top: 0;
}
.content > :last-child,
.content__main > :last-child {
	margin-bottom: 0;
}
@media (max-width: 1024px) {
	.content {
		padding-top: 60px;
	}
	.content:has(.content__sub) {
		flex-direction: column;
	}
}
@media (min-width: 1025px) {
	.content__main {
		flex: 1;
	}
	.content__sub {
		width: 260px;
	}
}

/* content-action */
.content-action {
	display: flex;
	gap: 30px;
	align-items: center;
	justify-content: center;
	margin-top: 60px;
}

/* pagination */
.pagination {
	display: flex;
	gap: 30px;
	justify-content: center;
	margin-top: 60px;
}
.pagination__link {
	display: inline-flex;
	align-items: center;
	height: 44px;
	transition: background-image 0.3s;
	text-decoration: none;
	color: inherit !important;
	font-size: calc(18rem / 16);
}
.pagination__link--previous {
	padding-left: 55px;
	background: no-repeat url("../.assets/ico_circle-chevron_blue_left_01.svg") left center;
}
.pagination__link--next {
	padding-right: 55px;
	background: no-repeat url("../.assets/ico_circle-chevron_blue_right_01.svg") right center;
}
@media (hover: hover) {
	.pagination__link:hover {
		color: var(--color-blue) !important;
	}
	.pagination__link--previous:hover {
		background-image: url("../.assets/ico_circle-chevron_white_left_01.svg");
	}
	.pagination__link--next:hover {
		background-image: url("../.assets/ico_circle-chevron_white_right_01.svg");
	}
}

/* local-navi */
.local-navi__heading {
	margin: 0;
	padding: 22px 15px;
	background-color: var(--color-blue-alpha);
	font-size: calc(18rem / 16);
}
.local-navi__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.local-navi__item:not(:last-child) {
	border-bottom: 1px solid var(--color-gray-light);
}
.local-navi__link {
	position: relative;
	display: block;
	padding: 15px 45px 15px 15px;
	text-decoration: none;
	color: inherit !important;
	background: no-repeat url("../.assets/ico_chevron_blue_right_01.svg") right 15px center;
	font-size: calc(18rem / 16);
	line-height: var(--line-height-tight);
}
.local-navi__link::before {
	position: absolute;
	inset: 18px auto 18px 0;
	width: 2px;
	content: "";
}
.local-navi__link[aria-current] {
	color: var(--color-blue) !important;
	font-weight: var(--weight-bold);
}
.local-navi__link[aria-current]::before {
	background-color: var(--color-blue);
}
@media (hover: hover) {
	.local-navi__link:hover {
		color: var(--color-blue) !important;
		font-weight: var(--weight-bold);
	}
	.local-navi__link:hover::before {
		background-color: var(--color-blue);
	}
}


/* =====================================
	footer
===================================== */
/* footer-body */
.footer-body {
	display: flex;
	padding: 55px var(--inner-padding);
	color: var(--color-white);
	background-color: var(--color-gray-dark-xx);
}
.footer-body a {
	text-decoration: none;
	color: inherit !important;
}
@media (max-width: 1024px) {
	.footer-body {
		flex-direction: column;
	}
}
@media (min-width: 1025px) {
	.footer-body {
		flex-wrap: wrap;
	}
}
@media (hover: hover) {
	.footer-body a:hover {
		text-decoration: underline;
	}
}

/* footer-brand */
.footer-brand {
	display: grid;
	margin-bottom: 55px;
	padding-bottom: 55px;
	border-bottom: 1px solid var(--color-gray-dark);
	font-size: calc(14rem / 16);
	font-weight: var(--weight-medium);
	font-style: normal;
}
.footer-brand__link {
	margin-bottom: 15px;
}
@media (max-width: 1024px) {
	.footer-brand {
		justify-items: center;
	}
	.footer-brand__image--pc {
		display: none;
	}
}
@media (min-width: 1025px) {
	.footer-brand {
		justify-items: start;
		width: 100%;
	}
	.footer-brand__image--sp {
		display: none;
	}
}

/* footer-navi */
.footer-navi {
	display: grid;
	gap: 25px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-weight: var(--weight-bold);
}
@media (min-width: 640px) {
	.footer-navi {
		grid-template-rows: auto auto auto auto 1fr;
		grid-template-columns: auto auto auto;
		justify-content: space-between;
	}
	.footer-navi__item--tall {
		grid-row: 1 / -1;
	}
}
@media (max-width: 1024px) {
	.footer-navi {
		margin-bottom: 55px;
		padding-bottom: 55px;
		border-bottom: 1px solid var(--color-gray-dark);
	}
}
@media (min-width: 1025px) {
	.footer-navi {
		flex: 7;
		margin-right: min(6.6vw, 90px);
		padding-right: min(6.6vw, 90px);
		border-right: 1px solid var(--color-gray-dark);
	}
}

/* footer-subnavi */
.footer-subnavi {
	display: grid;
	gap: 15px;
	margin: 25px 0 0 14px;
	padding: 0;
	list-style: none;
	font-size: calc(14rem / 16);
	font-weight: var(--weight-medium);
}

/* footer-related */
.footer-related {
	display: grid;
	gap: 15px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: calc(14rem / 16);
	font-weight: var(--weight-medium);
}
@media (min-width: 640px) and (max-width: 1024px) {
	.footer-related {
		grid-template-columns: 1fr 1fr;
	}
	.footer-related__item--long {
		grid-column: 1 / -1;
	}
}
@media (min-width: 1025px) {
	.footer-related {
		flex: 4;
	}
}

/* footer-utility */
.footer-utility {
	margin: 0;
	margin-top: 55px;
	padding: 0;
	padding-top: 55px;
	list-style: none;
	border-top: 1px solid var(--color-gray-dark);
	font-size: calc(14rem / 16);
	font-weight: var(--weight-medium);
}
@media (min-width: 640px) and (max-width: 1024px) {
	.footer-utility {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 1024px) {
	.footer-utility {
		display: grid;
		gap: 15px;
	}
}
@media (min-width: 1025px) {
	.footer-utility {
		display: flex;
		gap: 5px 60px;
		flex-wrap: wrap;
		justify-content: center;
		width: 100%;
		margin-top: 55px;
		padding-top: 55px;
	}
}

/* footer-extra */
.footer-extra {
	padding: 45px var(--inner-padding);
	background-color: var(--color-gray-light-x);
}

/* footer-badge */
.footer-badge {
	margin: 0 auto;
	padding: 0;
	list-style: none;
}
.footer-badge__item {
	display: grid;
	justify-items: center;
	max-width: 280px;
}
.footer-badge__image {
	border-radius: 10px;
	margin-bottom: 5px;
}
.footer-badge__name {
	font-weight: var(--weight-bold);
}
.footer-badge__text {
	font-size: calc(12rem / 16);
}
@media (max-width: 1024px) {
	.footer-badge {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 30px 20px;
		max-width: 580px;
	}
	.footer-badge__item {
		font-size: calc(14rem / 16);
	}
}
@media (min-width: 1025px) {
	.footer-badge {
		display: flex;
		gap: 30px;
		max-width: 1170px;
	}
}

/* footer-meta */
.footer-meta {
	padding: 55px var(--inner-padding) 25px var(--inner-padding);
}

/* footer-group */
.footer-group {
	margin: 0 auto 25px auto;
	padding: 0 0 55px 0;
	list-style: none;
	border-bottom: 1px solid var(--color-gray-light);
}
.footer-group__link {
	display: grid;
	justify-items: center;
	width: fit-content;
	margin: auto;
	text-decoration: none;
	color: inherit !important;
	font-weight: var(--weight-medium);
}
@media (max-width: 1024px) {
	.footer-group {
		display: grid;
		gap: 30px 20px;
		grid-template-columns: 1fr 1fr;
		max-width: 580px;
	}
	.footer-group__link {
		gap: 10px;
		font-size: calc(12rem / 16);
	}
}
@media (min-width: 1025px) {
	.footer-group {
		display: flex;
	}
	.footer-group__item {
		width: 100%;
		padding: 0 10px;
	}
	.footer-group__item:not(:last-child) {
		border-right: 1px solid var(--color-gray-light);
	}
	.footer-group__link {
		gap: 20px;
		font-size: calc(14rem / 16);
	}
}
@media (hover: hover) {
	.footer-group__link:hover .footer-group__name {
		text-decoration: underline;
	}
}

/* footer-copyright */
.footer-copyright {
	display: block;
	width: fit-content;
	margin: auto;
	color: var(--color-gray-dark);
	font-size: calc(12rem / 16);
	font-weight: var(--weight-medium);
}


/* =====================================
	NEWS
===================================== */
/* list-news */
.list-news {
	margin: 0;
	padding: 0;
	list-style: none;
}
.list-news__item:not(:last-child) {
	border-bottom: 1px solid var(--color-black);
}
.list-news__link {
	display: flex;
	gap: 0 40px;
	text-decoration: none;
	color: inherit !important;
}
.list-news__date {
	width: 4.5em;
	font-weight: var(--weight-medium);
}
.list-news__heading {
	flex: 1;
	font-weight: var(--weight-bold);
}
@media (max-width: 1024px) {
	.list-news__link {
		flex-direction: column;
		padding: 40px 0;
		font-size: 1rem;
	}
}
@media (min-width: 1025px) {
	.list-news__link {
		padding: 35px 0;
		font-size: calc(18rem / 16);
	}
}
@media (hover: hover) {
	.list-news__link:hover .list-news__heading {
		text-decoration: underline;
	}
}