/* fonts*/
.a1g{
	font-family:A1 Gothic R;
	-ms-font-feature-settings:A1 Gothic R;
}
.a1{
	font-family: A1 Mincho;
	-ms-font-feature-settings:A1 Mincho;
}
.bold{font-weight:bold;}
/* style */
.pageTitle{
	background:url(./images/bg_title.jpg) no-repeat center;
	background-size:contain;
	padding:5px 0;
}
.pageTitle img{
	display:block;
	margin:0 auto;
	padding:10px 0;
}
figure>img{
	border:none;	
}

#titleArea{background:url(./images/bg_staff.jpg) no-repeat center,#000000;}
#titleArea h1{text-align:center;}
#titleArea h1::after{content:"";background:none !important;}

#topicPath{background:url(./images/bg.jpg);}

#about{
	background:url(./images/bg_about.jpg) no-repeat center,#000000;
	padding:100px 0;
}
#about .text{
	color:#ffffff;
}
#about .text h2{
	font-size:4.5rem;
	margin-bottom:20px;
	text-shadow:0 0 15px rgba(0,0,0,0.9);
}
#about .text p{
	font-family:1.8rem;
	text-shadow:0 0 5px rgba(0,0,0,0.9);
}

#lineup{
	position:relative;
	z-index:0;
	background:url(./images/bg.jpg);
	padding:100px 0;
	overflow:hidden;
}
#lineup::before{
	content:"";
	position:absolute;
	z-index:-1;
	top:-40%;
	left:-10%;
	display:block;
	width:500px;
	height:200%;
	background:rgba(206,203,190,1);
	transform:rotate(15deg);
	mix-blend-mode: overlay;
}
#lineup::after{
	content:"";
	position:absolute;
	z-index:-1;
	top:-30%;
	right:-10%;
	display:block;
	width:500px;
	height:200%;
	background:rgba(206,203,190,1);
	transform:rotate(15deg);
	mix-blend-mode: overlay;
}
#lineup .flex{
	display:flex;
	align-items:stretch;
	justify-content: center;
	text-align: center;
	height:100%;
}
#lineup .box{
	width:20%;
	min-height:410px;
	padding:0 15px;
	margin:0 0 0 0;
}
#lineup .box .vertical{
	display:inline;
	font-size:4.5rem;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	margin:0 auto;
	line-height:1.6;
	text-align:left;
}

#lineup .box .vertical span{
	display: block;
	font-size:2.4rem;
}

#lineup .box .vertical .small{
	display: inline !important;
	font-size:2.0rem !important;
	color:#242424;
}
#lineup figure{
	overflow:hidden;
}
#lineup a{
	position:relative;
	z-index:0;
	display:block;
	
	height:100%;
	padding-bottom:30px;
}
#lineup a > span,
#lineup a .small{
	transition: .3s ease-in-out;
}

.detail{
	position:relative;
	z-index:0;
	padding:100px 0;
	color:#ffffff;
}

.detail dl{
	margin:0 0 15px 0;
}
.detail dl dt{
	float:left;
	min-width:60px;
	margin-right:15px;
}
.detail dl dd{
	overflow:hidden;
}
.detail h3{
	font-size:4.5rem;
	margin:0 0 20px 0;
	text-shadow:0 0 15px rgba(0,0,0,0.9);
}
.detail h3 span{
	display:block;
	font-size:2.0rem;
	margin-bottom:10px;
}
.detail h3 .small{
	display:inline;
	vertical-align:middle;
	font-size:2.4rem;
	color:#ffffff;
}
#sangenya{
	background:url(./images/bg_sangenya.jpg) no-repeat center;
	background-size:cover;
}
#dou{
	background:url(./images/bg_dou.jpg) no-repeat center;
	background-size:cover;
}
#tasuku{
	background:url(./images/bg_tasuku.jpg) no-repeat center;
	background-size:cover;
}
#hachigen{
	background:url(./images/bg_hachigen.jpg) no-repeat center;
	background-size:cover;
}
#shigi{
	background:url(./images/bg_shigi.jpg) no-repeat center;
	background-size:cover;
}

#map {
   width: 100%;
   height: 570px;
   background-color: grey;
 }
.shop h3{
	float:left;
}
.shop .guide{
	float:right;
	text-align:center;
	margin-bottom:15px;
}
.shop .guide a{
	font-family:A1 Gothic R;
	display:block;
	border:1px solid #ffffff;
	border-radius:5px;
	color:#ffffff;
	padding:30px 15px;
}


@media (min-width: 992px) {
	.detail::before{
		content:"";
		width:100%;
		height:60px;
		position:absolute;
		z-index:-1;
		left:0;
		top:0;
		background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 77%, rgba(0,0,0,0) 100%);
		background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 77%,rgba(0,0,0,0) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 77%,rgba(0,0,0,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#00000000',GradientType=0 );
	}
	.detail::after{
		content:"";
		width:100%;
		height:60px;
		position:absolute;
		z-index:-1;
		left:0;
		bottom:0;
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 23%, rgba(0,0,0,0.6) 100%); 
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 23%,rgba(0,0,0,0.6) 100%); 
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 23%,rgba(0,0,0,0.6) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#99000000',GradientType=0 );
	}
	#lineup a:hover,
	#lineup a:hover span,
	#lineup a:hover .small{
		color:#ffffff !important;
	}
	#lineup a::after{
		content:"";
		position:absolute;
		z-index:-1;
		top:0;
		left:0;
		width:100%;
		height:0;
		transition: .3s ease-in-out;
	}
	#lineup a:hover::after{
		height:100%;
		background:#242424;
	}
	#lineup a figure img{
		filter: grayscale(1);
		transition: .3s ease-in-out;

	}
	#lineup a:hover figure img{
		transform:scale(1.1) ;
		filter: grayscale(0);

	}
	.shop .guide a:hover{
		color:#242424;
		background:#ffffff;
	}
}

@media (max-width: 991px) {
	#titleArea{background:url(./images/bg_title_sp.jpg) no-repeat center,#000000;background-size:cover;}
	.pageTitle{background:none;}
	.pageTitle img{max-height:300px;}
}

@media (max-width: 767px) {
	#lineup .flex{
		display:block;
	}
	#lineup .box{
		width:100%;
		min-height:auto;
		padding:0 15px;
		margin:0 0 0 0;
	}
	#lineup .box::after{
		content:"";
		display:block;
		clear:both;
	}
	#lineup .box figure{
		width:40%;
		margin-right:15px;
		float:left;
	}
	#lineup .box .vertical{
		font-size:2.4rem;
		writing-mode: horizontal-tb !important;
		-ms-writing-mode:lr-tb !important;
		margin:0 auto;
	}
	#lineup .box .vertical span{
		font-size:1.6rem;
		margin-bottom:5px;
	}
	#lineup .box .vertical .small{
		font-size:1.2rem !important;
	}
	#lineup a{padding-bottom:0;}
	#about{
		background:url(./images/bg_about_sp.jpg) no-repeat center,#000000;
		padding:60px 0;
	}
	#about .text h2{
		font-size:3.5rem;
	}
	.shop h3,
	.shop .guide{
		float:none;
	}
	.shop .guide a{
		padding:10px 15px;
	}
	#lineup a{
		text-align: left;
	}
}