@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP');

/ *共通* /

html{
	font-family: "Zen Kaku Gothic New","游ゴシック","Yu Gothic",YuGothic,メイリオ,Meiryo,"ＭＳ Ｐゴシック",sans-serif;
}
body{
	margin:0;
	padding:0;
	background:#000;
	color:#fff;
	overflow-y:scroll;
        overflow: overlay;
/* footerを一番下にする記述 */	
	display:flex;
	flex-flow:column;
	min-height:100vh;
}
#wrap {
	max-width:100%;
	height:100vh;
/* footerを一番下にする記述 */
	flex:1;
}
ul{
	list-style:none;
}
a{
	text-decoration:none;
	color:#fff;
}

/* スクロールバー */

body::-webkit-scrollbar {
	width: 8px;
}
body::-webkit-scrollbar-thumb {
	background-color:rgba(0,0,0,0.8);;        
	border-radius: 7px;
}
body::-webkit-scrollbar-track {
	background:transparent;
}

/* 読み込み時徐々にはっきりと表示 */

.pig_image{
	filter:blur(8px);
	animation:blur-anim2 2s linear forwards;
}
@keyframes blur-anim2 {
	0%{opacity:0;}
	100% { filter: blur(0); }
}

/* スライド */

#first_view{
	width:100%;
	height:100vh;
	margin:0;
	background-color:#000;
	position:absolute;
	top:0;
	z-index:5;
	overflow:hidden;
	pointer-events:none;
	animation: fadein-keyframes 4s ease 0s 1 forwards;
	display: flex;
	align-items: center;
	justify-content: center;
}
@keyframes fadein-keyframes {
	0% { opacity: 1; }
	90% { opacity: 1; }
	100% { opacity: 0; }
}

/* navi */

#nav {
	width:200%;
	height:100vh;
	position:absolute;
	top:0;
	left:3%;
	float:left;
	width: calc(100% / 9);
	position: fixed;
	z-index:1;
}
#nav::before{
	position: fixed;
	top:9vh;
	left:13.5vw;
	bottom:8vh;
	width:1px;
	background-color:rgba(255,255,255,0.3);
	opacity:1;
	position-events:none;
	transition:opacity .8s;
	content:'';
}
#nav p{
	position:absolute;
	font-size:50%;
	top:43%;
	left:17%;
	letter-spacing:1px;
	writing-mode: vertical-rl;
	color:#bbb;
	transform: rotate(180deg);
	width: calc(100% / 9);
}
.logo {
	position:absolute;
	right:19%;
	top:4%;
	width:90%;
	height:auto;
	padding:0;
}
#sns {
	position:absolute;
	bottom:8%;
	left:12%;
	display:flex;
	width: calc(100% / 9); 
}
#sns:hover a:not(:hover){
	opacity:0.5;
}
#sns a{
	margin-right:25px;
}

/* ホーム */

#luxy{
	width:100%;
	height:auto;
}
#top{
	position:relative;
	width:100%;
	height:100vh;
	margin:auto;
}
.zutto {
	position:absolute;
	top:-1%;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:auto;
	height:auto;
	overflow: hidden; 
	z-index:3;
}

/* category */

#category {
	font-size:140%;
	line-height:1.6em;
	width: calc(100% / 7);
}
#category ul {
	position:absolute;
	top:4%;
	right:3%;
	font-size:21px;
	font-family:"游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	writing-mode:vertical-rl;
	-ms-writing-mode: tb-rl; 
	-webkit-writing-mode: vertical-rl
	text-orientation:upright;
	font-weight:bold;
}
#category ul .mokuzi {
	font-size:10px;
	letter-spacing:0.2em;
	opacity:65%;
	margin-top:3px;
}
#category ul li{
	line-height:2em;
}
#category li a {
	color:#fff;
}
#category:hover a:not(:hover){
	color:rgba( 255, 255, 255, 0.5);
}

/* about us */

