@charset 'UTF-8';
/*---------------------------------------------------------------------------*/
/* 思い出おにぎりGPの設定                                                    */
/*---------------------------------------------------------------------------*/

#gp-form {
    margin                : 50px auto 150px;
}

#gp-form .gp-form-message {
    margin                : 20px auto;
    font-size             : 1.6rem;
    text-align            : center;
}

#gp-form .gp-form-table {
    width                 : 100%;
    max-width             : 560px;
    margin                : auto;
    margin-top            : 30px;
    border-collapse       : separate;
    border-spacing        : 0 10px;
}

#gp-form .gp-form-table th {
    padding               : 10px;
    background-color      : rgba(35,24,21,0.1);
    text-align            : left;
}

#gp-form .gp-form-table td {
    padding               : 5px 10px;
}

#gp-form .gp-form-table td input,
#gp-form .gp-form-table td select {
    padding               : 10px 15px;
}

#gp-form .caution-note {
    width                 : 100%;
    max-width             : 550px;
    margin                : 20px auto;
    font-size             : 1.4rem;
}

#gp-form .caution-note-check {
    width                 : 100%;
    max-width             : 550px;
    margin                : 20px auto 50px;
    font-size             : 1.4rem;
}

#gp-form .caution-note-check input[type=checkbox],
#gp-form .caution-note-check input[type=radio] {
    width                 : 20px;
    height                : 20px;
}

#gp-form .submit {
    margin-top            : 20px;
    text-align            : center;
}

#gp-form .submit input[type=submit] {
    width                 : 500px;
    margin-top            : 20px;
    padding               : 15px;
    border-radius         : 10px;
    background-color      : #000;
    color                 : #fff;
    font-size             : 2rem;
    text-align            : center;
    transition            : .5s; 
}

#gp-form .submit input[type=reset] {
    width                 : 150px;
    margin-top            : 20px;
    padding               : 10px;
    border-radius         : 10px;
    background-color      : #555;
    color                 : #fff;
    text-align            : center;
    transition            : .5s; 
}

#gp-form .submit input:hover {
    background-color      : #fff;
    color                 : #200;
    cursor                : pointer;
}

#gp-form .result {
    text-align            : center;
}

#gp-form .gp-form-under-hr {
    width                 : 100%;
    max-width             : 1000px;
    margin                : 80px auto 0;
    padding               : 0;
    border                : 0;
    height                : 1px;
    background            : #aaa;
    background-image      : -webkit-linear-gradient(left, #fff, #999, #fff);
    background-image      : -moz-linear-gradient(left, #fff, #999, #fff);
    background-image      : -ms-linear-gradient(left, #fff, #999, #fff);
    background-image      : -o-linear-gradient(left, #fff, #999, #fff);
}

@media only screen and (max-width: 767px) {
    #gp-form {
        width             : 95%;
    }
    #gp-form .gp-form-message {
        font-size         : 1.4rem;
    }
    #gp-form .gp-form-table,
    #contact-form .contact-form-table {
        max-width         : 100vw;
    }
    #gp-form .gp-form-table th,
    #gp-form .gp-form-table td,
    #contact-form .contact-form-table th,
    #contact-form .contact-form-table td {
        display           : block;
    }
    #gp-form .gp-form-table input[type=text] {
        width             : 100%;
    }
    #gp-form .gp-form-table textarea {
        width             : 100%;
    }
    #gp-form .submit input[type=submit] {
        width             : 80%;
    }
    #gp-form .submit input[type=reset] {
        width             : 40%;
    }
}