@charset "utf-8";

/* font */
@font-face {
  font-family: 'Eulyoo1945';
  font-style: normal;
  font-weight: 400;
  src: url('/resources/fonts/Eulyoo1945-Regular.eot');
  src: url('/resources/fonts/Eulyoo1945-Regular.eot') format('embedded-opentype'),
  url('/resources/fonts/Eulyoo1945-Regular.woff2') format('woff2'),
  url('/resources/fonts/Eulyoo1945-Regular.woff') format('woff');
}
@font-face {
font-family: 'Eulyoo1945';
font-style: normal;
font-weight: 600;
src: url('/resources/fonts/Eulyoo1945-SemiBold.eot');
src: url('/resources/fonts/Eulyoo1945-SemiBold.eot') format('embedded-opentype'),
url('/resources/fonts/Eulyoo1945-SemiBold.woff2') format('woff2'),
url('/resources/fonts/Eulyoo1945-SemiBold.woff') format('woff');
}

:root {
  --color-primary: #222;
  --color-secondary: #552F17;
  --color-black: #000;
  --color-white: #fff;
  --color-gray: #444;
  --color-beige: #9B978F;
  --color-line: #ccc;

  --font-size-basic:14px;
  --font-size-small:13px;
  --font-size-sub:15px;
  --font-size-titlesub:20px;
}

html, body, div, span, a, strong, form, input, select, button, textarea, legend, fieldset, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, blockquote, address, p, th, td, caption, pre, nav, header {margin:0;padding:0;line-height:1.85;font-family:Eulyoo1945;font-size:var(--font-size-basic);font-weight:400;color:var(--color-primary);font-style:normal;box-sizing:border-box;}
ol, ul, li {list-style:none;}
blockquote, q {quotes:none}
blockquote:after, blockquote:before, q:after, q:before {content:"";content:none}
table {border-collapse:collapse;border-spacing:0}
a:link, a:visited {text-decoration:none}
a:hover, a:active {text-decoration:none}

html, body {overflow-x:hidden}
html.root {overflow-x:hidden;overflow-y:auto;}
html.lenis, html.lenis body {height:auto;scroll-behavior:smooth;}
.lenis.lenis-smooth {height:auto;scroll-behavior:auto !important;}
.lenis.lenis-smooth [data-lenis-prevent] {overscroll-behavior:contain;}
.lenis.lenis-stopped {overflow:hidden;}
.lenis.lenis-smooth iframe {pointer-events:none;}

.sr-only {position:absolute;overflow:hidden;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;color:transparent;padding:0;border:0;clip: rect(0, 0, 0, 0);}

/* intro */
#intro {position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:9999}
#intro .btn_intro {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;border:0 none;background:url('/resources/images/intro_bg.jpg') no-repeat 50% 50%;background-size:cover;cursor:pointer}
#intro .logo-intro {position:absolute;top:50%;left:50%;width:204px;height:auto;transform:translate(-50%, -50%);animation-name:introani; animation-timing-function:ease-in-out;animation-duration:2s}
@keyframes introani{
  from{
    /* transform:translate(-50%, -10%); */
    opacity:0;
  }
  to{
    /* transform:translate(-50%, -50%); */
    opacity:1;
  }
}
@media screen and (max-width:767px){ 
#intro .btn_intro {background:url('/resources/images/intro_bg_mo.jpg') no-repeat 50% 50%;background-size:cover;}
#intro .logo-intro {width:120px}
}

