@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");

/* テーマ既存スタイルのリセット（このページのみ） */
#pcontent,
#content-w,
#wrapper,
#wrapper-in {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	overflow: visible;
	position: relative;
	top: 0;
}

:root {
	--header_height: 60px;
	@media screen and (max-width: 480px) {
		--header_height: 40px;
	}
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--header_height);
}

br.on480 {
	display: none;
}

@media screen and (max-width: 480px) {
	br.on480 {
		display: block;
	}
}

.page_work,
.page_work * {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	color: inherit;
	background: transparent;
	float: none;
	letter-spacing: normal;
	text-shadow: none;
	box-shadow: none;
}

.page_work {
	--navy: #090e5c;
	--line: #d1d9e5;
	--card: #ebeef4;
	--content: 1280px;
	display: block;
	width: 100%;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.75;
	color: var(--navy);
	background: #fff;
	counter-reset: work-sec;
}

.page_work ul,
.page_work ol,
.page_work dl {
	list-style: none;
}

.page_work a {
	color: inherit;
	text-decoration: none;
	transition: .3s;
}

.page_work img {
	display: block;
	max-width: 100%;
	height: auto;
	border: 0;
	vertical-align: bottom;
}

.page_work .container {
	width: min(var(--content), calc(100% - 40px));
	margin: 0 auto;
}

.page_work section[id] {
	scroll-margin-top: 100px;
}

/* 共通見出し .sec_ttl */
.page_work .sec_ttl {
	display: flex;
	align-items: center;
	margin: 0 0 32px;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.46;
	color: var(--navy);
	counter-increment: work-sec;
}

.page_work .sec_ttl::before {
	content: counter(work-sec, decimal-leading-zero);
	flex-shrink: 0;
	margin-right: 28px;
	padding-right: 28px;
	border-right: 2px solid var(--navy);
	font-size: 80px;
	font-weight: 700;
	line-height: 1.25;
}

/* 下層共通 */
.page_work .under_common {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.page_work .page_img {
	width: 100%;
}

.page_work .page_img img {
	width: 100%;
	height: 189px;
	object-fit: cover;
}

.page_work .under_common .breadcrumbs,
.page_work .under_common .page_ttl,
.page_work .under_common > .txt,
.page_work .under_common .anchor_list {
	width: min(var(--content), calc(100% - 40px));
	margin-left: auto;
	margin-right: auto;
}

.page_work .breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 12px;
	font-size: 16px;
	line-height: 1.55;
	color: var(--navy);
}

.page_work .breadcrumb_item {
	display: flex;
	align-items: center;
}

.page_work .breadcrumb_item:not(:last-child)::after {
	content: ">";
	margin: 0 8px;
}

.page_work .page_ttl {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 14px;
	text-align: center;
}

.page_work .page_ttl .ja {
	font-size: 44px;
	font-weight: 700;
	line-height: 1.4;
}

.page_work .page_ttl .en {
	margin-top: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.08em;
}

.page_work .under_common > .txt {
	margin-top: 24px;
	font-size: 20px;
	line-height: 2;
	text-align: center;
}

.page_work .anchor_list {
	display: flex;
	margin-top: 36px;
	margin-bottom: 64px;
	border: 2px solid var(--line);
	counter-reset: work-anchor;
}

.page_work .anchor_item {
	display: flex;
	flex: 1 1 0;
	border-right: 2px solid var(--line);
	counter-increment: work-anchor;
}

.page_work .anchor_item:last-child {
	border-right: 0;
}

.page_work .anchor_item a {
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	min-height: 120px;
	padding: 8px 48px 12px 32px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.8;
}

.page_work .anchor_item a::before {
	content: counter(work-anchor, decimal-leading-zero);
	font-size: 40px;
	font-weight: 700;
	line-height: 1.36;
}

.page_work .anchor_item a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 27px;
	width: 25px;
	height: 16px;
	background: url("../images/work/chevron.svg") center / 25px 16px no-repeat;
	transform: translateY(-50%);
	transition: .3s;
}

.page_work .anchor_item a:hover {
	background: var(--card);
}

/* 01 */
.page_work .work_section01 {
	padding-bottom: 80px;
}

.page_work .work_section01 .img img {
	width: 100%;
	height: 307px;
	object-fit: cover;
}

.page_work .work_section01 .note {
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.5;
	text-align: right;
}

.page_work .work_section01 .container > .txt {
	margin-top: 24px;
	font-size: 16px;
	line-height: 1.75;
}

.page_work .work_section01 .work_list {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 20px;
	margin-top: 36px;
}

.page_work .work_section01 .work_item {
	display: flex;
	align-items: center;
	gap: 24px;
	width: calc(50% - 10px);
	min-height: 136px;
	padding: 20px 28px;
	background: var(--card);
}

.page_work .work_section01 .item_img {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
}

.page_work .work_section01 .work_item .item_img {
	width: 100px;
}

.page_work .work_section01 .item_img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.page_work .work_section01 .item_ttl {
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
}

/* 02 */
.page_work .work_section02 {
	padding-bottom: 80px;
}

.page_work .work_section02 .cols {
	display: flex;
	align-items: flex-start;
	gap: 48px;
}

.page_work .work_section02 .col1 {
	flex: 0 1 518px;
	width: 518px;
	max-width: 42%;
}

.page_work .work_section02 .col2 {
	flex: 1 1 0;
	min-width: 0;
}

.page_work .work_section02 .img img {
	width: 100%;
	height: 412px;
	object-fit: cover;
}

.page_work .work_section02 .note {
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.55;
	text-align: right;
}

.page_work .work_section02 .heading {
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
}

.page_work .work_section02 .col2 > .txt {
	margin-top: 10px;
	font-size: 16px;
	line-height: 1.625;
}

