.header_icon {
    height:40px;
    margin-right: 8px;
    cursor:pointer;
}

.header_user {
    width:230px;
    height:40px;
    font-size: 16px;
    padding-top: 8px;
    margin-left: -30px;
    text-align: right;
    overflow: hidden;
}

.background {
    position: absolute;
    background-color: #eee;
    height: 100%;
    width:100%;
}

.navi_button {
    background-color: #fff;
    width: 100%;
    height: 80px;
    color: #222;
    font-size: 24px;
    border: none;
  
    margin-left: auto;           /*センタリング*/
    margin-right: auto;          /*センタリング*/
    margin-top: 5px;               /*上余白*/
    margin-bottom: 5px;            /*下余白*/

    border-radius: 18px;    /*角丸く*/
    user-select: none;      /*選択できない*/
    cursor:pointer;
    display:block;
}

.navi_button div {
    margin-top: auto;               /*上余白*/
    margin-bottom: auto;            /*下余白*/
}

.navi_button:active{
    background: #ccc;
}

.mybody{
    height: 500px;
    background-color: #fafafa;
    border-radius: 20px;    /*角丸く*/
    padding-left: 50px;
    margin-left: 8px;
    margin-right: 8px;
}

.slidein {
    animation: slideInH 300ms ease-in-out;
}

.slideout {
    opacity: 0;
    animation: slideOutH 100ms ease-in-out;
}

@keyframes slideInH {
    0% {
        transform: translateX(200px);
        opacity: 0;
    }100%
    {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideOutH {
    0% {
        transform: translateX(0);
        opacity: 1;
    }100%
    {
        transform: translateX(100px);
        opacity: 0;
    }
}