/* header */
#header {position:fixed;top:0;left:0;width:100%;background:var(--color-white);transition:top 0.5s ease-in-out, background 0.4s;z-index:999}
#header.up {top:-80px}
#header .inner {display:flex;align-items:center;justify-content:space-between;max-width:1360px;height:80px;margin:0 auto;padding:0 40px}
#header .inner>* {flex:1 1}
#header .inner .nav {order:-1}
#header .inner .nav ul {display:flex;gap:30px}
#header .inner .nav a span {font-size:var(--font-size-sub);color:var(--color-primary)}
#header .inner .logo {text-align:center}
#header .inner .logo a {display:inline-block;width:124px;height:40px;background:url('/resources/images/logo_b.png') no-repeat;background-size:124px auto}
#header .inner .lang-list ul {display:flex;gap:30px;justify-content:flex-end;}
#header .inner .lang-list a span {font-size:var(--font-size-sub);color:var(--color-primary)}
#header.top {background:transparent}
#header.top .inner .nav a span, #header.top .inner .lang-list a span {color:var(--color-white)}
#header.top .inner .logo a {display:inline-block;width:124px;height:40px;background:url('/resources/images/logo_w.png') no-repeat;background-size:124px auto}

.hamburger {display:none;position:absolute;top:13px;right:14px;overflow:visible;margin:0;padding:10px;cursor:pointer;border:0;background-color:transparent;transition-timing-function:linear;transition-duration:.15s;transition-property:opacity,filter;text-transform:none;}
.hamburger.active:hover,.hamburger:hover {opacity:.7}
.hamburger.active .hamburger-inner, .hamburger.active .hamburger-inner:after, .hamburger.active .hamburger-inner:before {background-color:var(--color-black)}
.hamburger-box {position:relative;display:inline-block;width:24px;height:18px}
.hamburger-inner {top:50%;display:block;margin-top:-2px}
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {position:absolute;width:24px;height:2px;transition-timing-function:ease;transition-duration:.15s;transition-property:transform;background-color:var(--color-black)}
.hamburger-inner:after, .hamburger-inner:before {display:block;content:""}
.hamburger-inner:before {top:-8px;transition:top 75ms ease .12s,opacity 75ms ease}
.hamburger-inner:after {bottom:-8px;transition: bottom 75ms ease .12s,transform 75ms cubic-bezier(.55,.055,.675,.19)}
.hamburger .hamburger-inner {transition-timing-function:cubic-bezier(.55,.055,.675,.19);transition-duration:75ms}

/* html.open, html.open body {overflow:hidden} */
html.open .hamburger .hamburger-inner {transition-delay:.12s;transition-timing-function:cubic-bezier(.215,.61,.355,1);transform:rotate(45deg)}
html.open .hamburger .hamburger-inner:before {top:0;transition: top 75ms ease,opacity 75ms ease .12s;  opacity: 0}
html.open .hamburger .hamburger-inner:after {bottom:0;transition:bottom 75ms ease,transform 75ms cubic-bezier(.215,.61,.355,1) .12s;transform:rotate(-90deg)}
#header.top .hamburger .hamburger-inner, #header.top .hamburger .hamburger-inner:after, #header.top .hamburger .hamburger-inner:before, #header.top .hamburger.active .hamburger-inner, #header.top .hamburger.active .hamburger-inner:after, #header.top .hamburger.active .hamburger-inner:before {background-color:var(--color-white)}
html.open .hamburger .hamburger-inner, html.open .hamburger .hamburger-inner:after, html.open .hamburger .hamburger-inner:before, html.open .hamburger.active .hamburger-inner, html.open .hamburger.active .hamburger-inner:after, html.open .hamburger.active .hamburger-inner:before {background-color:var(--color-black)}
html.open #header.top .hamburger .hamburger-inner, html.open #header.top .hamburger .hamburger-inner:after, html.open #header.top .hamburger .hamburger-inner:before, html.open #header.top .hamburger.active .hamburger-inner, html.open #header.top .hamburger.active .hamburger-inner:after, html.open #header.top .hamburger.active .hamburger-inner:before {background-color:var(--color-black)}

