@charset "utf-8";
/* CSS Document */

/* (C)advista */
/* Default Style Reset --------------------------------------------------------------------------------------------------------- */
*                 {-webkit-appearance: none;}
body,form,fieldset{margin: 0px;padding: 0px;}
fieldset          {border:none;}
h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,ol,dl,dd{margin: 0px;padding: 0px;}
blockquote,li,dt,dd{}
li                {list-style:none;}
input,textarea    {font-size: 1em;}
img{border: 0px none;margin: 0;padding: 0;vertical-align: bottom;}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
@font-face {
font-family: 'MyYuGothicM';
font-weight: normal;
src: local('YuGothic-Medium'),
local('Yu Gothic Medium'),
local('YuGothic-Regular');
}
@font-face {
font-family: 'MyYuGothicM';
font-weight: bold;
src: local('YuGothic-Bold'),
local('Yu Gothic');}

/* Tag Castam ----------------------------------------------------------------------------------------------------------------- */
body              {font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
                   line-height: 150%;word-wrap:break-word;}
em                {font-style: normal;}
strong            {}
a                 {text-decoration: none;color: #000;}
a:link            {}
a:hover           {text-decoration: none;}
a:visited         {}
a:active          {}
input,textarea    {margin: 0;padding: 0;}

.bold            {font-weight: bold;}

.sp            {display: none;}


#btn          {display: none; }
#nav a     { 
padding: 0 0 0 20px;
font-family: "Book Antiqua", Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; font-size: 18px; font-style: normal; font-variant: normal; font-weight: normal; line-height: 180%;font-style: italic;color: #898989;}

*              {margin: 0;padding: 0;text-decoration: none;list-style: none;word-break : break-all;}
em             {font-style: normal;}
a              {color: inherit;}
a:hover        {opacity: 0.8;}
a:focus, *:focus {outline:none; }
.text          {font-size: 14px;letter-spacing: 0.2em;line-height: 318%;}
.center        {text-align: center;}
.noto          {font-family: 'Noto Serif JP', serif;display: block;}
.flex          {display: flex;}
.dl_list       {margin: 0 0 10px;}
.dl_list dt    {margin: 0 60px 20px 0; clear: both;float: left;}
.dl_list dd    {float: right; text-align: right;}
.dl_list:after {width: 0;height: 0;margin: 0;padding: 0;content: "";display: block;clear :both;}
.left_box      {margin: 0 46px 0 0;}
.t_right        {text-align: right;display: block;}
.list          {font-size: 12px;line-height: 180%;letter-spacing: 0.1em;}
video          {margin: 0 0 0 50%;transform:translateX(-50%);}
.video_box     {overflow: hidden; }


h2           {margin: 0 0 74px; font-family: "Book Antiqua", Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; font-size: 40px; font-style: normal; font-variant: normal; font-weight: normal; line-height: 180%;font-style: italic;display: block;text-align: center;letter-spacing: 0.1em;} 

h3           {margin: 0 0 20px;font-family: "Book Antiqua", Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; font-size: 18px; font-style: normal; font-variant: normal; font-weight: normal; line-height: 180%;font-style: italic;display: block;color: #ec6c0e;letter-spacing: 0.1em;} 
h4           {font-size: 14px;margin: 0 0 10px;}


header          {width: 120px;height: 100vh;padding: 60px 0 0;position: fixed;z-index: 100;background: #fff;left: -98% }
header.headerin {left: 0;transition:all 1.5s;  }

header img      {display: block;margin:  0 auto 75px;}
.sns_icon       {margin: 0;position: absolute;bottom: 40px;left: 0;right: 0;}
.sns_icon li    {margin: 0 0 10px;}
.sns_icon img   {margin: 0 auto;}


/* フェード処理 */
.fade             {opacity: 0;}
.fade.animeon     {opacity: 1;transition:all 1.5s ease;}
.up               {transform: translateY( 10%) ;transition:all 1.5s ease;}
.up.animeon       {transform: translateY( 0%);}
.down             {transform: translateY( -20%) ;transition:all 1.5s ease;}
.down.animeon     {transform: translateY( 0%) ;}
.leftin           {transform: translateX(-99%);transition:all 1s ease-out;overflow: hidden;} 
.leftin.animeon   {transform: translateX(0%);} 
.rightin          {transform: translateX(99%);transition:all 1s ease-out;overflow: hidden;} 
.rightin.animeon  {transform: translateX(0%);} 

/*コンテンツ*/
.content      {width: 100%; height: 100vh;min-height: 900px; padding: 0 0 0 120px;}
.container    {padding: 124px 0;overflow: hidden; }

#top          {overflow: hidden;}
#top video          {min-width: 100%; height: 100%;}
#top.on{transition: .5s;opacity: 1;}
#concept      {color: #fff; background: url(../img/concept_back.jpg) no-repeat center;background-size: cover;display: flex;align-items: center;justify-content: center;}
#concept h2   {width: 100%;margin: 0 0 50px;font-weight: normal;letter-spacing: 0.18em;text-align: center;font-family: 'Noto Serif JP', serif;display: block;font-style: normal;font-weight: normal;}

#concept .text{position: relative;}
#concept .text:after{content:"";width: 216px;height: 64px;background: url(../svg/sine.svg) no-repeat center top;background-size: contain;display: block;
                      position: absolute;right: 0;}
#menu         {height: auto;}
#menu .box1    {width: 35%;margin: 0 100px 0 0; }
#menu .box2    {width: 35%; }
#menu .flex   {justify-content: center;margin: 0 0 100px }
#menu .dl_list{margin: 0;letter-spacing: 0.25em;font-size: 14px;  }
#menu .video_box{width: 100%;max-width: 100%;height: 455px;overflow: hidden;margin: 0 0 100px;}

#menu .dl_list        { display:flex;flex-wrap: wrap;justify-content: space-between;}
#menu .dl_list dt      {width: auto;margin: 0 0 5px 0;float: none;}
#menu .dl_list dt .name{width: 250px;display: inline-block;}
#menu .dl_list:after{display: none;}
#menu .dl_list dt.mb   {margin: 0 0 20px 0;}
#menu .dl_list dd      {width: auto;float: none;}
#menu .dl_list dd span {font-size: 12px; }
#menu  .caption{width: 100%;margin: 0 0 20px;padding: 0 60px 0 0;font-size: 11px;font-family: 'Noto Serif JP', serif;}
#menu .caption.cap2    {width: 100%;margin: 34px 0;}
#menu .caption.center  {width: 100%;text-align: center;margin: 0 0 30px;}
.reserv               {position: relative; } 
.reserv:after         {content: "要予約";width: 40px; /*height: 100%;*/ height: auto; position: absolute;top: 0;left: -50px;letter-spacing: 0; font-size: 10px;text-align: center;background: #000;color: #fff;  }

#menu video   {width: auto;height: 100%;}
#video-wrap   {position: relative;height: 455px;}
#video-btn    {position: absolute;width: 100%;height: 100%;top: 0;right: 0;display: flex;justify-content: center;align-items: center;  }

#video-btn span.stop{opacity: 1;transition: .1s; }
#chef         {background: #150402;color: #fff;}
#chef .flex   {justify-content: center;}
#chef .video_box   {width: 326px;height: 250px;   }
#chef video   {height: 100%; margin: 0 0 30px 50%; }
#name span    {display: block;margin: 0 0 10px;font-size: 24px;letter-spacing: 0.1em;}
#name em      {font-size: 12px;}
#chef p       {margin: 0 0 60px;}


#outline      {font-size: 14px;}
#outline dt   {margin: 0 0 10px;float: left;clear: both;}
#outline dd   {margin: 0 0 10px;padding: 0 0 0 100px;}

#access .right_box{width: 500px;}
#access  iframe   {margin: 0 0 20px;}
#access .flex     {justify-content: center;}

#access .list p   {margin: 0 0 20px;}
#access .list span{display: block;margin: 0 0 0 -1em;}

iframe{
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
}
#add_box         {margin: 0 0 20px; font-size: 14px;}
#open_time       {font-size: 14px;}
#open_time dt    {margin: 0 10px 20px 0; clear: both;float: left;}
#open_time dd    {margin: 0 0 20px; padding: 0 0 0 100px;}
#open_time:after {width: 0;height: 0;margin: 0;padding: 0;content: "";display: block;clear :both;}
#tel span        {margin: 10px 0 0 ; display: block;font-style: italic;font-size: 25px;letter-spacing:0.25em; }
#tel span.sp     {display: none; }
small            {display: block;text-align: center;}


#access h3       {font-style: normal;}


@media only screen and (max-width: 768px) {
*                            {-webkit-appearance: none;-webkit-text-size-adjust: 100%;}
.pc                          {display: none;}
.sp                          {display: block;}
body                         {line-height: 120%;}
/*header                       {position: absolute;}
header.down                  {transform: none;}
header .box                  {display: block;}
*/
nav ul  {display: block;}
#nav .sp{display: block;}
#btn{display: block;}

/*三本線*/
#btn                                {position: fixed;top: 10px;right: 10px;z-index: 1001; }
#btn button:after                   {content: "";width:20px;height: 10px;border: 2px solid #fff;border-width: 0 0 2px;display: inline-block;box-sizing: border-box; position: absolute; top: 7px; right: 0;}
#btn button:before                  {content: "";width:20px;height: 8px;border: 2px solid #fff;border-width: 2px 0;display: inline-block;box-sizing: border-box; position: absolute; top: 3px; right: 0;}
#btn button                         {height: 20px;width: 20px;display: block;text-indent:-999em;position: relative;z-index: 101;background: none;border: none;}
.hidden #btn button:after           {transform:rotate(45deg);transform-origin: 100%;top: 10px;}
.hidden #btn button:before          {transform:rotate(-45deg);transform-origin: 100%;border-width: 2px 0 0; top: 2px;}
#nav_back                           {
width: -webkit-calc(100% + 20px);width : calc(100% + 8px) ;
height: -webkit-calc(100% + 20px);height : calc(100% + 8px) ;
margin:auto;
transform: translateX(51%);
top: 0;bottom: 0;right: 50%;

content: "";position: absolute;top: 0;background: #000;display: block;}


header                     {width: 100%;height: 100%; position: fixed;
                            transform-origin: top center;
                            transform: rotateX(90deg);
                            transition: .2s;overflow: hidden;z-index: 2;}
header.open                {transform: rotateX(0deg);transition: .2s;}
header.headerin            {transition: .2s;}
header #nav                {background: #fff;}
#nav .pc                     {display: none;}
#nav                         {width: 100%;height: 100%;padding: 40px 20px 0;top: 0px;position: fixed;}
#nav li                      {height: auto;text-align: left;display: block;position: relative;}
#nav li a                    {margin: 0 0 15px;padding: 15px;border-bottom: 1px solid #ec6c0e;z-index: 1;display: block;}
#nav li .lavel2              {width: 100%;height: auto;position: relative; }
#nav li a:after              {display: none;}
#nav .inner_menu li a        {background: none; }
#nav li a:hover              {}
#nav .lavel_open             {width: 60px;height: 100%;background:#e2f2ff;text-indent: -999em;position: absolute;top: 0; right: 0;line-height: 50px;visibility: visible;}
#nav .lavel_open:after       {content: "+";width: 100%;height: 100%;display: block; text-indent: 0;position: absolute;top: 0;right: 0;    z-index: 2;}
#nav .lavel2_active  .lavel_open:after{content: "-";height: 100%;display: block; text-indent: 0;position: absolute;top: 0;right: 0;}
#nav .inner_menu             {width: auto;padding: 0;visibility: hidden;    position: initial; }
#nav .inner_menu ul          {background: none;visibility: hidden;height: 0; transition: .2s;}
#nav .inner_menu li          {margin: 0;height: 0;visibility: hidden;}
#nav .inner_menu li a        {height: 0;padding: 15px;visibility: hidden;}
#nav li a:hover              {color: #000;background: none;transform: none;}
#nav li:hover .inner_menu    {margin: 0;transform: none; }
#nav li:hover .inner_menu li {display: block; height: auto;transform: none;}
#nav .inner_menu li a:hover  {border-bottom: 1px solid #b8e0ff;}
#nav .lavel2_active          {visibility: visible;transition: .2s;}
#nav .lavel2_active .lavel2  {padding: 0; height: auto;display:block;visibility: visible;height: auto;transition: .2s;background: #dcf1ff;}
#nav .lavel2_active .lavel2 li  {height: auto;display: block; height: auto;transition: .2s;}
#nav .lavel2_active .lavel2 li a{height: auto;transition: .2s;visibility: visible;}
#nav .arrow a:before            {display: none;visibility: visible;}

h2                        {margin: 0 0 50px;font-size: 30px;}
h3                        {margin: 0 0 5px;}
.flex                     {flex-wrap: wrap;}
.content                  {min-height: fit-content;padding: 50px 10px;}
.content img              {width: auto;max-width: 100%;margin: 0 auto;}
.left_box                 {margin: 0 0 50px;}
.container                {padding: 0; }
.text                     {line-height: 200%;letter-spacing: -0.01em;}
.dl_list dt               {margin: 0 15px 10px 0;}
.list                     {margin: 0 0 50px;}
#top                      {margin: 0 0 -10px;padding: 0;position: relative;z-index: auto;}
#top img                  {height:50%; margin: auto;position: absolute;top: 0;bottom: 0;left: 0;right: 0;z-index: 1;   }
#top video                 {position: relative;    filter: brightness(123%) contrast(92%); }
#top:after                {width: 100%;height: 100%;content: "";background: #fff;position: absolute; top: 0; left:0;opacity: 0.1;display: block; }
#concept                  {padding: 50px 10px 150px;}
#concept br               {display: none;}
#concept h2               {margin: 0 0 30px;}
#menu .video_box          {height: auto; }
#menu video               {width: 100%;height: auto;}
#menu .caption           {font-size: 10px;}
#menu .box1    {width: 100%;margin: 0 50px 0 0; }
#menu .box2    {width: 100%; }
#menu .dl_list            {font-size: 12px; }
#chef p br                {display: none;}
#tel                      {text-align: center;}
#tel span                 {line-height: 100%;}
#tel span.pc              {display: none;}
#tel span.sp              {display: block; }
#chef .video_box   {width: 100%;height: auto;margin-right: 0; }
#chef video   {width: 100%;height: auto;}
#video-wrap              {height: auto;}
.sns_icon                 {display: flex;justify-content: center;}
.sns_icon li              {margin: 0 10px 0 0;}
.sns_icon li:last-chaild  {margin: 0;}

.reserv:after             {height: 20px;left: inherit;right: -50px;}
#menu .dl_list           {justify-content: space-between;}
#menu .dl_list dt         {margin: 0 0 5px;width: 60%;  }
#menu .dl_list dd         {margin: 0 0 5px;width: 20%;  }
#menu .box1               {margin: 0 0 60px;}
}