.header_button
{
    border: 1px solid #939393;
    border-radius: 0.25rem;
    background-color: #FFF;
    padding: 0 0.25rem;
    width: 45px;
    height: 45px;
    position: absolute;
    top: 42px;
    right: 16px;
    overflow: hidden;
    display: inline-block;
    cursor: pointer;
}
.block
{
    position: fixed;
    top: 0px;
    left: 0px;
    background-color: #FFF;
    width: 100%;
    padding: 1rem;
    text-align: center!important;
}
.block a
{
    line-height: 2rem;
    border-bottom: 1px solid #B5B5B5;
}
.block a::before
{
    content: "・";
}
.header_button a, .header_button a div, .header_button a div span
{
    width: 100%;
    position: relative;
    left: 0;
}
.header_button a
{
    color: #000;
    display: block;
    height: 20px;
    top: 50%;
    margin: -10px 0 0;
}
.header_button a div {
    height: 2px;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.header_button a div {
    transition-duration: .5s;
}
.header_button a > div:nth-child(1) {
    top: 0;
}
.header_button a > div:nth-child(2) {
    top: 50%;
    margin: -1px 0 0;
}
.header_button a > div:nth-child(3) {
    top: 100%;
    margin: -2px 0 0;
}

.header_button a > div span {
    display: block;
    height: 100%;
    top: 0;
    overflow: hidden;
    background-color: #000;
    transition-duration: 1s;
    transition-timing-function: ease-in-out;
}

.header_button a > div:nth-child(1) span {
    animation: header_button 3s linear 3s infinite;
}
.header_button a > div:nth-child(2) span {
    animation: header_button 3s linear 3.2s infinite;
}
.header_button a > div:nth-child(3) span {
    animation: header_button 3s linear 3.4s infinite;
}
@keyframes header_button {
    0%, 100%, 50% {
        left: 0;
        opacity: 1;
    }
    20% {
        left: 100%;
        opacity: 0;
    }
    30% {
        left: -100%;
        opacity: 0;
    }
}
.header_on .header_button a > div:nth-child(1) span,
.header_on .header_button a > div:nth-child(2) span,
.header_on .header_button a > div:nth-child(3) span {
    animation: none;
}



.header_on .header_button a > div:nth-child(1) {
    animation: header_button_on0 .75s ease-in-out forwards
}
.header_on .header_button a > div:nth-child(2) {
    animation: header_button_on1 .75s ease-in-out forwards
}
.header_on .header_button a > div:nth-child(3) {
    animation: header_button_on2 .75s ease-in-out forwards
}
@keyframes header_button_on0 {
    0% {
        top: 0;
        margin: 0;
        transform: rotate(0)
    }
    49%, 51% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(0)
    }
    100% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(45deg)
    }
}
@keyframes header_button_on1 {
    0%, 49% {
        opacity: 1
    }
    100%, 51% {
        opacity: 0
    }
}
@keyframes header_button_on2 {
    0% {
        top: 100%;
        margin: -2px 0 0;
        transform: rotate(0)
    }
    49%, 51% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(0)
    }
    100% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(-45deg)
    }
}
.header_off .header_button a > div:nth-child(1) {
    animation: header_button_off0 .75s ease-in-out forwards
}
.header_off .header_button a > div:nth-child(2) {
    animation: header_button_off1 .75s ease-in-out forwards
}
.header_off .header_button a > div:nth-child(3) {
    animation: header_button_off2 .75s ease-in-out forwards
}
@keyframes header_button_off0 {
    0% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(45deg)
    }
    49%, 51% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(0)
    }
    100% {
        top: 0;
        margin: 0;
        transform: rotate(0)
    }
}
@keyframes header_button_off1 {
    0%, 49% {
        opacity: 0
    }
    100%, 51% {
        opacity: 1
    }
}
@keyframes header_button_off2 {
    0% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(-45deg)
    }
    49%, 51% {
        top: 50%;
        margin: -1px 0 0;
        transform: rotate(0)
    }
    100% {
        top: 100%;
        margin: -2px 0 0;
        transform: rotate(0)
    }
}