main .authentication-sns-button-list{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 960px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
main .authentication-sns-button-list.login{
    grid-template-columns: 1fr;
}
main .authentication-sns-button-select{
    background-color: #989898 !important;
}
main .authentication-sns-button{
    margin: 0;
    padding: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    color: #fff;
    border-radius: 4px;
    box-sizing: border-box;
    cursor: pointer;
}
main .authentication-sns-button .icon{
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}
main .authentication-sns-button .icon::before{
    content: '';
    margin: 0;
    padding: 0;
    width: 32px;
    height: 32px;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
}
main .authentication-github-button{
    background-color: #24292f;
}
main .authentication-github-button .icon::before{
    background-image: url('/front/images/sns/icon-github.svg');
}
main .authentication-twitter-button{
    background-color: #000;
}
main .authentication-twitter-button .icon::before{
    background-image: url('/front/images/sns/icon-x.svg');
}
main .authentication-facebook-button{
    background-color: #1877f2;
}
main .authentication-facebook-button .icon::before{
    background-image: url('/front/images/sns/icon-facebook.svg');
}
main .authentication-google-button{
    background-color: #fff;
    outline: solid 1px #000;
    color: var(--common-color-001);
}
main .authentication-google-button .icon::before{
    background-image: url('/front/images/sns/icon-google.svg');
}
main .authentication-sns-notice{
    margin: 0 auto 8px;
    padding: 0;
    width: 100%;
    max-width: 960px;
    color: #ff0000;
}
@media screen and (max-width: 960px) {
    main .authentication-sns-button-list{
        grid-template-columns: 1fr;
    }
}