@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
html{
font-family: 'Noto Sans Japanese', sans-serif;
	-webkit-font-smoothing: antialiased;
	font-size: 89.5%;
	letter-spacing: 0.03rem;
	line-height: 1.15;
	color: #333;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
body{
  background : #000000;
}

body.hidden{
overflow: hidden;
}

a{
color:#333;
font-weight:bold;
}
.section{
clear:both;
position:relative;
}

.w90{
width:90%;
position:relative;
margin:0 auto;
box-sizing:border-box;
}


#head_contact {
background-color:rgba(0,0,0,0.8);
position:relative;
height:50px;
overflow:hidden;
position:fixed;
top:0;
left:0;
width:100%;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
z-index:9999;
}
#head_contact ul.menu{
float:right;
list-style:none;
height:100%;
box-sizing:border-box;
}
#head_contact ul.menu li{
float:left;
height:100%;
line-height:50px;
margin-right:20px;
padding-top:15px;
}
#head_contact ul.menu li img{
	height:20px;
}
#head_contact h1{
float:left;
width:200px;
position:relative;
box-sizing:border-box;
height:100%;
padding:10px 0 10px;
text-align:center;
}
#head_contact h1 img{
height:30px;
}

.spmenu{
display:none;
}

#main {
background-image:url('../img/main_bg.jpg');
text-align:center;
background-position:center center;
padding-top:20%;
box-sizing:border-box;
background-size: auto 100%;
}

#main img.main_logo {
max-width:400px;
}

#concept {
padding:60px 0;
text-align:center;
}

#concept img.main_message {
	width:100%;
	margin-bottom:60px;
}

#concept table.message {
width:100%;
table-layout: fixed;

}

#concept table.message td{
	vertical-align: middle;
	color:#FFFFFF;
}

#concept table.message td.message {
    padding-right: 30px;
}
#concept table.message td h2{
font-size:2.0rem;
margin-bottom:30px;
text-align:left;
font-weight:bold;
}

#concept table.message td p {
	text-align: left;
    padding-bottom: 15px;
    font-weight: bold;
    line-height: 1.5rem;
    color: #FFFFFF;
}


#concept table.message td img{
width:100%;
}

#concept table.message td.img{
width:35%;
padding-left:45px;
}

#menu {
	color:#FFFFFF;
	font-weight: bold;
background-color:#006934;
padding:60px 0;
}
#menu h2{
font-size:2.0rem;
margin-bottom:30px;
text-align:left;
font-weight:bold;
color:#FFFFFF;
}
#menu table.menu {
	width:100%;
	table-layout: fixed;
	text-align:left;
}

#menu table.menu td{
	vertical-align: top;
	width:50%;
	text-align:left;
	position:relative;
	padding:0px 10px 10px 10px;
}

#menu h3{
font-size:1.3rem;
background-color:rgba(0,0,0,.8);
font-weight:bold;
padding:20px ;
position:relative;
margin-bottom:5px;
}
#menu h3:before{
content:"\0025cf";
font-size:0.6rem;
margin-right:5px;
}

#menu h3:hover {
cursor: pointer;
}

#menu h3:after{
content:"";
width:20px;
height:20px;
border-top:1px solid #FFFFFF;
border-right:1px solid #FFFFFF;
position:absolute;
right:20px;
top:10px;
transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}

#menu h3.select:after{
	transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
    top: 20px;
}

#menu .menus {
display:none;
padding:20px 5px;
}

#menu .menus p.name {
font-weight:bold;
line-height:1.2rem;
}

#menu .menus p.price {
	text-align: right;
	    font-weight: bold;
	    margin: 0px 0 20px 0;
	    font-size: 1.1rem;
	    border-bottom: dotted 1px rgba(255,255,255,0.2);
	    padding-bottom: 20px;
}

#menu .menus p.price:last-child{
	border-bottom: none;

}

#menu .menus p.price:before {
content:"\0030fb\0030fb\0030fb";

}

#access{
	padding:60px 0;
	text-align:center;
}

#access table.access {
	width:100%;
	table-layout: fixed;
}

#access table.access td{
	vertical-align: middle;
	width:50%;
	text-align:center;
	position:relative;
}

#access table.access td{
	padding-right:10px;
	padding-bottom:10px;
}
#access  p {
    text-align: left;
    padding-bottom: 15px;
    font-weight: bold;
    line-height: 1.5rem;
	color:#FFFFFF;
}
#access img.access{
width:100%;
}


