@charset "utf-8";
/* CSS Document */
* {
	margin:0;
	padding:0;
	text-decoration: none;
}
*#header {
      width: auto;
	  height:auto;
      padding-top: 5px;
	  padding-bottom: 5px;
      background-color:#FF4745;
}
 *#lead{
	  padding-top: 5px;
	  padding-bottom: 5px;
	  width: 100%;
	  height:auto;
	  color: #ffffff;
	  text-align: center;
	  margin: 0 auto;
      margin-left: auto;
      margin-right: auto;
      background-color:#281D1D; 
	  font-size:15px;
}
*#h1{
	  width:10em;
	  font-size:20px;
      height:auto;
	  text-align: center;
	  border: 3px solid;
      margin-left: auto;
      margin-right: auto;
      margin: 5px auto;
	  color: #ffffff;
}
*#map-background{
	  width: 100%;
	  height: 480px;
	  background-color: #474747;
}
*#map{
      height:auto;
      margin-left: auto;
      margin-right: auto;
      margin: 0 auto;
	  color: #ffffff;
}
*#category{
      width: auto;
	  height:55px;
      padding-top: 5px;
	  padding-bottom: 5px;
      background-color:#FF4745;
}
*#cat-table{
	 display: flex;
     justify-content: center;
	 font-size:11px;
}
*#cat-box{
	  float: left;
      width: auto;
	  height:40px;
      padding-top: 5px;
	  padding-bottom: 5px;
	  padding-left: 20px;
	  color: #ffffff;
}
*#nav-cont{
    width: auto;
    height:30px;
    padding-top: 5px;
    padding-bottom: 5px;
    color: #ffffff;
    background-color:#281D1D; 
}
*#nav-table{
    display: flex;
    justify-content: center;
    font-size:11px;
    color: #ffffff;
}
*#nav-box{
    float: left;
    width: auto;
    height:40px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    color: #ffffff;
}
*#slider{
	  width: 300px;
      height:136px;
      margin-left: auto;
      margin-right: auto;
      margin: 0 auto;
	  color: #000000;
	  padding-top: 10px;
	  padding-bottom: 10px;
	  margin: 30px auto;
}
.slider {
        position: relative;
}
.slider > li {
    position: absolute;
    list-style: none;
    visibility: hidden;
    animation: anime_slider_fade 8s 0s infinite;
}
.slider > li:nth-of-type(2) {
    animation-delay: 4s;
}
.slider > li:nth-of-type(3) {
    animation-delay: 8s;
}  
@keyframes anime_slider_fade {
    0% {
        visibility: visible;
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    33.3% {
        opacity: 1;
    }
    48.3% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}
*#footer{
      padding-top: 10px;
	  padding-bottom: 10px;
	  width: 100%;
	  height:auto;
	  color: #ffffff;
	  text-align: center;
	  margin: 0 auto;
	  height:auto;
	  display: inline-block;
      margin-left: auto;
      margin-right: auto;
      background-color:#281D1D; 
}






/* お店の部分レイアウト */
*#shop_picture{
	  width: 380px;
	  height:254px;
	  margin-left: auto;
      margin-right: auto;
      margin: 20px auto;
}
*#shop_name{
      padding-top: 10px;
	  padding-bottom: 10px;
	  font-size:20px;
	  width: 400px;
	  height:auto;
	  color: #ffffff;
	  text-align: center;
	  margin-left: auto;
      margin-right: auto;
      margin: 0px auto;
      background-color:#FF4745; 
}
*#genre{
	  border-color: #281D1D;
      padding-top: 10px;
	  padding-bottom: 10px;
	  width: 400px;
	  height:auto;
	  color: #ffffff;
	  text-align: center;
	  margin-left: auto;
      margin-right: auto;
      margin: 10px auto;
	  font-weight:bold;
      background-color:#281D1D; 
}
*#shop_exp{
      padding-top: 10px;
	  padding-bottom: 10px;
	  width: 400px;
	  height:auto;
	  text-align: left;
	  margin-left: auto;
      margin-right: auto;
      margin: 0 auto; 
}
*#shop_movie{
	  width: 400px;
	  height:auto;
	  text-align: center;
	  margin-left: auto;
      margin-right: auto;
      margin: 20px auto;
}
*#shopinfo-cont{
	  width: 400px;
	  background-color:#281D1D;
	  height:auto;
	  text-align: center;
	  padding-top: 10px;
	  padding-bottom: 10px; 
	  margin-left: auto;
      margin-right: auto;
      margin: 20px auto;
	  color:#FFFFFF;
}
*#shop-info{
	  font-weight:bold;
	  font-size: 20px;
	  width: 400px;
	  height:auto;
	  text-align: center;
	  margin-left: auto;
      margin-right: auto;
      margin: 10px auto;  
}
*#star{ 
	  background-color:#FF4745;
	  color:#FFFFFF;
}
*#shop-tel-and-access{ 
	  background-color:#281D1D;
	  color:#FFFFFF;
}


@media screen and (max-width:400px) {

* {
	margin:0;
	padding:0;
	max-width:100%;
  }
  *#header {
      width: auto;
	  height:auto;
      padding-top: 5px;
	  padding-bottom: 5px;
      background-color:#FF4745;
  }
  *#cat-box{
	  float: left;
      width: auto;
	  height:120px;
      padding-top: 5px;
	  padding-bottom: 5px;
	  padding-left: 20px;
	  color: #ffffff;
}
  *#slider{
	  width: 300px;
      height:auto;
      margin-left: auto;
      margin-right: auto;
	  color: #000000;
	  padding-top: 10px;
	  padding-bottom: 10px;
	  margin: 30px auto;
      }
}