@charset "UTF-8";


body{
width: 100%;
text-align: center;
position: relative;
}


video{
width: 100%;
position: absolute;
top: -50px;
right: 0;
}

.inner{width: 1000px; margin: auto; overflow: hidden;}

.main{
position: relative;
height: 560px;
overflow: hidden;
}

.main .logo{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
width: 300px;
z-index: 999
}

h1{
font-family: 'Arapey', serif;
font-size: 50px;
letter-spacing: 6px
}

p{
font-family: 'Arapey', serif;
font-size: 20px;
letter-spacing: 6px;
position: relative;
display: inline-block;
padding: 0 55px;
margin: 0 0 80px 0;
}

p:before, p:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: #fff;
}

p:before {
  left:0;
}
p:after {
  right: 0;
}


@media screen and (max-width: 480px) {
body{
background: url(../img/main-sp.jpg);
background-position: center center;
}

.inner{width: 100%;}

svg{
width:80%;
height:auto;
}
h1{
font-size: 30px;
letter-spacing: 6px
}

p{
font-family: 'Arapey', serif;
font-size: 20px;
}
}