@charset "utf-8";


/* layout =============================================================

======================================================================== */


/* =====================================================================

	container
	
======================================================================== */


	.l-container-1920,
	.l-container-sp,
	.l-container-w,
	.l-container {
		margin-right: auto;
		margin-left: auto;
		}
	.l-container-1920:before, .l-container-1920:after,
	.l-container-sp:before, .l-container-sp:after,
	.l-container-w:before, .l-container-w:after,
	.l-container:before, .l-container:after {
		display: table;
		content: " ";
		}
	.l-container-1920:after,
	.l-container-w:after,
	.l-container:after {
		clear: both;
		}


	@media print, screen and (min-width: 1920px) {
		.l-container-1920 {
			max-width: 1920px;
			width: 100%;
			}
	}
	@media print, screen and (min-width: 768px) {
		.l-container-1920 {
			min-width: 1000px;
			}
		.l-container-w {
			width: 100%;
			min-width: 980px;
			}
		.l-container {
			width: 980px;
			padding-left: 10px;
			padding-right: 10px;
			box-sizing: border-box;
			}
		.l-wrap {
			width: 100%;
			min-width: 980px;
			position: relative;
			z-index: 10;
			background-color: #fff;
			}
		.l-main {
			float: left;
			width: 670px;
			}
		.l-sub {
			float: right;
			width: 250px;
			margin-bottom: 5.0rem;
			}
		.l-contentbox {
			padding-left: 20px;
			padding-right: 20px;
			}
		
	}
	@media (max-width: 767px) {
		.l-container-w {
			width: 100%;
			}
		.l-container {
			width: 94%;
			}
		.l-wrap {
			width: 100%;
			position: relative;
			z-index: 10;
			background-color: #fff;
			}
		.l-container-sp {
			width: 100%;
			}
		.l-sub {
			margin-top: 4.0rem;
			}
		.l-contentbox {
			padding-left: 2%;
			padding-right: 2%;
			}

	}







/* =====================================================================

	header
	
======================================================================== */

.l-headerBase {
	width: 100%;
	}
.l-header {
	width: 100%;
	}
