.global-header {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 90;
}

.global-header + * {
    margin-top: var(--global-nav-bar-height);
}

.global-nav {
    overflow: hidden;
    height: var(--global-nav-bar-height);
    background-color: var(--section-bg-gray);
    transition: height 0.8s ease;
}

#global-nav.open {
    height: 100vh;
}

.global-nav > .wrapper {
    padding-left: unset;
    padding-right: unset;
}

.local-nav {
    top: var(--global-nav-bar-height);
    height: var(--local-nav-bar-height);
}

.global-nav-content {
    display: flex;
}

li.global-nav-item-home {
    z-index: 96;
    padding-left: var(--grid-margin);
    padding-right: var(--grid-margin);
}

.global-nav-menu-trigger {
    display: block;
    width: var(--global-nav-bar-height);
    height: var(--global-nav-bar-height);
    margin-right: var(--grid-margin);
    flex-shrink: 0;
    background-image: url('../images/icon/menu.svg');
    background-size: 24px 24px;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 96;
}

.global-nav.open .global-nav-menu-trigger {
    background-image: url('../images/icon/menu-opened.svg');
}




ul.global-nav-list {
    flex-direction: column;
    justify-content: flex-start;
    height: auto;
    margin-right: calc( (-1) * ( var(--global-nav-bar-height) + var(--grid-margin) ) );
}

ul.global-nav-list > li.global-nav-item {
    background-color: var(--fill-white);
}

.global-nav-link-home {
    width: calc( 130px + 2 * var(--nav-item-padding-left-and-right) );
    height: var(--global-nav-bar-height);
    background-image: url('../images/smartx-badge-on-light-horizontal-small.svg');
}

.global-nav-link > .wrapper {
    white-space: normal;
    word-break: break-word;
    font-size: var(--font-size-Text-L);
    line-height: var(--line-height-Text-L);
}

.global-nav-item.button:hover .global-nav-link > .wrapper {
    color: var(--blue-primary);
    transition: none;
}

.global-nav-item.button:hover .global-nav-link::after {
    background-image: url(../images/icon/hierarchy-triangle-right-blue.svg);
    transition: none;
}

.global-nav-item.button:hover .global-nav-link > .wrapper, .global-nav-item.button.opened .global-nav-link > .wrapper {
    box-shadow: none;
    transform: none;
}

.global-nav-item.button:hover .global-nav-flyout-scroll-container {
    display: none;
}

.global-nav-menu-list, .local-nav-item-subpage-list, .local-nav-menu-list {
    flex-direction: column;
}

.global-nav-item-menu, .global-nav-item-action {
    display: block;
}

.global-nav-item-menu .global-nav-item,
.global-nav-item-action .global-nav-item {
    height: var(--global-nav-subnav-bar-height);
    cursor: pointer;
}

.global-nav-item-menu .global-nav-link,
.global-nav-item-action .global-nav-link {
    padding-left: var(--grid-margin);
    padding-right: var(--grid-margin);
}

.global-nav-item-menu .global-nav-item:not(:last-child),
.global-nav-item-action .global-nav-item:not(:last-child) {
    border-bottom: 0.5px solid var(--stroke-gray-light-3);
}

.global-nav-flyout-scroll-container {
    overflow-y: hidden;
}




.global-nav-item-action {
    flex-direction: column;
}

.global-nav-action-list {
    flex-direction: column;
    align-items: stretch;
}

.global-nav-action-list .global-nav-link {
    align-items: stretch;
}

ul.global-nav-action-submenu {
    max-width: 100%;
    margin-left: 10px;
    box-shadow: none;
    border-radius: unset;
    height: calc( 100vh - var(--global-nav-bar-height) );
    z-index: 95;
    transition: transform 340ms cubic-bezier(0,1,.5,1) 20ms;
    overflow: hidden;
}

ul.global-nav-action-submenu .global-nav-section-group > *:last-child {
    margin-bottom: var(--global-nav-flyout-detail-padding-bottom);
}

