/*
======================================================================

Basic Config

======================================================================
*/


*{
margin: 0;
padding: 0;
list-style: none;
box-sizing: border-box;
font-size: 100%;
color: #707070;
font-family: "游明朝", "YuMincho", "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

html,
body{
height:100%;
}

body{
background: #000;
}

img{
width: 100%;
}

#wrap{
width: 640px;
margin: 0 auto;
min-height: 100vh;
}

@media screen and ( max-width:699px ){
  #wrap{
    border: 0;
    width: 100%;
  }
}


.inner{
width: 100%;
padding: 0 20px;  
}


/*
====================================================

M O V I E

====================================================
*/

#mov{
height: 80vh;
width: 100%;
overflow: hidden;
position: absolute;
top:0;
left: 0;
background: #000;
z-index: -1;
overflow-x: hidden;
}

#mov video{
width: 100%;
position: absolute;
top:0;
left: 50%;
transform: translate(-50%,0);
z-index: 1;
}

#mov:before{
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
top:0;
left: 0;
}

#mov:before{
background-image: url(../images/dot01.png);
background-repeat: repeat;
z-index: 2;
}
  
#mov span{
display: block;
width: 60%;
height: 100%;
background-image: url(../images/logo.png);
background-repeat: no-repeat;
background-position:center center;
background-size: contain;
z-index: 3;
position: absolute;
top:0;
left:50%;
transform: translate(-50%,0);
}

#mov .inst{
width: 40px;
position: absolute;
top:15px;
right: 15px;
z-index: 9999;
}



@media only screen and (min-width: 641px) {
  #mov{
    width: 640px;
    margin: 0 auto;
    position: absolute;
    top:0;
    left: 50%;
    transform: translate(-50%,0);
  }
}





.cont{
margin: 20% 0;

}


.cont header{
text-align: center;
padding: 30px 0;
}

.cont h1{
font-family: "trajan-pro-3", serif;
font-weight: 400;
font-style: normal;
text-transform: uppercase;
font-size: 2.2rem;
}

.cont h1 span{
display: block;
font-size: 1.2rem;
}

.cont p{
margin-bottom: 20px;
font-size: 1.2rem;
}


.cont .img img{
object-fit: cover;
margin: 40px 0;
}



.h_img:before{
content: "";
height: 33vh;
width: calc(100% - 40px);
margin: 0 auto;
display: block;
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
}


.cont .price{
width: 80%;
margin: 0 auto;
text-align: center;
border: solid 1px #aaa;
padding: 10px;
}

.cont .price dt{
font-size: 1.4rem;
white-space: nowrap;
}

.cont .price dd{
font-size: 1.8rem;
}


.cont .link a{
display: block;
width: 80%;
padding: 20px;
border: solid 1px #aaa;
line-height: 100%;
text-decoration: none;
text-align: center;
margin: 20px auto;
position: relative;
}

.cont .link a:after{
content: ">";
display: inline-block;
position: absolute;
top:50%;
right: 10px;
transform: translate(0,-50%);
}




.cont .price{
margin-bottom: 20px;
}

#concept{
padding-top: 70vh;
}

#system p{
text-align: center;
}


#ladys{
background: #FFE9F3;
margin: 0 20px;
padding-bottom: 20px;
}

#ladys:before{
height: 25vh;
width: 100%;
background-image:url(../images/women-celebration.jpg);
}

#ladys .price{
width: 90%;
}

#ladys .price dt{
font-size: 1rem;
}


#info:before{
background-image:url(../images/2024-03-02.jpg);
}

#info h2{
width: 50%;
margin: 20px auto;
}

#info dl{
text-align: center;
margin-bottom: 20px;
}






#recruit:before{
background-image:url(../images/132889_0.jpg);
}


#recruit h2{
text-align: center;
font-size: 1rem;
}

#recruit .tbl{
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 20px;
}

#recruit .tbl dt{
width: 25%;
}

#recruit .tbl dd{
width: 75%;
}




footer{
background: #707070;
padding: 30px 20px;
color: #fff;
}

footer .inst{
width: 50px;
margin: 0 auto;
margin-bottom: 20px;
}


footer p{
color: #fff;
text-align: center;
font-size: .8rem;
}