@media screen and (max-width:1360px) {
#header .inner {max-width:none}
}
@media screen and (max-width:1023px){ 
/* #header .inner {transition:height 0.2s cubic-bezier(0.075, 0.82, 0.165, 1), background 0.2s cubic-bezier(0.075, 0.82, 0.165, 1)} */
#header .inner {height:60px}
#header .inner .logo {position:absolute;top:16px;left:19px}
#header .inner .logo a, #header.top .inner .logo a {width:88px;height:28px;background-size:88px auto}
#header .inner .nav ul {display:block;padding:20% 0 10%;text-align:center;}
#header .inner .nav li {padding:18px 0}
#header .inner .nav a span {font-size:var(--font-size-titlesub)}
#header .inner .lang-list ul {justify-content:center;gap:0;margin-top:10%}
#header .inner .lang-list li {position:relative;padding:0 15px}
#header .inner .lang-list li:before {content:'';position:absolute;top:5px;left:0;width:1px;height:16px;background:var(--color-line)}
#header .inner .lang-list li:first-child:before {display:none} 
#header .inner .lang-list a {padding:10px}
#header .inner .nav a, #header .inner .lang-list a {pointer-events:none;}
#header .inner .nav ul, #header .inner .lang-list ul {transform:translateY(-5%);opacity:0;transition:none;}
#header .hamburger {display:block}

html.open #header .inner {display:block;height:100vh;background:var(--color-white);}
html.open #header .inner .nav ul, html.open #header .inner .lang-list ul {transform:translateY(0%);opacity:1;transition:transform 1s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.075, 0.82, 0.165, 1);}
html.open #header.top .inner .nav a span, html.open #header.top .inner .lang-list a span {color:var(--color-black)}
html.open #header.top .inner .logo a {background:url('/resources/images/logo_b.png') no-repeat;background-size:88px auto}
html.open #header .inner .nav a, html.open #header .inner .lang-list a {pointer-events:auto;} 
}

@media screen and (max-width:414px){
#header .inner .nav ul {padding:40% 0 20%}
#header .inner .lang-list ul {margin-top:20%}
}

/* section */
section {width:100%}
section a:link, section a:visited {text-decoration:underline}
section .title {font-size:30px;text-align:center;padding:142px 0 65px}
section .dot li div {position:relative;display:inline-block;padding-left:11px}
section .dot li div:before {content:'';position:absolute;top:10px;left:0;width:4px;height:4px;background:var(--color-primary);border-radius:4px;}
section p, section .dot li div {word-break:keep-all;}

@media screen and (max-width:1023px) {
section .title {font-size:30px;text-align:center;padding:93px 0 63px}
}

/* main */
#main {position:relative;width:100%;height:100vh;overflow:hidden}
#main .main-bg {position:relative;width:100%;height:100vh;opacity:0;background:url('/resources/images/main_bg.jpg') no-repeat 50% 50%;background-size:cover;}
#main .main-bg span {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background: linear-gradient(180deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 72.44%);}

@media screen and (max-width:1023px){ 
#main .main-bg {background:url('/resources/images/main_bg_mo.jpg') no-repeat 50% 50%;background-size:cover;}
}

/* team */
#con-team .inner {max-width:690px;padding:0 20px;margin:0 auto 88px}
#con-team .team-list li {padding-bottom:60px}
#con-team .team-list .chef {display:block;font-weight:600;color:var(--color-secondary);margin-bottom:19px}
#con-team .team-list p {text-align:justify}

@media screen and (max-width:1023px) {
#con-team .team-list li {padding-bottom:50px}
#con-team .team-list .chef {margin-bottom:17px}
}
@media screen and (max-width:767px){
#con-team .inner {margin:0 auto 50px}
}

