/* ===================================================================
CSS information
 file name  :  style.css
 style info :  デフォルトスタイルシート
=================================================================== */

/* ===================================================================
default
=================================================================== */

html{
	height:100%;
	font-family:'hgrkk';

}

body{
	background:url(../img/common/main_bg.jpg) no-repeat center top;
	background-attachment:fixed;
	-webkit-background-size:cover;
	background-size:cover;
	min-height:100%;
	height:100%;

}

#wrapper{
	min-height:100%;
	height:100%;
}

#sakura{
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;	
}

#head{
	width:100%;
	position:relative;
}

#head #navi{
	position:fixed;
	top:80px;
	right:50px;
	z-index:100;
}

#head #navi ul{}

#head #navi ul li{
	float:left;
	width:27px;
	margin:0 25px;
}

#head #navi ul li a:hover{
	opacity:0.8;
}

#logo{
	width:100%;
	height:100%;
}

#logo .decoration{
	position:fixed;
	left:50%;
	top:50%;
	max-width:1756px;
	width:100%;
}

#logo .decoration>img{
	width:100%;
}

#logo .decoration h1#logo01{
	position:fixed;
	width:130px;
	top:50%;
	left:50%;
	margin-left:-65px;
	margin-top:-213px;
}

#logo .decoration h1#logo02{
	position:absolute;
	width:227px;
	top:50%;
	left:50%;
	margin-left:-113.5px;
	margin-top:-89.5px;
}

#logo  .decoration img{
	width:100%;
	max-width:1780px;
}

#footer{
	background:url(../img/common/footer_bg.png) no-repeat bottom;
	background-size:100%;
	width:100%;
	height:200px;
	position:fixed;
	bottom:0;
	z-index:500;
}

#footer .footer_wrap{
	position:absolute;
	bottom:20px;
	width:100%;
}

#footer a,#footer p{
	color:#fff;
}

#footer  .footer_wrap ul{
	float:left;
	padding-left:20px;
}

#footer .footer_wrap ul li{
	float:left;
	margin-right:10px;
}

#footer .footer_wrap p{
	float:right;
	padding-right:20px;
}

.contents{
	width:100%;
	height:100%;
	margin:0 auto;
	position:relative;
}

#contents-wrap{
	max-width:720px;
	width:100%;
	height:580px;
	position:absolute;
	top:50%;	
	left:50%;
	margin-top:-340px;
	margin-left:-415px;
	background:#f9f9f6;
	padding:50px;
	border:5px solid #002954;
	box-shadow:0 0 20px #000;
	z-index:1000;
}

#contents-wrap h1,#contents-wrap h2{
	text-align:center;
	margin-bottom:45px;
}

#contents-wrap p{
	text-align:center;
}

#contents-wrap p#allow{
	position:absolute;
}

#contents-wrap p#allow.allow-over{
	top:-30px;
	left:0;
	width:100%;
	text-align:center;
}

#contents-wrap p#allow.allow-under{
	bottom:-30px;
	left:0;
	width:100%;
	text-align:center;
}

#contents-wrap #image-wrap{
	width:100%;
	margin-top:60px;
}

#contents-wrap #image-wrap p{
	float:left;
	margin:0 1%;
	width:23%;
}

#contents-wrap #image-wrap p img{
	width:100%;
}

#scroll{
	overflow-y:scroll;
	overflow-x:hidden;	
	height:470px;
}

#scroll::-webkit-scrollbar {
  all:unset;
  width: 12px;
  background: transparent;
}

#scroll::-webkit-scrollbar-track {
  all:unset;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.8);
  border-radius: 4px;
  background: transparent;
}

#scroll::-webkit-scrollbar-thumb {
  all:unset;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 4px;
  background: #1c4470;

}

#scroll::-webkit-scrollbar-thumb:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
  background: #08386e;
}


#scroll.hidden{
	overflow:hidden;
}

.menu-detail{
	padding:30px 10px;
	margin-bottom:20px;
	background:url(../img/menu-border.png) no-repeat center bottom;
}

.menu-detail:first-child{
	padding-top:0;
}

.menu-detail:last-child{
	margin:0;
	background:none;
	padding-bottom:0;
}

.menu-detail .menu-detail-left{
	width:60%;
	float:left;
}

.menu-detail .menu-detail-left img{
	width:100%;
}

.menu-detail .menu-detail-right{
	width:40%;
	float:right;
}

.menu-detail .menu-detail-right img{
	width:100%;
}

.store-detail{
	margin-bottom:30px;
}

.store-detail .store-detail-left{
	width:60%;
	float:left;
	text-align:left !important;
}

.store-detail .store-detail-right{
	width:40%;
	float:right;
}

.store-detail .store-detail-right img{
	width:100%;
}

#store .maps{
	width:100%;
	height:270px;
}

#store #scroll{
	height:490px;
}