@charset "utf-8";

/* =====================================
	normalize
===================================== */
/* html */
html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--header-height);
}

/* body */
body {
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
	margin: 0;
	background: var(--color-x-light-gray) no-repeat url("../files/bg_body_01.svg") left top;
	background-size: 81.4% auto;
}
@media (max-width: 1024px) {
	body[data-expanded-hamburger="true"] {
		overflow: hidden;
	}
	body[data-expanded-hamburger="true"] .brand,
	body[data-expanded-hamburger="true"] .main,
	body[data-expanded-hamburger="true"] .footer,
	body[data-expanded-hamburger="true"] .footer-fixed,
	body[data-expanded-hamburger="true"] .splide,
	body[data-expanded-hamburger="true"] .cookie {
		visibility: hidden;
	}
}


/* =====================================
	header
===================================== */
/* header */
.header {
	position: sticky;
	z-index: 1000;
	top: 0;
	border-bottom: 1px solid var(--color-white);
	background-color: var(--color-white);
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
}
.header__inner {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	min-height: calc(var(--header-height) - 1px);
	padding: 0 var(--inner-padding);
	max-width: var(--inner-width-x-large);
	margin: 0 auto;
}
@media (min-width: 1025px) {
	.header__inner {
		padding-right: 0;
	}
}

/* brand */
.brand {
	margin: 0;
	font-size: 1.0rem;
}
@media (max-width: 1024px) {
	.brand__image {
		width: 90px;
	}
}

/* hamburger */
.hamburger {
	appearance: none;
	position: relative;
	z-index: 1;
	justify-self: end;
	width: 24px;
	height: 24px;
	padding: 0;
	border: none;
	border-radius: 0;
	background: none;
}
.hamburger__line,
.hamburger__line::before,
.hamburger__line::after {
	position: absolute;
	display: block;
	width: 24px;
	height: 2px;
	content: "";
	transition: top 0.3s, transform 0.3s, background-color 0.3s;
	border-radius: 1px;
	background-color: var(--color-blue);
}
.hamburger__line {
	top: 11px;
	left: 0;
}
.hamburger__line::before {
	top: -5px;
}
.hamburger__line::after {
	top: 5px;
}
.hamburger[aria-expanded="true"] .hamburger__line {
	background-color: transparent;
}
.hamburger[aria-expanded="true"] .hamburger__line::before {
	top: 0;
	transform: rotate(45deg);
}
.hamburger[aria-expanded="true"] .hamburger__line::after {
	top: 0;
	transform: rotate(-45deg);
}
@media (min-width: 1025px) {
	.hamburger {
		display: none;
	}
}

/* navbar */
@media (max-width: 1024px) {
	.navbar {
		position: fixed;
		inset: var(--header-height) 0 0 0;
		display: none;
		overflow-y: auto;
		padding: var(--inner-padding);
		background: var(--color-white);
	}
}
@media (min-width: 1025px) {
	.navbar {
		display: grid !important;
		gap: 0 30px;
		grid-template-columns: 1fr min(19.8vw, 270px) auto;
		align-items: center;
		align-self: stretch;
	}
}

/* utility */
.utility {
	display: flex;
	gap: 15px 30px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 1.3rem;
}
.utility__item {
	padding-left: 15px;
	background: no-repeat url("../files/ico_caret_dark-gray_01.svg") left center;
}
.utility__link {
	text-decoration: none;
	color: inherit !important;
}
@media (max-width: 1024px) {
	.utility--sp {
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 40px;
	}
	.utility--pc {
		display: none;
	}
}
@media (min-width: 1025px) {
	.utility--pc {
		grid-area: 1 / 1 / 2 / 2;
		align-items: center;
		justify-content: flex-end;
	}
	.utility--sp {
		display: none;
	}
}
@media (hover: hover) {
	.utility__link:hover {
		text-decoration: underline;
	}
}

/* site-search */
.site-search {
	display: grid;
	grid-template-columns: 1fr 35px;
	height: 35px;
	border-bottom: 1px solid var(--color-dark-gray);
}
.site-search__field {
	appearance: none;
	width: 100%;
	padding: 0 10px;
	border: none;
	background-color: transparent;
}
.site-search__field::placeholder {
	font-size: 1.4rem;
}
.site-search__button {
	appearance: none;
	padding: 0;
	border: none;
	background: none;
}
@media (min-width: 1025px) {
	.site-search--header {
		grid-area: 1 / 2 / 2 / 3;
	}
}