ul.global-nav-action-submenu .global-nav-subnav {
    position: sticky;
    top: 0;
}

ul.global-nav-action-submenu .menu-section {
    padding: 12px calc( var(--grid-margin) - 8px );
}

ul.global-nav-action-submenu .menu-item {
    display: flex;
    justify-content: stretch;
    align-items: stretch;
    min-height: var(--global-nav-subnav-bar-height);
    box-sizing: border-box;
}

.global-nav-action-submenu .menu-caption + .menu-item {
    margin-top: 8px;
}

.global-nav-action-submenu .menu-item:hover .wrapper {
    border-radius: 8px;
}

.global-nav-section-group {
    overflow: hidden;
    overflow-y: scroll;
}




.global-nav-submenu {
    overflow: hidden;
    overflow-y: scroll;
    height: calc( 100% - var(--global-nav-subnav-bar-height) );
}

.global-nav-subnav {
    position: sticky;
    top: 0;
    height: var(--global-nav-subnav-bar-height);
    background-color: var(--section-bg-gray);
    display: flex;
    align-items: center;
}

.subnav-menu-back {
    height: var(--global-nav-subnav-bar-height);
    width: calc( var(--global-nav-subnav-bar-height) );
    display: block;
    flex-shrink: 0;
    background-image: url('../images/icon/hierarchy-triangle-left-gray.svg');
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: center;
    margin-left: calc( var(--grid-margin) - 16px - 4px );
    cursor: pointer;
}

.subnav-menu-back:hover {
    background-image: url('../images/icon/hierarchy-triangle-left-blue.svg');
}

.subnav-title {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--text-secondary);
    font-size: var(--font-size-Text-M);
    line-height: var(--line-height-Text-M);
    margin-right: calc( var(--grid-margin) - 16px - 4px + var(--global-nav-subnav-bar-height) );
}




.global-nav-flyout-content-solution {
    grid-template-rows: max-content;
}

.global-nav-flyout-padding-left,
.global-nav-flyout-padding-right {
    display: none;
}

[class^="global-nav-flyout-"][class$="-master"] {
    justify-content: flex-start;
}