.page_work .work_section02 .work_list {
	display: flex;
	flex-direction: column;
	margin: 24px 0 16px;
}

.page_work .work_section02 .work_item {
	display: flex;
	align-items: stretch;
}

.page_work .work_section02 .work_item:nth-child(n+4) {
	display: none;
}

.page_work .work_section02 .item_term {
	display: flex;
	flex: 0 0 212px;
	align-items: center;
	padding: 14px 24px;
	border: 2px solid var(--line);
	background: var(--card);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.57;
}

.page_work .work_section02 .item_desc {
	display: flex;
	flex: 1 1 0;
	align-items: center;
	padding: 14px 24px;
	border: 2px solid var(--line);
	border-left: 0;
	font-size: 16px;
	line-height: 2.04;
}

.page_work .work_section02 .work_item + .work_item .item_term,
.page_work .work_section02 .work_item + .work_item .item_desc {
	border-top: 0;
}

/* 03 */
.page_work .work_section03 {
	padding-bottom: 80px;
}

.page_work .work_section03 .work_list {
	display: flex;
	gap: 24px;
}

.page_work .work_section03 .work_item {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	min-width: 0;
}

.page_work .work_section03 .item_img img {
	width: 100%;
	height: 314px;
	object-fit: cover;
}

.page_work .work_section03 .item_ttl {
	margin-top: 12px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.66;
}

.page_work .work_section03 .item_note {
	margin-top: 2px;
	font-size: 14px;
	line-height: 1.55;
	text-align: right;
}

/* 04 */
.page_work .work_section04 {
	padding-bottom: 80px;
}

.page_work .work_section04 .cols {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 129px;
	padding: 16px 64px;
	background: var(--card);
}

.page_work .work_section04 .col1 {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: 56px;
	min-width: 0;
}

.page_work .work_section04 .img {
	flex-shrink: 0;
	width: 125px;
	height: 96px;
}

.page_work .work_section04 .img img {
	width: 125px;
	height: 96px;
	object-fit: contain;
}

.page_work .work_section04 .col1 .txt {
	font-size: 22px;
	line-height: 1.82;
}

.page_work .work_section04 .col2 {
	flex-shrink: 0;
}

.page_work .work_section04 .btn a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 281px;
	height: 62px;
	border: 2px solid var(--navy);
	background: #fff;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.63;
	white-space: nowrap;
}

.page_work .work_section04 .btn a:hover {
	background: var(--navy);
	color: #fff !important;
}

@media screen and (max-width: 1024px) {
	.page_work .page_img img {
			height: 140px;
		}

	.page_work .page_ttl .ja {
			font-size: 32px;
		}

	.page_work .under_common > .txt {
			font-size: 16px;
			line-height: 1.8;
		}

	.page_work .anchor_list {
			flex-wrap: wrap;
		}

	.page_work .anchor_item {
			flex: 1 1 50%;
			border-bottom: 2px solid var(--line);
		}

	.page_work .anchor_item:nth-child(2n) {
			border-right: 0;
		}

	.page_work .anchor_item:nth-child(n+3) {
			border-bottom: 0;
		}

	.page_work .sec_ttl {
			font-size: 24px;
		}

	.page_work .sec_ttl::before {
			margin-right: 16px;
			padding-right: 16px;
			font-size: 48px;
		}

	.page_work .work_section01 .img img,
	.page_work .work_section02 .img img,
	.page_work .work_section03 .item_img img {
			height: auto;
			aspect-ratio: 16 / 9;
		}

	.page_work .work_section01 .item_ttl {
			font-size: 18px;
		}

	.page_work .work_section01 .work_item .item_img {
		width: 80px;
	}

	.page_work .work_section02 .cols,
	.page_work .work_section04 .cols,
	.page_work .work_section04 .col1 {
			flex-direction: column;
		}

	.page_work .work_section02 .col1,
	.page_work .work_section02 .col2 {
			width: 100%;
			max-width: none;
		}

	.page_work .work_section02 .col1 {
		flex: 0 0 auto;
	}

	.page_work .work_section02 .item_term {
			flex-basis: 140px;
			font-size: 16px;
		}

	.page_work .work_section03 .work_item {
			width: 100%;
		}

	.page_work .work_section04 .cols {
			padding: 24px 20px;
		}

	.page_work .work_section04 .col1 {
			gap: 16px;
		}

	.page_work .work_section03 .item_ttl {
		font-size: 18px;
	}

	.page_work .work_section04 .col1 .txt {
			font-size: 16px;
		}
}

@media screen and (max-width: 768px) {
	.page_work .anchor_item {
			flex-basis: 100%;
			border-right: 0;
		}

	.page_work .anchor_item:nth-child(n+3) {
			border-bottom: 2px solid var(--line);
		}

	.page_work .anchor_item:last-child {
			border-bottom: 0;
		}

	.page_work .work_section01 .work_item {
			width: 100%;
			min-height: 110px;
		}

	.page_work .work_section02 .work_item {
			flex-direction: column;
		}

	.page_work .work_section02 .cols {
			gap: 24px;
	}

	.page_work .work_section02 .item_term,
	.page_work .work_section02 .item_desc {
			flex-basis: auto;
			width: 100%;
			border-left: 2px solid var(--line);
		}

	.page_work .work_section02 .item_desc {
			border-top: 0;
		}

	.page_work .work_section03 .work_list {
		flex-direction: column;
	}

	.page_work .work_section02 .work_item + .work_item .item_term {
			border-top: 0;
		}
}

@media screen and (max-width: 480px) {
	.page_work .work_section01,
	.page_work .work_section02,
	.page_work .work_section03 {
		padding-bottom: 56px;
	}
	.page_work .work_section01 .work_item .item_img {
		width: 64px;
	}
}