/* global */
.global {
	margin: 0;
	padding: 0;
	list-style: none;
}
.global__item {
	position: relative;
}
.global__link {
	appearance: none;
	display: flex;
	gap: 10px;
	align-items: center;
	width: 100%;
	transition: color 0.3s, background-color 0.3s, font-weight 0.3s;
	text-align: center;
	text-decoration: none;
	color: inherit !important;
	border: none;
	background: none;
	font-size: 1.5rem;
}
.global__link[aria-current="page"],
.global__link[aria-expanded="true"] {
	color: var(--color-blue) !important;
	background-color: var(--color-light-blue);
	font-weight: bold;
}
@media (max-width: 1024px) {
	.global {
		margin-top: 40px;
	}
	.global__item {
		border-bottom: 1px solid var(--color-light-gray);
	}
	.global__link {
		justify-content: space-between;
		padding: 16px 10px;
	}
}
@media (min-width: 1025px) {
	.global {
		grid-area: 2 / 1 / 3 / 3;
		display: flex;
		justify-content: flex-end;
		margin-bottom: 10px;
	}
	.global__item:not(:first-child) {
		padding-left: 1px;
	}
	.global__item:not(:first-child)::before {
		position: absolute;
		top: 12px;
		bottom: 12px;
		left: 0;
		width: 1px;
		content: "";
		background-color: var(--color-light-gray);
	}
	.global__link {
		justify-content: center;
		width: clamp(135px, 12.1vw, 165px);
		padding: 10px 0;
	}
}
@media (hover: hover) {
	.global__item:hover .global__link {
		color: var(--color-blue) !important;
		background-color: var(--color-light-blue);
		font-weight: bold;
	}
}

/* mega */
.mega__trigger::after {
	width: 6px;
	height: 9px;
	content: "";
	transition: transform 0.3s;
	transform: rotate(90deg);
	background: no-repeat url("../files/ico_chevron_dark-gray_01.svg") center center;
	background-size: contain;
}
.mega__list {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	border-radius: 10px;
	background-color: var(--color-white);
}
.mega__item {
	width: 100%;
}
.mega__link {
	display: grid;
	transition: color 0.3s, font-weight 0.3s;
	text-decoration: none;
	color: inherit !important;
}
.mega__heading {
	display: grid;
	gap: 10px;
	grid-template-columns: 40px auto;
	align-items: center;
}
@media (max-width: 1024px) {
	a.mega__trigger {
		display: none;
	}
	.mega__trigger[aria-expanded="true"]::after {
		transform: rotate(270deg);
	}
	.mega__panel {
		display: none;
		padding: 20px 0 !important;
	}
	.mega__list {
		gap: 20px;
		flex-wrap: wrap;
	}
	.mega__link {
		gap: 5px;
		padding: 0 10px;
	}
	.mega__heading {
		font-size: 1.5rem;
	}
	.mega__lead {
		font-size: 1.2rem;
	}
}
@media (min-width: 1025px) {
	button.mega__trigger {
		display: none;
	}
	.mega:focus-within .mega__trigger::after {
		transform: rotate(270deg);
	}
	.mega__panel {
		position: fixed;
		right: 0;
		left: 0;
		display: block !important;
		visibility: hidden;
		margin: 0 max(calc(50% - 640px), 20px);
		transition: padding-top 0.3s, opacity 0.3s;
		opacity: 0;
		box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.1);
	}
	.mega:focus-within .mega__panel {
		visibility: visible;
		padding-top: 10px;
		opacity: 1;
	}
	.mega__list {
		padding: 30px 5px;
	}
	.mega__item {
		padding: 0 25px;
	}
	.mega__item:not(:first-child) {
		border-left: 1px solid var(--color-light-gray);
	}
	.mega__link {
		gap: 15px;
	}
	.mega__heading {
		min-height: 3.2em;
		font-size: 1.6rem;
	}
	.mega__lead {
		font-size: 1.3rem;
	}
}
@media (hover: hover) {
	.mega:hover a.mega__trigger::after {
		transform: rotate(270deg);
	}
	.mega:hover .mega__panel {
		visibility: visible;
		padding-top: 10px;
		opacity: 1;
	}
	.mega__link:hover {
		color: var(--color-blue) !important;
		font-weight: bold;
	}
}

