mor-menu{
    display: block;

    &.fill{
        height: 100%;

        mor-private-menu{
            height: 100%;
        }

        .pos-top{
            .root-menu{
                height: 100%;

                > li{
                    height: calc(100% + 1px);

                    > a{
                        height: 100%;
                        display: flex;
                        align-items: center;
                    }

                    &.current{
                        > a{
                            border-top: 1px transparent solid;
                        }
                    }
                }
            }
        }
    }

    &.line{
        .pos-top{
            .root-menu{
                border-bottom: 1px @colorNeutral2 solid;

                > li{
                    > a{
                        border-bottom: 1px @colorNeutral2 solid;

                        &:hover{
                            color: @colorNeutral10;
                            border-bottom-color: @colorTheme;
                        }

                        &.current{
                            color: @colorBlack;
                            font-weight: 400;
                            border-bottom-color: @colorTheme;
                            border-bottom-width: 2px;
                        }
                    }

                    &.current{
                        > a{
                            color: @colorBlack;
                            font-weight: 400;
                            border-bottom-width: 2px;
                            border-bottom-color: @colorTheme;
                        }
                    }
                }
            }

            .sub-menu{
                > li{
                    > a{
                        &.current{
                            color: @colorBlack;
                            background-color: lighten(@colorTheme, 37%);
                        }
                    }

                    &.current{
                        > a{
                            color: @colorBlack;
                            background-color: lighten(@colorTheme, 37%);
                        }
                    }
                }
            }
        }

        .pos-side{
            .root-menu{
                border-right: 1px @colorNeutral2 solid;

                &.current,
                &.last-current{
                    > a{
                        padding-right: calc(1.5em - 4px);
                    }
                }
            }

            .sub-menu{
                > li{
                    > a{
                        &.current{
                            border-bottom-color: @colorTheme;
                            border-bottom-width: 2px;
                        }
                    }
                }

                &.current,
                &.last-current{
                    > a{
                        padding-right: calc(1.7em - 4px);
                    }
                }
            }

            .root-menu,
            .sub-menu{
                > li{
                    &.current{
                        > a{
                            color: @colorBlack;
                            font-weight: 400;
                            background-color: lighten(@colorTheme, 37%);
                            border-right: 4px lighten(@colorTheme, 20%) solid;
                        }
                    }

                    &.last-current{
                        > a{
                            color: @colorBlack;
                            font-weight: 400;
                            background-color: lighten(@colorTheme, 37%);
                            border-right: 4px @colorTheme solid;
                        }
                    }
                }
            }
        }
    }

    &.block{
        .pos-top{
            .root-menu{
                > li{
                    > a{
                        &:hover{
                            background-color: @colorNeutral2;
                        }

                        &.current{
                            color: @colorWhite;
                            font-weight: 400;
                            background-color: @colorLightTheme;
                        }
                    }

                    &.current{
                        > a{
                            color: @colorWhite;
                            font-weight: 400;
                            background-color: @colorLightTheme;
                        }
                    }
                }
            }

            .sub-menu{
                > li{
                    > a{
                        &.current{
                            color: @colorWhite;
                            background-color: @colorLightTheme;
                        }
                    }

                    &.current{
                        > a{
                            color: @colorWhite;
                            background-color: @colorLightTheme;
                        }

                        > .has-child-menu-icon{
                            color: @colorWhite;
                        }
                    }
                }
            }
        }

        .pos-side{
            .root-menu,
            .sub-menu{
                > li{
                    > a{
                        &.current{
                            color: @colorWhite;
                            font-weight: 400;
                            background-color: @colorLightTheme;
                        }
                    }

                    &.current{
                        > a{
                            color: @colorTheme;
                            font-weight: 400;
                        }
                    }

                    &.last-current{
                        > a{
                            color: @colorWhite;
                            font-weight: 400;
                            background-color: @colorLightTheme;
                        }

                        > .has-child-menu-icon{
                            color: @colorWhite;
                        }
                    }
                }
            }
        }
    }

    &.si-m,
    &.si-s{
        .pos-top{
            .sub-menu{
                li{
                    &.has-group{
                        padding-left: @fontSize*0.75;
                    }
                }
            }
        }
    }

    &.si-m{
        .root-menu{
            > li > a{
                font-size: @fontSize*0.9375;
                padding: 0 1.5em;
            }
        }

        .sub-menu{
            > li > a{
                padding: 0.5em 1em;
                font-size: @fontSize*0.875;
            }
        }

        .pos-top{
            .root-menu{
                height: @formHeight;

                > li{
                    > a{
                        height: @formHeight;
                        line-height: @formHeight;
                    }
                }
            }

            .sub-menu-wrap{
                top: @formHeight;
                padding-top: @fontSize*0.4;
            }

            .sub-menu{
                padding: @fontSize*0.5 0;

                > li{
                    .has-child-menu-icon{
                        margin-top: -1px;
                    }

                    > a{
                        min-width: 100px;
                    }
                }
            }
        }

        .pos-side{
            .root-menu{
                > li{
                    min-width: 160px;

                    &.menu-group-title{
                        padding: 0 1.5em;
                    }

                    > a{
                        height: @formHeight*1.2;
                        line-height: @formHeight*1.2;
                    }
                }
            }

            .sub-menu{
                padding-left: 1.5em;

                > li{
                    &.menu-group-title{
                        padding: 0.5em 1.7em 0.5em 0.5em;
                    }

                    > a{
                        padding: 0.5em 1.7em 0.5em 1.8em;
                        line-height: @formHeight*0.9 - @fontSize*0.875;
                    }
                }
            }

            .root-menu{
                > li{
                    .has-child-menu-icon{
                        top: 20px;
                    }
                }
            }

            .sub-menu{
                > li{
                    .has-child-menu-icon{
                        top: 12px;
                    }
                }
            }
        }

        &.collapse{
            &,
            .pos-side,
            .pos-side .root-menu,
            .pos-side .root-menu > li > a{
                width: @fontSize*4;
            }
        }
    }

    &.si-s{
        .root-menu{
            > li > a{
                font-size: @fontSize*0.875;
                padding: 0 1.3em;
            }
        }

        .sub-menu{
            > li > a{
                padding: 0.5em 0.8em;
                font-size: @fontSize*0.8125;
            }
        }

        .pos-top{
            .root-menu{
                height: @formHeight*0.85;

                > li{
                    > a{
                        height: @formHeight*0.85;
                        line-height: @formHeight*0.85;
                    }
                }
            }

            .sub-menu-wrap{
                top: @formHeight*0.85;
                padding-top: @fontSize*0.3;
            }

            .sub-menu{
                padding: @fontSize*0.4 0;

                > li{
                    .has-child-menu-icon{
                        margin-top: 0;
                    }

                    > a{
                        min-width: 90px;
                    }
                }
            }
        }

        .pos-side{
            .root-menu{
                > li{
                    min-width: 140px;

                    &.menu-group-title{
                        padding: 0 1.3em;
                    }

                    > a{
                        height: @formHeight;
                        line-height: @formHeight;
                        padding-right: 1.5em;
                    }
                }
            }

            .sub-menu{
                padding-left: 1.3em;

                > li{
                    &.menu-group-title{
                        padding: 0.5em 1.7em 0.5em 0.3em;
                    }

                    > a{
                        padding: 0.5em 1.7em 0.5em 1.8em;
                        line-height: @formHeight*0.75 - @fontSize*0.875;
                    }
                }
            }

            .root-menu{
                > li{
                    .has-child-menu-icon{
                        top: 15px;
                    }
                }
            }

            .sub-menu{
                > li{
                    .has-child-menu-icon{
                        top: 10px;
                    }
                }
            }
        }

        &.collapse{
            &,
            .pos-side,
            .pos-side .root-menu,
            .pos-side .root-menu > li > a{
                width: @fontSize*3.4375;
            }

            .pos-side .root-menu > li > a{
                padding-right: 1.3em;
            }
        }
    }

    &.si-xs{
        .root-menu{
            > li > a{
                font-size: @fontSize*0.8125;
                padding: 0 1em;
            }
        }

        .sub-menu{
            > li > a{
                font-size: @fontSize*0.75;
                padding: 0.3em 1em 0.3em 0.5em;
            }
        }

        .pos-top{
            .root-menu{
                height: @formHeight*0.7;

                > li{
                    > a{
                        height: @formHeight*0.7;
                        line-height: @formHeight*0.7;
                    }
                }
            }

            .sub-menu-wrap{
                top: @formHeight*0.7;
                padding-top: @fontSize*0.2;
            }

            .deep-submenu{
                padding-left: 2px;
            }

            .sub-menu{
                padding: @fontSize*0.3 0;

                > li{
                    &.has-group{
                        padding-left: @fontSize*0.7;
                    }

                    .has-child-menu-icon{
                        margin-top: -1px;
                    }

                    > a{
                        min-width: 80px;
                    }
                }
            }
        }

        .pos-side{
            .root-menu{
                > li{
                    min-width: 120px;

                    &.menu-group-title{
                        padding: 0 1.3em;
                    }

                    > a{
                        height: @formHeight*0.85;
                        line-height: @formHeight*0.85;
                        padding-right: 2em;
                    }
                }
            }

            .sub-menu{
                padding-left: 1em;

                > li{
                    &.menu-group-title{
                        padding: 0.5em 1.7em 0.5em 0.2em;
                    }

                    > a{
                        padding: 0.5em 1.7em 0.5em 1.9em;
                        line-height: @formHeight*0.65 - @fontSize*0.875;
                    }
                }
            }

            .root-menu{
                > li{
                    .has-child-menu-icon{
                        top: 12px;
                    }
                }
            }

            .sub-menu{
                > li{
                    .has-child-menu-icon{
                        top: 7px;
                    }
                }
            }
        }

        &.collapse{
            &,
            .pos-side,
            .pos-side .root-menu,
            .pos-side .root-menu > li > a{
                width: @fontSize*2.75;
            }

            .pos-side .root-menu > li > a{
                padding-right: 1em;
            }
        }
    }

    &.si-xxs{
        .root-menu{
            > li > a{
                font-size: @fontSize*0.75;
                padding: 0 0.5em;
            }
        }

        .sub-menu{
            > li > a{
                font-size: @fontSize*0.75;
                padding: 0.3em 1.2em 0.3em 0.5em;
            }
        }

        .pos-top{
            .root-menu{
                height: @formHeight*0.55;

                > li{
                    > a{
                        height: @formHeight*0.55;
                        line-height: @formHeight*0.55;
                    }
                }
            }

            .sub-menu-wrap{
                top: @formHeight*0.55;
                padding-top: @fontSize*0.1;
            }

            .deep-submenu{
                padding-left: 1px;
            }

            .sub-menu{
                padding: @fontSize*0.3 0;

                > li{
                    &.has-group{
                        padding-left: @fontSize*0.5;
                    }

                    .has-child-menu-icon{
                        margin-top: 0;
                    }

                    > a{
                        min-width: 60px;
                    }
                }
            }
        }

        .pos-side{
            .root-menu{
                > li{
                    min-width: 80px;

                    &.menu-group-title{
                        padding: 0 1.3em;
                    }

                    > a{
                        height: @formHeight*0.7;
                        line-height: @formHeight*0.7;
                        padding-right: 2.5em;
                    }
                }
            }

            .sub-menu{
                padding-left: 0.7em;

                > li{
                    &.menu-group-title{
                        padding: 0.5em 1.9em 0.5em 0;
                    }

                    > a{
                        padding: 0.5em 1.9em 0.5em 1.6em;
                        line-height: @formHeight*0.55 - @fontSize*0.875;
                    }
                }
            }

            .root-menu{
                > li{
                    .has-child-menu-icon{
                        top: 12px;
                    }
                }
            }

            .sub-menu{
                > li{
                    .has-child-menu-icon{
                        top: 4px;
                    }
                }
            }
        }

        &.collapse{
            &,
            .pos-side,
            .pos-side .root-menu,
            .pos-side .root-menu > li > a{
                width: @fontSize*1.8125;
            }

            .pos-side .root-menu > li > a{
                padding-right: 0.5em;
            }
        }
    }

    &.co-bk{
        .pos-top,
        .pos-side{
            .root-menu,
            mor-private-menu .sub-menu{
                background: @colorBlack;
                color: @colorNeutral3;
            }

            .root-menu,
            .sub-menu{
                > li > a{
                    color: @colorNeutral6;
                }

                > li > a:hover{
                    color: @colorNeutral2;
                }

                > li.current > a{
                    color: @colorWhite;
                }

                > li.is-disable{
                    > a{
                        background: darken(@colorBlack, 10%);

                        &:hover{
                            color: @colorNeutral6;
                            background: darken(@colorBlack, 10%);
                        }
                    }
                }
            }

            .sub-menu > li.menu-group-title{
                border-top-color: @colorNeutral10;
                border-bottom-color: @colorNeutral10;
            }
        }

        &.line{
            .pos-top,
            .pos-side{
                .root-menu{
                    border-bottom-color: @colorNeutral10;
                    border-right-color: @colorNeutral10;
                }

                .root-menu,
                .sub-menu{
                    > li > a:hover{
                        border-bottom-color: @colorNeutral10;
                    }

                    > li.current > a{
                        border-bottom-color: @colorNeutral3;
                        border-right-color: lighten(@colorBlack, 15%);
                        background: lighten(@colorBlack, 8%);
                    }

                    > li.last-current > a{
                        border-right-color: @colorNeutral3;
                    }

                    > li > a{
                        border-bottom-color: @colorNeutral10;
                    }
                }
            }

            .pos-top > .root-menu{
                > li > a{
                    border-bottom: 2px @colorNeutral10 solid;
                }
            }
        }

        &.block{
            .pos-top{
                .root-menu{
                    > li:not(.is-disable) > a:hover{
                        background-color: @colorNeutral10;
                    }
                }

                .root-menu,
                .sub-menu{
                    > li.current > a{
                        background-color: @colorNeutral10;
                    }
                }
            }

            .pos-side{
                // .sub-menu{
                //     > li.last-current > a{
                //         background-color: @colorNeutral10;
                //     }
                // }
            }
        }

        &.expand.line{
            .pos-side{
                .root-menu,
                .sub-menu{
                    > li{
                        &.last-current{
                            > a{
                                background: lighten(@colorBlack, 20%);
                                border-right: 4px darken(@colorTheme, 10%) solid;
                            }
                        }
                    }
                }
            }
        }

        &.collapse{
            .pos-side{
                .root-menu{
                    > li > a:hover{
                        background: lighten(@colorBlack, 5%);
                    }
                }
            }
        }
    }

    &.co-wh{
        .pos-top,
        .pos-side{
            .root-menu,
            .sub-menu{
                background: @colorWhite;

                > li > a{
                    color: @colorNeutral8;

                    &:hover{
                        color: @colorNeutral10;
                    }

                    &.current{
                        color: @colorTheme;
                    }
                }

                > li.current > a{
                    color: @colorTheme;
                }

                > li.is-disable{
                    > a{
                        background: @colorNeutral1;

                        &:hover{
                            color: @colorNeutral6;
                        }
                    }
                }
            }

            .root-menu{
                > li{
                    &.is-disable{
                        > a{
                            &:hover{
                                border-bottom-color: @colorNeutral2;
                            }
                        }
                    }
                }
            }
        }

        &.expand{
            .pos-side{
                .root-menu,
                .sub-menu{
                    > li{
                        &.last-current{
                            > a{
                                color: @colorTheme;
                            }
                        }
                    }
                }
            }
        }

        &.expand.line{
            .pos-side{
                .root-menu,
                .sub-menu{
                    > li{
                        &.last-current{
                            > a{
                                border-right: 4px @colorTheme solid;
                            }
                        }
                    }
                }
            }
        }

        &.collapse{
            .pos-side{
                .root-menu{
                    > li > a:hover{
                        background: @colorNeutral2;
                    }
                }
            }
        }
    }

    &.expand{
        .pos-side{
            .root-menu{
                > li{
                    &.current{
                        > a{
                            padding-right: 1.5em;
                        }
                    }
                }
            }

            .sub-menu{
                > li{
                    &.current{
                        > a{
                            padding-right: 1.7em;
                        }
                    }
                }
            }

            .root-menu,
            .sub-menu{
                > li{
                    .has-child-menu-icon{
                        display: none;
                    }

                    > a{
                        &.has-child-menu{
                            &:hover{
                                cursor: default;
                                color: @colorNeutral6;
                            }
                        }
                    }

                    &.current{
                        > a{
                            border-right: none;
                        }
                    }

                    &.last-current{
                        > a{
                            background-color: lighten(@colorTheme, 37%);
                            border-right: 4px @colorTheme solid;
                        }
                    }
                }
            }

            .sub-menu-wrap{
                display: block;
            }
        }
    }

    &.collapse{
        .pos-side{
            .root-menu{
                > li{
                    min-width: 0;
                    display: inline-block;

                    > a{
                        overflow: hidden;

                        > .mo-icon{
                            padding-right: 0;
                        }

                        &:hover{
                            background: @colorNeutral1;
                        }
                    }

                    > .has-child-menu-icon{
                        display: none;
                    }
                }
            }

            .sub-menu{
                padding-left: 0;

                > li > .has-child-menu-icon{
                    right: 4px;
                }
            }

            .sub-menu-wrap{
                left: 100%;
                top: 0;
                transform: none;
            }
        }
    }

    // default status
    &{
        .si-m;
        .co-wh;
    }
}