@charset "UTF-8";

/* ====================================
	コーポレートトップのスタイル

	対象 : /corporate/
 ==================================== */

/* ====================================
	Webフォント：Crimson Text
 ==================================== */
@font-face {
	font-family: 'Crimson Text';
	src: url('/assets/common/fonts/crimson-text-latin-600.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

/* ====================================
	共有パーツ
 ==================================== */

/* リンクと本文を区切る短い罫線 */
.section-links__link::after,
.card-links__title::after {
	content: '';
	display: block;
	inline-size: 5rem;
	margin-top: 2rem;
	border-top: 2px solid var(--black);
}

@media print,
screen and (width >=1080px) {

	.section-links__link::after,
	.card-links__title::after {
		margin-top: 3rem;
	}
}

/* ====================================
	メインビジュアル
 ==================================== */
.main-visual {
	max-inline-size: 1500px;
	margin: 0 auto;
}

.main-visual img {
	display: block;
}

/* ====================================
	クイックアクセス
 ==================================== */
.quick-access {
	padding-block: 2rem 1.4rem;
	background-color: var(--gray-100);
}

.quick-access .layout-inner {
	display: grid;
	justify-items: center;
	gap: 20px;
}

.quick-access__title {
	display: flex;
	gap: .25em;
	font-family: 'Crimson Text', serif;
	font-size: 2rem;
	font-weight: 600;
	line-height: 1;
}

.quick-access__list {
	display: flex;
	gap: 2px;
	inline-size: 100%;
}

.quick-access__list>li {
	flex: 1;
}

.quick-access__link {
	display: grid;
	justify-items: center;
	gap: 6px;
	font-size: 1.2rem;
	line-height: 1.3;
	text-align: center;
}

.quick-access__icon {
	inline-size: 42px;
	block-size: 42px;
	background: var(--icon) no-repeat center / contain, var(--gray-500);
	border-radius: 20%;
}

.quick-access__icon--press-releases {
	--icon: url('/assets/pages/corporate/images/icon-quick-press-releases.svg');
}

.quick-access__icon--notices {
	--icon: url('/assets/pages/corporate/images/icon-quick-notices.svg');
}

.quick-access__icon--blog {
	--icon: url('/assets/pages/corporate/images/icon-quick-blog.svg');
}

.quick-access__icon--awards {
	--icon: url('/assets/pages/corporate/images/icon-quick-awards.svg');
}

.quick-access__icon--corporate-profile {
	--icon: url('/assets/pages/corporate/images/icon-quick-corporate-profile.svg');
}

@media (hover:hover) and (pointer: fine) {
	.quick-access__link:hover {
		color: var(--sharp-red);
		text-decoration: none;
	}

	.quick-access__link:hover .quick-access__icon {
		background-color: var(--sharp-red);
	}
}

@media print,
screen and (width >=768px) {
	.quick-access {
		padding-block: 20px;
		background-color: transparent;
	}

	.quick-access .layout-inner {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 30px;
	}

	.quick-access__title {
		display: block;
		font-size: 2.4rem;
		text-align: center;
	}

	.quick-access__title span {
		display: block;
	}

	.quick-access__list {
		inline-size: auto;
	}

	.quick-access__list>li {
		flex: none;
		inline-size: 95px;
	}

	.quick-access__icon {
		inline-size: 50px;
		block-size: 50px;
	}
}

/* ====================================
	画像＋メインリンク＋サブリンク一覧のセクション
 ==================================== */
.section-links {
	padding-block: 6rem 3rem;
}

.section-links__heading {
	font-size: 2.6rem;
	font-weight: 700;
	text-align: center;
}

.section-links__main {
	margin-top: 3rem;
}

.section-links__figure {
	max-inline-size: 560px;
	margin-inline: auto;
}

.section-links__figure img {
	aspect-ratio: 8 / 5;
	object-fit: cover;
}

.section-links__caption {
	margin-top: .5rem;
	font-size: 1.2rem;
	line-height: 1.5;
}

.section-links__body {
	margin-top: 3rem;
	padding-block: 2rem;
	border-top: 1px solid var(--gray-300);
}

.section-links__lead {
	margin-top: 4rem;
	font-size: 1.5rem;
	line-height: 1.5;
}

.section-links__item {
	padding-block: 2rem;
	border-top: 1px solid var(--gray-300);
}

.section-links__item:last-child {
	border-bottom: 1px solid var(--gray-300);
}

/* メインリンクとサブリンクの共通スタイル */
.section-links__link a,
.section-links__item a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.5;
}

@media (hover:hover) and (pointer: fine) {

	.section-links__link a:hover,
	.section-links__item a:hover {
		color: var(--sharp-red);
		text-decoration: none;
	}
}

@media print,
screen and (width >=1080px) {
	.section-links {
		padding-block: 10rem 5rem;
	}

	.section-links__heading {
		font-size: 3.4rem;
	}

	.section-links__main {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8rem;
		margin-top: 6rem;
	}

	.section-links__figure img {
		aspect-ratio: 7 / 4;
	}

	.section-links__body {
		align-self: start;
		margin-top: 0;
		padding-block: 3rem;
		border-bottom: 1px solid var(--gray-300);
	}

	.section-links__lead {
		margin-top: 6rem;
		font-size: 1.6rem;
	}

	.section-links__list {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0 5%;
		margin-top: 4rem;
	}

	.section-links__item {
		padding-block: 1.8rem;
	}

	/* 3列グリッドの各列の最終項目 */
	.section-links__item:nth-last-child(-n+3) {
		border-bottom: 1px solid var(--gray-300);
	}

	.section-links__link a {
		font-size: 2.4rem;
	}

	.section-links__item a {
		font-size: 2rem;
	}
}

/* ====================================
	カード型リンク
 ==================================== */
.card-links {
	padding-block: 3rem;
}

.card-links__item {
	padding-block: 2.6rem;
	border-top: 1px solid var(--gray-300);
}

.card-links__col:last-child .card-links__item:last-child {
	border-bottom: 1px solid var(--gray-300);
}

.card-links__head {
	display: flex;
	align-items: start;
	gap: 2rem;
}

.card-links__figure {
	flex: none;
	inline-size: 14rem;
}

.card-links__figure img {
	aspect-ratio: 8 / 5;
	object-fit: cover;
}

.card-links__title {
	flex: 1;
	min-inline-size: 0;
}

.card-links__title span {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.5;
}

.card-links__item--sub .card-links__title::after {
	content: none;
}

.card-links__lead {
	margin-top: 4rem;
	font-size: 1.5rem;
	line-height: 1.5;
}

@media (hover:hover) and (pointer: fine) {
	.card-links__head:hover {
		color: var(--sharp-red);
		text-decoration: none;
	}
}

@media print,
screen and (width >=1080px) {
	.card-links {
		padding-block: 5rem;
	}

	.card-links .layout-inner {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		gap: 8rem;
	}

	.card-links__item {
		padding-block: 1.4rem;
	}

	/* 横並びになるため最終列以外の最終項目にも下線を足す */
	.card-links__col:not(:last-child) .card-links__item:last-child {
		border-bottom: 1px solid var(--gray-300);
	}

	.card-links__head {
		gap: 3rem;
	}

	.card-links__item--sub .card-links__head {
		align-items: center;
	}

	.card-links__figure {
		inline-size: 16rem;
	}

	.card-links__title span {
		font-size: 2.4rem;
	}

	.card-links__item--sub .card-links__title span {
		font-size: 2rem;
	}

	.card-links__lead {
		margin-top: 2rem;
		font-size: 1.6rem;
	}
}

/* ====================================
	More Contents
 ==================================== */
.more-contents {
	padding-block: 6rem 3rem;
}

.more-contents__heading {
	font-size: 2.6rem;
	font-weight: 700;
	text-align: center;
}

.more-contents__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 4rem 4%;
	margin-top: 4rem;
}

.more-contents__head {
	display: block;
}

.more-contents__figure img {
	aspect-ratio: 9 / 5;
	object-fit: cover;
}

.more-contents__title {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 2.6rem;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.5;
}

.more-contents__lead {
	margin-top: 1.4rem;
	font-size: 1.4rem;
	line-height: 1.5;
}

@media (hover:hover) and (pointer: fine) {
	.more-contents__head:hover {
		color: var(--sharp-red);
		text-decoration: none;
	}
}

@media print,
screen and (width >=1080px) {
	.more-contents {
		padding-block: 10rem 5rem;
	}

	.more-contents__heading {
		font-size: 3.4rem;
	}

	.more-contents__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 6rem;
		margin-top: 6rem;
	}

	.more-contents__title {
		gap: 2rem;
		margin-top: 3rem;
		font-size: 2rem;
	}

	.more-contents__lead {
		margin-top: 2rem;
		font-size: 1.6rem;
	}
}