/* cta */
.cta {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 1.4rem;
}
.cta__link {
	gap: 10px;
	align-content: center;
	align-items: center;
	transition: background-color 0.3s;
	text-decoration: none;
}
.cta__link::before {
	line-height: 1;
}
.cta__link--download {
	color: var(--color-white) !important;
	background-color: var(--color-dark-blue);
}
.cta__link--download::before {
	content: url("../files/ico_download_01.svg");
}
.cta__link--contact {
	color: var(--color-dark-gray) !important;
	background-color: var(--color-yellow);
}
.cta__link--contact::before {
	content: url("../files/ico_contact_01.svg");
}
@media (hover: hover) {
	.cta__link--download:hover {
		background-color: var(--color-blue);
	}
	.cta__link--contact:hover {
		background-color: var(--color-light-yellow);
	}
}
@media (max-width: 1024px) {
	.cta--header {
		gap: 10px;
		margin-top: 40px;
	}
	.cta--footer {
		grid-template-columns: 1fr 1fr;
	}
	.cta__link {
		display: flex;
		justify-content: center;
		min-height: 56px;
	}
	.cta__link br {
		display: none;
	}
}
@media (min-width: 1025px) {
	.cta {
		grid-area: 1 / 3 / 3 / 4;
		grid-template-columns: 1fr 1fr;
		align-self: stretch;
	}
	.cta__link {
		display: grid;
		width: 120px;
		height: 100%;
		text-align: center;
	}
}


/* =====================================
	main
===================================== */
/* breadcrumb */
.breadcrumb {
	padding: 10px 0;
	color: var(--color-white);
	background-color: var(--color-blue);
	font-size: 1.2rem;
}
.breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	max-width: var(--inner-width-large);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
	list-style: none;
}
.breadcrumb__item:not(:last-child)::after {
	margin: 0 10px;
	content: url("../files/ico_chevron_white_01.svg");
}
.breadcrumb__link {
	color: inherit !important;
}

/* cover */
.cover {
	display: grid;
	gap: 20px;
	align-content: center;
	max-width: var(--inner-width);
	margin: 0 auto;
	padding: var(--inner-padding);
}
.cover__heading {
	margin: 0;
}
.cover__label {
	font-weight: 500;
}
.cover__lead {
	margin: 0;
}
.cover__list {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}
.cover__category {
	background-color: var(--color-white);
}
@media (max-width: 768px) {
	.cover {
		min-height: 180px;
	}
	.cover__heading {
		font-size: 2.6rem;
	}
	.cover__label {
		font-size: 1.6rem;
	}
}
@media (min-width: 769px) {
	.cover {
		min-height: 340px;
	}
	.cover__heading {
		font-size: 4.0rem;
	}
	.cover__label {
		font-size: 2.0rem;
	}
}

/* contents */
.contents {
	padding: 60px 0;
	background-color: var(--color-white);
}
.contents__inner {
	max-width: var(--inner-width);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
}
.contents__inner--large {
	max-width: var(--inner-width-large);
}
.contents__inner > :first-child {
	margin-top: 0;
}
.contents__inner > :last-child {
	margin-bottom: 0;
}
.contents__figure {
	margin-bottom: 40px;
}
.contents__image {
	width: 100%;
	border-radius: 8px;
}
.contents__panel > :first-child {
	margin-top: 0;
}
.contents__panel > :last-child {
	margin-bottom: 0;
}
.contents__action {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	justify-content: center;
	margin: 50px 0;
}

