/*////////////////////////////////////////////////////////////////////////////*/

/*! sitemap.css */

/*////////////////////////////////////////////////////////////////////////////*/
/*
	・サイトマップは、ヘッダーとフッターのMENUボタンから開かれるグローバルメニュー内に含めるパターンと、フッターのMENUボタンの代わりにサイトマップをフッター内容として直接配置するパターンがある。
	・フッターのサイトマップ配置の判断基準は、フッター内に独自の表示内容がある場合はMENUボタンを設置し、ない場合はサイトマップを直置きとする。フッターの内容はほとんど使われない前提で考える。
	・MENUボタンを設置すれば、フッター内容を絞ってスッキリさせることができる。
*/


/*------------------------------------------------------------------------------

	変数

------------------------------------------------------------------------------*/

:root {
	--sitemap-bg-color-rgb: 255 255 255;
	--sitemap-bg-color-a: 0;
	--sitemap-bg-color: rgb(var(--sitemap-bg-color-rgb) / var(--sitemap-bg-color-a));
	--sitemap-text-color-rgb: var(--color-text-h, 0 0 0);
	--sitemap-text-color-a: 1;
	--sitemap-text-color: rgb(var(--sitemap-text-color-rgb) / var(--sitemap-text-color-a));
}


/*------------------------------------------------------------------------------

	サイトマップ

------------------------------------------------------------------------------*/


/*	コンテナー
------------------------------------------------------------------------------*/

.sitemap {
	--sitemap-padding-x: var(--space_9_2);
	--sitemap-padding-y: max(var(--space_9_6), calc(var(--menu-height) + 4em));
	--sitemap-gap: var(--space_4_3);
	/**/
	position: relative;
	padding: var(--sitemap-padding-y) var(--sitemap-padding-x);
	color: var(--sitemap-text-color);
	fill: var(--sitemap-text-color);
}

.sitemap > *:first-child {
	margin-top: 0 !important;
}

.sitemap > *:last-child {
	margin-bottom: 0 !important;
}


/*------------------------------------------------------------------------------

	サイトマップ - header

------------------------------------------------------------------------------*/


/*	コンテナー
------------------------------------------------------------------------------*/

.sitemap-header {
	margin: 0 0 var(--sitemap-gap);
}


/*	ロゴ
------------------------------------------------------------------------------*/

.sitemap-logo {
	--fixed-height: 3em;
}

.sitemap-logo > .logo-tagline,
.sitemap-logo > .logo {
	--logo-color: rgb(var(--sitemap-text-color-rgb) / var(--sitemap-text-color-a));
	color: rgb(var(--sitemap-text-color-rgb) / var(--sitemap-text-color-a));
}

@media (max-width: 720px) {

	.sitemap-logo .logo-fashion-izumi.fixed-height {
		width: 100% !important;
		height: auto !important;
	}

/**/}


/*------------------------------------------------------------------------------

	サイトマップ - body

------------------------------------------------------------------------------*/

.sitemap-body {
	position: relative;
}


/*------------------------------------------------------------------------------

	サイトマップ - CTAボタン

------------------------------------------------------------------------------*/

