@charset "utf-8";

/* CSS Document */

/* ----------------------------------------
 *  Core Style:
 * ---------------------------------------- */
@media (max-width: 1023px){
    .lastSidebar{
        position: fixed;
        z-index: 9998;
        top: 0;
        right: -250px;
        overflow: scroll;
        width: 250px;
        height: 100%;
        background: #202226;

        -webkit-overflow-scrolling: touch;
    }
    #lastOverlay{
        position: fixed;
        z-index: 9997;
        top: 0;
        left: 0;
        display: none;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
    }
    body.noscroll{
        position: fixed;
        right: 0;
        left: 0;
        overflow: hidden;
        width: 100%;
    }
}

/* ----------------------------------------
 *  User Style:
 * ---------------------------------------- */

@media (max-width: 1023px){
    #slideMenu h2{
        margin: 0;
        padding: 24px 16px;
    }
    .globalNavi{
        border-top: dotted 1px #333;
    }
    .globalNavi li{
        width: 100%;
        border-bottom: dotted 1px #333;
    }
    .globalNavi li a{
        display: block;
    }
    .triggerBtn{
        position: fixed;
        z-index: 9999;
        top: 0;
        right: 0;
        left: auto;
        display: block;
        width: 62px;
        height: 62px;
        border-bottom: 2px solid #202226;
        border-left: 2px solid #202226;
        background: #fff;
    }
    #menuTrigger,
    #menuTrigger span{
        display: inline-block;
        box-sizing: border-box;
        transition: all 0.4s;
    }
    #menuTrigger{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    #menuTrigger:active{
        background: rgba(255, 255, 255, 0.4);
    }
    #menuTrigger span{
        position: absolute;
        left: 16px;
        width: 28px;
        height: 2px;
        border-radius: 4px;
        background-color: #202226;
        -webkit-box-shadow: 0 0 4px #fff;
           -moz-box-shadow: 0 0 4px #fff;
                box-shadow: 0 0 4px #fff;
    }
    #menuTrigger span:nth-of-type(1){
        top: 18px;
    }
    #menuTrigger span:nth-of-type(2){
        top: 28px;
    }
    #menuTrigger span:nth-of-type(3){
        top: 38px;
    }
    #menuTrigger.active span:nth-of-type(1){
        -webkit-transform: translateY(10px) rotate(-45deg);
                transform: translateY(10px) rotate(-45deg);
    }
    #menuTrigger.active span:nth-of-type(2){
        opacity: 0;
    }
    #menuTrigger.active span:nth-of-type(3){
        -webkit-transform: translateY(-10px) rotate(45deg);
                transform: translateY(-10px) rotate(45deg);
    }
}