/* pagination */
.pagination {
	margin: 50px 0;
}
.pagination__list {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
.pagination__item:has(.pagination__prev) {
	margin-right: 10px;
}
.pagination__item:has(.pagination__next) {
	margin-left: 10px;
}
.pagination__link {
	appearance: none;
	display: block;
	min-width: 24px;
	padding: 1px;
	transition: color 0.3s, background-color 0.3s;
	text-align: center;
	text-decoration: none;
	color: inherit !important;
	border: none;
	border-radius: 3px;
	background-color: var(--color-white);
	font-size: 1.4rem;
}
.pagination__link[aria-current="page"] {
	color: var(--color-white) !important;
	background-color: var(--color-blue);
}
.pagination__prev,
.pagination__next {
	display: flex;
	gap: 9px;
	align-items: center;
	text-decoration: none;
	color: inherit !important;
}
.pagination__prev::before,
.pagination__next::after {
	width: 26px;
	height: 26px;
	content: "";
	transition: background-image 0.3s;
	background: no-repeat url("../files/ico_circle-chevron_01.svg");
}
.pagination__prev::before {
	transform: rotate(180deg);
}
@media (hover: hover) {
	.pagination__link:hover {
		color: var(--color-white) !important;
		background-color: var(--color-blue);
	}
	.pagination__prev:hover::before,
	.pagination__next:hover::after {
		background-image: url("../files/ico_circle-chevron_light-gray_01.svg");
	}
}

/* note */
.note {
	display: grid;
	align-content: center;
	max-width: var(--inner-width-large);
	min-height: 120px;
	margin: 0 auto;
	padding: var(--inner-padding);
}
.note > :first-child {
	margin-top: 0;
}
.note > :last-child {
	margin-bottom: 0;
}
.note__list {
	font-size: 1.2rem;
}

/* banners */
.banners {
	display: grid;
}
.banner {
	grid-row: span 3;
	display: grid;
	grid-template-rows: subgrid;
	color: var(--color-white);
}
.banner--download {
	background-color: var(--color-dark-blue);
}
.banner--faq,
.banner--service {
	background-color: var(--color-blue);
}
.banner--terms {
	background-color: var(--color-dark-turquoise);
}
.banner__inner {
	grid-row: inherit;
	display: inherit;
	grid-template-rows: inherit;
	align-items: start;
	justify-items: center;
	background: rgba(255, 255, 255, 0.1) no-repeat center bottom;
}
.banner__inner--download {
	background-image: url("../files/bg_banner_download_01.png");
}
.banner__inner--faq {
	background-image: url("../files/bg_banner_faq_01.png");
}
.banner__inner--service {
	background-image: url("../files/bg_banner_service_01.png");
}
.banner__inner--terms {
	background-image: url("../files/bg_banner_terms_01.png");
}
.banner__heading {
	margin: 0;
}
.banner__lead {
	margin: 0;
}
.banner__button {
	min-width: min(230px, 100%);
	background-color: var(--color-white);
}
.banner__button--download,
.banner__button--faq,
.banner__button--service {
	color: var(--color-blue) !important;
	background-image: url("../files/ico_arrow_blue_01.svg");
}
.banner__button--terms {
	color: var(--color-turquoise) !important;
	background-image: url("../files/ico_arrow_turquoise_01.svg");
}
@media (max-width: 768px) {
	.banner {
		padding: 15px;
	}
	.banner__inner {
		padding: 20px 15px;
		border-radius: 15px;
		background-size: 345px auto;
	}
	.banner__heading {
		margin-top: 10px;
		font-size: 2.2rem;
	}
	.banner__lead {
		margin-top: 15px;
		font-size: 1.2rem;
	}
	.banner__button {
		margin-top: 30px;
	}
}
@media (min-width: 769px) {
	.banners {
		grid-template-columns: 1fr 1fr;
	}
	.banner {
		padding: 25px;
	}
	.banner__inner {
		padding: 85px 25px;
		border-radius: 25px;
		background-size: 635px auto;
	}
	.banner__heading {
		font-size: 3.5rem;
	}
	.banner__lead {
		margin-top: 20px;
	}
	.banner__button {
		margin-top: 40px;
	}
}
@media (hover: hover) {
	.banner__button--download:hover,
	.banner__button--faq:hover,
	.banner__button--service:hover {
		background-color: var(--color-light-blue);
	}
	.banner__button--terms:hover {
		background-color: var(--color-light-turquoise);
	}
}


/* =====================================
	footer
===================================== */
.footer {
	flex-grow: 1;
	background-color: var(--color-white);
}
.footer__inner {
	display: grid;
	gap: 40px 25px;
	max-width: var(--inner-width-large);
	margin: 0 auto;
	padding: 0 var(--inner-padding);
}
@media (max-width: 768px) {
	.footer {
		padding: 30px 0 20px 0;
	}
}
@media (min-width: 769px) {
	.footer {
		padding: 60px 0 40px 0;
	}
}
@media (max-width: 1024px) {
	.footer__inner {
		grid-template-columns: 1fr auto;
	}
}
@media (min-width: 1025px) {
	.footer__inner {
		grid-template-columns: 1fr auto auto;
	}
}

/* operation */
@media (max-width: 1024px) {
	.operation {
		grid-column: 1 / 3;
		text-align: center;
	}
}

/* sitemap */
.sitemap__list {
	display: grid;
	gap: 10px;
	margin: 0;
	padding-left: 0;
	list-style: none;
	font-size: 1.3rem;
}
.sitemap__item {
	padding-left: 20px;
	background: no-repeat url("../files/ico_arrow_blue_01.svg") left calc(0.8em - 4px);
}
.sitemap__link {
	text-decoration: none;
	color: var(--color-blue) !important;
}
.sitemap__list-nest {
	display: grid;
	gap: 10px;
	margin: 10px 0;
	padding-left: 0;
	list-style: none;
	font-size: 1.2rem;
}
.sitemap__item-nest {
	padding-left: 20px;
	background: no-repeat url("../files/ico_disc_dark-gray_01.svg") 6px calc(0.8em - 1.5px);
	background-size: 3px;
}
.sitemap__link-nest {
	text-decoration: none;
	color: inherit !important;
}
@media (max-width: 768px) {
	.sitemap {
		column-gap: 20px;

		column-count: 2;
	}
	.sitemap__list {
		break-inside: avoid;
	}
	.sitemap__list:nth-child(even) {
		margin-top: 30px;
	}
}
@media (min-width: 769px) {
	.sitemap {
		display: flex;
		gap: 40px;
		align-items: flex-start;
		flex-wrap: wrap;
	}
}
@media (max-width: 1024px) {
	.sitemap {
		grid-column: 1 / 3;
		justify-content: space-between;
	}
}
@media (min-width: 1025px) {
	.sitemap {
		grid-column: 2 / 4;
	}
}
@media (hover: hover) {
	.sitemap__link:hover,
	.sitemap__link-nest:hover {
		text-decoration: underline;
	}
}

/* copyright */
.copyright {
	align-self: center;
	justify-self: flex-end;
	font-size: 1.1rem;
}
@media (min-width: 1025px) {
	.copyright {
		grid-column: 1 / 3;
	}
}

/* pagetop */
.pagetop__link {
	display: inline-grid;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	transition: padding-bottom 0.3s;
	border-radius: 50%;
	background-color: var(--color-white);
	box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.1);
}
@media (hover: hover) {
	.pagetop__link:hover {
		padding-bottom: 10px;
	}
}


