/* ==============================
   フッター（ブランド別ホテル一覧）
   ============================== */
:root {
    --color-key: #2b2b2b;
    --color-accent: #2C4A3F;
    --color-bg: #F5F3F1;
    --color-ui-bg: #ffffff;
    --color-ui-sub: #eae4dc;
    --color-text_dark: #000000;
    --color-text_gray: #B8B6B5;
    --color-text_light: #ffffff;
    --color-border_dark: #000000;
    --color-border_light: #ffffff;
    --container-w: 1180px;
}
.logo {
	width: auto;
    height: 40px;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.footer {
	font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
	background: var(--color-key);
	color: var(--color-text_light);
	padding: 48px 24px;
}

.footer-inner {
	display: flex;
	justify-content: space-between;
	gap: 48px;
	max-width: 1180px;
	margin: 0 auto;
}

.footer-col {
	flex: 1;
}

.footer-col--2col .footer-list {
	display: block;
	columns: 2;
	column-gap: 0;
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-col--2col .footer-list li a {
	break-inside: avoid;
	display: flex;
	padding: 12px 8px;
	align-items: center;
	gap: 8px;
	align-self: stretch;
}

.footer-col--1col .footer-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.footer-col--1col .footer-list li a {
	break-inside: avoid;
	display: flex;
	padding: 12px 8px;
	align-items: center;
	gap: 8px;
	align-self: stretch;
}

.footer-col--2col {
	flex: 2;
}

.footer-col--1col {
	flex: 1;
}

.footer-category {
	margin-bottom: 23px;
}

.footer-category-title {
	font-size: 16px;
	font-weight: bold;
	padding: 12px 16px;
	border-bottom: 1px solid var(--color-border_light);
}

.footer-list {
	max-height: none;
	overflow: visible;
	opacity: 1;
	transition: none;
}

.footer-list li {
	border-bottom: 1px solid var(--color-border_light);
	margin-left: 24px;
}

.footer-list li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 72px;
	padding: 12px 16px;
	margin-left: 12px;
	font-size: 14px;
	color: var(--color-text_light);
	text-decoration: none;
}

.footer-icon {
	flex-shrink: 0;
	fill: var(--color-text_light);
}

.footer-copy {
	text-align: center;
	margin-top: 32px;
	padding: 32px 24px;
	font-size: 12px;
	color: var(--color-text_light);
}

.footer-icon {
	fill: var(--color-text_light);
}

.acc__icon {
	display: none;
}

.footer-logo {
	display: flex;
	width: 100%;
	justify-content: center;
	padding: 54px 36px;
}

/* ==============================
   フッター アコーディオン（タブレット・スマホ共通）
   ============================== */
@media (max-width: 1179px) {
	.footer-logo {
		display: none;
	}

	.footer-category {
		border-bottom: 1px solid var(--color-border_light);
		margin: 0;
	}

	.footer-inner {
		flex-direction: column;
		gap: 0;
	}

	.footer-col--2col .footer-list li a {
		padding: 12px 28px;

	}

	.footer-col--1col .footer-list li a {
		padding: 12px 28px;
	}

	.footer-col--2col .footer-list,
	.footer-col--1col .footer-list {
		columns: 1 !important;
		display: block;
	}

	.footer-col {
		order: 1;
	}

	/* その他のホテルを末尾に移動 */
	.footer-col--other {
		order: 99;
	}

	.footer-category-title {
		font-size: 16px;
		font-weight: bold;
		padding: 16px;
		border: none;
		margin: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: relative;
		cursor: pointer;
	}

	.footer-list {
		margin: 0;
		padding: 0;
		list-style: none;
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		transition: max-height 1s ease, opacity 1s ease;
	}

	.footer-list li {
		border: none;
		margin: 0;
		padding: 0;
	}

	.footer-list li a {
		display: flex;
		padding: 12px 28px;
		gap: 8px;
		height: auto;
	}

	.footer-list.open {
		max-height: 750px;
		opacity: 1;
		transition: max-height 2s ease, opacity 1.5s ease;
	}

	.footer-inner>.footer-col:first-child .footer-category-title {
		border-top: 1px solid var(--color-border_light);
	}

	.footer-list li:last-child {
		margin-bottom: 12px;
	}

	.acc__icon {
		display: flex;
		align-items: center;
		margin-left: auto;
	}

	.footer-category .icon-plus {
		display: inline;
		fill: var(--color-text_light);
	}

	.footer-category .icon-minus {
		display: none;
	}

	.footer-category.open .icon-plus {
		display: none;
	}

	.footer-category.open .icon-minus {
		display: inline;
		fill: var(--color-text_light);
	}

}