@charset "utf-8";
/* CSS Document */
html{
	margin:0;
	padding:0;
}

body{
font-family:Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGP明朝B" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-size: 1.0rem;
	line-height:1.4rem;
	margin:0;
	padding:0;
}

	a, a:hover, a:target, a:active, a:focus{
		border:none;
		outline:none !important;
	}

	a:active img, a:focus img{
		border:none !important;
	}

	.d-inline-block {
		display: inline-block;
	}

#header{
	margin-top:20px;
	margin-bottom:10px;
}

	
#navbar{
	background:none;
	border:none;
	margin-bottom:0;
}

	#navbar .nav-justified > li > a{
		background:none;
		border:none;
	}

		#navbar .nav-justified > li > a:hover{
			background:none;
		}

			#navbar .nav-justified > li > a span{
				display:none;
			}

	i {
		font-style: normal;
	}
	i.take-out::after {
		content: ' 円';
	}
	i.tax::before {
		content: '（税込 ';
	}
	i.tax {
		color: gray;
	}
	i.tax::after {
		content: '円）';
	}

	@media (min-width: 768px) {

		html{
			font-size: 120%;
		}

		i.take-out {
			font-size: 1.8rem;
		}
		i.take-out::after {
			font-size: 1.0rem;
		}
		i.tax {
			font-size: 1.0rem;
		}
		i.tax::after, i.tax::before {
			font-size: 0.7rem;
		}

		#navbar .nav-justified > li > a {
			padding:0 0 5px 0;
		}
	
			#navbar .nav-justified > li > a:hover{
				border-bottom:2px solid #CC3300;
			}
		
			#navbar .nav-justified > li > a span{
				display:none;
			}

			h1{
				margin:4rem auto 1rem auto;;
				font-size:3rem;
			}
			
			h2{
				font-size:2rem;
			}
			
			#gu_list{
				font-size:1.5rem;
			}

			ul.row {
				font-size:1.5rem;
				line-height: 2rem;
			}

			#kodawari_comment_box{
				line-height: 1.5rem;
			}


				#kodawari_comment_box h2{
					font-size:2rem;
					margin-top:5px;
				}

			#gu_list li.gu_comment div{
				font-size:1rem;
				line-height:1.5rem;
			} 
			
			#map{
				height:450px; width:100%;border:0;
			}

			#gu_desc{
				margin:1rem 0; color:#666666;
			}

	}	
	
	@media (max-width: 768px) {

		html{
			font-size: 100%;
		}

		i.take-out {
			font-size: 1.3rem;
		}
		i.take-out::after {
			font-size: 0.7rem;
		}
		i.tax {
			font-size: 1.0rem;
		}
		i.tax::after, i.tax::before {
			font-size: 0.7rem;
		}

		#navbar .nav-justified > li  {
			border-bottom:1px solid #f0f0f0;
		}
	
		#navbar .nav-justified > li > a {
			text-align:left;
		}
	
			#navbar .nav-justified > li > a span{
				display:inline;
			}
		
			#navbar .nav-justified > li > a img{
				display:none;
			}
			
			h1{
				margin:0.5rem auto 0.2rem auto;;
				font-size:1.5rem;
			}
			
			h2{
				font-size:1.3rem;
			}

			#gu_desc{
				margin:0.8rem 0 0.4rem 0; color:#666666;
				font-size:0.8rem;
			}

			#gu_list li{
				padding-top:0.5rem;
			}

			#footer{
				font-size:0.9rem;
				line-height:1rem;
			}

				#kodawari_comment_box{
					font-size: 0.9rem;
					line-height: 1.5rem;
				}

				#kodawari_comment_box h2{
					margin-top:0px;
				}

			#map{
				height:250px; width:100%;border:0;
			}

	}	

.address span{
	white-space:nowrap;
}


img{
	max-width:100%;
}


#footer{

	margin-top:10px;
}

	#footer .footer_box{
		background:#f0f0f0;
		text-align: right;
	}

	#footer .footer_box .container{
		text-align:right;
		padding-top:10px;
		padding-bottom:10px;
	}



.navbar{
min-height:35px;

}

.container{
	max-width:950px;

}

