/* Sanko: about | 共通 → ページ → tablet.css の順で読み込み。指定順を維持。 */

.about {
	padding-block: 64px 0;
}

.about__inner {
	max-width: 1440px;
	margin-inline: auto;
	padding-inline: 64px 63px;
}

.about__layout {
	display: flex;
	align-items: flex-start;
	margin-top: 107px;
}

.about__layout > * {
	margin-block-start: 0;
}

.about__content {
	flex: 1 1 auto;
	min-width: 0;
}

.about__content > * {
	margin-block-start: 0;
}

.section-nav {
	flex: 0 0 217px;
	position: sticky;
	top: 120px;
}

@media (min-width: 1201px) and (pointer: fine), (min-width: 1367px) {
	.about .section-nav {
		top: var(--sanko-about-nav-top, 120px);
	}
}

.section-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.section-nav__list li {
	margin: 0;
}

.section-nav__list a {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	color: #999;
	text-decoration: none;
}

.section-nav__list a::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #bbb;
	flex-shrink: 0;
}

.section-nav__list a.is-current {
	color: var(--wp--preset--color--primary);
}

.section-nav__list a.is-current::before {
	background: var(--wp--preset--color--primary);
}

@media (hover: hover) and (pointer: fine) {
	.section-nav__list a:hover {
		color: var(--wp--preset--color--primary);
	}

	.section-nav__list a:hover::before {
		background: var(--wp--preset--color--primary);
	}
}

.about-section {
	scroll-margin-top: 120px;
}

.about-section + .about-section {
	margin-top: 160px;
}

.about-section--greeting {
	margin-top: 104px !important;
}

.about-section > * {
	margin-block-start: 0;
}

.about-eyebrow {
	margin: 0;
	font-size: 1rem;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: 0.2em;
	color: var(--wp--preset--color--primary);
}

.about-heading {
	margin: 42px 0 0;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 67px;
	letter-spacing: 0.1em;
	color: #000;
}

.about-text {
	margin: 25px 0 0;
	font-size: 0.875rem;
	line-height: 35px;
	letter-spacing: 0.1em;
	color: #000;
}

.about-text--lg {
	margin-top: 27px;
	font-size: 1rem;
	line-height: 40px;
}

.about-mission__photo {
	margin: 34px 0 0;
	aspect-ratio: 1096 / 307;
	overflow: hidden;
}

.about-mission__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.about-greeting {
	display: flex;
	align-items: flex-start;
	gap: 68px;
	margin-top: 46px;
}

.about-greeting > * {
	margin-block-start: 0;
}

.about-greeting__body {
	flex: 1 1 auto;
	min-width: 0;
}

.about-greeting__body > .about-heading {
	margin-top: 0;
}

.about-greeting__sign {
	margin: 109px 0 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: #000;
	letter-spacing: 0.1em;
}

.about-greeting__role {
	font-size: 0.875rem;
}

.about-greeting__name {
	font-size: 1.125rem;
	font-weight: 500;
}

.about-greeting__photo {
	flex: 0 0 393px;
	margin: 0;
	aspect-ratio: 393 / 576;
	border-radius: 10px;
	overflow: hidden;
}

.about-greeting__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.company-table {
	max-width: 100%;
	margin: 46px 0 0;
	border-top: 1px solid var(--wp--preset--color--border-light);
}

.company-table__row {
	display: flex;
	align-items: flex-start;
	border-bottom: 1px solid var(--wp--preset--color--border-light);
	padding-block: 25px;
	font-size: 0.875rem;
	line-height: 30px;
	letter-spacing: 0.1em;
}

.company-table__row--offices {
	padding-bottom: 40px;
}

.company-table dt {
	flex: 0 0 167px;
	padding-left: 12px;
	color: #666;
	font-weight: 500;
}

.company-table dd {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	color: #000;
}

.company-table dd p {
	margin: 0;
}

.company-table__row--offices dd,
.company-table__text {
	line-height: 30px;
}

.office + .office {
	margin-top: 40px;
	padding-top: 42px;
	border-top: 1px solid var(--wp--preset--color--border-light);
}

.office__head {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 24px;
}

.office__text {
	margin: 0;
}

.office__text strong {
	font-weight: 500;
}

.office__photo {
	flex: 0 0 246px;
	width: 246px;
	max-width: 100%;
	height: auto;
	aspect-ratio: 205 / 119;
	object-fit: cover;
	border-radius: 4px;
}

.office__photo[src*="office-izumo-20261015"] {
	aspect-ratio: 1046 / 858;
	object-fit: contain;
}

.office__map {
	margin-top: 36px;
	aspect-ratio: 668 / 350;
	background: #d9d9d9;
}

.office__map iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.office__link {
	display: none;
}

.adk-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 330px;
	max-width: 100%;
	min-height: 99px;
	padding: 12px 20px;
	background: #3a6fbb;
	color: var(--wp--preset--color--base);
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.05em;
	text-align: center;
}

.adk-badge + .company-table__text {
	margin-top: 30px !important;
}

.timeline {
	position: relative;
	margin: 80px 0 0;
	padding-block: 6px 20px;
}

.timeline::before {
	content: "";
	position: absolute;
	left: 120px;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #666;
}

.timeline__item {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 0;
	min-height: 80px;
	font-size: 0.875rem;
	line-height: 22px;
	letter-spacing: 0.1em;
}

.timeline__item:last-child {
	min-height: 0;
}