/* =====================================
	footer-fixed
===================================== */
.footer-fixed {
	position: sticky;
	z-index: 1;
	bottom: 0;
	border-top: 1px solid var(--color-white);
}
@media (min-width: 1025px) {
	.footer-fixed {
		display: none;
	}
}


/* =====================================
	JavaScript
===================================== */
/* accordion */
[data-accordion="trigger"] {
	cursor: pointer;
}
[data-accordion="panel"] {
	display: none;
}


/* =====================================
	faq
===================================== */
.posts-faq {
	display: grid;
	gap: 10px;
}
.post-faq {
	padding: 4px;
	border: 1px solid var(--color-light-gray);
	border-radius: 5px;
}
.post-faq__button {
	position: relative;
	padding: 15px 35px 15px 45px;
	background: no-repeat url("../files/ico_faq_q_01.svg") 15px calc(0.8em + 8px);
}
.post-faq__button::after {
	position: absolute;
	top: calc(0.8em - -10px);
	right: 15px;
	width: 6px;
	height: 9px;
	content: "";
	transition: transform 0.3s;
	transform: rotate(90deg);
	background: no-repeat url("../files/ico_chevron_dark-gray_01.svg") center center;
	background-size: contain;
}
.post-faq__button[aria-expanded="true"]::after {
	transform: rotate(270deg);
}
.post-faq__a {
	margin: 0;
	padding: 15px 15px 15px 45px;
	border-top: 4px solid transparent;
	border-radius: 5px;
	background: var(--color-light-blue) no-repeat url("../files/ico_faq_a_01.svg") 15px calc(0.8em + 8px);
}
.post-faq__button > :first-child,
.post-faq__a > :first-child {
	margin-top: 0;
}
.post-faq__button > :last-child,
.post-faq__a > :last-child {
	margin-bottom: 0;
}