.carousel-inner{
	border:1px solid #dddddd;
}

	.carousel-indicators{
		position:relative; 
		bottom:0px;
	}
	
		.carousel-indicators li {
			border: 1px solid #dddddd;
		}
		
		.carousel-indicators .active {
			background-color: #dddddd;
		}
 
.row img{
margin-bottom:15px;

}

img.fit {
	max-width:100%;
}

img.full_fit {
	width:100%;
}


#gu_list{
	margin:0;
	padding-left:0;
}

	#gu_list li{
		list-style:none;
		margin-left:0;
		padding-left:0;
		line-height:1.5em;
	}

#kodawari_box{
	padding:1em 0;
}

	#kodawari_box img{
		cursor:pointer;
	}

	#kodawari_box > div > div{
		display:none;
	}

.bl_top{
	margin-top:20px;
	border-top:1px solid #ffffff;
}

	.balloon.bl_top {
		position: relative;
		border-top: 1px solid #cccccc;
		z-index: 0;
	}

		.balloon.bl_top:before {
			content: "";
			position: absolute;
			top: -8px; left: 50%;
			margin-left: -9px;
			display: block;
			width: 0px;
			height: 0px;
			border-style: solid;
			border-width: 0 9px 9px 9px;
			border-color: transparent transparent #ffffff transparent;
			z-index: 0;
		}
		
		.balloon.bl_top:after {
			content: "";
			position: absolute;
			top: -9px;
			left: 50%;
			margin-left: -10px;
			display: block;
			width: 0px;
			height: 0px;
			border-style: solid;
			border-width: 0 10px 10px 10px;
			border-color: transparent transparent #cccccc transparent;
			z-index: -1;
		}

.bl_bottom{
	margin-bottom:20px;
}

	.balloon.bl_bottom {
		position: relative;
		border-bottom: 1px solid #cccccc;
		z-index: 0;
	}

		.balloon.bl_bottom:before {
			content: "";
			position: absolute;
			bottom: -9px; left: 50%;
			margin-left: -9px;
			display: block;
			width: 0px;
			height: 0px;
			border-style: solid;
		
			border-width: 9px 9px 0 9px;
			border-color: #ffffff transparent transparent transparent;
			z-index: 0;
		}
		
		.balloon.bl_bottom:after {
			content: "";
			position: absolute;
			bottom: -10px;
			left: 50%;
			margin-left: -10px;
			display: block;
			width: 0px;
			height: 0px;
			border-style: solid;
		
			border-width: 10px 10px 0 10px;
			border-color: #cccccc transparent transparent transparent;
			z-index: -1;
		}


#gu_image_box{
	position:relative;
}

	#gu_image_box div{
		height:100%;
		width:20%;
		top:0;
		position:absolute;
		cursor:pointer;
		transition: background-color 0.5s ease;
	}
	
		#gu_image_box div:hover{
			background:rgba(255,255,255, 0.3);
		}
		
		#gu_image_box div.tarako{ left:0%; }
		#gu_image_box div.konbu{ left:20%; }
		#gu_image_box div.sake{ left:40%; }
		#gu_image_box div.ume{ left:60%; }
		#gu_image_box div.okaka{ left:80%; }
		

#gu_list li{
	cursor:pointer;
}
	#gu_list li span{
		position: relative;
	}
	#gu_list li span::after{
		position: absolute;
		bottom: -1px;
		left: 50%;
		content: '';
		width: 0;
		height: 1px;
		background-color: #CC3300;
		transition: .3s;
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		transform: translateX(-50%);
	}
	#gu_list li span:hover::after{
		width: 100%;
	}

	#gu_list li div{
		display:none;
	} 

	#gu_list li.gu_comment{
		cursor:default;
	}

		#gu_list li.gu_comment div{
			display:block;
			margin:10px 0 15px 0;
			background:#f0f0f0;
			padding:10px;
			
			-webkit-border-radius: 6px;
			-moz-border-radius: 6px;
			border-radius: 6px;
		} 

		#gu_list li.gu_comment div h2{
			margin-top:5px;
		} 

	#gu_list li.active span{
		border-bottom:1px solid #CC3300;
		color:#CC3300;
	}

#media_list{
	list-style:none;
	margin-left:0;
	padding-left:0;
}

.red{
	color: red;
}