#reserve {
padding:60px;
text-align:center;
}

#reserve  img{
max-width:400px;
}



/*footer*/
footer{
background-color:rgba(0,0,0,1.0);
padding:80px 0;
color:rgba(255,255,255,1.0);
text-align:center;
padding:20px 0;
}
footer .profilebox{
    width: 90%;
	position: relative;
    margin: 30px auto;
    box-sizing: border-box;
	padding-left:45%;
	background-image:url('../img/logo_footer.svg');
	background-repeat: no-repeat;
    background-size: 25%;
    background-position: 5% 45%;
}
footer .profilebox:after{
	clear:both;
	content:"";
	display:block;
	width:100%;
	height:0;
}

footer .profilebox p {
text-align:left;
padding-bottom:15px;
font-weight:bold;
line-height:1.5rem;

}

footer img.dragonfly{
width:10%;
display:block;
margin:0 auto 10px;
}

/*pageTop*/
#pagetop{
position:fixed;
bottom:0;
right:0;
background-color:rgba(0,0,0,1.0);
color:rgba(255,255,255,1.0);
width:50px;
height:50px;
line-height:50px;
display:none;
z-index:9999;
text-align:center;
font-size:2.0rem;
font-weight:800;
}

#photo {
padding:100px 0 80px;
}

#photo iframe {
margin-bottom:30px;
}

#photo a {
display:inline-block;
padding:20px ;
color:#FFFFFF;
border:solid 2px #FFFFFF;
text-align:center;
margin:0 auto;
font-size:1.5rem;
transition: .8s ;
}

#photo a:hover{
cursor:pointer;
background-color:#FFFFFF;
color:#000000;
}


#photo a i {
margin-right:5px;

}




/*SP用*/
@media (max-width:640px){
	html{
		font-size: 80%;
	}
	#head_contact{
		overflow: inherit;
	}
	#head_contact h1{
	width:100%;
	}
	.spmenu{
	width:50px;
	height:50px;
	display:inline-block;
	position:absolute;
	right:0;
	top:0;
	text-align:center;
	color:rgba(255,255,255,1.0);
	text-align:center;
	line-height:50px;
	font-size:1.5rem;

	background-color:#006934;
	}
	.spmenu.select{
	background-color: #006934;
	}
	.spmenu i{
		line-height:50px;
	}
	.spmenu i.close{
		display:none;
	}
	.spmenu.select i.open{
		display:none;
	}
	.spmenu.select i.close{
		display:block;
	}
	#head_contact ul.menu{
	display:none;
	position:fixed;
	top:50px;
	left:0;
	width:100%;
	background-color: #006934;
	height:auto;
	padding:0 20px;
	z-index:10000;
	opacity:1.0;
	}
	#head_contact ul.menu li{
		width:100%;
		text-align:center;
		float:clear;
		margin-right:0;
	}
	#main {
		height:100vh!important;
		padding-top: 40vh;
	}
	#main img.main_logo {
		max-width:200px;
	}

	table.responsive td{
		display:block;
		width:100%;
	}
	#concept table.message td.img{
		padding-left:0;
		width:100%;
	}
	#menu table.menu td{
		width:100%;
		box-sizing:border-box;
		padding: 0;
	}
	#menu table.menu td img {
		width:80%;
	}
	#access table.access td{
		width:100%;
	}
	#access table.access td.text{
		padding-right:0;
	}
	footer .profilebox {
		padding-left: 0;
		    background-position: center top;
		    background-size: auto 80px;
		    padding-top: 100px;
	}
	#concept table.message td.message{
    padding-right: 0px;
	}

}

#covid {
background-color: #f01818;
color:#FFFFFF;
padding:20px 0;
text-align: center;
display: block;
}

#modal{
	position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #FFFFFF;
    z-index: 9999;
	overflow-y: auto;
}


#modal a.close{
background-color: #000000;
color: #FFFFFF;
position: fixed;
top:0;
right: 0;
width: 40px;
height: 40px;
text-align: center;
line-height:30px;
font-size:2.0rem;
}

#modal .inner{
	width: 90%;
    max-width: 700px;
    display: block;
    margin: auto;
    padding-top: 50px;
}

#modal .inner p{
	line-height: 1.5rem;
	    margin-bottom: 10px;
}