/* menu */
#con-menu .menu-bg {display:flex;width:100%;margin:0 auto;    transform: translateY(-1px);}
#con-menu .menu-bg .menu-bg-inner {flex:1;position:relative;display:block;padding-bottom:36.8%;overflow:hidden}
#con-menu .menu-bg .menu-img {position:absolute;top:0;left:0;display:block;width:100%;height:100%}
#con-menu .menu-bg .bg-1 {background:url('/resources/images/menu_1.jpg') no-repeat 50% 50%;background-size:cover;}
#con-menu .menu-bg .bg-2 {background:url('/resources/images/menu_2.jpg') no-repeat 50% 50%;background-size:cover;}
#con-menu .inner {max-width:920px;padding:0 20px;margin:0 auto 144px;text-align:center}
#con-menu .title {padding-bottom:40px;}
#con-menu .menu-info p {padding:5px 0}
#con-menu .menu-restrictions .title-sub {font-size:var(--font-size-titlesub);color:var(--color-secondary);margin:54px 0 14px}
#con-menu .menu-restrictions p {color:var(--color-secondary)}
#con-menu .menu-list {display:flex;max-width:840px;margin:72px auto 0;text-align:center}
#con-menu .menu-list > div {flex:1;padding:12px 0;}
#con-menu .menu-list > div:first-child {border-right:1px solid var(--color-line);}
#con-menu .menu-list .title-sub {font-size:var(--font-size-sub);font-weight:600;margin-bottom:14px;}
#con-menu .menu-list li {padding:5px 0}

@media screen and (max-width:767px){
#con-menu .menu-bg {flex-direction: column;}
#con-menu .menu-bg .menu-bg-inner {padding-bottom:74.5%;}
#con-menu .inner {margin:0 auto 92px}
#con-menu .menu-info p br {display:none}
}

/* information */
#con-information {background:#FDFAF5}
#con-information .inner {max-width:920px;padding:0 20px;margin:0 auto;padding-bottom:150px;text-align:center}
#con-information .inner .title {padding:142px 0 8px}
#con-information .title-sub {font-size:var(--font-size-sub);font-weight:600;margin:56px 0 13px}
#con-information p {padding:4px 0}
#con-information .info-menu .title-sub {margin-bottom:16px}
#con-information .info-menu p {padding:0}
#con-information .info-menu h3 + p {padding-bottom:5px}
#con-information .info-menu p .name, #con-information .info-menu p .price {display:block;padding:3px 0 6px;}
#con-information .parking-address {padding:12px 0 17px}
#con-information .info-map {margin-top:54px}
#con-information .info-map p {position:relative;display:inline-block;padding:5px 0 0}
#con-information .info-map p img {width:100%;max-width:620px;vertical-align:top}
#con-information .info-map p .mo {display:none}
#con-information .info-map .btn_map {position:absolute;right:12px;bottom:12px;background:var(--color-primary);padding:3px 10px 1px;border-radius:40px}
#con-information .info-map .btn_map span {color:var(--color-white)}

@media screen and (max-width:767px){
#con-information .inner {padding-bottom:100px}
#con-information .inner .title {padding:90px 0 8px}
#con-information .title-sub {margin:46px 0 13px}
#con-information p br {display:none}
#con-information .info-map {margin-top:45px}
#con-information .info-map p .pc {display:none}
#con-information .info-map p .mo {display:block}
}

/* reservation */
#con-reservation .reservation-bg-inner {position:relative}
#con-reservation .reservation-bg {position:relative;display:block;padding-bottom:28.9%;background:url('../images/reservation_bg.jpg') no-repeat 50% 50%;background-size:cover;}
#con-reservation .reservation-bg-inner .title {position:absolute;top:50%;left:50%;width:204px;height:auto;transform:translate(-50%, -54%);color:var(--color-white)}
#con-reservation .reservation-info {display:flex;flex-wrap:wrap;max-width:1320px;padding:0 20px;margin:100px auto 0}
#con-reservation .reservation-info .summary {flex:1 100%;padding-bottom:50px}
#con-reservation .reservation-info .caution {flex:1 68%;padding-right:60px}
#con-reservation .reservation-info .cancel {flex:1 31%}
#con-reservation .reservation-info .online {flex:1 100%;padding-top:83px}
#con-reservation .reservation-info .title-sub {font-size:var(--font-size-sub);font-weight:600;padding:11px 0 12px;}
#con-reservation .reservation-info .dot li {padding:6px 0 4px}
#con-reservation .reservation-info .cancel .name, #con-reservation .reservation-info .rule {display:block}
.lang-en #con-reservation .reservation-info .cancel .name, .lang-en #con-reservation .reservation-info .rule {display:inline-block}
#con-reservation .reservation-info .cancel .rule {color:var(--color-secondary);padding-top:3px;}
#con-reservation .reservation-info .caution .btn_caution {font-weight:600}
#con-reservation .reservation-info .cancel p {padding:7px 0}
#con-reservation .reservation-info .online .title-sub {padding:11px 0 18px}
#con-reservation .reservation-info .btn-reservation {display:inline-block;padding:12px 32px;border-radius:3px;background:var(--color-primary)}
#con-reservation .reservation-info .btn-reservation span {color:var(--color-white)}

