/* スモール */
@media (min-width: 0px) {
    #a2-large-menu {
        display                   : none;

        margin-left               : auto;
        padding                   : 0 32px 0 0;
    }

    #a2-large-menu ul {
        display                   : flex;
    }

    #a2-large-menu li {
        margin-left               : 24px;

        list-style                : none;
    }

    #a2-large-menu li a {
        font-size                 : 18px;
        color                     : white;
        text-shadow               : 1px 2px 2px rgba(52,85,43,0.8);
        line-height               : var(--a2-header-hight);
    }

    #a2-large-menu li a:hover {
        opacity                   : 0.5;
    }
    
    #a2-small-menu {
        margin-left               : auto;
    }
  
    #a2-small-menu #a2-open-hamMenu {
        padding                   : 0 32px 0 0;
        line-height               : var(--a2-header-hight);

        font-size: 32px;
        color:white;
        text-shadow               : 1px 2px 2px rgba(52, 85, 43, 0.8);

        cursor: pointer;
    }

    #a2-small-menu #a2-open-hamMenu:hover {
        opacity                   : 0.5;
    }
      
    #a2-small-menu #a2-open-hamMenu.hide {
        display: none;
    }

    .a2-hamburgerMenu {
        position                  : fixed;
        top                       : 0;
        bottom                    : 0;
        left                      : 0;
        right                     : 0;

        z-index                   : 20;

        padding                   : 64px;

        text-align                : center;

        background                : rgba(225, 225, 225, 0.85);

        opacity                   : 0;
        transition                : opacity 0.6s;

        pointer-events            : none;
    }
      
    .a2-hamburgerMenu.show {
        opacity                   : 1;

        pointer-events            : visiblePainted;
    }

    .a2-hamburgerMenu #a2-close-hamMenu {
        position                  : absolute;
        top                       : 8px;
        right                     : 16px;

        font-size                 : 28px;

        cursor                    : pointer;
    }

    .a2-hamburgerMenu #a2-close-hamMenu:hover {
        opacity                   : 0.5;
    }
      
    .a2-hamburgerMenu ul {
        margin                    : 0;
        padding                   : 0;

        list-style-type           : none;
    }
      
    .a2-hamburgerMenu li {
        margin-top                : 24px;

        opacity                   : 0;
        transform                 : translateY(16px);
        transition                : opacity 0.3s, transform 0.3s;
    }
      
    .a2-hamburgerMenu li a {
        font-size                 : 24px;
        font-weight               : bold;
        color                     : blue;

        text-decoration           : none;
    }

    .a2-hamburgerMenu li a:hover {
        opacity                   : 0.5;
    }

    .a2-hamburgerMenu.show li {
        opacity                   : 1;
        transform                 : none;
    }
      
    .a2-hamburgerMenu.show li:nth-child(1) {
        transition-delay          : 0.1s;
    }
      
    .a2-hamburgerMenu.show li:nth-child(2) {
        transition-delay          : 0.2s;
    }
      
    .a2-hamburgerMenu.show li:nth-child(3) {
        transition-delay          : 0.3s;
    }
      
    .a2-hamburgerMenu.show li:nth-child(4) {
        transition-delay          : 0.4s;
    }
}

/* ミドル */
@media (min-width: 651px) {
    #a2-large-menu {
        display                   : block;
    }
    
    #a2-small-menu {
        display                   : none;
    }
}

/* ラージ */
@media (min-width: 961px) {
}