/* =====================================
	needs
===================================== */
.posts-needs {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
}
.post-needs__link {
	display: block;
	height: 100%;
	padding: 24px;
	transition: border-color 0.3s;
	text-decoration: none;
	color: inherit !important;
	border: 1px solid var(--color-light-gray);
	border-radius: 5px;
}
.post-needs__figure {
	overflow: hidden;
	border-radius: 5px;
}
.post-needs__image {
	object-fit: cover;
	aspect-ratio: 120 / 63;
	width: 100%;
	transition: transform 0.3s;
}
.post-needs__heading {
	margin-top: 25px;
	font-size: 1.6rem;
	font-weight: bold;
}
.post-needs__lead {
	margin-top: 15px;
}
@media (hover: hover) {
	.post-needs__link:hover {
		border-color: var(--color-blue);
	}
	.post-needs__link:hover .post-needs__image {
		transform: scale(1.2);
	}
}


/* =====================================
	news
===================================== */
/* local-yearly */
.local-yearly {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	margin: 50px 0;
}
.local-yearly__select {
	padding: 5px;
	border: 1px solid var(--color-gray);
	border-radius: 4px;
	background-color: var(--color-white);
	color: inherit;
	box-shadow: none;
}

/* post-news */
.posts-news {
	margin: 0;
	padding: 0;
	list-style: none;
}
.post-news {
	border-bottom: 1px solid var(--color-light-gray);
}
.post-news__link {
	display: grid;
	gap: 10px 0;
	grid-template-columns: auto 1fr;
	padding: 20px 0 20px 40px;
	transition: background-color 0.3s, background-position 0.3s;
	text-decoration: none;
	color: inherit !important;
	background: no-repeat url("../files/ico_circle-arrow_01.svg") left center;
}
.post-news__date {
	width: 8.5em;
	font-size: 1.2rem;
}
.post-news__list {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}
.post-news__heading {
	grid-column: 1 / 3;
	font-weight: bold;
}
@media (hover: hover) {
	.post-news__link:hover {
		background-color: var(--color-light-blue);
		background-position: 5px center;
	}
}


/* =====================================
	service
===================================== */
.posts-service {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
}
.post-service {
	grid-row: span 2;
	display: grid;
	gap: 0;
	grid-template-rows: subgrid;
}
.post-service__link {
	grid-row: inherit;
	display: inherit;
	grid-template-rows: inherit;
	padding: 19px 24px;
	transition: border-color 0.3s;
	text-decoration: none;
	color: inherit !important;
	border: 1px solid var(--color-light-gray);
	border-radius: 5px;
}
.post-service__heading {
	align-self: center;
	margin-right: -5px;
	padding-right: 35px;
	transition: background-position 0.3s;
	background: no-repeat url("../files/ico_circle-arrow_01.svg") right 5px center;
	font-size: 1.6rem;
	font-weight: bold;
}
.post-service__lead {
	position: relative;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 2px solid var(--color-light-gray);
}
.post-service__lead::after {
	position: absolute;
	top: -2px;
	left: 0;
	width: 50px;
	height: 2px;
	content: "";
	border-radius: 1px;
	background-color: var(--color-blue);
}
@media (hover: hover) {
	.post-service__link:hover {
		border-color: var(--color-blue);
	}
	.post-service__link:hover .post-service__heading {
		background-position: right center;
	}
}


