/* 独自定義はここから */
.s-button{
    display:flex;
    line-height:1em;
    flex-direction: column;
    flex-wrap: nowrap;
    white-space: nowrap;
    font-weight:bold;
    margin:4px;
    padding:4px;
    border-radius:3px;
    background-color: rgba(0,0,0,0.05);
    border-left:none;
    border-top:none;
    border-right:1px solid rgba(0,0,0,0.4);
    border-bottom:1px solid rgba(0,0,0,0.4);
    -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;

    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.01), rgba(0,0,0,0.14 ));
    background-image: -moz-linear-gradient(top, rgba(0,0,0,0.01), rgba(0,0,0,0.14));
    background-image: -o-linear-gradient(top, rgba(0,0,0,0.01), rgba(0,0,0,0.14));
    background-image: -ms-linear-gradient(top, rgba(0,0,0,0.01), rgba(0,0,0,0.14));
}
.s-button.s-active:not(.s-disabled),
.s-button:not(.s-disabled):active{
    background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,0.08), rgba(0,0,0,0.14 ));
    background-image: -moz-linear-gradient(bottom, rgba(0,0,0,0.08), rgba(0,0,0,0.14));
    background-image: -o-linear-gradient(bottom, rgba(0,0,0,0.08), rgba(0,0,0,0.14));
    background-image: -ms-linear-gradient(bottom, rgba(0,0,0,0.08), rgba(0,0,0,0.14));
    border-left:1px solid rgba(0,0,0,0.4);
    border-top:1px solid rgba(0,0,0,0.4);
    border-right:none;
    border-bottom:none;
    background-color: rgba(0,0,0,0.2);
}
.s-button:not(.s-disabled):hover{
    cursor:pointer;
    background-color: rgba(0,0,0,0.14);
}
.s-button.s-flat{
    background:transparent;
    padding:8px;
    border:2px solid #338;
}
.s-button.s-flat.s-active{
    background: #66b;
    border: 2px solid #55a;
    color: #fff;
}
.s-button.s-flat.s-active:not(.s-disabled){
    background: #338;
    border:2px solid #338;
    color: #fff;
}
/* .s-button.s-active:not(.s-disabled), */
/* .s-button.s-pressed:not(.s-disabled),*/
.s-button a{
    color: inherit;
    text-decoration: none;
}