/*--------------------------------------------------------------------------
hero
---------------------------------------------------------------------------*/
.hero {
position: relative;
}
.hero img.vus {
width: 100%;
height: 100vh;
-o-object-fit: cover;
object-fit: cover;
}

.hero .logo {
width: 10%;
max-width: 200px;
position: absolute;
top: 3%;
left: 1.5%;
}

.hero .label {
position: absolute;
left: 2.5%;
bottom: 5%;
}
.hero .label h1 {
color: #fff;
font-size: 30px;
line-height: 1.6;
font-family: "Shippori Mincho", serif;
font-weight: 400;
font-style: normal;
}
.hero .label p {
margin-top: 10px;
color: #fff;
line-height: 1.7;
}
.hero .label p br {
display: none;
}
@media screen and (max-width: 768px) {
.hero .logo {
width: 20%;
max-width: 300px;
position: absolute;
top: 20px;
left: 25px;
}
.hero .label {
left: 30px;
bottom: 30px;
}
.hero .label h1 {
color: #fff;
font-size: 24px;
line-height: 1.6;
font-family: "Shippori Mincho", serif;
font-weight: 400;
font-style: normal;
}
.hero .label p {
margin-top: 5px;
color: #fff;
font-size: 12px;
}
.hero .label p br {
display: block;
}
}




/*--------------------------------------------------------------------------
concept
---------------------------------------------------------------------------*/
.concept .cover {
width: 50%;
}
.concept .intro {
width: 50%;
padding-left: 6%;
}
.concept .intro span {
font-family: "Allura", cursive;
font-weight: 400;
font-style: normal;
font-size: 28px;
line-height: 28px;
color: #c6c6c6;
}
.concept .intro h2 {
font-size: 24px;
line-height: 1.6;
font-family: "Shippori Mincho", serif;
font-weight: 400;
font-style: normal;
}
.concept .intro p {
line-height: 2.2;
}

@media screen and (max-width: 960px) {
.concept .cover {
width: 100%;
margin-top: 30px;
}
.concept .intro {
width: 100%;
padding-left: 0;
order: -1;
}
}

@media screen and (max-width: 768px) {
.concept .intro h2 br {
display: none;
}
}



/*--------------------------------------------------------------------------
menu
---------------------------------------------------------------------------*/
.menu {
text-align: center;
}
.menu h2 {
font-family: "Allura", cursive;
font-weight: 400;
font-style: normal;
font-size: 28px;
color: #c6c6c6;
}
.menu .lead {
line-height: 2.2;
}
.menu ul.menu-list li {
width: 31%;
margin-bottom: 60px;
}
.menu ul.menu-list li p {
margin-top: 20px;
}
.menu .btn {
max-width: 480px;
margin: 0 auto;
background: #333;
color: #fff;
text-align: center;
border-radius: 100px;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.menu .btn:hover {
box-shadow: 0 0 0 1px #333 inset;
background: #fff;
}
.menu .btn a {
display: block;
padding: 20px;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.menu .btn:hover a {
color: #333;
}


@media screen and (max-width: 960px) {
.menu .lead {
text-align: left;
}
.menu .lead br {
display: none;
}
.menu ul.menu-list li {
width: 48%;
margin-bottom: 30px;
}
.menu ul.menu-list li p {
margin-top: 10px;
font-size: 12px;
}
.menu .btn {
width: 90%;
max-width: initial;
margin-top: 10px;
}
.menu .btn a { 
padding: 15px;
}
}



/*--------------------------------------------------------------------------
access
---------------------------------------------------------------------------*/
.access .inner {
max-width: 880px;
margin: 0 auto;
}
.access .inner h2 {
font-family: "Allura", cursive;
font-weight: 400;
font-style: normal;
font-size: 28px;
text-align: center;
color: #c6c6c6;
}
.access .inner .map iframe {
width: 100%;
}
.access .inner dl.info-list dt,
.access .inner dl.info-list dd {
padding-bottom: 10px;
}
.access .inner dl.info-list dt {
width: 100px;
font-weight: normal;
}
.access .inner dl.info-list dd {
width: calc(100% - 100px);
}


@media screen and (max-width: 960px) {
.access .inner .map iframe {
height: 250px;
}
.access .inner dl {
width: 86.6666%;
margin: 30px auto 0;
align-items: flex-start
}
.access .inner dl.info-list dt,
.access .inner dl.info-list dd {
padding-bottom: 10px;
font-size: 12px;
}
.access .inner dl.info-list dt {
width: 80px;
font-weight: normal;
}
.access .inner dl.info-list dd {
width: calc(100% - 80px);
}
}


/*--------------------------------------------------------------------------
footer
---------------------------------------------------------------------------*/
footer {
background: #666;
}
footer .logo {
width: 240px;
margin: 0 auto;
}
footer .copy {
color: #fff;
text-align: center;
font-size: 12px;
}
@media screen and (max-width: 960px) {
footer .logo {
width: 120px;
}
}