*
{
    margin: 0;
    padding: 0;
}

#menu-overplay
{
    position: fixed;
    top: 0%;
    left: 0;
    right: 0;
    bottom: 0%;
    background:rgb(117, 169, 142) url(bg3.png);
    display: flex;
    justify-content: center;
    align-items: center;
    overflow-y:  auto;
    transform: scale(0);
    transition: 0.5s;
    z-index: 99999;
}
.menu-frame-bg{
    position:relative;
    width: 90vw;
    max-width: 1200px;
    height: 85vh;
    background-image:none;
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain; /* contain！完整保留整张雕花，不裁切花纹 */
    display:flex;
    justify-content:center;
    align-items:center;
}
#menu-overplay.active
{
    transform: scale(1);
}
#menu-overplay ul
{
    position: relative;
    padding: 120px 80px;
}
#menu-overplay ul li
{
    position: relative;
    list-style: none;
    text-align: center;
    display: block;
}
#menu-overplay ul li a
{
    position: relative;
    text-decoration:none ;
    font-size: 3.5em;
    padding: 0 10px;
    color: rgb(245, 246, 248);
    font-weight: 700;
    text-transform: uppercase;
    display: inline-block;
}
#menu-overplay ul li a:before
{
    content: '';
    position:absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 8px;
    background: rgb(61, 147, 107);
    transform: translateY(-50%) scaleX(0);
    transform-origin:right;
    transition: 0.5s transform;
}
#menu-overplay ul li a:hover:before
{
    transform: translateY(-50%) scaleX(1);
    transform-origin:left;
    transition: 0.5s transform;
}
#toggleicon
{
    position: fixed;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: rgb(252, 253, 253) url(open.png);
    z-index: 100000;
    cursor: pointer;

}
#toggleicon.active
{
    background: rgb(237, 175, 142) url(close.png) ;
}