.global-nav-flyout-product-master .wrapper {
    display: block;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

ul.master-menu-primary, ul.master-menu-secondary {
    padding-left: var(--grid-margin);
    position: relative;
}

.top-to-bottom ul.master-menu-secondary {
    padding-right: var(--grid-margin);
}

.left-to-right [class^="global-nav-flyout-"][class$="-master"] {
    grid-column: 1 / span 4;
    grid-row: 1 / 3;
}

.top-to-bottom [class^="global-nav-flyout-"][class$="-master"] {
    grid-column: 1 / span 12;
    grid-row: 2 / 3;
}

.global-nav-item-solutions ul.master-menu-secondary li.master-menu-secondary-item, .global-nav-item-success-stories ul.master-menu-secondary li.master-menu-secondary-item {
    max-width: unset;
}

.left-to-right li.master-menu-primary-item .title,
.left-to-right li.master-menu-secondary-item .wrapper {
    font-size: var(--font-size-Text-S);
    line-height: var(--line-height-Text-S);
}

li.master-menu-primary-item .wrapper {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

li.master-menu-primary-item .tag {
    border: none;
    padding: unset;
}


.left-to-right.has-master.has-promotion [class^="global-nav-flyout-"][class$="-detail"] {
    grid-column: 5 / span 8;
    grid-row: 1 / 2;
}

.has-master [class^="global-nav-flyout-"][class$="-detail"] {
    grid-column: 5 / span 8;
}

.top-to-bottom.has-master.has-promotion [class^="global-nav-flyout-"][class$="-detail"],
.top-to-bottom.has-promotion [class^="global-nav-flyout-"][class$="-detail"] {
    grid-column: 1 / span 12;
    grid-row: 1 / 2;
}

.global-nav-item-solutions .set-columns .detail-menu, .global-nav-item-success-stories .set-columns .detail-menu, .global-nav-item-resources .set-columns .detail-menu, .global-nav-item-partners .set-columns .detail-menu, .global-nav-item-company .set-columns .detail-menu {
    max-width: unset;
}

.global-nav-menu-list .global-nav-item .global-nav-link::after,
.global-nav-action-list .global-nav-item-inquiry .global-nav-link::after,
.global-nav-action-list .global-nav-item-locale .global-nav-link::after {
    content: '';
    width: 16px;
    height: 16px;
    display: block;
    position: absolute;
    right: calc( var(--grid-margin) + 16px );
    top: calc( var(--global-nav-subnav-bar-height) - 32px );
    background-image: url('../images/icon/hierarchy-triangle-right-gray.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all .16s ease 20ms;
}

@media ( max-width: 320px ) {
    .global-nav-menu-list .global-nav-item .global-nav-link::after {
        top: calc( var(--global-nav-subnav-bar-height) - 32px + 4px );
    }
}

ul.global-nav-menu-list > li.global-nav-item [class^="global-nav-flyout-"][class$="-detail"] {
    padding-left: var(--grid-margin);
    padding-right: var(--grid-margin);
}

ul.global-nav-menu-list > li.global-nav-item:not(.has-promotion) [class^="global-nav-flyout-"][class$="-detail"] {
    padding-bottom: 240px;
}

ul.global-nav-menu-list > li.global-nav-item.left-to-right.has-master [class^="global-nav-flyout-"][class$="-detail"] {
    padding-left: 20px;
}

.detail-menu-group .detail-menu .detail-menu-header + .detail-menu-list {
    margin-left: -12px;
    margin-right: -12px;
}

.detail-menu-list .detail-menu-item .wrapper {
    padding: 12px;
}

.detail-menu-group {
    flex-direction: column;
    gap: 24px;
}

.global-nav-item-products .product-detail-menu-ecp .set-columns .detail-menu,
.global-nav-item-products .product-detail-menu-hci .set-columns .detail-menu {
    max-width: unset;
}

.detail-menu-elevated .header + .menu {
    margin-top: 16px;
}

.detail-menu-elevated .icon {
    display: none;
}

.detail-menu-elevated .menu .detail-menu-item-group .detail-menu-item::after {
    margin-right: 4px;
}

.detail-menu-elevated .menu .detail-menu-item-elevated,
.detail-menu-elevated .menu .detail-menu-item-elevated::after,
.detail-menu-elevated .menu .detail-menu-item-elevated .text .title,
.detail-menu-elevated .menu .detail-menu-item-elevated .text .description,
.detail-menu-elevated .menu .detail-menu-item-group .detail-menu-item::after,
.detail-menu-group .detail-menu .detail-menu-list .detail-menu-item.open-in-new-tab .wrapper::after,
li.master-menu-secondary-item .wrapper::after {
    transition: none;
}


.left-to-right.has-master [class^="global-nav-flyout-"][class$="-promotion"] {
    grid-column: 5 / span 8;
    grid-row: 2 / 3;
}

[class^="global-nav-flyout-"][class$="-promotion"] {
    margin-right: unset;
    padding-bottom: 240px;
}

.top-to-bottom [class^="global-nav-flyout-"][class$="-promotion"] {
    grid-column: 1 / span 12;
    grid-row: 3 / 4;
}

.promotion-card {
    height: 280px;
    min-height: 240px;
    max-width: 320px;
}

.top-to-bottom .promotion-card:first-child {
    margin-left: var(--grid-margin);
}

.promotion-wrapper {
    height: 300px;
}

.promotion-wrapper::after {
    content: none;
}

.promotion-scroll-container {
    padding-right: var(--grid-margin);
}

.promotion-card-info {
    padding: 12px 16px;
    gap: 4px;
}

.promotion-title {
    -webkit-line-clamp: 2;
}

.promotion-title, .promotion-card-cta {
    font-size: var(--font-size-Text-S);
    line-height: var(--line-height-Text-S);
}

.promotion-card-group {
    padding-right: 20%;
}

.has-2-cards .promotion-card-group {
    width: 160%;
}

.has-3-cards .promotion-card-group {
    width: 240%;
}

.has-4-cards .promotion-card-group {
    width: 320%;
}


@media ( max-width: 375px ) {
    li.master-menu-secondary-item:not(.open-in-new-tab) .wrapper::after {
        content: none;
    }
}

@media ( max-width: 374px ) {
    .detail-menu-elevated .header .introduction {
        font-size: var(--font-size-Text-S);
        line-height: var(--line-height-Text-S);
    }
}

@media ( min-width: 375px ) {
    .detail-menu-elevated .header .heading {
        font-size: var(--font-size-Display-M);
        line-height: var(--line-height-Display-M);
    }
}

@media ( max-height: 600px ) {
    ul.master-menu-primary {
        position: relative;
    }
}




.global-nav-flyout {
    height: calc( 100vh - var(--global-nav-bar-height) );
    top: calc( var(--global-nav-bar-height) );
    z-index: 95;
    transition: transform 340ms cubic-bezier(0,1,.5,1) 20ms;
    border-top: none;
}

#global-nav .global-nav-flyout,
#global-nav .global-nav-action-submenu {
    transform: translateX(100%);
    pointer-events: none;
}

#global-nav.show-subnav .global-nav-flyout,
#global-nav.show-subnav .global-nav-action-submenu {
    transform: translateX(0);
    pointer-events: auto;
}

.global-nav-item-menu .global-nav-menu-flyout .global-nav-link,
.global-nav-item-action .global-nav-link {
    transition: transform 340ms ease 20ms;
}

.global-nav-item-menu .global-nav-item,
.global-nav-item-action .global-nav-item {
    background-color: transparent;
    transition: background-color .32s ease 160ms;
}

#global-nav.show-subnav .global-nav-item-menu .global-nav-link,
#global-nav.show-subnav .global-nav-item-action .global-nav-link {
    transform: translateX(-16%);
}

