@charset "utf-8";
/*
 * base css 
 * pc width 1000px fixed
 */

@media (max-width: 599px) {
} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {
} /* end 600-959 */

@media (min-width: 960px) {
} /* 960- */

/* ---------------------------------------- common */

.backfix { 
	color: #fff;
	background: #000; 
}
header > p.backfix { background: rgba( 0, 0, 0, .5 ); }

#wrapper { overflow-x: hidden; }

@media (max-width: 599px) {

	main {
		font-size: 1.3rem;
		line-height: 2;
		padding: 6em 0 3em;
	}
	.inner {
		padding: 0 16px;
	}
	section, article { margin: 0 0 4em; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	main {
		font-size: 1.4rem;
		line-height: 2;
		padding: 6em 0 3em;
	}
	.inner {
		padding: 0 24px;
	}
	section, article { margin: 0 0 5em; }

} /* end 600-959 */

@media (min-width: 960px) {

	main {
		font-size: 1.5rem;
		line-height: 2;
		padding: 6em 0 3em;
	}
	.inner {
		padding: 0 38px;
	}
	section, article { margin: 0 0 6em; }

} /* 960- */

h2, h3, h4, h5 {
    font-weight: 700;
    font-weight: bold;
    line-height: 1.6;
    margin: 0 0 1.5em;
}

@media (max-width: 599px) {
	
	h2 { font-size: 2.0rem; }
	h3 { font-size: 1.8rem; }
	h4 { font-size: 1.6rem; }
	h5 { font-size: 1.4rem; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {
	
	h2 { font-size: 2.2rem; }
	h3 { font-size: 2.0rem; }
	h4 { font-size: 1.8rem; }
	h5 { font-size: 1.6rem; }

} /* end 600-959 */

@media (min-width: 960px) {
	

	h2 { font-size: 2.4rem; }
	h3 { font-size: 2.2rem; }
	h4 { font-size: 2.0rem; }
	h5 { font-size: 1.8rem; }

} /* 960- */

/* ---------------------------------------- mobilemenu */

@media (max-width: 768px) {

	#mobilemenu { padding: 16px; }
	#mobilemenu ul {
		display: table;
		table-layout: fixed;
	}
	#mobilemenu ul li {
		display: table-cell;
		vertical-align: middle;
		padding: 0 12px 0 0;
	}
	#mobilemenu ul li a {
		display: inline-block;
		color: #fff;
		font-size: 3.8rem;
	}

} /* end -599 */

@media (min-width: 769px) {

	#mobilemenu { display: none; }

} /* 960- */


/* ---------------------------------------- header */

header { position: relative; }

header > h1 {
    width: 90%;
    color: #fff;
    font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
    font-weight: bold;
    line-height: 1.8;
    text-align: center;
    text-shadow:0px 0px 4px #000000,0px 0px 5px #000000,0px 0px 8px #000000;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: 99;
}
header > p {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 16px;
    position: absolute;
    top: 5%;
    left: 5%;
    z-index: 98;
}
header > p img {
    width: 100%;
    height: auto;
}

@media (max-width: 599px) {

    header > h1 { font-size: 1.8rem; }
    header > p { width: 24%; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

    header > h1 { font-size: 2.4rem; }
    header > p { width: 18%; }

} /* end 600-959 */

@media (min-width: 960px) {

    header > h1 { font-size: 2.8rem; }
    header > p { width: 12%; }

} /* 960- */


/* ---------------------------------------- footer */

footer { }

/* ----------------------------- footmap */

@media (max-width: 768px) {

	#footmap { display: none; }

}
@media (min-width: 769px) {

	#footmap { 
		background: #f5f5f5;
		padding: 4em; 
	}
	#footmap > div + div { margin: 1.5em 0 0; }
	#footmap dl {
		display: -webkit-box;
		display: -webkit-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
	#footmap dt {
		width: 100%;
		border-bottom : 1px #ccc dotted;
		text-align: center;
		font-weight: bold;
		padding: 0 0 .5em;
		margin: 0 0 .5em;
	}
	#footmap dd { margin: .5em .75em; }
	#footmap dd a {
		display: block;
		line-height: 1;
	}

}

@media (min-width: 769px) and (max-width:959px) {

	#footmap dl { font-size: 1.3rem; }
	#footmap dt { font-size: 1.5rem; }

} /* end 600-959 */

@media (min-width: 960px) {

	#footmap dl { font-size: 1.4rem; }
	#footmap dt { font-size: 1.6rem; }

} /* 960- */


/* ----------------------------- reservation */

footer .reservation {
	text-align: center; 
	font-family:'Hiragino Kaku Gothic ProN', Meiryo, 'MS PGothic', sans-serif;
}

footer .reservation .telnum {
	line-height: 1;
}
footer a.reservationBox span {
	font-size: 1.4rem;
	margin: 0 0 0 20px;
}
footer a.reservationBox {
	display: inline-block;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	line-height: 1;
}
footer a.reservationBox:hover {
	background: #fff;
	border: 1px #ccc solid;
	color: #333;
}

footer .reservation ul li img {
	width: 3.2rem;
	height: auto;
	margin: 0 4px 0 0;
	vertical-align: baseline;
}

footer .reservation p > img {
	width: 160px;
	height: auto;
	vertical-align: middle;
	margin: 0 0 10px;
}

footer .reservation p .marks img {
	width: 40px;
	height: auto;
	vertical-align: middle;
	margin: 0 10px 0 0;
}

@media (max-width: 768px) {

	footer .reservation { 
		background: #f5f5f5;
		padding: 3em 0 2.5em; 
	}	
	footer .reservation ul { margin: 0 0 16px; }
	footer .reservation ul li:last-child { margin: 4px 0 0; }
	footer .reservation ul li .telnum {
		font-size: 1.8rem;
	}
	footer .reservation ul li img + .telnum {
		font-size: 3.2rem;
	}

	footer a.reservationBox { 
		font-size: 1.6rem; 
		padding: 16px;
	}
	
	footer a.reservationBox span {
		font-size: 1.2rem;
		margin: 0 0 0 20px;
	}
	footer .reservation p {
		font-size: 1.4rem;
		vertical-align: middle;
		margin: 24px 0 0;
	}

	footer .reservation p .marks { display: block; }
	
	footer .reservation p span {
		white-space: nowrap;
	}
	footer .reservation p span + span.telnum {
		margin: 0 0 0 12px;
	}


} /* 768px- */


@media (min-width: 769px) {

	footer .reservation { padding: 3.5em 0 3em; }	
	footer .reservation ul { margin: 0 0 24px; }
	footer .reservation ul li { font-size: 1.6rem; }
	footer .reservation ul li:last-child { margin: 8px 0 0; }
	
	footer .reservation ul li .telnum {
		font-size: 2.4rem;
	}
	footer .reservation ul li img + .telnum {
		font-size: 4.4rem;
	}
	
	footer a.reservationBox { 
		font-size: 2.0rem; 
		padding: 20px 40px;
	}
	
	footer .reservation p {
		font-size: 1.8rem;
		vertical-align: middle;
		margin: 24px 0 0;
	}

	footer .reservation p span {
		margin: 0 0 0 12px;
	}


} /* 769px- */


footer aside {
	line-height: 2;
	text-align: center;
	padding: 1.5em 1em;
}

@media (max-width: 599px) {

	footer aside { font-size: 1.1rem; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	footer aside { font-size: 1.2rem; }

} /* end 600-959 */

@media (min-width: 960px) {

	footer aside { font-size: 1.3rem; }

} /* 960- */