.l-header a {
	text-decoration: none !important;
	}

	@media print, screen and (min-width: 768px) {
		.l-headerBase {
			min-width: 980px;
			position: fixed;
			z-index: 5000;
			top: 0;
			}
		.l-header {
			height: 80px;
			min-width: 980px;
			background: url(../img/common/bg_header.jpg) repeat-x top center;
			}


		/* hlogo */
		.l-header h1 {
			float: left;
			width: 270px;
			margin-left: 20px;
			margin-top: 14px;
			}


		/* l-hnav */
		.l-hnav {
			height: 50px;
			float: right;
			width: 520px;
			margin-right: 20px;
			margin-top: 13px;
			}
		.l-hnav ul {
			padding-top: 9px;
			}
			.l-hnav ul li {
				width: 120px;
				height: 32px;
				line-height: 26px;
				box-sizing: border-box;
				padding: 2px;
				margin: 0 5px;
				}
				.l-hnav ul li:nth-child(1) {
					background-color: rgba(98,82,48,1.0);
					}
					.l-hnav ul li:nth-child(1).bl-hover  {
						background-color: rgba(98,82,48,0.7);
						}
				.l-hnav ul li:nth-child(2) {
					background-color: rgba(153,0,0,1.0);
					}
					.l-hnav ul li:nth-child(2).bl-hover  {
						background-color: rgba(153,0,0,0.7);
						}
				.l-hnav ul li:nth-child(3) {
					background-color: rgba(51,102,51,1.0);
					}
					.l-hnav ul li:nth-child(3).bl-hover  {
						background-color: rgba(51,102,51,0.7);
						}
				.l-hnav ul li:nth-child(4) {
					background-color: rgba(142,121,84,1.0);
					}
					.l-hnav ul li:nth-child(4).bl-hover  {
						background-color: rgba(142,121,84,0.7);
						}

			.l-hnav ul li span {
				display: inline-block;
				border: #c9bc8d solid 1px;
				width: 100%;
				height: 100%;
				box-sizing: border-box;
				padding-left: 40px;
				position: relative;
				}
				.l-hnav ul li span::before {
					position: absolute;
					top: 4px;
					left: 8px;
					}
				.l-hnav ul li:nth-child(1) span::before {
					content: url(../img/common/icon_home.png);
					}
				.l-hnav ul li:nth-child(2) span::before {
					content: url(../img/common/icon_reservation.png);
					}
				.l-hnav ul li:nth-child(3) span::before {
					content: url(../img/common/icon_contact.png);
					}
				.l-hnav ul li:nth-child(4) span::before {
					content: url(../img/common/icon_kumiawase.png);
					}
			.l-hnav ul li span a {
				color: #fff;
				font-size: 1.2rem;
				}


		/* l-gnav */
		.l-gnav {
			width: 100%;
			min-width: 980px;
			background: -moz-linear-gradient(top, #4d4126 4%, #625230);
			background: -webkit-linear-gradient(top, #4d4126 4%, #625230);
			background: linear-gradient(to bottom, #4d4126 4%, #625230);
  			height: 60px;
			position: relative;
			}
			.l-gnav:after {
				content: url(../img/common/bg_gnavunder.png);
				position: absolute;
				top: 60px;
				left: 50%;
				margin-left: -440px;
				}
			.l-gnav > ul {
  				height: 60px;
				background:  url(../img/common/hnav_line.png) no-repeat right 16px;
				}
			.l-gnav > ul > li {
				float: left;
				width: 160px;
				background: url(../img/common/hnav_line.png) no-repeat left 16px;
				}
			.l-gnav > ul > li a {
				display: inline-block;
				width: 100%;
				height: 100%;
				text-align: center;
				}
      
      /*l-gnav --> dropdown menu*/
      .l-gnav .ddmenu {
        margin-top: -5px;
        position: relative;
        z-index: 2;
        }
      _:-ms-input-placeholder, :root .l-gnav .ddmenu {
        margin-top: -8px;
        }
      .l-gnav .ddmenu img {
        vertical-align: top;
        }
      .l-gnav .ddmenu li a {
        display: block;
        }
      .l-gnav .ddmenu li a:hover img {
        opacity: 1;
        }
      .l-gnav .ddmenu {
        display: none;
        position: absolute;
        }
      .l-gnav li:hover .ddmenu {
        display: block;
        }
  }


	@media (max-width: 767px) {
		.l-header {
			height: 50px;
			background: url(../img/common/bg_header-sp.jpg) repeat-x bottom center;
			background-size: auto 100%;
			overflow: hidden;
			  box-shadow: 0px 2px 3px -3px rgba(58,38,37,0.6);
			  -webkit-box-shadow: 0px 2px 3px -3px rgba(58,38,37,0.6);
			  -moz-box-shadow: 0px 2px 3px -3px rgba(58,38,37,0.6);
			}
		.l-header h1 {
			margin-left: 10px;
			margin-top: 7px;
			}
		.l-header h1 img {
			width: auto;
			height: 36px;
			}
		.l-hnav {
			display: none;
			}
	}






/* =====================================================================

	article
	
======================================================================== */


	@media print, screen and (min-width: 768px) {
		.l-article-home {
			padding-bottom: 50px;
			}
		.l-article {
			margin-top: 140px;
			padding-bottom: 200px;
			}
	}

	@media (max-width: 767px) {
		.l-article-home {
			padding-bottom: 0px;
			}
		.l-article {
			padding-bottom: 100px;
			}
	}




/* =====================================================================

	Section
	
======================================================================== */


	@media print, screen and (min-width: 768px) {
		.l-section {
			padding-top: 50px;
			padding-bottom: 50px;
			}
		.l-section-t {
			padding-top: 50px;
			}
		.l-section-b {
			padding-bottom: 50px;
			}
	}

	@media (max-width: 767px) {
		.l-section {
			padding-top: 30px;
			padding-bottom: 30px;
			}
		.l-section-t {
			padding-top: 30px;
			}
		.l-section-b {
			padding-bottom: 30px;
			}
	}







/* =====================================================================

	footer
	
======================================================================== */

.l-footer {
	clear: both;
	color: #fff;
	text-align: left;
	position: relative;
	}
.l-footer a {
	text-decoration: none !important;
	color: #fff;
	}
.l-footer a:hover {
	text-decoration: none !important;
	color: #D9CFAE;
	}
	@media print, screen and (min-width: 768px) {
		.l-footer {
			padding-top: 80px;
			padding-bottom: 10px;
			min-width: 980px;
			background: #625230 url(../img/common/bg_footer.jpg) no-repeat bottom center;
			}
	}
	@media (max-width: 767px) {
		.l-footer {
			padding-top: 40px;
			padding-bottom: 80px;
			background: #625230 url(../img/common/bg_footer-sp.jpg) no-repeat bottom center;
			}
	}




	
	/* Logo & Address & QR */

	.l-fLogo address {
		font-style: normal;
		}

	@media print, screen and (min-width: 768px) {
		.l-fLogo {
			float: left;
			width: 310px;
			}
		.l-fLogo h1 {
			margin-bottom: 25px;
			}
	}
	@media (max-width: 767px) {
		.l-fLogo h1 {
			margin-bottom: 15px;
			text-align: center;
			}
		.l-fLogo h1 img {
			width: 80%;
			}
		.l-fLogo address {
			text-align: center;
			}
	}



	/* Footer menu for pc */
	@media print, screen and (min-width: 768px) {
		.l-fNav {
			float: right;
			width: 590px;
			line-height: 2;
			}
		.l-fNav > ul:nth-child(1) {
			float: left;
			width: 28%;
			}
		.l-fNav > ul:nth-child(2) {
			float: left;
			width: 22%;
			}
		.l-fNav > ul:nth-child(3) {
			float: left;
			width: 28%;
			}
		.l-fNav > ul:nth-child(4) {
			float: right;
			width: 22%;
			}
		.l-fNav ul li {
			display: block;
				}
			.l-fNav ul li a::before {
				content: "\f101";
				color: #fff;
				font-family: 'Font Awesome 5 Free';
				font-weight: bold;
				margin-right: 10px;
				}
	}





	/* copyright */
	.l-copyright {
		text-align: center;
		line-height: 30px;
		}
	@media print, screen and (min-width: 768px) {
		.l-copyright {
			margin-top: 100px;
			}
	}
	@media (max-width: 767px) {
		.l-copyright {
			margin-top: 100px;
			}
		.l-copyright span {
			display: none;
			}
	}




	/* Pagetop for pc */

	.l-pagetop {
		position: fixed;
		z-index: 100;
		opacity: 0;
		transition: all .7s;
		pointer-events: none;
		right: 10px;
		}
	.l-pagetop-on {
		opacity: 1;
		pointer-events: auto;
		}
		.l-pagetop  a:hover img {
			opacity:1;
			filter: alpha(opacity=100);
			-ms-filter: "alpha( opacity=100 )";
			 -webkit-filter: brightness(1.2);
			 -moz-filter: brightness(1.2);
			 -o-filter: brightness(1.2);
			 -ms-filter: brightness(1.2);
			 filter: brightness(1.2);
			}	


	@media (max-width: 767px) {
		.l-pagetop {
			display: none;
			}
	}




	/* Footer menu for sp */
	@media print, screen and (min-width: 768px) {
		.l-fMenu-sp {
			display: none;
			}
	}
	@media (max-width: 767px) {
		.l-fMenu-sp {
			position: fixed;
			z-index: 100;
			bottom: 0px;
			left: 0px;
			height: 50px;
			width: 100%;
			border-top: #322918 solid 1px;
			}
		.l-fMenu-sp > ul > li {
			text-align: center;
			width: 20%;
			}
		.l-fMenu-sp > ul > li a {
			display: inline-block;
			width: 100%;
			text-align: center;
			}
		.l-fMenu-sp > ul > li img {
			margin-top: 5px;
			height: 40px;
			width: auto;
			}
		.l-fMenu-sp > ul > li:nth-child(3),
		.l-fMenu-sp > ul > li:nth-child(1) {
			background-color: #efe9db;
			}
		.l-fMenu-sp > ul > li:nth-child(4),
		.l-fMenu-sp > ul > li:nth-child(2) {
			background-color: #a99e86;
			}
		.l-fMenu-sp > ul > li:nth-child(5) {
			background-color: #322918;
			}
	}




	/* slide-menu */
	@media print, screen and (min-width: 768px) {
		.l-spNav-overlay,
		.l-slide-menu {
			display: none;
			}
  	}
	@media (max-width: 767px) {
		.l-slide-menu {
			position: fixed;
			bottom: 0;
			right: -210px;
			width: 210px;
			margin: 0;
			z-index: 1000;
			display: -webkit-box; /*Android4.3*/
			display: -moz-box;    /*Firefox21*/
			display: -ms-flexbox; /*IE10*/
			display: -webkit-flex; /*PC-Safari,iOS8.4*/
			display: flex;
			-webkit-flex-wrap: wrap;
			flex-wrap: wrap;
			}
		.l-spNav {
			float: right;
			width: 100%;
			max-height: 95vh;
			overflow-y: auto;
			background-color: rgba(50,41,24,0.9);
			}
			.l-spNav li {
				border-bottom: rgba(239,233,219,0.5) solid 1px;
				}
			.l-spNav li a {
				display: inline-block;
				width: 100%;
				color: #efe9db;
				box-sizing: border-box;
				padding: 10px 15px;
				text-decoration: none;
				}
		.l-spNav-close {
			height: 50px;
			width: 80px; /*IE9未満とかプレフィックス使ってもだめなブラウザやOS対応*/
			widht: -webkit-calc(100vw / 5);/*Chrome19~25対応*/
			width: -moz-calc(100vw / 5);/*Firefox4~15対応*/
			width: calc(100vw / 5);  
			text-align: center;
			float: right;
			}
			.l-spNav-close i {
				color: #efe9db;
				font-size: 2.25em;
				margin-top: 10px;
				}
		.l-spNav-overlay {
			content: '';
			visibility: hidden;
			position: fixed;
			top: 0;
			left: 0;
			display: block;
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,0);
			-webkit-transition: all .5s ease;
			transition: all .5s ease;
			z-index: 3;
			}
		body.open .l-spNav-overlay {
			visibility: visible;
			cursor: pointer;
			background: rgba(0,0,0,0.5);
			}
  	}