/* =========================================================
 * footer.css
 * 同様にCocoon標準フッターのマークアップに対するベストエフォートの再スタイリング。
 * ========================================================= */

#footer,
.footer-container,
#footer-container {
	background-color: var(--tks-surface-white) !important;
	border-top: 1px solid var(--tks-border-subtle);
	padding: 48px 0;
	font-family: var(--tks-font-body);
}

#footer a,
.footer-container a {
	color: var(--tks-on-surface-variant) !important;
	text-decoration: none;
	font-size: 13px;
}
#footer a:hover,
.footer-container a:hover {
	color: var(--tks-primary) !important;
}

#copyright,
.copyright {
	color: var(--tks-text-sub) !important;
	font-size: 12px;
}

/* 独自フッターレイアウト（テンプレート内で .tks-footer-* を使う場合） */
.tks-footer {
	background: var(--tks-surface-white);
	border-top: 1px solid var(--tks-border-subtle);
	padding: 48px 0;
}
.tks-footer-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
}
.tks-footer-links a {
	margin-right: 20px;
	font-size: 13px;
	color: var(--tks-on-surface-variant);
	text-decoration: none;
}
.tks-footer-links a:hover {
	color: var(--tks-primary);
}
.tks-footer-copyright {
	font-size: 12px;
	color: var(--tks-text-sub);
}