/***** 問い合わせフォーム ****/
.sample-Form{
    display: grid;
    grid-template-columns: 1fr 3fr;
    gap: 15px;
}
.sample-Form__Group{
    display: contents;
}
.sample-Form__Group *{
    font-size: 1.6rem;
}
@media screen and (max-width: 600px) {
    .sample-Form{
        display: block;
    }
    .sample-Form__Group{
        display: block;
        margin-bottom: 20px;
    }    
}

.sample-Form__Label{
    display: block;
    padding-bottom: 5px;
}
.sample-Form__Label.--required{
    display: flex;
    align-items: center;
}
.sample-Form__Label.--required::after{
    content: '必須';
    color: white;
    background-color: red;
    border-radius: 5px;
    padding: 1px 5px;
    font-size: 0.8em;
    display: block;
    margin-left: 5px;
}
.sample-Form__Submit{
    grid-column: 1 / -1;
    text-align: center;
    padding-top: 30px;
    margin-bottom: 50px;
}
.sample-Form__Submit button{
    font-size: 1.6rem;
    color: #fff;
    background-color: #3490dc;
    width: 300px;
    border-width: 0;
    border-radius: 5px;
    padding: 15px 50px;
}
.sample-Form__Submit button:hover{
    background-color: #52a1e1;
}
.sample-Form__Submit button[value=back]{
    background-color: transparent;
}
.sample-Form__Submit button[value=back]:hover{
    color: #ccc;
}


/***** 問い合わせフォームのメッセージ ****/
.sample-Message{
    color: #1b4b72;
    background-color: #d6e9f8;
    border: 1px solid #c6e0f5;
    padding: 15px;
    margin-bottom: 20px;
}
.sample-Message.--success{
    color: #1d643b;
    background-color: #d7f3e3;
    border-color: #c7eed8;
}