@charset "UTF-8";

/* #luxy {
    width: 100%;
    position: fixed;
    transform: translate3d(0px, 0px, 0px);
} */

.side_btn {
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0);
    border: 0px;
    padding: 6px 6px;
    position: fixed;
    right: 0;
    top: 100px;
    -webkit-animation-name: side;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease;
    -moz-animation-name: side;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease;
    /*デフォルトで非表示にする*/
    opacity: 0;
    visibility: hidden;
}


/*このクラスが付与されると表示する*/

.active {
    opacity: 1;
    visibility: visible;
}

@-webkit-keyframes side {
    0% {
        -webkit-transform: translate(0, 0);
    }
    50% {
        -webkit-transform: translate(0, -4px);
    }
    100% {
        -webkit-transform: translate(0, 0);
    }
}

@-moz-keyframes side {
    0% {
        -moz-transform: translate(0, 0);
    }
    50% {
        -moz-transform: translate(0, -4px);
    }
    100% {
        -moz-transform: translate(0, 0);
    }
}


/* NGなら赤くする */

form input:focus:invalid {
    border: tomato 2px solid;
}


/* OKなら、その他のテキストボックス以外を緑にする */

form input:valid:not(:last-child) {
    border: seagreen 2px solid;
}

.form_list .number {
    width: 100px;
}

.form_list p {
    text-align: left;
}

.form_required {
    font-size: .8em;
    margin-left: 5px;
}

.form_required_icon {
    color: red;
}

.form_list input {
    width: 100%;
    height: 36px;
    padding-left: 10px;
    appearance: none;
    border: 1px solid #D8D7D5;
    font: inherit;
    outline: none;
    border-radius: 5px;
}

.form_address {
    width: 65%;
    margin: 0 auto;
}

@media all and (max-width: 599px) {
    .form_address {
        width: 100%;
    }
}

.contact_form {
    background: linear-gradient(to right, #00ff84 0%, cyan 100%);
    display: inline-block;
    padding: 20px 50px;
    border-radius: 30px;
    font-size: 2.5rem;
    filter: drop-shadow(5px 5px 3px #5F9963);
    width: 80%;
    font-weight: 700;
}

/**
ボトムバナーのデザイン
**/
.bottom_banner {
    position: fixed;
    left: 0;
    bottom: 0;
    background: #AD8500;
    width: 100%;
    z-index: 100;
    text-align: center;
    padding: 1.5rem;
}

.bottom_banner_title {
    font-size: 3rem;
    font-weight: bold;
    color: #41493E;
    font-family: 'Trajan Pro';
}

.bottom_banner_text {
    color: #CCCCCC;
    font-size: 1.2rem;
}