#global-nav.products.show-subnav .global-nav-item-products,
#global-nav.solutions.show-subnav .global-nav-item-solutions,
#global-nav.success-stories.show-subnav .global-nav-item-success-stories,
#global-nav.resources.show-subnav .global-nav-item-resources,
#global-nav.partners.show-subnav .global-nav-item-partners,
#global-nav.company.show-subnav .global-nav-item-company,
#global-nav.inquiry.show-subnav .global-nav-item-inquiry,
#global-nav.locale.show-subnav .global-nav-item-locale {
    background-color: var(--blue-light-20);
    transition: background-color .16s ease;
}

#global-nav.products.show-subnav .global-nav-item-products .global-nav-link > .wrapper,
#global-nav.solutions.show-subnav .global-nav-item-solutions .global-nav-link > .wrapper,
#global-nav.success-stories.show-subnav .global-nav-item-success-stories .global-nav-link > .wrapper,
#global-nav.resources.show-subnav .global-nav-item-resources .global-nav-link > .wrapper,
#global-nav.partners.show-subnav .global-nav-item-partners .global-nav-link > .wrapper,
#global-nav.company.show-subnav .global-nav-item-company .global-nav-link > .wrapper,
#global-nav.inquiry.show-subnav .global-nav-item-inquiry .global-nav-link > .wrapper,
#global-nav.locale.show-subnav .global-nav-item-locale .global-nav-link > .wrapper {
    color: var(--blue-primary);
    transition: color .16s ease;
}