/* =====================================
	case
===================================== */
/* local-tab */
.local-tab {
	margin: 30px 0;
}
.local-tab__list {
	display: flex;
	margin: 0;
	padding: 0 10px;
	list-style: none;
	border-bottom: 1px solid var(--color-light-gray);
}
.local-tab__item {
	margin-bottom: -1px;
}
.local-tab__link {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	min-height: 70px;
	transition: background-color 0.3s;
	text-align: center;
	text-decoration: none;
	color: inherit !important;
	border: 1px solid var(--color-light-gray);
	border-radius: 5px 5px 0 0;
	background-color: var(--color-x-light-gray);
}
.local-tab__link[aria-current] {
	border-bottom-color: var(--color-white);
	background-color: var(--color-white);
	font-weight: bold;
}
@media (max-width: 768px) {
	.local-tab__list {
		gap: 10px;
	}
	.local-tab__item {
		flex-grow: 1;
	}
	.local-tab__item:first-child {
		flex-shrink: 0;
	}
}
@media (min-width: 769px) {
	.local-tab__list {
		gap: 20px;
	}
	.local-tab__item {
		flex: 1;
	}
	.local-tab__link {
		font-size: 1.6rem;
	}
}
@media (hover: hover) {
	.local-tab__link:not([aria-current="page"]):hover {
		background-color: var(--color-light-gray);
	}
}

/* filter */
.filter {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin: 30px 0;
	padding: 0;
	list-style: none;
}
.label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 0 20px;
	transition: border-color 0.3s, background-color 0.3s;
	text-decoration: none;
	color: var(--color-dark-gray) !important;
	border: 1px solid var(--color-light-gray);
	border-radius: 20px;
	background-color: var(--color-white);
	font-size: 1.4rem;
}
.label[aria-current] {
	color: var(--color-white) !important;
	border-color: var(--color-blue);
	background-color: var(--color-blue);
}
@media (hover: hover) {
	.label:hover {
		color: var(--color-white) !important;
		border-color: var(--color-blue);
		background-color: var(--color-blue);
	}
}

/* posts-case */
.posts-case {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
	margin: 30px 0;
	padding: 0;
	list-style: none;
}
.post-case__link {
	display: block;
	height: 100%;
	padding: 24px;
	transition: background-color 0.3s, border-color 0.3s;
	text-decoration: none;
	color: inherit !important;
	border: 1px solid var(--color-light-gray);
	border-radius: 5px;
	background-color: var(--color-x-light-gray);
	box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.1);
}
.post-case__figure {
	overflow: hidden;
	border: 1px solid var(--color-light-gray);
	border-radius: 5px;
	background-color: var(--color-white);
	box-shadow: 0 9px 6px -6px rgba(0, 0, 0, 0.1);
}
.post-case__image {
	object-fit: contain;
	aspect-ratio: 120 / 63;
	width: 100%;
	padding: 10px;
}
.post-case__heading {
	margin-top: 25px;
}
.post-case__list {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin: 25px 0 0 0;
	padding: 0;
	list-style: none;
}
.post-case__service {
	display: inline-flex;
	justify-content: center;
	padding: 8px 20px 8px 35px;
	transition: background-color 0.3s;
	border-radius: 4px;
	background: var(--color-white) no-repeat url("../files/ico_disc_blue_01.svg") 15px center;
	font-size: 1.2rem;
}
@media (hover: hover) {
	.post-case__link:hover {
		border-color: var(--color-blue);
		background-color: var(--color-white);
	}
	.post-case__link:hover .post-case__service {
		background-color: var(--color-x-light-gray);
	}
}

/* case-effect */
.case-effect {
	margin-top: 60px !important;
	margin-bottom: 40px;
	padding: 26px;
	border: 4px solid var(--color-blue);
}
.case-effect__term {
	margin: -30px -26px 30px -26px;
	margin-bottom: 26px;
	padding: 20px 26px 20px 56px;
	color: var(--color-white);
	background: var(--color-blue) no-repeat url("../files/ico_check_white_01.svg") 26px center;
	font-size: 1.8rem;
}
.case-effect__definition {
	margin-left: 0;
	padding-left: 30px;
	background: no-repeat url("../files/ico_check_blue_01.svg") left calc(0.8em - 10px);
}
.case-effect__definition:not(:first-of-type) {
	margin-top: 10px;
}

