*{
	margin: 0;
	padding: 0;
}
html, body {
     height: 100%;
}
body {
	font-size: 92%;
	-webkit-font-smoothing: antialiased;
	-webkit-transform: translate3d();
	color:#000;
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',Meiryo, メイリオ, sans-serif;
	background:#000;
}

img {vertical-align: middle; }
ul  { margin: 0; padding: 0 }
li  { margin: 0; padding: 0; list-style: none; }

.font70  {font-size:  70%;}
.font80  {font-size:  80%;}
.font140 {font-size: 140%;}
.font150 {font-size: 150%;}

.center  {text-align:center;}
.mrb100  {margin-bottom:100px;}

.bg_white{
	background:#fff;
}
.bg_glay{
	background:#F1F3F4;
}
.fade {
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.fade:hover {
    opacity: 0.6;
    filter: alpha(opacity=90);
}
a{
	color:#fff;
}
a:hover {
	text-decoration: none;
	color:#B3B3B3;
}
.red{color:#C31B1B;}
.bold{font-weight: bold;}

@media screen and (min-width: 1080px) { 
	
	p{
		font-size:110%;
		color:#fff;
		line-height:200%;
		margin-top:10px;
		margin-bottom:50px;
		width:800px;
		text-align:left;
		margin-left:auto;
		margin-right: auto;
	}
	.pc_none{
		display:none;
	}

}
@media (max-width:1079px) {

	p{
		font-size:110%;
		color:#fff;
		line-height:200%;
		margin-top:10px;
		margin-bottom:50px;
		width:96%;
		text-align:left;
		margin-left:auto;
		margin-right: auto;
	}
	.sp_none{
		display:none;
	}

}


/***********************************
* header *
***********************************/

@media screen and (min-width: 1080px) { 
	
	.hdr{
		width:1080px;
		text-align    :left;
		margin        :0px auto 0px auto;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-around;
		justify-content: space-around;
	}
	.hdr_logo{
		padding:10px 5px;
	}
	.hdr_logo img{
		height:100px;
	}
	.hdr_space{
		width:700px;
	}
	.hdr_bt01{
		padding:0px 5px;
	}
	.hdr_bt01 img{
		height:35px;
	}
	.hdr_bt02{
		padding:20px 5px;
	}
	.hdr_bt02 img{
		height:35px;
	}

}
@media (max-width:1079px) {
	
	.hdr{
		width:100%;
		text-align    :left;
		margin        :0px auto 0px auto;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-around;
		justify-content: space-around;
	}
	.hdr_logo{
		padding:10px 5px;
	}
	.hdr_logo img{
		height:100px;
	}
	.hdr_space{
		width:100%;
	}
	.hdr_bt01{
		padding:0px 5px;
	}
	.hdr_bt02{
		padding:23px 2px 0px 2px;
	}
	.hdr_bt02 img{
		height:30px;
	}
	
}

/***********************************
* BUTTON *
***********************************/

.hdr_bt01 .button a {
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    text-decoration: none;
    display: block;
    width: 90px;
    background: #BF0000;
    padding: 10px 10px;
    font-family: "Noto Sans Japanese";
    text-align: center;
    line-height: 1.8;
    font-weight: 500;
    outline: none;
    color: #fff;
    transition: all 0.2s ease;
    margin-top: 15px;
}
.booking_bt01 .button a {
	font-size:130%;
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    text-decoration: none;
    display: block;
    width: 200px;
    background: #BF0000;
    padding: 10px 10px;
    font-family: "Noto Sans Japanese";
    text-align: center;
    line-height: 1.8;
    font-weight: 500;
    outline: none;
    color: #fff;
    transition: all 0.2s ease;
    margin-top: 15px;
}

/* 光る部分 */
.booking_bt01 .button a::before ,
.hdr_bt01 .button a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%);
    transform: skewX(-25deg);
}

/* ホバーで光る */
.booking_bt01 .button a:hover::before ,
.hdr_bt01 .button a:hover::before {
    animation: shine 0.7s forwards;
}

/* アニメーション定義 */
@keyframes shine {
    0% {
        left: -75%;
    }
    100% {
        left: 125%;
    }
}


/***********************************
* home *
***********************************/