#global-nav.products.show-subnav .global-nav-item-products .global-nav-link::after,
#global-nav.solutions.show-subnav .global-nav-item-solutions .global-nav-link::after,
#global-nav.success-stories.show-subnav .global-nav-item-success-stories .global-nav-link::after,
#global-nav.resources.show-subnav .global-nav-item-resources .global-nav-link::after,
#global-nav.partners.show-subnav .global-nav-item-partners .global-nav-link::after,
#global-nav.company.show-subnav .global-nav-item-company .global-nav-link::after,
#global-nav.inquiry.show-subnav .global-nav-item-inquiry .global-nav-link::after,
#global-nav.locale.show-subnav .global-nav-item-locale .global-nav-link::after {
    background-image: url(../images/icon/hierarchy-triangle-right-blue.svg);
}

.global-nav-mobile-dim {
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #101A29;
    opacity: 0;
    z-index: 80;
    transition: none;
    pointer-events: none;
}

#global-nav.open.show-subnav .global-nav-mobile-dim {
    opacity: 0.4;
    transition: opacity .32s ease 20ms;
}




.global-nav-action-list .global-nav-item-action-item {
    align-items: stretch;
}




.global-nav:not(.open) + .global-nav-curtain {
    transition: opacity .48s ease 320ms;
}

.global-nav.open + .global-nav-curtain {
    opacity: 0.4;
    transition: opacity .32s ease 20ms;
}




.local-nav > .wrapper {
    background-color: var(--fill-white);
    height: var(--local-nav-bar-height);
    overflow: hidden;
    transition: height 0.6s ease;
}

.local-nav-content {
    display: flex;
}

ul.local-nav-list {
    flex-direction: column;
    justify-content: flex-start;
    padding-left: var(--nav-item-padding-left-and-right);
    padding-right: var(--nav-item-padding-left-and-right);
}

li.local-nav-item-page-title {
    height: var(--local-nav-bar-height);
}

ul.local-nav-list > li.local-nav-item {
    margin-left: calc( (-1) * var(--nav-item-padding-left-and-right) );
    flex-direction: column;
}

.local-page-title {
    flex-grow: 1;
    align-items: center;
}

.local-page-title .wrapper {
    flex-grow: 1;
}

.local-page-title .wrapper span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc( 100vw - 2 * var(--grid-margin) - var(--local-nav-bar-height) );
}

.local-nav-link {
    display: block;
    flex-grow: 1;
    padding: 12px var(--nav-item-padding-left-and-right);
}

li.local-nav-item-subpage-list, li.local-nav-item-action {
    margin-right: calc( (-1) * ( var(--global-nav-bar-height) + var(--nav-item-padding-left-and-right) ) );
}

li.local-nav-item-subpage-list + li.local-nav-item-action::before {
    content: '';
    display: block;
    height: 1px;
    width: calc( 100% - var(--nav-item-padding-left-and-right) * 2 );
    position: relative;
    left: calc( var(--nav-item-padding-left-and-right) );
    margin-bottom: 8px;
    background-color: var(--stroke-gray-light-1);
}

.local-nav-action-list {
    flex-direction: column;
    flex-grow: 1;
    gap: 0;
}

.local-nav-item-action-item {
    flex-grow: 1;
}

.local-nav-list .local-nav-item-action {
    padding-right: unset;
}

.local-nav-item-subpage-list .local-nav-link {
    transition: none;
}

.local-nav-item.button:not(.selected):hover {
    background: var(--fill-gray-light-2);
    border-radius: 8px;
}

.local-nav-item-action-item.button:not(.selected):hover {
    background: var(--blue-light-10);
}


.local-nav-menu-trigger {
    display: block;
    width: var(--global-nav-bar-height);
    height: var(--global-nav-bar-height);
    flex-shrink: 0;
    background-image: url(../images/icon/chevron-down.svg);
    background-size: 24px 24px;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 96;
}

.local-nav.open .local-nav-menu-trigger {
    background-image: url(../images/icon/chevron-up.svg);
}




.local-nav-curtain {
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #101A29;
    opacity: 0;
    z-index: -1;
    transition: opacity .32s ease 20ms;
    pointer-events: none;
}

.local-nav.open .local-nav-curtain {
    opacity: 0.4;
}




.section-anchor-nav {
    display: none;
}