/* form */
.form-wrap {
    max-width: 1000px;
    margin: 50px auto 0;
}

@media screen and (min-width: 768px) {
    .form-wrap {
        margin-top: 100px;
    }
}

form {
    margin-bottom: 50px;
}
#forms {
    padding: 0 40px;
}

@media screen and (max-width: 768px) {
    #forms {
        padding: 0 3%;
    }
}
.formTtl {
    background: #f97276;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-bottom: 5px;
    margin-right: auto;
    margin-left: auto;
}
@media screen and (max-width: 768px) {
    #form div:nth-of-type(2) {
        font-size: 14px;
    }
}
.csTable {
    width: 100%;
    margin: 0px auto 30px;
    background: #ddd;
    border-collapse: separate;
    border-spacing: 1px;
}
.csTable tbody th {
    background: #f6f6f6;
    padding: 5px 5px 5px 30px;
    vertical-align: middle;
    text-align: left;
    width: 250px;
}

@media screen and (max-width: 768px) {
    .csTable tbody th {
        display: block;
        width: 100%;
        padding: 5px 10px;
    }
}
.csTable tbody th p {
    position: relative;
    padding-left: 15px;
    margin: 0;
}
.csTable tbody th p:before {
    content: "";
    top: 50%;
    left: 0;
    width: 10px;
    height: 2px;
    background: #f97276;
    display: block;
    position: absolute;
}
.csTable tbody th p span {
    background: #f97276;
    color: #fff;
    display: inline-block;
    position: absolute;
    padding: 2px 10px;
    font-size: 90%;
    top: 0;
    right: 10px;
}
.csTable tbody td {
    background: #fff;
    padding: 10px;
    font-size: 14px;
}

@media screen and (max-width: 768px) {
    .csTable tbody td {
        display: block;
    }
}
.csTable tbody td #reserve_date1,
.csTable tbody td #reserve_date2 {
    margin: 5px 0;
    width: 100px;
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
}
.csTable tbody td #name,
.csTable tbody td #mailaddress,
.csTable tbody td #tel2 {
    width: 100%;
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
}
.csTable tbody td #age {
    width: 100px;
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
}
.csTable tbody td textarea {
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
}
.submitBtn {
    border: none;
    cursor: pointer;
}

@media screen and (min-width: 769px) {
    .submitBtn {
        background: url(../img/send.png) #fff;
        width: 616px;
        height: 71px;
        text-indent: -9999px;
    }
}

@media screen and (max-width: 768px) {
    .submitBtn {
        background-image: -o-linear-gradient(
            -90deg,
            #589ff2 0%,
            #7381d3 47%,
            #5871d7 48%,
            #9db3e2 100%
        );
        background-image: -ms-linear-gradient(
            -90deg,
            #589ff2 0%,
            #7381d3 47%,
            #5871d7 48%,
            #9db3e2 100%
        );
        background-image: linear-gradient(
            180deg,
            #589ff2 0%,
            #7381d3 47%,
            #5871d7 48%,
            #9db3e2 100%
        );
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff589ff2,endColorstr=#ff9db3e2,GradientType=0)";
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff589ff2, endColorstr=#ff9db3e2, GradientType=0);
        background-image: -moz-linear-gradient(
            50% 0% -90deg,
            #589ff2 0%,
            #7381d3 47%,
            #5871d7 48%,
            #9db3e2 100%
        );
        background-image: -webkit-gradient(
            linear,
            50% 0%,
            50% 100%,
            color-stop(0, #589ff2),
            color-stop(0.47, #7381d3),
            color-stop(0.48, #5871d7),
            color-stop(1, #9db3e2)
        );
        background-image: -webkit-linear-gradient(
            -90deg,
            #589ff2 0%,
            #7381d3 47%,
            #5871d7 48%,
            #9db3e2 100%
        );
        color: #fff;
        width: 290px;
        padding: 10px;
        border-radius: 10px;
        font-size: 120%;
    }
}

.form-next {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
}
.form-next .age,
.form-next .caution {
    padding: 10px;
    border: 1px solid #ccc;
    font-size: 12px;
    font-size: 0.75rem;
}
.form-next .caution {
    margin-top: 1rem;
    border: 2px solid #1c285e;
    background: #ffffee;
    font-size: 14px;
    font-size: 0.875rem;
}
.form-next a {
    text-decoration: underline;
}