#about us {
	margin:0;
	padding:0;
	width:100%;
	height:auto;
}
#news_box {
	display:flex;
	flex-direction:row;
	width:100%;
	height:145px;
}
#news {
	width:27%;
	height:100px;
	margin-top:28px;
	text-align:right;
}
.news_logo {
	display:block;
	margin-left:auto;
}
.news_logo img {
	width:28%;
	height:28%;
}
#blog {
	width:71%;
	height:90px;
	margin-top:28px;
	padding-top:10px;
	padding-left:2%;
}
.blog_text {
	font-family:"游ゴシック";
	font-style:Regular;
	font-size:10pt;
	opacity:0.7;
}
.blog_date_text {
	font-family:"ＭＳ Ｐゴシック";
	letter-spacing:0.16em;
	font-size:9pt;
	opacity:0.5;
}
.blog_line  {
	width:100%;
}
.blog_line td:nth-child(1) {
	font-size:12px;
	font-weight:bold;
	color:#696969;
	padding-right:2em;
        border-bottom:none;
}
.blog_line td:nth-child(2) {
	font-size:15px;
        border-bottom:none;
}
#about_top {
	position:relative;
	width:100%;
	height:630px;
	margin-bottom:12%;
}
#about_top .about_shop {
	position:absolute;
	top:11.6%;
	left:31.2%;
	width:67.5%;
}
#about_top .about_logo {
	position:absolute;
	top:40.3%;
	left:13.1%;
	width:44.6%;
}
#about_main {
	position:relative;
	width:100%;
	height:0;
	padding-top:60%;
	background-image:url(../images/back_main.png);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	margin-top:3%;
}
#about_main .english_logo {
	position:absolute;
	top:6.8%;
	left:26.9%;
	width:20%;
}
#concept {
	position:absolute;
	top:5%;
	left:51%;
}
.concept_text {
	font-family:"游明朝";
	font-weight:bold;
	font-size:1.96vw;
	line-height:3.4vw;
	opacity:0.95;
	word-break:keep-all;
}
.concept_text_span{
	color:#ed1c24;
	font-size:3vw;
	font-family:"游明朝";
	font-weight:bold;
	word-break:keep-all;
}
responsive_space1{
	display:none;
}
#message {
	position:absolute;
	top:24.7%;
	left:51%;
}
.message_text {
	width:100%;
	font-family:"游ゴシック";
	font-weight:bold;
	font-size:1.02vw;
	line-height:2.12vw;
	opacity:0.75;
	word-break:keep-all;
}

/* gallery */

#gallery div{
	display:block;
	text-align:center;
	margin:0;
	padding: 10px;
    	background: rgba(0, 0, 0, 0.5);
    	width: 32vw;
    	height: 24vw;
	position: absolute;
	left: 15vw;
	top: 15.5vw;
	overflow-y:scroll;
}
#gallery div a{
	display:inline;
	margin-left:5px;
}

#gallery div::-webkit-scrollbar{
	width: 5px;
	height: 5px;
}
#gallery div::-webkit-scrollbar-track {
	border-radius: 5px;
	background: rgba(0, 0, 0, 0.37);
}
#gallery div::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background:#ccc;
}#gallery p{
	position:absolute;
	top:40vw;
	left:39vw;
}

/* Menu */

#menu_main{
	width:100%;
	height:auto;
}
#menu_img {
	width:100%;
	height:auto;
}
#menu_img img {
	width:29%;
	margin-top:5%;
	margin-bottom:2%;
	margin-left:19.7%;
}

/* アコーディオンメニュー */

#menu_list {
	position:relative;
	width:73%;
	height:auto;
	margin-left:27%;
	margin-bottom:5%;
	color:white;
}
.lunch_memo p{
	display:block;
	font-size:1vw;
	line-height:2.4vw;
	color:#bbb;
}
.dinner_memo p{
	display:block;
	font-size:1vw;
	line-height:2.4vw;
	color:#bbb;
}
.dinner_memo2 p{
	display:block;
	font-size:1vw;
	line-height:2.4vw;
	font-weight:bold;
	color:#dd0000;
}
.s_02 .accordion_one {
	width:100%;
	height:auto;
}
.s_02 .accordion_one .accordion_header {
	background-color: #000;
	border-top:0.01px solid #222222;
	border-bottom:0.01px solid #222222;
	color: #fff;
	font-size:1.56vw;
	padding:48px 11% 48px 0;
	position: relative;
	cursor: pointer;
	transition-duration: 0.2s;
}
.s_02 .accordion_one:nth-of-type(2) .accordion_header {
    	background-color: #000;
	border-top:0.1px solid #222222;
}
.s_02 .accordion_one:nth-of-type(3) .accordion_header {
	background-color: #000;
	border-top:0.1px solid #222222;
}
.s_02 .accordion_one:nth-of-type(4) .accordion_header {
	background-color: #000;
	border-top:0.1px solid #222222;
	border-bottom:0.1px solid #222222;
}
.s_02 .accordion_one .accordion_header:hover {
	opacity: .8;
}