@media screen and (max-width:767px){
#con-reservation .reservation-bg {padding-bottom:69.4%}
#con-reservation .dot li div br {display:none}
#con-reservation .reservation-info {flex-direction:column;margin:52px auto 0}
#con-reservation .reservation-info .summary {padding-bottom:38px}
#con-reservation .reservation-info .caution {padding:0 0 32px 0}
#con-reservation .reservation-info .online {padding-top:30px}
#con-reservation .reservation-info .btn-reservation {display:block;padding:15px;text-align:center}
}

/* footer */
#footer {margin-top:200px}
#footer .inner {display:flex;gap:38px;align-items:center;flex-wrap:wrap;max-width:1320px;padding:22px 20px;margin:0 auto}
#footer .inner p span {font-size:var(--font-size-small);color:var(--color-gray)}
#footer .inner .privacy-policy a span {font-weight:600}
#footer .inner .instagram {order:1;flex-grow:1;text-align:right}

@media screen and (max-width:1023px) {
#footer {margin-top:120px}
#footer .inner {gap:1px;}
#footer .inner p {flex:0 30%;}
body.lang-en #footer .inner p {flex:0 45%;}
#footer .inner .instagram {margin-top:-40px;}
}

@media screen and (max-width:767px){
#footer {margin-top:98px}
#footer .inner {display:flex;gap:1px;flex-direction:column;}
#footer .inner .instagram {order:0;margin-bottom:5px}
#footer .inner .privacy-policy {margin:1px 0 14px}
}

/* error */
#error .inner {text-align:center;max-width:600px;margin:5% auto 2%}
#error .logo {display:inline-block;width:124px;height:40px;background:url('/resources/images/logo_b.svg') no-repeat}
#error .info {margin-top:48px}
#error .info h2 strong {line-height:1.67;}
#error .info h2 strong {display:block;font-size:24px}
#error .info p {padding:15px 0 23px}
#error .info p span {display:block;padding:4px 0;line-height:1.57;}
#error .contact {padding:15px 0;border-top:1px solid #ccc;border-bottom:1px solid #ccc}
#error .contact p span {display:block;line-height:1.57;padding:4px 0}
#error .linkmove p {display:flex;justify-content:center;align-items:center;gap:16px;padding:40px 0 17px}
#error .linkmove a {display:inline-block;width:184px;border:1px solid #222;text-decoration:none;padding:7px 0;}
#error .linkmove a span {display:block;line-height:1.3;}
#error footer {margin-top:20px}

@media screen and (max-width:767px){
#error .inner {margin:10% auto 8%;padding:0 20px}
#error .logo {width:88px;height:28px;background-size:88px auto}
#error .info {margin-top:36px}
#error .info h2 strong {font-size:20px;line-height:1.3;padding:5px 0;}
#error .info p {padding:15px 0 18px}
#error .info p span {font-size:13px;padding:2px 0 3px;line-height:1.55;}
#error .info p br {display:none}
#error .contact {padding:14px 0 10px}
#error .contact p span {font-size:13px;line-height:1.47;padding:4px 0}
#error .contact p span br {display:none}
#error .linkmove a {width:160px;}
#error .linkmove a span {font-size:13px;line-height:1.3;}
#error footer p {font-size:13px}
}



@media screen and (min-width:1024px) {
	/* Desktop */
}
@media screen and (min-width:768px) and (max-width: 1023px) {
	/* Tablet */
}
@media screen and (max-width:767px){ 
	/* Mobile */
}