/* case-service */
.case-service {
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
	margin: 40px 0;
	padding: 20px;
	background-color: var(--color-x-light-gray);
}
.case-service__term {
	position: relative;
	width: calc(100% + 40px);
	margin: -20px -20px 15px -20px;
	padding-left: 18px;
	border-left: 2px solid var(--color-blue);
	background-color: var(--color-white);
	font-size: 1.6rem;
	font-weight: bold;
}
.case-service__term::after {
	position: absolute;
	right: 0;
	bottom: -10px;
	left: -2px;
	height: 10px;
	content: "";
	background-color: var(--color-white);
}
.case-service__definition {
	margin-left: 0;
}
.case-service__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 20px 8px 45px;
	transition: border-color 0.3s, background-position 0.3s;
	text-decoration: none;
	color: var(--color-blue) !important;
	border: 1px solid transparent;
	border-radius: 4px;
	background: var(--color-white) no-repeat url("../files/ico_circle-arrow_01.svg") 10px center;
	font-size: 1.4rem;
}
@media (hover: hover) {
	.case-service__link:hover {
		border-color: var(--color-blue);
		background-position: 15px center;
	}
}

/* case-interviewee */
.case-interviewee {
	display: grid;
	gap: 30px;
	margin: 40px 0;
}
.case-interviewee__item {
	display: grid;
	gap: 5px 20px;
	grid-template-rows: auto 1fr;
	grid-template-columns: 150px 1fr;
}
.case-interviewee__term {
	grid-area: 1 / 2 / 2 / 3;
	font-size: 1.6rem;
	font-weight: bold;
}
.case-interviewee__definition {
	grid-area: 2 / 2 / 3 / 3;
	margin-left: 0;
}
.case-interviewee__figure {
	grid-area: 1 / 1 / 3 / 2;
	margin-left: 0;
}
@media (min-width: 769px) {
	.case-interviewee {
		grid-template-columns: 1fr 1fr;
	}
}


/* =====================================
	outline
===================================== */
/* heading-outline */
.heading-outline {
	margin: 80px auto 40px auto;
	text-align: center;
}
.heading-outline__text {
	display: inline-block;
}
.heading-outline__text--mark {
	position: relative;
	z-index: 1;
}
.heading-outline__text--mark::before {
	position: absolute;
	z-index: -1;
	right: 0;
	bottom: 4px;
	left: 0;
	height: 14px;
	content: "";
	background-color: var(--color-light-yellow);
}
@media (max-width: 768px) {
	.heading-outline {
		font-size: 2.2rem;
	}
}
@media (min-width: 769px) {
	.heading-outline {
		font-size: 2.8rem;
	}
}

/* outline-case */
.outline-case {
	display: grid;
	gap: 5px;
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (max-width: 768px) {
	.outline-case {
		grid-template-columns: repeat(auto-fill, minmax(min(80px, 100%), 1fr));
	}
}
@media (min-width: 769px) {
	.outline-case {
		grid-template-columns: repeat(auto-fill, minmax(min(120px, 100%), 1fr));
	}
}

/* outline-point */
.outline-point {
	display: flex;
	gap: 20px;
	justify-content: center;
	margin: 50px 0;
	padding: 0;
	list-style: none;
}
.outline-point__item {
	width: 100%;
}
.outline-point__link {
	position: relative;
	z-index: 1;
	display: grid;
	overflow: hidden;
	gap: 5px;
	align-content: center;
	justify-items: center;
	aspect-ratio: 423 / 282;
	text-decoration: none;
	border-radius: 10px;
	box-shadow: 0 9px 6px -6px rgba(0, 0, 0, 0.1);

	container-type: inline-size;
}
.outline-point__image {
	position: absolute;
	z-index: -1;
	inset: 0;
	transition: transform 0.3s;
}
@container (max-width: 768px) {
	.outline-point__text {
		padding: 0 1.4cqw;
		color: var(--color-white);
		background-color: rgba(0, 0, 0, 0.45);
		font-size: 5.7cqw;
		font-weight: bold;
	}
}
@media (max-width: 768px) {
	.outline-point {
		flex-wrap: wrap;
	}
}
@media (min-width: 568px) and (max-width: 768px) {
	.outline-point__item {
		width: calc(50% - 10px);
	}
}
@media (hover: hover) {
	.outline-point__link:hover .outline-point__image {
		transform: scale(1.1);
	}
}