.timeline__item dt {
	flex: 0 0 192px;
	color: #666;
	font-weight: 500;
}

.timeline__item dd {
	flex: 1 1 auto;
	margin: 0;
	color: #000;
}

.timeline__item::before {
	content: "";
	position: absolute;
	left: 117px;
	top: 8px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #666;
}

.timeline__item::after {
	content: "";
	position: absolute;
	left: 124px;
	top: 11px;
	width: 46px;
	height: 1px;
	background: #666;
}

.csr__lead {
	margin-top: 24px;
}

.csr-list {
	display: flex;
	justify-content: space-between;
	gap: 40px;
	list-style: none;
	margin: 33px 0 0;
	padding: 0;
}

.csr-list__item {
	flex: 0 1 330px;
	margin: 0;
}

.csr-list__title {
	margin: 0 0 12px;
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: 0.1em;
	color: #000;
}

.csr-list__item a {
	display: block;
}

.csr-list__item img {
	display: block;
	width: 100%;
	height: 99px;
	object-fit: contain;
	border: 0;
}

.csr-list__item img[src$="csr-watashi-20261016.jpg"] {
	object-fit: cover;
	object-position: 50% 60%;
}

.about + .contact-section {
	padding-top: 101px;
}

@media (max-width: 1200px), (min-width: 1201px) and (max-width: 1366px) and (pointer: coarse) {
	.about {
		padding-block: 32px 0;
	}

	.about__inner {
		padding-inline: var(--wp--custom--spacing--page-margin);
	}

	.about__layout {
		flex-direction: column;
		align-items: stretch;
		margin-top: 40px;
	}

	.section-nav {
		position: static;
		flex: 0 0 auto;
	}

	.section-nav__list {
		display: flex;
		flex-wrap: wrap;
		gap: 0 28px;
	}

	.section-nav__list a {
		height: 44px;
		font-size: 13px;
		color: #000;
	}

	.section-nav__list a::before {
		width: 10px;
		height: 10px;
		background: var(--wp--preset--color--primary);
	}

	.about__content {
		margin-top: 79px;
	}

	.about-section + .about-section {
		margin-top: 64px;
	}

	.about-section--greeting {
		margin-top: 64px !important;
	}

	.about-eyebrow {
		font-size: 13px;
		line-height: 20px;
	}

	.about-heading {
		margin-top: 20px;
		font-size: 25px;
		line-height: 40px;
		letter-spacing: 0.08em;
	}

	.about-text, .about-text--lg {
		margin-top: 18px;
		font-size: 13px;
		line-height: 28px;
		letter-spacing: 0.06em;
	}

	.about-mission__photo {
		margin: 30px calc(-1 * var(--wp--custom--spacing--page-margin)) 0;
		aspect-ratio: 390 / 154;
	}

	.about-greeting {
		flex-direction: column;
		gap: 24px;
		margin-top: 20px;
	}

	.about-greeting__photo {
		order: -1;
		flex: 0 0 auto;
		width: 100%;
		aspect-ratio: 2 / 3;
	}

	.about-greeting__photo img {
		object-fit: contain;
		object-position: center;
	}

	.about-greeting__sign {
		margin-top: 32px;
	}

	.about-greeting__body > .about-heading br {
		display: none;
	}

	.company-table {
		margin-top: 20px;
	}

	.company-table__row {
		padding-block: 24px;
		font-size: 13px;
		line-height: 24px;
	}

	.company-table dt {
		flex-basis: 100px;
		padding-left: 12px;
	}

	.office__head {
		flex-direction: column;
		gap: 16px;
	}

	.office__photo {
		flex: 0 0 auto;
		width: 204px;
		aspect-ratio: 170 / 100;
	}

	.office__map {
		display: none;
	}

	.office__link {
		display: block;
		margin-top: 12px;
		font-size: 12px;
	}

	.office__link a {
		color: #000;
		text-decoration: underline;
	}

	.office__link a::after {
		content: " ↗";
	}

	.office + .office {
		margin-top: 28px;
		padding-top: 28px;
	}

	.adk-badge {
		width: 100%;
		min-height: 60px;
		font-size: 1rem;
	}

	.adk-badge + .company-table__text {
		margin-top: 20px !important;
	}

	.timeline {
		margin-top: 40px;
	}

	.timeline::before {
		left: 78px;
	}

	.timeline__item {
		min-height: 78px;
		font-size: 13px;
		line-height: 24px;
	}

	.timeline__item dt {
		flex-basis: 130px;
	}

	.timeline__item::before {
		left: 75px;
		top: 9px;
	}

	.timeline__item::after {
		left: 82px;
		top: 12px;
		width: 36px;
	}

	.csr-list {
		flex-direction: column;
		gap: 28px;
		margin-top: 24px;
	}

	.csr-list__item {
		flex: 0 0 auto;
	}

	.about + .contact-section {
		padding-block: 40px 0;
	}
}

.about-section--mission .about-text--lg {
	font-size: 1.1rem;
}

.about-greeting__body .about-text,
.company-table__row--media dd,
.company-table__row--group dd,
.csr__lead {
	font-size: 1rem;
}

.about-greeting__body .about-text {
	letter-spacing: 0;
}

@media (min-width: 1201px) and (pointer: fine), (min-width: 1367px) {
	.about-greeting__body .about-text {
		font-size: 1.1rem;
	}

	.about-greeting__role {
		font-size: 1rem;
	}

	.about-greeting__name {
		font-size: 1.25rem;
	}
}