@media print, screen and (min-width: 1000px) { 

	.main_img{
		text-align    : center;
		width         : 1100px;
		height:660px;
		margin        : 0px auto 0px auto;
	}
	.main_img img{
		width         : 1100px;
		height:660px;
	}
	.main_block{
		padding-top   : 110px;
		padding-bottom: 0px;
	}
	.main_block02{

	}
	.content{
		width         : 1080px;
		text-align    : left;
		margin        : 0px auto 0px auto;
		padding       : 0px 0px;
		clear         : both;
	}
	.menu01_txt{
		color:#fff;
		margin-bottom:10px;
	}
	.menu01,
	.menu02{
		text-align    :left;
		width         :700%;
		margin        : 0px auto 30px auto;
	}
	.menu02{
		margin        : 0px auto 50px auto;
	}
	.menu01 img,
	.menu02 img{
		width         :1080px;
	}
	.news{
		text-align : center;
		width      : 400px;
		margin     : 0px auto 50px auto;
		line-height: 1.8;
	}
	.news a{
		color:#000;
		text-decoration: border;
	}
	.tit01{
		font-weight:bold;
		font-size: 140%;
		margin:0px 0px 10px 0px;
		color:#fff;
		text-align:center;
	}
	.tit02{
		font-weight:bold;
		font-size: 140%;
		margin:0px 0px 30px 0px;
		color:#fff;
		text-align:center;
	}
	.txt{
		font-size: 110%;
		margin:0px 0px 10px 0px;
		color:#fff;
		text-align:center;
	}
	.page_tit01{
		text-align  :center;
		margin-left :auto;
		margin-right:auto;
		margin-bottom:30px;
		width       :200px;
		padding     :15px 10px;
		font-size   :100%;
		font-weight :bold;
		border      :2px solid #000;
		color       :#000;
	}
	.page_tit02{
		text-align  :center;
		margin-left :auto;
		margin-right:auto;
		margin-bottom:30px;
		width       :200px;
		padding     :15px 10px;
		font-size   :120%;
		font-weight :bold;
		border-bottom:2px solid #666;
		color       :#333;
	}
	.footer_tit{
		width     :300px;
		text-align:left;
		margin    :0px auto 10px auto;
		font-size: 140%;
		font-weight: bold;
	}

	.address,
	.tel,
	.mail{
		width     :300px;
		text-align:left;
		margin    :0px auto 10px auto;
		font-size :100%;
		line-height:1.8;
	}
	.tel  a{
		pointer-events: none;
		text-decoration: none;
		color:#000;
	}
	.mail a{
		text-decoration:border;
		color:#000;
	}

	.table       {display:table;border-collapse:collapse;}
	.table_row   {display: table-row;}
	.table-cell{
		display   :table-cell;
		vertical-align:top;
		font-size :100%;
		line-height:1.8 ;
	}
	.table_data{
		border-top   : 1px solid #fff;
		width        : 100%;
		font-size:120%;
	}
	.table_data .th{
		background   : #000;
		font-weight:bold;
		color:#fff;
		padding      : 10px 10px 0px 10px;
		width        : 200px;
		border-right : 1px solid #fff;
		border-bottom: 1px solid #fff;
		line-height  : 2;
	}
	.table_data .td{
		background   : #000;
		padding      : 10px 10px;
		border-bottom: 1px solid #fff;
		line-height  : 2;
		color:#fff;
	}

	/* ----- CONTACT ----- */
	.form_sec1{
		margin-top:10px;
	}

	#top_contact {
		padding: 110px 0px;
	}
	label {
		display: inline-block;
		font-size:100%;
		padding:5px 0;
		margin-right: 26px;
	}
	.dt,
	#top_contact dl dt {
		margin:20px 0px 5px 0px;
		font-size:110%;
	}
	#form_sec2 {
		margin: 0 -60px 40px 0;
	}
	input[type=text], input[type=tel], input[type=email] {
		width:1080px;
		height: 45px;
		padding: 0 12px;
		border: none;
		border-radius: 0;
		-webkit-border-radius: 0;
	}
	input[type=text]:focus, input[type=tel]:focus, input[type=email]:focus, textarea:focus {
		background: #FFF;
		outline: none;
	}
	#form_sec3 {
		text-align: center;
	}
	textarea {
		width:1080px;
		height: 216px;
		padding: 12px;
		border: none;
		border-radius: 0;
		-webkit-border-radius: 0;
	}
	#button_wrap1 {
		margin: 20px auto;
		width:250px;
	}
	#button_wrap2 {
		margin: 20px auto;
		width:500px;
	}
	input[type=button] {
		color: #FFF;
		font-size: 100%;
		letter-spacing: 0.1em;
		width: 225px;
		height:45px;
		background: #6D6D6F;
		border: none;
		-webkit-appearance: none;
		border-radius: 0;
		-webkit-border-radius: 0;
		float:left;
		width: 225px;
		height:48px;
		margin:0px 10px 0px 0px;
	}
	input[type=button]:focus {
		outline: none;
	}
	input[type=button]:hover {
		opacity: 0.5;
	}
	input[type=submit] {
		color: #FFF;
		font-size: 100%;
		letter-spacing: 0.1em;
		width: 225px;
		height:45px;
		background: #404042;
		border: none;
		-webkit-appearance: none;
		border-radius: 0;
		-webkit-border-radius: 0;
		float:left;
		width: 225px;
		height:48px;
	}
	input[type=submit]:focus {
		outline: none;
	}
	input[type=submit]:hover {
		opacity: 0.5;
	}
	input[type=text], input[type=tel], input[type=email], textarea {
		color: #0F0F0F;
		font-size: 110%;
		background: #EBEBEB;
	}
	#top_contact p{
		margin:0px 0px 0px 0px;
		line-height:180%;
	}
	footer{
		text-align:center;
		color:#fff;
		margin:100px auto 0px auto;
		padding-bottom:20px;
	}

	.booking_bt01{
		margin:0px auto 100px auto;
		text-align:left;
		width:200px;
	}

	}
