@charset "UTF-8";
/* CSS Document */
/*===================================
form
===================================*/
#booking {
    background: #a36f6f;
    color: #fff;
}
#booking ._container {
    padding: 8%;
}
#booking ._container form {
    font-weight: 500;
    margin-top: 2em;
}
#booking ._container .form .form-item {}
#booking ._container .form .form-item + .form-item {
    margin-top: 1em;
}
#booking ._container .form .form-item .form-label {
    font-size: 6vw;
}
#booking ._container .form .input-item, #booking ._container .form .form-item-textarea {
    font-size: 16px;
    padding: 5px 1em;
    width: 100%;
    background: #ececec;
}
#booking ._container .form .form-item-textarea {
    border-radius: 10px;
    color: #222;
    height: 200px;
    margin-top: 1em;
}
#booking ._container .form .form-item .input-item {
    color: #222;
    border-radius: 100vh;
    margin-top: .5em;
}
#booking ._container .form #warning {
    text-align: center;
    font-size: .7em;
    font-weight: bold;
}
#booking ._container .form .form-label.is-msg {
    margin-top: 0;
    margin-bottom: auto;
}
#booking ._container .form .btns {
    justify-content: center;
}
._container .form .submit-btn, ._container .form .back-btn {
    border-radius: 100vh;
    background: #fff;
    color: #222;
    display: block;
    font-size: 4vw;
    letter-spacing: 0.05em;
    transition: .3s all;
    padding: .3em 1em;
    width: min(100%, 400px);
}
.submit-btn:hover {
    background: #a36f6f;
    color: #fff;
}
.back-btn {
    background: #222;
}
#booking ._container .form .g-recaptcha > div {
    margin: 30px auto;
}
@media screen and (min-width:480px) {
    #booking ._container .form .form-item .form-label {
        font-size: 4vw;
    }
    ._container .form .submit-btn, ._container .form .back-btn {
        font-size: 3vw;
    }
}
@media screen and (min-width:768px) {
    #booking ._container .form .form-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 20px;
    }
    #booking ._container .form .form-item .form-label {
        font-size: 2vw;
        width: 35%;
        border-right: 1px solid #ccc;
    }
    #booking ._container .form .form-item .input-item {
        width: 65%;
    }
    #booking ._container .form .form-item-textarea {
        width: 65%;
    }
}
@media screen and (min-width:960px) {
    ._container .form .submit-btn, ._container .form .back-btn {
        font-size: 2vw;
    }
}
@media screen and (min-width:1200px) {
    #booking ._container .form {
        width: min(100%, 1200px);
        margin: 0 auto;
    }
    ._container .form .submit-btn, ._container .form .back-btn {
        font-size: 1vw;
    }
}
/*===================================
confirm
===================================*/
#confirm ._container .form {
    width: min(100%, 1200px);
    margin: 0 auto;
}
.confirm p br {
    display: none;
}
.confirm-body {
    width: min(100%, 800px);
    margin: 50px auto;
}
@media screen and (min-width:768px) @media screen and (min-width:768px) {
    .confirm p {
        text-align: center;
    }
    .confirm p br {
        display: block;
    }
}
/*===================================
thanks
===================================*/
#thanks {
    background: #a36f6f;
    color: #fff;
}
#thanks ._container {
    width: min(100%, 1200px);
    margin: 0 auto;
    padding: 8%;
}
#thanks ._container ._box {
    margin-top: 2em;
}
@media screen and (min-width:768px) {
    #thanks .thanks p {
        text-align: center;
    }
}
@media screen and (min-width:1200px) {
    #thanks ._container .heading01 {
    font-size: 5vw;
}
}