@charset "UTF-8";

.menu-body, .menu-body .menu {
    width: 100vw;
    height: 100vh
}

.menu-body {
    /*    background: linear-gradient(180deg, #641a87 20%, #ffc300);*/
    background: #120505fa;
    position: fixed;
    font-family: "Noto Sans SC", "SF Pro Text", "Myriad Set Pro", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "SF Pro Icons", "Apple Legacy Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999
}

    .menu-body .menu .title {
        height: 3.9375rem;
        margin-top: 1.5rem;
        background: linear-gradient(90deg, #FF5733, #FFC300);
        padding: 0 1rem;
        font-size: 1.25rem;
        font-weight: 900;
        line-height: 3.9375rem;
        letter-spacing: .15px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

        .menu-body .menu .title .icon {
            width: 1.625rem;
            height: 1.625rem;
            display: block;
            background-image: url(../images/menu-icon.png);
            background-position: center center;
            background-size: cover
        }

    .menu-body .menu .menu-div {
        margin: 2.125rem 3.4375rem auto 1.375rem
    }

        .menu-body .menu .menu-div .menu-item {
            color: rgba(255,255,255,.6);
            margin: .625rem 0
        }

            .menu-body .menu .menu-div .menu-item .item-title {
                height: 3.5rem;
                background-color: rgba(255,255,255,.12);
                display: flex;
                column-gap: 1.875rem;
                align-items: center
            }

                .menu-body .menu .menu-div .menu-item .item-title h1 {
                    display: block;
                    margin-left: 1rem;
                    flex: 1;
					font-weight:900;
					color: #fff;
                }

                    .menu-body .menu .menu-div .menu-item .item-title h1 a {
                        display: block;
                        text-decoration: none;
                        color: #fff;
                    }

                .menu-body .menu .menu-div .menu-item .item-title .icon {
                    display: block;
                    background-image: url(../images/right-icon.png);
                    width: 2.5rem;
                    height: 100%;
                    background-position: center center;
                    background-size: 1.5rem 1.5rem;
                    background-repeat: no-repeat no-repeat;
                    margin-right: .75rem
                }

            .menu-body .menu .menu-div .menu-item ul {
                display: none;
                max-height: 40vh;
                overflow: auto
            }

                .menu-body .menu .menu-div .menu-item ul li {
                    display: block;
                    height: 1.25rem;
                    margin: 1rem .75rem 1rem 1rem
                }

                    .menu-body .menu .menu-div .menu-item ul li a {
                        color: rgba(255,255,255,.6)
                    }

            .menu-body .menu .menu-div .menu-item.active .item-title .icon {
                background-image: url(../images/down-icon.png);
                background-size: .9375rem .75rem
            }

            .menu-body .menu .menu-div .menu-item.active ul {
                display: block
            }