@media only screen and (max-width:999px) {

	.main_img{
		text-align    : center;
		width         : 100%;
		margin        : 0px auto 0px auto;
	}
	.main_img img{
		width         : 100%;
	}
	.main_block{
		padding-top   : 0px;
		padding-bottom: 0px;
	}
	.main_block{

	}
	.content{
		width         : 96%;
		text-align    : left;
		margin        : 0px auto 0px auto;
		padding       : 0px 0px;
		clear         : both;
	}
	.menu01_txt{
		color:#fff;
		margin-bottom:10px;
	}
	.menu01,
	.menu02{
		text-align    : center;
		width         :100%;
		margin        : 0px auto 30px auto;
	}
	.menu02{
		margin        : 0px auto 50px auto;
	}
	.menu01 img,
	.menu02 img{
		width         :100%;
	}
	.news{
		text-align : center;
		width         : 96%;
		margin     : 0px auto 50px auto;
		line-height: 1.8;
	}
	.news a{
		color:#000;
		text-decoration: border;
	}
	.tit01{
		font-weight:bold;
		font-size: 140%;
		margin:0px 0px 10px 0px;
		color:#fff;
		text-align:center;
	}
	.tit02{
		font-weight:bold;
		font-size: 140%;
		margin:0px 0px 10px 0px;
		color:#fff;
		text-align:center;
	}
	.txt{
		font-size: 110%;
		margin:0px 0px 10px 0px;
		color:#fff;
		text-align:center;
	}
	.page_tit01{
		text-align  :center;
		margin-left :auto;
		margin-right:auto;
		margin-bottom:30px;
		width         :50%;
		padding     :15px 10px;
		font-size   :120%;
		font-weight :bold;
		border      :2px solid #000;
		color       :#000;
	}
	.page_tit02{
		text-align  :center;
		margin-left :auto;
		margin-right:auto;
		margin-bottom:30px;
		width         :50%;
		padding     :15px 10px;
		font-size   :120%;
		font-weight :bold;
		border-bottom:2px solid #666;
		color       :#333;
	}
	.footer_tit{
		width     :96%;
		text-align:left;
		margin    :0px auto 10px auto;
		font-size: 140%;
		font-weight: bold;
	}

	.address,
	.tel,
	.mail{
		width     : 96%;
		text-align:left;
		margin    :0px auto 10px auto;
		font-size :100%;
		line-height:1.8;
	}
	.tel  a{

	}
	.mail a{
		text-decoration:border;
		color:#000;
	}

	.table       {}
	.table_row   {}
	.table-cell{

	}
	.table_data{
		width        : 100%;
		font-size:120%;
	}
	.table_data .th{
		background   : #000;
		font-weight:bold;
		padding      : 10px 10px 0px 10px;
		width        : calc(100% - 20px);
		border-bottom: 1px solid #fff;
		line-height  : 2;
		color:#fff;
	}
	.table_data .td{
		background   : #000;
		padding      : 10px 10px;
		border-bottom: 1px solid #fff;
		line-height  : 2;
		color:#fff;
	}

	
	/* ----- CONTACT ----- */
	.form_sec1{
		margin-top:10px;
	}

	#top_contact {
		padding: 110px 0px;
	}
	label {
		display: inline-block;
		font-size:100%;
		padding:5px 0;
		margin-right: 26px;
	}
	.dt,
	#top_contact dl dt {
		margin:20px 0px 5px 0px;
		font-size:110%;
	}
	#form_sec2 {

	}
	input[type=text], input[type=tel], input[type=email] {
		width:calc(100% - 24px);
		height: 45px;
		padding: 0px 12px;
		border: none;
		border-radius: 0;
		-webkit-border-radius: 0;
	}
	input[type=text]:focus, input[type=tel]:focus, input[type=email]:focus, textarea:focus {
		background: #FFF;
		outline: none;
	}
	#form_sec3 {
		text-align: center;
	}
	textarea {
		width:calc(100% - 24px);
		height: 216px;
		padding: 12px;
		border: none;
		border-radius: 0;
		-webkit-border-radius: 0;
	}
	#button_wrap1 {
		margin: 20px auto;
		width:250px;
	}
	#button_wrap2 {
		margin: 20px auto;
		width:100%;
	}
	input[type=button] {
		color: #FFF;
		font-size: 100%;
		letter-spacing: 0.1em;
		width: 225px;
		height:45px;
		background: #6D6D6F;
		border: none;
		-webkit-appearance: none;
		border-radius: 0;
		-webkit-border-radius: 0;
		float:left;
		width: 225px;
		height:48px;
		margin:0px 10px 0px 0px;
	}
	input[type=button]:focus {
		outline: none;
	}
	input[type=button]:hover {
		opacity: 0.5;
	}
	input[type=submit] {
		color: #FFF;
		font-size: 100%;
		letter-spacing: 0.1em;
		width: 225px;
		height:45px;
		background: #404042;;
		border: none;
		-webkit-appearance: none;
		border-radius: 0;
		-webkit-border-radius: 0;
		float:left;
		width: 225px;
		height:48px;
	}
	input[type=submit]:focus {
		outline: none;
	}
	input[type=submit]:hover {
		opacity: 0.5;
	}
	input[type=text], input[type=tel], input[type=email], textarea {
		color: #0F0F0F;
		font-size: 110%;
		background: #EBEBEB;
	}
	#top_contact p{
		margin:0px 0px 0px 0px;
		line-height:180%;
	}
	footer{
		text-align:center;
		color:#fff;
		margin:100px auto 0px auto;
		padding-bottom:20px;
	}

	.booking_bt01{
		margin:0px auto 100px auto;
		text-align:left;
		max-width:200px;
	}
}