/* アコーディオンの丸ボタンの記述 */

.s_02 .accordion_one .accordion_header .i_box {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	right: 6%;
	width: 16px;
	height: 16px;
	background:#fff;
	margin-top: -9px;
	margin-right:-45px;
	border-radius: 50%;
	box-sizing: border-box;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
}
.s_02 .accordion_one .accordion_header.stay .i_box {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
.s_02 .accordion_one .accordion_header .i_box .one_i {
	display: block;
	width: 18px;
	height: 18px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
	position: relative;
}
.s_02 .accordion_one .accordion_header.stay .i_box .one_i {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
.s_02 .accordion_one .accordion_header.stay.open .i_box .one_i {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.s_02 .accordion_one .accordion_header.open .i_box {
	-webkit-transform: rotate(-360deg);
	transform: rotate(-360deg);
}
.s_02 .accordion_one .accordion_header.stay.open .i_box {
	-webkit-transform: rotate(315eg);
	transform: rotate(315deg);
}
.s_02 .accordion_one .accordion_header .i_box .one_i:before, .s_02 .accordion_one .accordion_header .i_box .one_i:after {
	display: flex;
	content: '';
	background-color: #000;
	border-radius: 10px;
	width: 8px;
	height: 1px;
	position: absolute;
	top: 7.5px;
	left: 4px;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	transform-origin: center center;
}
.s_02 .accordion_one .accordion_header .i_box .one_i:before {
	width: 1px;
	height: 8px;
	top: 5px;
	left: 7px;
}
.s_02 .accordion_one .accordion_header.stay .i_box .one_i:before {
	content: none;
}
.s_02 .accordion_one .accordion_header.open .i_box .one_i:before {
	content: none;
}
.s_02 .accordion_one .accordion_header.stay.open .i_box .one_i:before {
	content: "";
}
.s_02 .accordion_one .accordion_header.open .i_box .one_i:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.s_02 .accordion_one .accordion_header.stay.open .i_box .one_i:after {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
.s_02 .accordion_one .accordion_inner {
	display: none;
	border-left: 2px solid #000;
	border-right: 2px solid #000;
	box-sizing: border-box;
}
.s_02 .accordion_one .accordion_inner.stay {
	display: block;
}
.s_02 .accordion_one:nth-of-type(2) .accordion_inner {
	border-left: 2px solid #000;
	border-right: 2px solid #000;
}
.s_02 .accordion_one:nth-of-type(3) .accordion_inner {
	border-left: 2px solid #000;
	border-right: 2px solid #000;
}
.s_02 .accordion_one:nth-of-type(4) .accordion_inner {
	border-left: 2px solid #000;
	border-right: 2px solid #000;
}
.s_02 .accordion_one .accordion_inner .box_one {
	height: 300px;
}
.s_02 .accordion_one .accordion_inner p.txt_a_ac {
	margin: 0;
}

/* アコーディオンの中のテーブル */

.menu_line, td, th {
	border-bottom: 0.3px solid #222222;
}
.menu_line {
	border-collapse: collapse;
	font-size:14px;
}
.menu_line td{
	white-space:nowrap;
	padding-bottom:0.7em;
	padding-top:0.7em;
}
.list{
	border-collapse: separate;
	border-spacing: 8px 0px;
}

/* Lunch,Dinner,Drinks,Desert,TakeOut,￥マークの記述 */

.name{
	color:#808080;
	float:right;
	font-size:11px;
	letter-spacing:0.2em;
	width:3px;
	font-weight:bold;
}
.name1{
	color:#808080;
	float:right;
	font-size:11px;
	letter-spacing:0.2em;
	width:19px;
	white-space:nowrap;
	font-weight:bold;
}
.menu_line td:nth-child(2):before{
	content:'￥';
	font-size:16px;
	font-weight:300;
}
.menu_line td:nth-child(1) {
	width:44.5em;
}
.menu_line td:nth-child(2){
	font-size:22px;
	font-family:'roc-grotesk,serif';
	font-weight:400;
	text-align:right;
}

/* ※仕入状況により…のコメント */

.memo{
	position:absolute;
	color:#696969;
	font-weight:bold;
	padding-top:15px;
	white-space: nowrap;
	font-size:12px;
	margin-left:10%;
}

/* image roll */

.roll {
	width:100%;
	height:auto;
	margin-top:0;
}

#roll_wa {
	width:100%;
	height:auto;
}

#roll_wa img {
	width:13%;
}

.roll__wrap {
	display:flex;
	overflow:hidden;
}

.roll__list {
	display:flex;
	list-style:none;
}

.roll__list--left{
	padding:0;
	animation:scroll-left 75s infinite linear 0.5s both;
}
@keyframes scroll-left {
	from { transform:translateX(0); }
	to { transform:translateX(-100%); }
}

.roll__item {
	width:calc(100% / 8);
}

.roll__item > img{
	width:500px;
	height:auto;
}

.roll ul li {
	margin-left:15px;
}

/* shop info */

h3,h4{
	font-weight:normal
}
h4{
	font-size:1.1vw;
	margin-block-start:0;
}
h3,h4,p{
	padding:0;
}
#shopinfo_wrap{
	padding-top: 12vw;
	padding-bottom: 12vw;
	background:#000;
}
.shopinfo_header{
	position:relative;
	height:15vw;
}
.shopinfo_header img{
	position:absolute;
	top:1.3vw;
	left:20vw;
	width:40%;
	height:auto;
}
.shopinfo_title {
	position:absolute;
	top: 8.5vw;
	left: 20.6vw;
	font-weight: 400;
}
.shopinfo_map{
	position:relative;
	top:1em;
	overflow:hidden;
	width:92vw;
	height:60.96774vw;
}

.shopinfo_map img{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	filter: grayscale(1);
	opacity:0.9;
}
.shopinfo_datamain{
	position:relative;
	display:flex;
	justify-content: space-between;
}
.shopinfo_datamain::before{
	height:1px;
	background:#fff;
	content:'';
	width:100%;
	position:absolute;
	left:0;
	bottom:0;
	opacity:0.2;	
}
.shopinfo_datamain::after{
	height:1px;
	background:#fff;
	content:'';
	width:4%;
	position:absolute;
	left:0;
	bottom:0;	
}
.shopinfo_datamain h3{
	font-size:20px;
}
.shopinfo_datamain address{
	letter-spacing: .03em;
}
.shopinfo_datamain img{
	padding:0.5em;
	width:10px;
	height:auto;
}
.shopinfo_datamain div{
	display:flex;
	align-items: center;
}
.shopinfo_datamain div a:hover{
	color:yellow;
}
.shopinfo_datasub span{
	font-size:15px;
}
.tel{
	margin-top: 1vw;
	margin-block-end:0;
	font-size: 1.8vw;
	letter-spacing: .1em;
}
.tel a[href*="tel:"]{
	pointer-events:none;
}

/*
.tel a{
	position:relative;
}
.tel a::before{
	content:'';
	position:absolute;
	bottom:0;
	rigth:0;
	display:block;
	width:100%;
	height:1px;
	background:#fff;
	transition:width 0.3s;
}
a:hover::before{
	right:0;
	width:0;	
}
*/

span.tenpotime{
	font-size:0.8vw;
}	
.shopinfo_datasub dl{
	margin:.4vw 0 0 0;
	padding:0;
	display:flex;
	font-size:0.8vw;
	letter-spacing:0.1em;
}
.shopinfo_datasub dt{
	text-align: justify;
	text-align-last: justify;
}
.shopinfo_datasub dd{
	position: relative;
	margin-left:2em;
}
.shopinfo_datasub dd::before{
	position:absolute;
	content:'：';
	top: 0;
	left:-1.5em;
}
.shopinfo_dataway{
	position:relative;
}
.comment{
	margin-top:0.8vw;
	font-size:12px;
}
.shopinfo_dataway dl{
	display:flex;
	font-size:12px;
}
.shopinfo_dataway dt{
	text-align:justify;
	text-align-last: justify;
}
.shopinfo_dataway dd{
	position:relative;
}
.shopinfo_dataway dd::before{
	position:absolute;
	content:'：';
	top:0;
	left:-2em;
}
.shopinfo_datamemo{
	color:#f0e68c;
	font-size:0.8vw;
}
.shopinfo_datamemo p{
	margin-block-end:0;
	padding-bottom:20px;
}

/* 氷リンク */

.kouri:hover{
	transform:scale(1.1);
}

/* footer */

footer{
	width:100%;
	height:auto;
	margin-top:0;
}
.footer_copy{
	position:absolute;
	color:#fff;
	z-index:2;
	padding-top:5vw;
	padding-left:80vw;
	white-space: nowrap;
}