/* ========================================
   company.css - 会社概要ページ専用スタイル
   トップページのデザイン体系を継承
======================================== */

/* ========================================
   1. 会社情報テーブル
======================================== */
.section-block--company-info {
	background: var(--color-bg-yellow);
	position: relative;
}

.sec--company-info {
	padding: 6rem 1.25rem;
}

@media (min-width: 576px) {
	.sec--company-info {
		padding: 6rem 1.25rem;
	}
}

@media (min-width: 768px) {
	.sec--company-info {
		padding: 6.5rem 2rem;
	}
}

@media (min-width: 1024px) {
	.sec--company-info {
		padding: 7rem 2rem;
	}
}

@media (min-width: 1440px) {
	.sec--company-info {
		padding-top: 7.5rem;
	}
}

/* ヘッダー */
.company-info__header {
	text-align: left;
	margin-bottom: 2.5rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
}

@media (min-width: 768px) {
	.company-info__header {
		margin-bottom: 3.5rem;
	}
}

.company-info__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--title-en-sp);
	color: var(--color-primary);
	letter-spacing: var(--title-en-tracking);
	font-weight: 700;
	line-height: 1;
}

.company-info__en::first-letter {
	color: #378add;
}

@media (min-width: 768px) {
	.company-info__en {
		font-size: var(--title-en-pc);
	}
}

.company-info__title {
	font-size: var(--title-ja-sp);
	font-weight: 700;
	color: var(--color-text);
	letter-spacing: 0.06em;
	line-height: 1.3;
}

@media (min-width: 768px) {
	.company-info__title {
		font-size: var(--title-ja-pc);
	}
}

/* リスト本体 */
.company-info__list {
	max-width: 880px;
	margin: 0 auto;
	border-radius: var(--radius-md);
	overflow: hidden;
	position: relative;
}

/* 四隅L字コーナー */
.company-info__corner {
	position: absolute;
	width: 64px;
	height: 64px;
	pointer-events: none;
	z-index: 1;
	transition:
		width  0.55s cubic-bezier(0.4, 0, 0.2, 1),
		height 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.company-info__list:hover .company-info__corner,
.company-info__list.is-connected .company-info__corner {
	width: 50%;
	height: 50%;
}

.company-info__corner--tl {
	top: 0; left: 0;
	border-top:  3px solid #0a4a7a;
	border-left: 3px solid #0a4a7a;
	border-radius: var(--radius-md) 0 0 0;
}
.company-info__corner--tr {
	top: 0; right: 0;
	border-top:   3px solid #0a4a7a;
	border-right: 3px solid #0a4a7a;
	border-radius: 0 var(--radius-md) 0 0;
}
.company-info__corner--bl {
	bottom: 0; left: 0;
	border-bottom: 3px solid #0a4a7a;
	border-left:   3px solid #0a4a7a;
	border-radius: 0 0 0 var(--radius-md);
}
.company-info__corner--br {
	bottom: 0; right: 0;
	border-bottom: 3px solid #0a4a7a;
	border-right:  3px solid #0a4a7a;
	border-radius: 0 0 var(--radius-md) 0;
}

/* 行 */
.company-info__row {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 0;
	border-bottom: 1px solid #d0e2ef;
}

.company-info__row:last-child {
	border-bottom: none;
}

/* ラベル（dt） */
.company-info__label {
	flex: 0 0 36%;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.875rem 0.75rem;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--color-text);
	letter-spacing: 0.05em;
	line-height: 1.5;
	background: var(--color-primary-light);
	border-right: 1px solid var(--color-border-yellow);
}

.company-info__label::before {
	content: '';
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #378add;
	flex-shrink: 0;
	align-self: center;
}

@media (min-width: 576px) and (max-width: 767px) {
	.company-info__label {
		padding: 1.125rem 1rem;
		font-size: 0.9375rem;
	}
}

@media (min-width: 768px) {
	.company-info__label {
		flex: 0 0 240px;
		padding: 1.5rem 1.5rem;
		font-size: 1rem;
		letter-spacing: 0.06em;
		gap: 0.625rem;
	}
	.company-info__label::before {
		width: 6px;
		height: 6px;
	}
}

/* 値（dd） */
.company-info__value {
	flex: 1;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 0.875rem 0.75rem;
	font-size: 0.875rem;
	color: var(--color-text);
	line-height: var(--body-line-height-sp);
	letter-spacing: 0.04em;
	background: #ffffff;
}

@media (min-width: 576px) and (max-width: 767px) {
	.company-info__value {
		padding: 1.125rem 1rem;
		font-size: 0.9375rem;
	}
}

@media (min-width: 768px) {
	.company-info__value {
		padding: 1.5rem 1.5rem;
		font-size: 1rem;
	}
}

.company-info__sub {
	display: inline-block;
	margin-left: 0.5rem;
	font-size: 0.85em;
	color: var(--color-text-light);
}

.company-info__zip {
	display: inline-block;
	margin-right: 0.5rem;
	font-weight: 700;
	color: var(--color-text-mid);
	letter-spacing: 0.04em;
}

/* 営業電話注記 */
.company-info__note {
	display: block;
	width: 100%;
	margin-top: 0.25rem;
	font-size: 0.75rem;
	color: var(--color-text-light);
	letter-spacing: 0.04em;
	line-height: 1.5;
	font-weight: 400;
}

/* 代表電話番号 */
.company-info__tel {
	color: #0a4a7a;
	letter-spacing: 0.04em;
	font-weight: 700;
	transition: color 0.2s ease;
}

.company-info__tel:hover {
	color: var(--color-primary);
}

/* TEL / FAX 行（同番号をスラッシュ区切りで表示） */
.company-info__telfax {
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	flex-wrap: wrap;
}

