/* Site-wide mobile primary navigation and back-to-top control. */

.floweralba-mobile-global-navigation,
.floweralba-mobile-back-to-top {
	display: none;
}

@media only screen and (max-width: 1200px) {
	.floweralba-mobile-global-navigation {
		position: relative;
		z-index: 35;
		display: block;
		width: 100%;
		border-bottom: 1px solid #ececf0;
		background: #fff;
		color: #242429;
		font-family: "Noto Sans KR", "Apple SD Gothic Neo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	}

	.floweralba-mobile-global-navigation *,
	.floweralba-mobile-global-navigation *::before,
	.floweralba-mobile-global-navigation *::after,
	.floweralba-mobile-back-to-top,
	.floweralba-mobile-back-to-top::before,
	.floweralba-mobile-back-to-top::after {
		box-sizing: border-box;
	}

	.floweralba-mobile-global-navigation__inner {
		position: relative;
		width: 100%;
		background: #fff;
	}

	.floweralba-mobile-global-navigation__inner::before,
	.floweralba-mobile-global-navigation__inner::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		z-index: 2;
		width: 26px;
		opacity: 0;
		pointer-events: none;
		transition: opacity 150ms ease;
	}

	.floweralba-mobile-global-navigation__inner::before {
		left: 0;
		background: linear-gradient(90deg, #fff 15%, rgba(255, 255, 255, 0));
	}

	.floweralba-mobile-global-navigation__inner::after {
		right: 0;
		background: linear-gradient(270deg, #fff 15%, rgba(255, 255, 255, 0));
	}

	.floweralba-mobile-global-navigation.is-scrollable:not(.is-at-start) .floweralba-mobile-global-navigation__inner::before,
	.floweralba-mobile-global-navigation.is-scrollable:not(.is-at-end) .floweralba-mobile-global-navigation__inner::after {
		opacity: 1;
	}

	.floweralba-mobile-global-navigation__scroller {
		width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		overscroll-behavior-x: contain;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.floweralba-mobile-global-navigation__scroller::-webkit-scrollbar {
		display: none;
	}

	.floweralba-mobile-global-navigation__list {
		display: flex;
		align-items: stretch;
		width: max-content;
		min-width: 100%;
		min-height: 46px;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.floweralba-mobile-global-navigation__list > li {
		display: flex;
		flex: 1 0 auto;
		min-width: 0;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.floweralba-mobile-global-navigation__list > li > a {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-width: 80px;
		min-height: 46px;
		padding: 7px 12px;
		color: #303038;
		font-size: 13.5px;
		font-weight: 600;
		line-height: 1.3;
		text-align: center;
		text-decoration: none;
		white-space: nowrap;
		-webkit-tap-highlight-color: transparent;
	}

	.floweralba-mobile-global-navigation__list > li > a::after {
		content: "";
		position: absolute;
		right: 12px;
		bottom: 0;
		left: 12px;
		height: 2px;
		border-radius: 2px 2px 0 0;
		background: transparent;
	}

	.floweralba-mobile-global-navigation__list > li > a:hover,
	.floweralba-mobile-global-navigation__list > li > a:focus-visible,
	.floweralba-mobile-global-navigation__list > .current-menu-item > a,
	.floweralba-mobile-global-navigation__list > .current-menu-ancestor > a,
	.floweralba-mobile-global-navigation__list > .current_page_item > a {
		color: #ff5481;
		text-decoration: none;
	}

	.floweralba-mobile-global-navigation__list > li > a:focus-visible {
		outline: 2px solid rgba(255, 84, 129, .35);
		outline-offset: -3px;
	}

	.floweralba-mobile-global-navigation__list > .current-menu-item > a::after,
	.floweralba-mobile-global-navigation__list > .current-menu-ancestor > a::after,
	.floweralba-mobile-global-navigation__list > .current_page_item > a::after {
		background: #ff5481;
	}

	.floweralba-mobile-global-navigation__list > li > a .mi,
	.floweralba-mobile-global-navigation__list > li > a [class*="fa-"] {
		display: none;
	}

	.floweralba-mobile-back-to-top {
		position: fixed;
		right: calc(16px + env(safe-area-inset-right));
		bottom: calc(18px + env(safe-area-inset-bottom));
		z-index: 990;
		align-items: center;
		justify-content: center;
		width: 46px;
		height: 46px;
		padding: 0;
		border: 1px solid #ececf0;
		border-radius: 50%;
		outline: none;
		background: rgba(255, 255, 255, .96);
		box-shadow: 0 5px 18px rgba(24, 25, 31, .14);
		color: #ff5481;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translate3d(0, 10px, 0);
		transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms, box-shadow 150ms ease;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	.floweralba-mobile-back-to-top.is-visible {
		display: flex;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translate3d(0, 0, 0);
		transition-delay: 0s;
	}

	.floweralba-mobile-back-to-top:hover,
	.floweralba-mobile-back-to-top:focus-visible {
		border-color: rgba(255, 84, 129, .32);
		box-shadow: 0 7px 22px rgba(255, 84, 129, .2);
	}

	.floweralba-mobile-back-to-top:focus-visible {
		outline: 2px solid rgba(255, 84, 129, .45);
		outline-offset: 3px;
	}

	.floweralba-mobile-back-to-top svg {
		display: block;
		width: 23px;
		height: 23px;
	}
}

/* The existing full desktop menu remains the single navigation at tablet widths. */
@media only screen and (min-width: 993px) and (max-width: 1200px) {
	.floweralba-region-shell-subnav ~ .floweralba-mobile-global-navigation {
		display: none;
	}
}

@media only screen and (max-width: 360px) {
	.floweralba-mobile-global-navigation__list > li > a {
		min-width: 78px;
		padding-right: 8px;
		padding-left: 8px;
		font-size: 13px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.floweralba-mobile-global-navigation__inner::before,
	.floweralba-mobile-global-navigation__inner::after,
	.floweralba-mobile-back-to-top {
		transition: none;
	}
}