/***********************************
* viewer *
***********************************/

@media screen and (min-width: 1080px) { 

	.viewer {
		margin: 0 auto;
		width:1100px;
		height:660px;
		text-align: left;
		overflow: hidden;
	}
	
	.viewer ul {
		width:1100px;
		height:660px;
		text-align: left;
		overflow: hidden;
		position: relative;
	}
	
	.viewer ul li {
		top: 0;
		left: 0;
		width:1100px;
		height:660px;
		display: none;
		position: absolute;
	}
	.viewer img{
		width:1100px;
		height:660px;
	}
	
}
@media (max-width:1079px) {

	.viewer {
		margin: 0 auto;
		width:100%;
		text-align: left;
		overflow: hidden;
	}
	
	.viewer ul {
		width:100%;
		min-height:330px;
		text-align: left;
		overflow: hidden;
		position: relative;
	}
	
	.viewer ul li {
		top: 0;
		left: 0;
		width:100%;
		display: none;
		position: absolute;
	}
	.viewer img{
		width:100%;
	}
	
}

/***********************************
* MENU GRID *
***********************************/

.menu_table {
  display: grid;
  gap: 5px;
  margin: 10px auto 100px auto;
  text-align: center;
  justify-content: center; /* メニュー数が少なくても中央寄せ */
  max-width: 1080px; /* PC最大幅 */
}

.menu_item {
  font-size:95%;
  padding-bottom: 50px;
  margin-left: auto;
  margin-right: auto; /* 1個でも中央寄せ */
  width: calc((1080px - 20px)/5); /* ディナー幅に揃える */
  box-sizing: border-box; /* paddingやborderを含めて幅固定 */
}

.menu_item img {
  width: 100%;
  display: block;
  margin: 0 auto 10px auto;
}

/* PC: 最大横5列 */
@media screen and (min-width: 1000px) {
  .menu_table {
    --columns: 6; /* ここを変えるだけで列数変更可能 */
    grid-template-columns: repeat(auto-fit, minmax(calc((1080px - (var(--columns) - 1) * 5px)/var(--columns)), 1fr));
    justify-content: center; 
  }
  .menu_item img {
    max-width: calc((1080px - (var(--columns) - 1) * 5px)/var(--columns));
  }
}


/* タブレット: 横2列 */
@media screen and (max-width: 999px) {
  .menu_table {
    grid-template-columns: repeat(2, 1fr);
    width: 96%;
    justify-content: center; /* 1～2個でも中央寄せ */
  }
  .menu_item {
    width: 100%;
  }
}



/***********************************
*  *
***********************************/

@media screen and (min-width: 1080px) { 


}
@media (max-width:1079px) {

	
}