.company-info__telfax-num {
	font-size: 0.875rem;
	font-weight: 700;
	color: var(--color-text);
	letter-spacing: 0.04em;
	transition: color 0.2s ease;
}

@media (min-width: 768px) {
	.company-info__telfax-num {
		font-size: 1rem;
	}
}

a.company-info__telfax-num:hover {
	color: var(--color-primary);
}

.company-info__telfax-sep {
	color: var(--color-border-yellow);
	font-weight: 700;
	font-size: 1.125rem;
}

/* URL リンク */
.company-info__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #0a4a7a;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 0.2s ease;
	font-weight: 500;
}

.company-info__link:hover {
	color: var(--color-primary);
}

.company-info__link i {
	font-size: 0.75em;
}

/* 資格バッジ */
.company-info__badge {
	display: inline-flex;
	align-items: center;
	padding: 0.4rem 0.875rem;
	background: #0a4a7a;
	color: #ffffff;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	border-radius: var(--radius-xs);
	border-left: 3px solid var(--color-primary);
}

/* 適格請求書番号など */
.company-info__code {
	display: inline-block;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: var(--color-text);
	padding: 0.25rem 0.625rem;
	background: var(--color-bg-warm);
	border: 1px dashed var(--color-border-yellow);
	border-radius: var(--radius-xs);
}

/* ========================================
   2. アクセス
======================================== */
.section-block--company-map {
	background: #0a4a7a;
	position: relative;
}

.sec--company-map {
	padding: 4rem 1.25rem;
}

@media (min-width: 576px) {
	.sec--company-map {
		padding: 5rem 1.25rem;
	}
}

@media (min-width: 768px) {
	.sec--company-map {
		padding: 6rem 2rem;
	}
}

@media (min-width: 1024px) {
	.sec--company-map {
		padding: 7rem 2rem;
	}
}

.company-map__header {
	text-align: center;
	margin-bottom: 2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
}

@media (min-width: 768px) {
	.company-map__header {
		margin-bottom: 3rem;
	}
}

.company-map__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--title-en-sp);
	color: var(--color-primary);
	letter-spacing: var(--title-en-tracking);
	font-weight: 700;
	line-height: 1;
}

.company-map__en::first-letter {
	color: #ffffff;
}

@media (min-width: 768px) {
	.company-map__en {
		font-size: var(--title-en-pc);
	}
}

.company-map__title {
	font-size: var(--title-ja-sp);
	font-weight: 700;
	color: #ffffff;
	letter-spacing: 0.06em;
	line-height: 1.3;
}

@media (min-width: 768px) {
	.company-map__title {
		font-size: var(--title-ja-pc);
	}
}

/* ========================================
   アクセス 2カラム（左：情報 / 右：地図）
======================================== */
.access__inner {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

@media (min-width: 768px) {
	.access__inner {
		flex-direction: row;
		align-items: stretch;
		gap: 3rem;
	}
}

/* 左：住所・交通手段 */
.access__info {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

@media (min-width: 768px) {
	.access__info {
		flex: 1;
	}
}

/* 住所 */
.access__address {
	font-style: normal;
	display: flex;
	align-items: flex-start;
	gap: 0.625rem;
	font-size: 0.9375rem;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.9);
	letter-spacing: 0.04em;
	line-height: 1.7;
	padding: 1rem 0.25rem;
	background: transparent;
	border: none;
	border-radius: 0;
}

.access__address i {
	color: var(--color-primary);
	flex-shrink: 0;
	margin-top: 0.2rem;
	font-size: 1rem;
}

/* 交通手段リスト */
.access__transport {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.access__transport-item {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 0.875rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.access__transport-icon {
	width: 40px;
	height: 40px;
	background: rgba(255, 255, 255, 0.12);
	color: var(--color-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.9375rem;
	flex-shrink: 0;
	border-radius: var(--radius-xs);
}

.access__transport-body {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding-top: 0.125rem;
}

.access__transport-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	color: var(--color-primary);
	line-height: 1;
}

.access__transport-text {
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.8);
	line-height: 1.7;
	letter-spacing: 0.04em;
}

/* 右：マップ */
.access__map-outer {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

/* 四隅L字コーナー */
.access__corner {
	position: absolute;
	width: 48px;
	height: 48px;
	pointer-events: none;
	z-index: 1;
	transition:
		width  0.55s cubic-bezier(0.4, 0, 0.2, 1),
		height 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.access__map-outer:hover .access__corner {
	width: 50%;
	height: 50%;
}

.access__corner--tl {
	top: 0; left: 0;
	border-top:  3px solid var(--color-primary);
	border-left: 3px solid var(--color-primary);
	border-radius: var(--radius-md) 0 0 0;
}
.access__corner--tr {
	top: 0; right: 0;
	border-top:   3px solid var(--color-primary);
	border-right: 3px solid var(--color-primary);
	border-radius: 0 var(--radius-md) 0 0;
}
.access__corner--bl {
	bottom: 0; left: 0;
	border-bottom: 3px solid var(--color-primary);
	border-left:   3px solid var(--color-primary);
	border-radius: 0 0 0 var(--radius-md);
}
.access__corner--br {
	bottom: 0; right: 0;
	border-bottom: 3px solid var(--color-primary);
	border-right:  3px solid var(--color-primary);
	border-radius: 0 0 var(--radius-md) 0;
}

@media (min-width: 768px) {
	.access__map-outer {
		flex: 1;
		min-width: 0;
		display: flex;
		flex-direction: column;
	}
}

.access__map-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--radius-md);
}

@media (min-width: 768px) {
	.access__map-wrap {
		aspect-ratio: unset;
		min-height: 0;
		flex: 1;
	}
}

.access__map-wrap iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