.sitemap-cta {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sitemap-cta-item {
	margin: 0;
}

.sitemap-cta-link {
	--btn-bg-color-rgb: var(--sitemap-text-color-rgb);
	--btn-border-color-rgb: var(--sitemap-text-color-rgb);
	--btn-text-color-rgb: var(--sitemap-bg-color-rgb);
	--btn-icon-color-rgb: var(--sitemap-bg-color-rgb);
	--btn-border-width: 2px;
}

.cta-item-line .sitemap-cta-link {
	--btn-bg-color-rgb: var(--color-line-rgb);
	--btn-border-color-rgb: var(--color-line-rgb);
}

.cta-item-googlemaps .sitemap-cta-link {
	--btn-bg-color-rgb: var(--color-text-h-rgb);
	--btn-border-color-rgb: var(--color-text-h-rgb);
}

.sitemap-cta-item .de {
	vertical-align: baseline;
	margin: 0 .125em;
	font-size: 90%;
}

@media (max-width: 720px) {

	.sitemap-cta {
		grid-gap: .75em;
	}

	.sitemap-cta-link.btn-rounded {
		--btn-border-radius: .5em;
		/**/
		display: flex;
		flex-direction: column;
	}

	.sitemap-cta-link::after {
		display: none;
	}

	.sitemap-cta-link .btn-icon {
		order: 1;
		margin: 0 0 .25em;
	}

	.sitemap-cta-link .btn-icon > svg {
		width: 2em;
		height: 2em;
	}

/**/}


/*------------------------------------------------------------------------------

	サイトマップ - コンテンツツリー

------------------------------------------------------------------------------*/


/*	コンテナー　レイアウト
------------------------------------------------------------------------------*/

.sitemap-cta,
.sitemap-menu,
.sitemap-menu-child,
.sitemap-owned-media-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sitemap-menu {
	--menu-item-gap: .75em;/* メニューアイテム感ギャップ */
	/**/
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: var(--space_4_3);
	align-items: flex-start;
	/**/
	list-style: none;
	margin: var(--space_4_3) 0 0;
	padding: 0;
}

@media (max-width: 1280px) {

	.sitemap-menu {
		grid-template-columns: 1fr 1fr;
	}

/**/}

@media (max-width: 720px) {

	.sitemap-menu-b2b,
	.sitemap-menu-b2c {
		grid-column: 1 / -1;
	}

/**/}


/*	サービスメニュー
------------------------------------------------------------------------------*/

.sitemap-menu-services {
	grid-column: 1 / 3;
	/**/
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 0 var(--space_4_3);
	align-items: flex-start;
}

.sitemap-menu-services .sitemap-menu-title {
	grid-column: 1 / -1;
}

/**/

.menu-services-main li + li {
	margin-top: var(--menu-item-gap);
}

.menu-services-main .btn {
	--btn-border-width: 2px;
	--btn-border-color-rgb: var(--btn-text-color-rgb);
	--btn-border-color-a: 1;
}

@media (max-width: 1280px) {

	.sitemap-menu-services {
		grid-column: 1 / -1;
	}

/**/}


/*	グループタイトル
------------------------------------------------------------------------------*/

.sitemap-menu-title {
	display: flex;
	align-items: baseline;
	/**/
	overflow: hidden;
	position: relative;
	width: 100%;
	margin: 0 0 calc(var(--menu-item-gap) * 2);
	font-size: 87.5%;
	font-weight: bold;
	white-space: nowrap;
	color: rgb(var(--color-text-p-rgb));
}

.sitemap-menu-title::after {
	content: '';
	flex-grow: 1;
	flex-shrink: 1;
	width: 100%;
	height: 1px;
	margin-left: .5em;
	background-color: rgb(var(--color-text-p-rgb));
}

/**/

.sitemap-menu-title-b2b,
.sitemap-menu-title-b2c {
	margin: 0 .5em 0 0;
	padding: .5em .5em;
	background: var(--color-izumi-blue);
	border-radius: .25em;
	line-height: 1;
	color: #FFF;
	text-box: trim-both cap alphabetic;
}

.sitemap-menu-title-b2c {
	background: rgb(var(--color-text-h-rgb));
}


/*	子メニュー
------------------------------------------------------------------------------*/

.sitemap-menu-child-item + .sitemap-menu-child-item {
	margin-top: var(--menu-item-gap);
}

.menu-services + .menu-services {
	margin-top: .375em;
}


/*	メニューリンク
------------------------------------------------------------------------------*/

.sitemap-menu-link {
	--btn-bg-color-rgb: var(--sitemap-bg-color-rgb);
	--btn-border-color-rgb: var(--sitemap-bg-color-rgb);
	--btn-text-color-rgb: var(--sitemap-text-color-rgb);
	--btn-icon-color-rgb: var(--sitemap-text-color-rgb);
	/**/
	--btn-icon-gap: .5em;
	--btn-text-align: left;
	--btn-font-weight: bold;
}

.sitemap-menu-link.btn .btn-label {
	display: flex;
	flex-direction: column;
	gap: .25em
}

.sitemap-menu-label-sub {
	font-weight: normal;
	font-size: max(11px, 75%);
}

/**/

.sitemap-menu-child {
	--padding-x: .5em;
	--padding-y: calc(var(--padding-x) - (var(--line-height) - 1) / 2 * 1em);
	--hovered-bg-color-rgb: var(--btn-bg-color-rgb);
	--hovered-bg-color-a: var(--btn-bg-color-a);
	--hovered-border-width: var(--btn-border-width);
	--hovered-border-radius: var(--btn-border-radius);
	--hovered-border-color-rgb: var(--btn-border-color-rgb);
	--hovered-border-color-a: var(--btn-border-color-a);
	--hovered-opacity: 0;
	/**/
	--btn-bg-color-rgb: 255 255 0;
	--hovered-bg-color-a: 1;
}

.sitemap-menu-child .sitemap-menu-child-item {
	position: relative;
}

/**/

.sitemap-menu-link.btn {
	--btn-border-radius: .375em;
	--btn-border-width: 2px;
	--btn-border-color-rgb: var(--btn-text-color-rgb);
	--btn-border-color-a: 1;
}

.sitemap-menu-link:not(.btn)::after {
	pointer-events: none;
	content: '';
	position: absolute;
	z-index: -1;
	left: calc(var(--padding-x) * -1);
	top: calc(var(--padding-y) * -1);
	width: calc(100% + var(--padding-x) * 2);
	height: calc(100% + var(--padding-y) * 2);
	background: rgb(var(--hovered-bg-color-rgb) / var(--hovered-bg-color-a));
	border: var(--hovered-border-width) solid rgb(var(--hovered-border-color-rgb) / var(--hovered-border-color-a));
	border-radius: var(--hovered-border-radius);
	transition: opacity .2s ease-out;
	opacity: var(--hovered-opacity);
}

@media (any-hover: hover) {

	.sitemap-menu-child .sitemap-menu-link:not(.btn):hover {
		--hovered-opacity: 1;
	}

/**/}
@media (any-hover: none) {

	.sitemap-menu-child .sitemap-menu-link:not(.btn):active {
		--hovered-opacity: 1;
	}

/**/}


/*------------------------------------------------------------------------------

	サイトマップ - SNSアカウント

------------------------------------------------------------------------------*/


/*	コンテナー
------------------------------------------------------------------------------*/

.sitemap-other {
	position: absolute;
	right: 0;
	top: calc(var(--sitemap-gap) * -1);
	transform: translateY(-100%);
}


/*	リスト
------------------------------------------------------------------------------*/

.sitemap-owned-media-list {
	display: grid;
	grid-template-columns: repeat(3, auto);
	grid-gap: 1em;
}

.om-item {
	margin: 0;
}

.om-link {
	--btn-padding-x: 0px;
	--btn-padding-y: 0px;
	--btn-bg-color-a: 0;
	--btn-border-color-a: 0;
	--btn-border-width: 0;
	/**/
	transition: filter .2s ease-out;
}

.om-link::after {
	display: none;
}

.om-link > .om-icon {
	margin: 0;
}

.om-link > .om-icon > svg {
	display: block;
	width: 2em;
	height: 2em;
}

.om-link > .om-label {
	display: none;
}

@media (any-hover: hover) {

	.om-link:hover {
		filter: brightness(125%);
	}

/**/}
@media (any-hover: none) {

	.om-link:active {
		filter: brightness(125%);
	}

/**/}


@media (max-width: 1280px) {

	.sitemap-other {
		position: relative;
		right: auto;
		top: auto;
		transform: none;
	}

	.sitemap-owned-media-list {
		display: flex;
		flex-wrap: wrap;
		/**/
		margin-top: var(--space_4_3);
	}

	.om-item {
		margin: 1em 1em 0 0;
	}

/**/}