@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
/*
Theme Name: SHINOI RING Coming soon
*/

* {
    font-family: "Noto Sans JP", Roboto;
    margin: 0;
    scroll-behavior: smooth;
}

body {
    position: absolute;
    width: 100%;
}

header {
    position: fixed;
    z-index: 2;
    width: 100%;
}

footer {
    text-align: center;
}

footer p{
    margin: 10em 0 1em 0;
    color: #f7f8f8ff;
    font-weight: 100;
    line-height: 1.8;
    letter-spacing: 0.08em;
}

h1, h2, h3 {
    font-weight: 700;
    letter-spacing: 0.08em;
}

h2, p {
    line-height: 1.8;
}

h1 {
    font-size: 48px;
}

@media screen and (max-width: 720px) {
    h1 {font-size: 36px;}
    #header-contents img {width: 20%; min-width: 72px;}
} /* end 720px */

h2 {
    font-size: 24px;
    padding: 2em 0;
}

h3 {
    font-size: 14px;
}

#header-contents {
    padding:24px 24px 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#reservation-button {
    padding: 1.2em 2.6em;
    font-weight: 500;
    letter-spacing: 0.08em;
    background-color: #f7f8f8;
    color:#262626;
    text-decoration: none;
    border: 0;
    border-radius: 4px;
}

#reservation-button:hover {
    background-color: #262626;
    color:#f7f8f8;
}

#main-logo {
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
}

#main-message {
    text-align: center;
    padding: 30vh 5% 40vh 5%;
    color: #f7f8f8ff;
}

#reservation {
    text-align: center;
    margin: 0 15%;
    padding: 76px 0;
    background-color: #f7f8f8cc;
    backdrop-filter: blur(8px);
    border-radius: 4px;
    color: #262626ff;
}

.wpcf7 p {
    margin: 0 17.5% 1em 17.5%;
    text-align: left;
    line-height: 2.8;
}

#form-checkbox p {
    line-height: 1.8;
}

#form-checkbox span {
    margin: 0;
}

@media screen and (max-width: 1024px) {
    #reservation {margin: 0 10%;}
} /* end 1024px */

@media screen and (max-width: 720px) {
    #reservation {margin: 0 5%;}
    .wpcf7 p {margin: 0 12.5% 1em 12.5%;}

} /* end 720px */

.reservation-p{
    padding: 3em;
}

.wpcf7 textarea, .wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 select {
    width: 100%;
    padding: 1em;
    box-sizing: border-box;
    border-radius: 4px;
    border: 0;
    background-color: #ffffffcc;
}

.required {
    margin: 0px 9px;
    font-size: 10px;
    padding: 3px 10px 5px 9px;
    background-color: #c72600;
    color: #FFFFFF;
    border-radius: 6px;
    vertical-align: text-top;
}

.not-required {
    margin: 0px 9px;
    font-size: 10px;
    padding: 3px 10px 5px 9px;
    background-color: #505050;
    color: #FFFFFF;
    border-radius: 6px;
    vertical-align: text-top;
}

#submitcss p {
    text-align: center;
}

#submitcss input {
    padding: 1em 6em;
}

#a-privacypolicy {
    color: #c72600;
}

.wpcf7-spinner {
    display: none;
}

.video-wrap {
   position: relative;
}

video {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    height: 100vh;
}

.contents-wrap {
    font-family: serif;
    z-index: 1;
}