@charset "UTF-8";

body{background-image: url(../kihagi/kabegami.png);}
#gaikan{position: relative;}
#gaikan > img{object-fit:cover;width: 100%;height: 550px;}
#bunsho{ background: url(../kihagi/haikei.png) right bottom no-repeat;color: #003;background-color: #fff;background-size:contain;}
#naikan{ background-color: #253762;}
.menuwaku{background-color: #253762;color: #FFF; text-align:center;display: inline-block;}
#info{ background-color: #253762;color: #FFE;}
footer{background-color: #253762;}
button {background-color: rgba(52,87,119,0.6); }





.korona{ border: 1px #fff solid;border-collapse: separate;padding:0.5em}


.yureru {
	animation: yureru 2s infinite;
}
@keyframes yureru {
	0% {
		transform: translate(2px, 0px);
	}
	5% {
		transform: translate(-2px, 0px);
	}
	10% {
		transform: translate(2px, 0px);
	}
	15% {
		transform: translate(-2px, 0px);
	}
	20% {
		transform: translate(2px, 0px);
	}
	25% {
		transform: translate(-2px, 0px);
	}
	30% {
		transform: translate(0px, 0px);
	}
}

#info table.basic tr > td:nth-child(1){width:11em;}
#info table.basic {border-collapse: separate;border-spacing: 0px 8px;}
#info > table.basic > tbody > tr > td:nth-child(1){vertical-align: top;}

/*PC*/
@media screen and (min-width:768px){
#wrap{background-color:#253762;}
#gaikan{width:100%;height:530px;}
#gaikan > p{position:absolute;}
#gaikan > p:first-child{top:-70px;left:-50px;z-index: 2;}
#gaikan > p:first-child > img{width:100%;}
#gaikan > p + img:last-of-type {width:100%;text-align: center;object-fit: cover;height:600px;}


#bunsho{font-size:1.1rem;line-height:2.5rem;padding:90px 110px;}
.menusub{letter-spacing: 0.1em;}
.mahugu{margin:0 auto 10px auto;width:500px;text-align: center; box-shadow: 2px 2px 4px gray;}
.mahugu img{width:100%;vertical-align: bottom;}
#motikomiryori{width:100%;}
#motikomiryori img{width:100%;}
#menu {text-align: center;padding-bottom:50px;padding-top:80px;}
#menu > p:first-child{font-size: 1.5em;font-weight: 600;line-height: 2em;}
ul.ring{width:500px;margin: 0 auto;display: flex;font-weight: 600;
      flex-wrap: wrap;padding-bottom:40px;font-size:1.3em;color:#253762;}
ul.ring li:nth-child(odd){width:30%;text-align: right;}
ul.ring li:nth-child(even){width:65%;text-align: left;}



#takeout{background-color: white;border: #BF0000  solid 50px; box-sizing: border-box;}
#takeout img{width:100%;}
#takeout .take-title00{display: flex; justify-content: space-between;width:100%;}
#takeout .take-title01{width:30%;height:400px;overflow: hidden;}
#takeout .take-title01 img{text-align: start;height: 400px;object-fit: cover;}
#takeout picture{width:70%;height:400px;overflow: hidden;}
#takeout picture img{height: 400px;object-fit: cover;}
#takeout .take_menu{padding-top:50px;}
#takeout table{margin:0 auto;width:60%;max-width: 600px;font-size: 1.2em;}
#takeout table ul{display: flex; }
#takeout table  tr td:nth-child(1){width:10%;text-align: right;}
#takeout table  tr td:nth-child(2){width:55%; padding:0 0 0 1em;font-weight: 700;}
#takeout table  tr td:nth-child(3){width:35%; font-weight: 700;} 
#takeout .red{color: darkred;}
#takeout .blue{color:royalblue;}
#takeout table + p{text-align: center;}
#takeout .takememo{padding-top:10px;background-color: #BF0000;}
#takeout .takememo > div{padding:50px;background-color: white;}
#takeout .takememo p:first-of-type{}
#takeout .takememo p:nth-child(2){text-align: center;color:black;font-weight: 700;font-size: 1.5em;}
#takeout .takememo p:nth-child(2) a{text-decoration: none;color:black;}

.slider {
	margin: 0 auto ;
	width:100%;
	max-width:710px;
	padding:30px 0;
 
  }
  
  .slider-img {
	margin: 0 10px;
  
  }
  .slider-img img {
	height: auto;
	width: 100%;
	border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999))) / 8px;
	background-color: lightblue;
  }
  .card > p{font-size:1.4rem;}

  }




/*SP*/
@media screen and (max-width:767px){

body {background-color: #253762 ;color: #253762;}
#header{background-color:#253762;}
#gaikan{background-color: #253762;position: relative;width:100%;height:55vh;}
#gaikan > p:first-child {position: absolute;top:-5vh;left:-7vw;min-width:150px;z-index:2;}
#gaikan  .ticket{width:60vw; position:absolute; right:-6vw;bottom:-4vh;z-index:2;}
#gaikan > img:last-child{width:100%;height: 55vh;object-fit: cover;}

#gaikan p img{width:100%;}


#bunsho{padding:13% 1.2rem;line-height:1.4rem;position:relative;}
#bunsho{background-size:auto 60%;}

.mahugu{margin:0 auto 10px auto;box-shadow: 2px 2px 4px gray;width:80vw; }
.mahugu img{width:100%;vertical-align: bottom;}
#motikomiryori{width:100%;}
#motikomiryori img{width:100%;}
#menu {text-align: center;}
#menu > p:first-child{font-size: 1.5em;font-weight: 600;line-height: 2em;}
ul.ring{width:95%;margin: 0 auto;text-align: left;font-size:0;padding-bottom:4vh;font-weight: 600;}
ul.ring li:nth-child(odd){width:100%;padding:0;margin:0;font-size:1rem;line-height:0.9em;}
ul.ring li:nth-child(even){width:100%;margin:0;font-size:1rem;padding-left: 0.8em;padding-bottom:0.5em;}


#takeout{background-color: white;border: #BF0000  solid 0.5em; box-sizing: border-box;}
#takeout img{width:100%;}
#takeout .take-title00{display: flex;flex-direction: column;}
#takeout .take-title01{width:100%;height:auto;}
#takeout .take-title02{width:100%;height:auto;}
#takeout .take-title02 img {width:100%;height:auto;object-fit: none;}
#takeout .take_menu{}
#takeout table{margin:0 auto;width:90VW;font-size: 1.2em;}
#takeout table ul{display: flex; }
#takeout table  tr td:nth-child(1){width:3em;text-align: right;}
#takeout table  tr td:nth-child(2){width:10em; padding:0 0 0 1em;}
#takeout table  tr td:nth-child(3){font-weight: 700;} 
#takeout .red{color: darkred;}
#takeout .blue{color:royalblue;}
#takeout table + p{text-align: center;}
#takeout .takememo{padding:10px;background-color: #BF0000;}
#takeout .takememo > div{padding:50px;background-color: white;}
#takeout .takememo p:first-of-type{}
#takeout .takememo p:nth-child(2){text-align: center;color:black;font-weight: 700;font-size: 1.5em;}
#takeout .takememo p:nth-child(2) a{text-decoration: none;color:black;}

.slider {
	margin: 0 auto;
	width: 100%;
  }
  
  .slider-img {
	margin: 0 5px;
  
  }
  .slider-img img {
	height: auto;
	width: 100%;
	border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999))) / 8px;
	background-color: lightblue;
  }


}
