@charset "utf-8";

/* RESET */
html { color: #000; background: #f7f6f4; -webkit-font-smoothing: antialiased; font-weight: normal; letter-spacing: 0.1em; font-size: 14px; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, select, p, blockquote, th, td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0 }
fieldset, img { border: 0 }
address, button, caption, cite, code, dfn, em, input, optgroup, option, select, strong, textarea, th, var { font: inherit }
del, ins { text-decoration: none }
li { list-style: none }
caption, th { text-align: left }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
q:before, q:after { content: '' }
abbr, acronym { border: 0; font-variant: normal }
sup { vertical-align: baseline }
sub { vertical-align: baseline }
legend { color: #000 }
a { text-decoration: none; color: #333; }
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
::-moz-selection { background: rgba(150, 127, 96, 0.3); }
::selection { background: rgba(150, 127, 96, 0.3); }
a {/* タップ選択範囲の青色を透明に */
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	tap-highlight-color: rgba(0, 0, 0, 0);}

/* //////////////////////////////////////////////

COMMON

////////////////////////////////////////////// */
@font-face { font-family: 'icon'; src: url('../fonts/icon.eot?na1gw8'); src: url('../fonts/icon.eot?na1gw8#iefix') format('embedded-opentype'), url('../fonts/icon.ttf?na1gw8') format('truetype'), url('../fonts/icon.woff?na1gw8') format('woff'), url('../fonts/icon.svg?na1gw8#icon') format('svg'); font-weight: normal; font-style: normal; }
[class^="i-"], [class*=" i-"] { font-family: 'icon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.i-down:before { content: "\61"; }
.i-arrowD:before { content: "\64"; }
.i-arrowL:before { content: "\6c"; }
.i-arrowR:before { content: "\72"; }
.i-expand:before { content: "\65"; }
.i-fb:before { content: "\66"; }
.i-in:before { content: "\69"; }
.i-tw:before { content: "\74"; }
.i-ba:before { content: "\62"; font-size: 23px; }
.i-top:before { content: "\6c"; }
.i-arrowD, .i-arrowL, .i-arrowR { font-size: 26px; line-height: 70px; }

body, html { width: 100%; overflow-x: hidden; font-family: 'Lato', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Verdana, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 14px; line-height: 1.8; box-sizing: border-box; }
h1, h2, h4, h6 { font-family: 'Playfair Display', serif; }
h1 { font-size: 84px; line-height: 1; font-weight: 700; }
h2 { font-size: 30px; font-weight: 900; letter-spacing: initial; line-height: 1.2; }
h3 { font-size: 16px; color: #333; letter-spacing: .2em; margin-bottom: 30px;}
h3.display { font-family: 'Playfair Display', serif; font-size: 60px; font-weight: 700; line-height: 1.1; letter-spacing: inherit; }
h4 { font-size: 30px; font-weight: 900; letter-spacing: initial; line-height: 1.2; }
h5 { font-size: 12px; margin: 30px 0 0; }

.clip { position: absolute; }
.clip.mask { background: url(../img/img_clip.jpg); background-size: cover; width: 100%; height: 100%; }
.clip-body { background: #d0c1b1; }

.trim-title { font-family: 'Playfair Display', serif; font-weight: 700; }

.all { position: relative; }
.middle { vertical-align: middle; }
.table { display: table; width: 100%; height: 100%; }
.cell { display: table-cell; vertical-align: middle; }
.cover { display: block; width: 100%; height: 100%; }
.fR, .fL { box-sizing: border-box; }
.fR { padding-left: 5%; }
.fL { padding-right: 5%; } 
.wrapper { margin: 0 5%;}
.container { width: 1038px; box-sizing: border-box; margin: 60px auto 100px; }
.container p { font-size: 14px; letter-spacing: normal; }
.container p .by {  }
.container .guide-ja { font-weight: bold; font-size: 12px; margin: 2px 0 8px; letter-spacing: .2em; color: rgba(0, 0, 0, 0.8); }
.spacer { height: 200px; }
.spacerH { height: 100px; }

.bg-beige { background: #f2ede9; z-index: -1; }
.quote { position: relative; }
.quote:before { content: " “ "; display: inline-block; color: #bd9f77; position: absolute; left: -0.5em; top: -0.1em; font-size: 120%; }


.header { position: relative; width: 100%; height: 100px; padding: 10px 20px; z-index: 200; font-weight: 700; font-size: 12px; box-sizing: border-box;}
.header, .header > * { -webkit-transition: all .3s; transition: all .3s; }
.header .in >* { float: left; line-height: 100px; }
.header .inner { position: relative; }
.header .sitename { display: inline-block; vertical-align: middle; }
.header .sitename br { display: none; }
.toggle { display: none; }
.header .left { height: 100%; float: left; }
.header .left span { margin-left: 1.5em; }
.header .left a { display: block; }
.header .right { float: right; }
.header .right ul li { float: left; margin: 0 20px;}
.header .right ul li .blank:after { font-family: 'icon'; content: "\65"; font-size: 10px; padding-left: 0.3em; -webkit-font-smoothing: subpixel-antialiased; }
.header .btn.book { position: relative; float: left; display: block; margin: 25px 10px; vertical-align: middle; background: #b99877; overflow: hidden; line-height: 4em; z-index: 1; cursor: pointer; border-radius: 40px; -webkit-transition: all .3s ease-in-out .1s; transition: all .3s ease-in-out .1s; -webkit-backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; }
.header .btn.book a { display: block; padding: 0 28px; }
.header .btn.book span { color: #fff; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: all .3s ease-in-out 0s, color .3s ease-in-out .2s; transition: all .3s ease-in-out 0s, color .3s ease-in-out .2s; display: inline-block; }
.header .btn.book span.i {
	color: #f2ede9;
	padding: 0;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    top: 0;
    right: 20px;
    height: 100%;
    width: 1em;
    -webkit-transform: translateY(2px) scale(0.5);
    transform: translateY(2px) scale(0.5);
    line-height: 48px;
    opacity: 0;
    -webkit-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;
}
.header .btn.book:focus { outline: none; }
.header .btn.book::before, .header .btn.book::after { content: ''; position: absolute; height: 100%; width: 100%; bottom: 100%; left: 0; z-index: -1; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1); transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1); }
.header .btn.book::before { background: #926c4c; }
.header .btn.book::after { background: #fff; }

.header .nav_cont >* { float: left; }
.header .spnv { display: none; }
.logo_wrap { width: 100px; height: 100px; line-height: 100px; padding: 18px; box-sizing: border-box; float: left; }
.logo { width: 90px; height: 66px; text-indent: -9999px;}

.firstview { position: relative; }
.firstview .bg-beige { position: absolute; height: calc(100% + 10%); width: calc(50% + 5%); top: -20%; left: 0; }
.main { position: relative; width: 100%; height: calc(100% - 200px); }
.main .inner { overflow: hidden; position: absolute; height: 100%; width: calc(100% - 5%); float: right; top: 0; right: 0; font-size: 84px; }
.top.main .trim-title { position: absolute; width: calc(90% - 5%); right: 0; height: 3em; line-height: 84px; top: calc(50% + -2em);}
.top.main .trim-title span { height: 100%; top: 0; }
.trim-title { height: 100%; position: relative; }
.trim-title span { position: absolute; display: block; left: -10%; max-width: 1000px;}
.trim-title.front span { position: absolute; color: #fff; }
.trim-title.front { overflow: hidden;}
.trim-front { z-index: 3; }
.trim-back { z-index: 1; }
.trim-img { position: relative; z-index: 2; }
.top .scrl { text-align: center; color: #000; z-index: 10; }
.top .scrl a { display: block; }

.txtL, .txtR { display: table-cell; }
.txtL { width: 35%; padding-right: 5%; }
.txtR { width: 60%; }
.txtL .inner, .txtR .inner { position: relative; margin: 50px 0; }
.head span { display: block; margin: -30px 0 30px; font-size: 12px; text-transform: uppercase; font-weight: 700; }
.head h2 { padding-bottom: 100px; }
.head h2:after { content: ""; position: absolute; display: block; width: 60px; height: 1px; background: #bd9f77; bottom: 0; }
.txtL .sub h4 { font-size: 20px; }
.button { position: relative; display: block; margin: 50px 0 0; padding: 0 25px; width: 210px; height: 60px; line-height: 60px; color: #fff; box-sizing: border-box; background: #000; float: right; font-size: 12px; font-weight: 900; letter-spacing: 0.2em; text-transform: uppercase; text-align: left!important;}
.button:after { content: ""; display: block; position: absolute; top: 50%; right: -30px; width: 60px; height: 1px; background: #e4ddd4; }

.img_holder { display: block; position: relative; }
.img_holder .cover { position: absolute; }
.img_holder .cover:nth-child(1) { z-index: 2; }
.img_holder .cover:nth-child(2) { z-index: 1; }
.img_holder .imgS { width: 45%; height: 85%; }
.img_holder .imgM { width: 55%; height: 100%; top: 15%; }
.img_holder .imgL { width: 100%; height: 80%; position: relative; }
.img_holder .imgL.top { position: absolute; }
.img_holder .top { margin-top: 5%;}
.img_holder .left { left: 0; }
.img_holder .right { right: 0; }
.img_holder .pdR { right: 5%; }
.img_holder .pdL { left: 5%; }
.img_holder .bg-beige { position: absolute; height: 100%; width: calc(50% + 10%); top: 0; }
.img_holder .bg-beige.forflip { height: 80%; top: initial; bottom: 5%; }
.img_holder.double { margin-bottom: 80px; }
.img_holder.double .imgs { position: absolute; }
.img_holder.double.flip .imgS { height: 75%; }
.img_holder.double.flip .imgM { height: 80%; }
.img_holder.single { /*margin-top: -50px;*/ margin-bottom: -10px; }
.img_holder.single .bg-beige { height: 80%; }
.info_dl { margin: 30px 30px 0 0; }
.info_dl dd, .info_dl dt{ padding: 6px 0; letter-spacing: .05em; line-height: 1.5; margin-bottom: 12px; float: left; }
.info_dl dd.no-mb, .info_dl dt.no-mb { margin-bottom: 0; padding-bottom: 0; }
.info_dl dt { text-transform: uppercase; font-weight: bold; font-size: 11px; color: rgba(0, 0, 0, 0.4); letter-spacing: 1px; width: 90px; clear: both; box-sizing: border-box; }
.info_dl dd { font-size: 14px; width: 73%; }
.info_dl dd span { color: rgba(0, 0, 0, 0.4); font-size: 11px; font-weight: bold; }
.info_dl dd a { text-decoration: underline; font-weight: bold; padding: 3px; }
.topinfo { position: relative; width: 100%; }
.topinfo .inner { width: 35%; display: inline-block; float: left;}
.topinfo .button { position: absolute; right: 0; bottom: 0; }

.footer { position: relative; background: #22201f; color: #fff; }
.footer .in { height: 60vh; float: left; position: relative; display: table;}
.footer .belt { background: #bd9f77; padding: 50px;}
.footer .left { width: calc(50% - 5%); }
.footer .right { width: calc(50% + 5%); }
.footer .links { max-width: 320px; display: table-cell; vertical-align: middle; padding: 0 160px 0 100px; }
.footer .links li { max-width: 300px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); width: 100%; }
.footer .links li a { display: block; line-height: 70px; color: #fff; font-size: 12px; clear: right; }
.footer .links li a p { float: right; display: inline-block; }
.footer .links li a p:after { font-family: 'icon'; content: "\65"; opacity: .14; padding-left: 10px; }
.footer .links li a span { vertical-align: middle; text-align: left; display: inline-block; }
.footer .imgarea { position: absolute; width: 100%; height: 100%; right: 0; top: -70px; }
.footer .imgarea .inner { position: absolute; width: 100%; height: 100%; top: 0; }
.footer .imgarea .trim-img { width: 100%; height: 100%; }
.footer .imgarea .trim-title { font-size: 70px; line-height: 1em; }
.footer .imgarea .trim-title span { top: calc(50% - 1em); }
.footer .imgarea .trim-title.front { color: #f9f9f5; }
.footer .imgarea .trim-title.back { color: #bd9f77; }
.footer .imgarea .button { position: absolute; bottom: 80px; left: 60%; margin: 0; z-index: 10; }
.footer_bottom { color: #4e4d4c; font-size: 12px; font-weight: 700; padding: 0 80px 50px; }
.footer_bottom > * { line-height: 100px; }
.footer_bottom .copyright { float: left; width: 50%; }
.footer_bottom .svg { fill: #4e4d4c; }
.footer_bottom .goup { display: none; }
.sns { float: right; width: 50%; text-align: right;}
.sns p { display: inline-block; }
.sns ul { display: inline-block; margin-left: 16px; }
.sns li { display: inline-block; font-size: 20px; font-size: 16px; margin: 0 8px; }
.sns li a { display: block; }

/* slider custom */
.slider_top { position: relative; height: 100%; float: right; width: calc(90% - 5%); z-index: 2; }
.slider_top .clip-body .clip { z-index: 101; }



.slider { width: 100%; position: relative; height: 100%; }
.slider .slide {}
/* HOME FIRSTVIEW */
.item .bg-img { display: table-cell; width: 100%; height: 100%; z-index: 1; }
.slider-progress { width: 50px; background: #eee9e3; position: absolute; z-index: 1; bottom: 20%; left: -10%;}
.slider-progress .progress { width: 100%; max-width: 100%; height: 2px; background: #b99877; -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(0); transform: scaleX(0); }
.slider_top .item { position: relative; }

/* .slideT-wrap.clip-body, */
.slideM-wrap.clip-body { display: none; }
.slideT-wrap/* ,
.slideM-wrap */ { position: absolute; height: 100%; width: 100%; z-index: 110; -webkit-transition: all .3s 1s; transition: all .3s 1s; }
.slideT-wrap.cliped { z-index: 0; opacity: 0; -webkit-transition: opacity .3s 1s, z-index .3s 1.1s; transition: opacity .3s 1s, z-index .3s 1.1s; }
/* .slideM-wrap.cliped { z-index: 0; opacity: 0; -webkit-transition: opacity .3s .5s, z-index .3s .7s; transition: opacity .3s .5s, z-index .3s .7s; } */

.sliderM { height: 100%; width: 100%;}
.sliderM .slick-arrow { position: absolute; width: 50%; height: 100%; top: 0; border: none; outline: none; cursor: pointer; background: rgba(255, 255, 255, 0); -webkit-transition: opacity .2s ease-in-out .2s, display .2s ease-in-out; transition: opacity .2s ease-in-out .2s, display .2s ease-in-out; opacity: 0; overflow: visible; }
.sliderM .slick-arrow span { display: inline-block; padding: 0 20px; -webkit-transition: all .3s ease-in-out .05s; transition: all .3s ease-in-out .05s;}
.sliderM .slick-prev { left: 0; text-align: left; }
.sliderM .slick-next { right: 0; text-align: right; }
.sliderM .slick-list .slick-slide {
	-webkit-transition: opacity .3s ease-in-out 0.65s, transform .3s ease-in 0s;
	-webkit-transition: opacity .3s ease-in-out 0.65s, -webkit-transform .3s ease-in 0s;
	transition: opacity .3s ease-in-out 0.65s, -webkit-transform .3s ease-in 0s;
	transition: opacity .3s ease-in-out 0.65s, transform .3s ease-in 0s;
	transition: opacity .3s ease-in-out 0.65s, transform .3s ease-in 0s, -webkit-transform .4s ease-in-out 0s;
}
.sliderM .slick-list .slick-slide.slick-current.slick-active {
	-webkit-transition: opacity .3s ease-in-out 0.3s, transform .4s ease-in-out 0s;
	-webkit-transition: opacity .3s ease-in-out 0.3s, -webkit-transform .4s ease-in-out 0s;
	transition: opacity .3s ease-in-out 0.3s, -webkit-transform .4s ease-in-out 0s;
	transition: opacity .3s ease-in-out 0.3s, transform .4s ease-in-out 0s;
	transition: opacity .3s ease-in-out 0.3s, transform .4s ease-in-out 0s, -webkit-transform .4s ease-in-out 0s;	
}
.sliderM .slick-list .slick-slide.slick-current.slick-active:before { 
	opacity: 0;	
	 }
.sliderM .slick-arrow.slick-disabled { opacity: 0; display: none !important; }

.slick-list.hoverR .slick-slide { -webkit-transform: translate3d(-70px, 0, 0); transform: translate3d(-70px, 0, 0); }
.slick-list.hoverL .slick-slide { -webkit-transform: translate3d(70px, 0, 0); transform: translate3d(70px, 0, 0); }

.slick-list.hoverR.slick-disabled .slick-slide,
.slick-list.hoverL.slick-disabled .slick-slide { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-list.hoverR.clicked .slick-slide, 
.slick-list.hoverL.clicked .slick-slide { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-dots { position: absolute; bottom: -30px; display: block; width: 100%; padding: 0; text-align: right; }
.slick-dots li { position: relative; display: inline-block; width: 10px; height: 10px; margin: 0 3px; padding: 0; cursor: pointer; vertical-align: middle; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 6px; height: 6px; cursor: pointer; color: transparent; border: 0; outline: none; background: #b99877; border-radius: 50%; opacity: .5; transition: all .3s .1s; }
.slick-dots li.slick-active button { opacity: 1; }

.gallery { box-sizing: border-box; padding: 0 0 0 5%; }
.gallery .float_box { padding: 5% 0 0; margin-bottom: 0; }
.gallery .float_box .boxes { height: 100%; }
.gallery .float_box .flL { height: 60%; top: 50%; margin-top: -15%;}
.gallery .float_box p { margin: 20px 0 0 }

/* //////////////////////////////////////////////

███████╗██╗   ██╗██████╗     ██████╗  █████╗  ██████╗ ███████╗███████╗
██╔════╝██║   ██║██╔══██╗    ██╔══██╗██╔══██╗██╔════╝ ██╔════╝██╔════╝
███████╗██║   ██║██████╔╝    ██████╔╝███████║██║  ███╗█████╗  ███████╗
╚════██║██║   ██║██╔══██╗    ██╔═══╝ ██╔══██║██║   ██║██╔══╝  ╚════██║
███████║╚██████╔╝██████╔╝    ██║     ██║  ██║╚██████╔╝███████╗███████║
╚══════╝ ╚═════╝ ╚═════╝     ╚═╝     ╚═╝  ╚═╝ ╚═════╝ ╚══════╝╚══════╝
                                                                      

////////////////////////////////////////////// */
.sub .scrl a { color: #bcb09f; font-size: 11px; text-transform: uppercase; }
.sub .scrl { position: absolute; height: 100%; width: calc(100% - 5%); right: 0; top: 0; z-index: 100; }
.sub .scrl .in { position: absolute; height: 100%; width: 75%; right: 0; }
.sub .scrl ul { position: absolute; top: calc(50% + 100px); left: -20%; }
.sub .scrl ul li { line-height: 30px; letter-spacing: inherit; font-weight: 700;}
.sub .main { position: relative; width: 100%; height: 500px; margin: 0 0 200px;}
.sub .main .trim-img { height: 100%; float: right; width: 75%; z-index: 2; top: 50px; }
.sub .main .trim-title { position: absolute; width: 75%; right: 0; }
.sub .main .trim-title span { height: 1em; top: calc(50% - 0.2em); left: -20%; }
.sub .firstview .bg-beige { top: 0; height: calc(100% + 100px);}

.slider_about { position: relative; margin-bottom: 20%; }
.slider_about .img_holder { height: 100%; }
.slider_about .trim-title { position: absolute; height: 100%; top: 0px; width: 100%; font-size: 70px; line-height: 1em; }
.slider_about .trim-area { position: absolute; width: 55%; margin-top: 0; height: 100%; top: 15%; left: 5%; }
.slider_about .trim-title span { display: block; width: 80%; left: 90%; top: 79%; }
.slider_about .trim-title.front span { color: #f2ede9; }
.slider_about .trim-title.back span { color: #bd9f77; }

.float_box { position: relative; width: 100%; z-index: 0; padding-bottom: 5%; margin-bottom: 5%; }
.float_box .boxes { position: absolute; height: 100%; }
.float_box .flL { width: 50%; left: 0; }
.float_box .flR { width: 55%; right: 0; padding-left: 5%; box-sizing: border-box;}
.float_box .lower { top: 15%; }
.float_box .txt .inner { max-width: 500px; padding: 0 100px; }
.float_box .txt h3 { position: relative; width: 80%; padding: 0 0 40px; margin: 0 0 40px;}
.float_box .txt h3:after { content: ""; position: absolute; display: block; width: 60px; height: 1px; background: #bd9f77; bottom: 0; }
.link_social { margin: 0 auto 140px; }
.link_social li { float: left; margin: 0 20px; line-height: 60px; }
.link_social li h2 { line-height: 60px; }
.link_social .button { margin: 0; }

.reservation .inner { text-align: center; margin: 0 auto 80px; }
.reservation .inner .button { margin: 50px auto; float: none; }
.reservation .inner h2 { padding-bottom: 0px; }
.reservation .inner h2:after { display: none; }
.reservation .inner .telephone { font-family: 'Playfair Display', serif; font-size: 30px; font-weight: 700; line-height: 1.1; color: #333; }
.reservation .head span { margin-top: 0; }
.reservation-list { display: flex; justify-content: space-around; }
.reservation-list.two-cols li { width: 50%; }

.footer/* ._sub */ .in { height: 30vw; }
.footer/* ._sub */ .imgarea .trim-title span { top: calc(50% - 1.5em); width: 70%; font-size: 60px; line-height: 1em;}

.menu_list { position: relative; width: 90%; margin: 0 auto 10%; padding: 0 50px; box-sizing: border-box; max-width: 1500px; }
.menu_list .bg-beige { position: absolute; width: 100%; height: 95%; top: 5%; left: 0; }
.menu_list .bg-beige.shift { height: calc(80% - 150px); }
.menu_list > ul  { margin: 0 auto; }
.menu_list > ul > li { width: 49%; display: inline-block; padding: 0 50px; box-sizing: border-box;}
.menu_list .thumb { position: relative; width: 100%; height: 300px; }
.menu_list .data { margin: 30px 0 70px; }
.menu_list h3 { margin: 30px 0 15px; }
.menu_list p { max-width: 500px; }
.ex_head { padding: 0 5% 5%; margin: 5% 0 0; }
.ex_head span, .ex_head .note, .ex_content .memo { font-size: 12px; color: #454341; font-weight: bold; }
.ex_head .note { float: right; }
.ex_content .memo { margin: 10px 0 40px; }
.lineup { padding: 0 20px; }
.lineup li { display: block; float: left; width: 100%; letter-spacing: 0; color: #333; margin: .15em 0; }
.lineup li:before { display: block; float: left; content: "・"; color: #bd9f77; font-size: 16px; font-weight: bold; margin-right: 0.5em;}
.spec_table { background: #fff; width: 1140px; margin: 0 auto 10%; padding: 5% 10% 6%; box-sizing: border-box; }
.spec_table table { width: 100%; margin: 0 auto; }
.spec_table th, .spec_table td { padding: 20px 0; color: #333; }
.spec_table th { width: 30%; border-bottom: 2px solid #e6dbcd; font-weight: bold; }
.spec_table td { width: 70%; border-bottom: 1px solid #e6dbcd; }

.txtR .inner .info_dl { margin: 0; }
.contact .txtL { width: 50%; }
.contact .txtR { width: 40%; }
.map { width: 70%; height: 100%; background: #bd9f77; }
.map_holder.double { margin-bottom: 300px; }
.map_holder .imgS.right { top: 50%; }
.map_area { position: relative; margin: 0 0 160px; }
.map_txt { position: absolute; height: 100%; width: 30%; top: 0; left: 60%; pointer-events: none; }
.map_txt h3.display { margin-bottom: 0; font-size: 3.8vw; }
.map_txt .button { float: left; width: 250px; pointer-events: auto; }
.float_box .info_dl dd, .float_box .info_dl dt { padding: 3px 0; margin-bottom: 0; }
.mail_box { display: table; position: relative; width: 100%; height: 50vh; text-align: center; background: #fff; }
.mail_box li { display: table-cell; vertical-align: middle; width: 50%; height: 100%; box-sizing: border-box; }
.mail_box li.border:after { content: ""; position: absolute; display: block; width: 1px; height: 200px; top: calc(50% - 100px); left: 50%; background: #bcbcbb; z-index: 3;}
.mail_box li a { position: relative; display: block; z-index: 2; }
.mail_box li .cover { position: absolute; top: 0; left: 0; z-index: 1; opacity: 0; -webkit-transition: all .6s ease-out; transition: all .6s ease-out; }
.mailto p { letter-spacing: normal; font-size: 13px; font-weight: bold; color: rgba(0,0,0,0.5); -webkit-transition: all .3s ease-out .3s; transition: all .3s ease-out .3s; }
.mailto h2 {  -webkit-transition: all .3s ease-out .3s;  transition: all .3s ease-out .3s;  }
.mailto h6 { letter-spacing: normal; font-size: 18px; border-bottom: 3px solid #bd9f77; display: inline-block; line-height: 1.4; -webkit-transition: all .3s ease-out .3s; transition: all .3s ease-out .3s; }
.mailto .vr { display: block; width: 1px; background: #bd9f77;  margin: 30px auto; height: 0; -webkit-transition: all .2s ease .1s; transition: all .2s ease .1s; }

/* ////////////////////////////////////////////////////////////////////////////////////////////

slick slider

//////////////////////////////////////////////////////////////////////////////////////////// */
/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; height: 100%;}
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; height: 100%; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slider_top .slick-initialized .slick-slide { display: table; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slick-arrow { position: absolute; z-index: 100; }

/* ////////////////////////////////////////////////////////////////////////////////////////////

*  ABOUT SLIDER

//////////////////////////////////////////////////////////////////////////////////////////// */
.delaySlider_holder { position: relative; width: 100%; height: 100%; top: 0; }
.delaySlider { position: relative; z-index: 1; height: 100%; zoom: 1; }
.delaySlider:before, .delaySlider:after { content: ""; display: table; }
.delaySlider:after { clear: both; }
.delaySlider .dlslider { position: absolute; width: 100%; height: 100%; margin: 0; text-align: center; overflow: hidden; }
.delaySlider .dlWrap.left { height: 100%; width: 55%; top: 15%; left: 5%; z-index: 3; background: #bd9f77; }
.delaySlider .dlWrap.right { height: 85%; width: 45%; right: 0; z-index: 2; }
.delaySlider .figure { position: relative; border: 0 solid #958b46; overflow: hidden; }
.delaySlider .figure:after { content: ''; position: absolute; width: 110%; height: 100%; left: 0; top: 0; background: rgba(120, 128, 121, 0.85); opacity: 0; filter: alpha(opacity=0); }
.delaySlider .figure, .delaySlider .figure:after, .dlslider .item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1; }
.delaySlider .figure { cursor: pointer; }

/* controll */
.mkgctrl { position: absolute; left: 5%; z-index: 100; height: 100%; width: 55%; top: 15%; }
.mkgctrl ul { position: absolute; bottom: 0; left: 0; }
.mkgctrl li { float: left; }
.mkgctrl a { z-index: 3; display: block; width: 80px; height: 80px; text-align: center; background: #000; color: #fff; -webkit-transition: all .4s; transition: all .4s; cursor: pointer; }
.mkgctrl a span { line-height: 80px; display: inline-block; -webkit-transition: all .4s; transition: all .4s; }
.mkgctrl a.next { border-left: 1px solid #fff; }

/* ////////////////////////////////////////////////////////////////////////////////////////////

PAGE MOVING

//////////////////////////////////////////////////////////////////////////////////////////// */
.locker { position: fixed; left: 0; top: 0; width: 200%; height: 100%; transform: scaleX(0); transform-origin: left; }
.locker.room1 { background: #967859; z-index: 302; }
.locker.room2 { background: #fff; z-index: 300; }
.moving .room1 { -webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out; transform: scaleX(1); left: 100%; }
.moveend .room1 { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
.moving .room2 { -webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out; transform: scaleX(1); background: #fff;}
.moveend .room2 { -webkit-transition: all 0.9s cubic-bezier(0.45, 0.05, 0.55, 0.95); transition: all 0.9s cubic-bezier(0.45, 0.05, 0.55, 0.95); transform: scaleX(0); transform-origin: right;}
/* ////////////////////////////////////////////////////////////////////////////////////////////

PAGE LOADING

//////////////////////////////////////////////////////////////////////////////////////////// */
#loadbody, header { z-index: 310; }
.loader { display: none; position: fixed; height: 100%; right: 0; top: 0; width: 100%; z-index: 301; overflow: hidden; opacity: 1; }
.is_waiting .loader,
.is_loading .loader { display: block; background: #fff; height: 100%; }
.is_loaded .loader { -webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out; opacity: 0; }

.loader svg { display: none; }
.is_loading .loader svg,
.is_waiting .loader svg {display: block; position: fixed; width: 200px; height: 200px; left: 50%; top: 50%; margin: -100px 0 0 -100px; z-index: 1000; opacity: 1; }
.ie9 .loader, 
.ie9 .loader svg { display: none!important; }

.loader .st { fill: none; stroke: #ab9e91; opacity: 0; stroke-dashoffset: 0; }
.logo_t .st { clip-path: url(#logo_t); }
.logo_h .st { clip-path: url(#logo_h); }
.logo_e .st { clip-path: url(#logo_e); }
.logo_r .st { clip-path: url(#logo_r); }
.logo_i .st { clip-path: url(#logo_i); }
.logo_n .st { clip-path: url(#logo_n); }
.logo_g .st { clip-path: url(#logo_g); }
.logo_o .st { clip-path: url(#logo_o); }
.loading .loader svg { display: block; opacity: 1; }
.loader .st1 { stroke-width: 3; stroke-dasharray: 13; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .1s infinite; }
.loader .st2 { stroke-width: 3; stroke-dasharray: 5; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .2s infinite; }
.loader .st3 { stroke-width: 3; stroke-dasharray: 18; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .3s infinite; }
.loader .st4 { stroke-width: 3; stroke-dasharray: 14; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .4s infinite; }
.loader .st5 { stroke-width: 3; stroke-dasharray: 27; animation: loading_o 4s cubic-bezier(0.175, 0.885, 0.320, 1) .5s infinite; }
.loader .st6 { stroke-width: 3; stroke-dasharray: 13; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .6s infinite; }
.loader .st7 { stroke-width: 3; stroke-dasharray: 10; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .7s infinite; }
.loader .st8 { stroke-width: 3; stroke-dasharray: 14; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .8s infinite; }
.loader .st9 { stroke-width: 1.7; stroke-dasharray: 6; animation: loading_i 4s cubic-bezier(0.175, 0.885, 0.320, 1) .9s infinite; }
.loader .st10 { stroke-width: 3; stroke-dasharray: 14; animation: loading_l 4s cubic-bezier(0.175, 0.885, 0.320, 1) .10s infinite; }
.loader .st11 { stroke-width: 3; stroke-dasharray: 21; animation: loading_o 4s cubic-bezier(0.175, 0.885, 0.320, 1) .11s infinite; }
.loader .st12 { stroke-width: 3; stroke-dasharray: 34; animation: loading_o 4s cubic-bezier(0.175, 0.885, 0.320, 1) .12s infinite; }
.loader .st13 { stroke-width: 3; stroke-dasharray: 30; animation: loading_o 4s cubic-bezier(0.175, 0.885, 0.320, 1) .13s infinite; }
.loader .st14 { stroke-width: 3; stroke-dasharray: 36; animation: loading_o 4s cubic-bezier(0.175, 0.885, 0.320, 1) .14s infinite; }
@keyframes loading_l {
	0%, 10% { stroke-width: 0; stroke-dashoffset: 20; opacity: 0; }
	50% { stroke-width: 3; stroke-dashoffset: 0; opacity: 1; }
	90%, 100% { stroke-width: 3; stroke-dashoffset: -20; opacity: 0; }
}
@keyframes loading_i {
	0%, 10% { stroke-width: 0; stroke-dashoffset: 6; opacity: 0; }
	50% { stroke-width: 1.7; stroke-dashoffset: 0; opacity: 1; }
	90%, 100% { stroke-width: 1.7; stroke-dashoffset: -6; opacity: 0; }
}
@keyframes loading_o {
	0%, 10% { stroke-width: 0; stroke-dashoffset: 36; opacity: 0; }
	50% { stroke-width: 3; stroke-dashoffset: 0; opacity: 1; }
	90%, 100% { stroke-width: 3; stroke-dashoffset: -36; opacity: 0; }
}

/* //////////////////////////////////////////////

404

////////////////////////////////////////////// */
.error .sub .main { margin: 0 0 130px; }

/* //////////////////////////////////////////////

██╗  ██╗ ██████╗ ██╗   ██╗███████╗██████╗ 
██║  ██║██╔═══██╗██║   ██║██╔════╝██╔══██╗
███████║██║   ██║██║   ██║█████╗  ██████╔╝
██╔══██║██║   ██║╚██╗ ██╔╝██╔══╝  ██╔══██╗
██║  ██║╚██████╔╝ ╚████╔╝ ███████╗██║  ██║
╚═╝  ╚═╝ ╚═════╝   ╚═══╝  ╚══════╝╚═╝  ╚═╝
                                          

////////////////////////////////////////////// */
@media screen and (min-width:769px) {	
	.header .right ul li { -webkit-transition: all .5s; transition: all .5s; }
	.header .right ul li:hover { opacity: .5; }

	.header .btn.book:hover { background: #fff; -webkit-transition: all .3s .6s; transition: all .3s .6s; }
	.header .btn.book:hover::before, .header .btn.book:hover::after { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
	.header .btn.book:hover::after { -webkit-transition-delay: 0.175s; transition-delay: 0.175s; }
	.header .btn.book:hover span { color: #000; -webkit-transform: translateX(-7px); transform: translateX(-7px); padding: 0 10px; }
	.header .btn.book:hover span.i {
		color: #000;
		-webkit-transform: translateY(0) scale(0.7);
		transform: translateY(0) scale(0.7);
		opacity: 1;
		-webkit-transition: width .3s ease-in-out 0s, opacity .3s ease-in-out .3s, -webkit-transform .3s ease-in-out .2s;
		transition: opacity .3s ease-in-out .3s, -webkit-transform .3s ease-in-out .2s;
		transition: transform .3s ease-in-out .2s, opacity .3s ease-in-out .3s;
		transition: transform .3s ease-in-out .2s, opacity .3s ease-in-out .3s, -webkit-transform .3s ease-in-out .2s;
		font-size: 10px;
	}

	.sub .scrl a { -webkit-transition: all .5s; transition: all .5s; }
	.sub .scrl a:hover { color: #333; }

	
	.mkgctrl a.next:hover span { -webkit-transform: translateX(10px); transform: translateX(10px); }
	.mkgctrl a.prev:hover span { -webkit-transform: translateX(-10px); transform: translateX(-10px); }
	.mkgctrl a.next.mkgctrl a.next.clicked:hover span { -webkit-transform: translateX(20px); transform: translateX(20px); }
	.mkgctrl a.prev.clicked:hover span { -webkit-transform: translateX(-20px); transform: translateX(-20px); }
	.mail_box.on li p,
	.mail_box.on li h2 { color: #fff; }
	.mail_box.on li h6 { color: #fff; }
	.mail_box li.hover .cover { opacity: 1; }
	.mail_box li.hover h6 { color: #bd9f77; }
	.mail_box li.hover .vr { height: 50px; }

	.button { -webkit-transition: .3s ease .2s; transition: .3s ease .2s; }
	.button:after { -webkit-transition: .3s ease; transition: .3s ease; -webkit-transform-origin: right; transform-origin: right; }
	.button { background-image: -webkit-linear-gradient(top, #000, #000 50%, #fff 50%, #fff); background-image: linear-gradient(to bottom, #000, #000 50%, #fff 50%, #fff); background-position: 0 0; background-size: 100% 200%;}
	.button.enter { color: #000; background-position: 0 100%; padding: 0 40px; }
	.button.enter:after { background: #000; width: 80%; right: 0; }
	.button.enter.out:after { width: 80%; right: 10%; background: #000; }
	.button.out:after { width: 20%; -webkit-transform-origin: left; transform-origin: left; right: 100%; background: #000; }
	.button.leave:after { width: 0%; -webkit-transform: translateX(-30px); transform: translateX(-30px); right: initial; left: 0; -webkit-transition: width .3s ease 0s, right .2s ease .6s, left .2s ease .6s, background .2s ease .3s, -webkit-transform .3s ease 0s; transition: width .3s ease 0s, right .2s ease .6s, left .2s ease .6s, background .2s ease .3s, -webkit-transform .3s ease 0s; transition: transform .3s ease 0s, width .3s ease 0s, right .2s ease .6s, left .2s ease .6s, background .2s ease .3s; transition: transform .3s ease 0s, width .3s ease 0s, right .2s ease .6s, left .2s ease .6s, background .2s ease .3s, -webkit-transform .3s ease 0s; }

	.mkgctrl a.next.clicked:hover, .mkgctrl a.next.clicked:hover,
	.mkgctrl a.prev.clicked:hover, .mkgctrl a.prev.clicked:hover { background: #564a39; }

	.sliderM.hoverL .slick-list .slick-slide { -webkit-transform: translate3d(60px, 0, 0) !important; transform: translate3d(60px, 0, 0) !important; }
	.sliderM.hoverR .slick-list .slick-slide { -webkit-transform: translate3d(-60px, 0, 0) !important; transform: translate3d(-60px, 0, 0) !important; }

	.sliderM:hover .slick-prev:hover { opacity: 1; }
	.sliderM:hover .slick-next:hover { opacity: 1; }
	.sliderM:hover .slick-prev:hover span { -webkit-transform: translateX(-30px); transform: translateX(-30px);}
	.sliderM:hover .slick-next:hover span { -webkit-transform: translateX(30px); transform: translateX(30px);}
	/* .sliderM .slick-list .slick-slide { opacity: .5; } */
	.sliderM .slick-list .slick-slide { position: relative; }
	.sliderM .slick-list .slick-slide:before {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		opacity: .5;
		background: #fff;
		-webkit-transition: opacity .3s ease-in-out .2s;
		-webkit-transition: opacity .3s ease-in-out .2s;
		transition: opacity .3s ease-in-out .2s;
		transition: opacity .3s ease-in-out .2s;
		transition: opacity .3s ease-in-out .2s;
	}

	.footer .links li a span, .footer .links li a p:after { -webkit-transition: .3s ease; transition: .3s ease;  }
	.footer .links li:hover a span { -webkit-transform: translateX(10px); transform: translateX(10px); }
	.footer .links li:hover a p:after { opacity: 1; }
	.footer_bottom .sns li a { -webkit-transition: .3s ease; transition: .3s ease; }
	.footer_bottom .sns li a:hover { color: #ccc; }
}

/* //////////////////////////////////////////////

██████╗ ███████╗███████╗██████╗  ██████╗ ███╗   ██╗███████╗██╗██╗   ██╗███████╗
██╔══██╗██╔════╝██╔════╝██╔══██╗██╔═══██╗████╗  ██║██╔════╝██║██║   ██║██╔════╝
██████╔╝█████╗  ███████╗██████╔╝██║   ██║██╔██╗ ██║███████╗██║██║   ██║█████╗  
██╔══██╗██╔══╝  ╚════██║██╔═══╝ ██║   ██║██║╚██╗██║╚════██║██║╚██╗ ██╔╝██╔══╝  
██║  ██║███████╗███████║██║     ╚██████╔╝██║ ╚████║███████║██║ ╚████╔╝ ███████╗
╚═╝  ╚═╝╚══════╝╚══════╝╚═╝      ╚═════╝ ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═══╝  ╚══════╝
                                                                               

////////////////////////////////////////////// */
@media screen and (max-width:1280px) { 
	.footer .in { height: 40vw; }
}
@media screen and (max-width:1038px) {
	.header { height: 90px; padding: 0 10px; }
	.header .in >* { line-height: 90px; }
	.header .left span { margin: 0; width: 68% }
	.header .sitename { line-height: 1.2em; }
	.header .sitename br { display: block; }
	.header .right ul li { margin: 0 1vw; }
	.logo_wrap { width: 90px; height: 90px; line-height: 90px; }
	.header .nav, .overlay ,.toggle span { -webkit-transition: all 0.3s; transition: all 0.3s; }
	.container { width: 100%; padding: 0 5vw;}
	.top.main .trim-title span { font-size: 8vw; line-height: 1em; }
	.trim-title span, .footer .imgarea .trim-title { font-size: 6vw; line-height: 0.9em; }
	.footer .links { padding: 0 80px; }
	.menu_list > ul > li { padding: 0 3vw; }
	.spec_table { width: 90%; }
}

/* Tablet */
@media screen and (max-width:768px) {	

	body, html {-webkit-tap-highlight-color: rgba(0, 0, 0, 0); tap-highlight-color: rgba(0, 0, 0, 0); -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }
	.header { position: fixed; height: 60px; background: #fff; padding: 0; }
	.header .in >* { float: none; line-height: 60px; }
	.header .nav_cont { padding: 60px 50px; display: table-cell; vertical-align: middle; }
	.header .nav .nav_bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #fff; z-index: -1; opacity: 0; }
	.header .spnv { display: block; width: 100%; position: absolute; left: 0; bottom: 30px; }
	.header .spnv .sns { display: block; position: relative; width: 200px; float: none; margin: 0 auto; opacity: 0.3; }
	.header .spnv .sns ul,
	.header .spnv .sns p { display: inline-block; float: left; }
	.header .spnv .sns ul li { margin: 0 10px; }
	.header .nav { height: 100%; width: 100%; box-sizing: border-box;}
	.header .logo_wrap { width: 40px; height: 40px; line-height: 60px; padding: 0; margin: 10px;}
	.header .right { float: none; display: table; position: relative; }
	.header .right .nv { width: 100%; display: table-cell; vertical-align: middle; }
	.header .right .nv li { float: none; line-height: 4; border-image-width: 100%; }
	.header .right .nv li a { display: block; }
	.header .sitename { font-size: 10px; }
	.header .btn.book { width: 100%; margin: 20px 0px; padding: 0 0;}
	.header .btn.book a { display: block; max-width: 200px;  padding: 14px 24px; margin: 0 auto; line-height: 25px; text-align: center;}
	.toggle { display: block; padding: 22px 20px; top: 0; right: 0; -webkit-transition: all .3s 0s; transition: all .3s 0s; }
	.toggle { position: fixed; top: 0; right: 0; }
	.toggle { display: table-row; z-index: 300; }
	.toggle span.t2 { margin: 5px auto; }
	.overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(189, 159, 119, 0.3); z-index: -2; }
	.header .nav, .header .nav .nav_bg, .header .nav_cont { opacity: 0; -webkit-transform: scale(0.95) translateY(10px); transform: scale(0.95) translateY(10px); -webkit-transition: all .3s 0s; transition: all .3s 0s; }
	.nav_wrapper { width: 100%; height: 100%; float: none; position: fixed; left: 0; top: 0; opacity: 0; box-sizing: border-box; -webkit-transform: translate(0, 100%); transform: translate(0, 100%); -webkit-transition: opacity .3s .5s, -webkit-transform .3s .3s; transition: opacity .3s .5s, -webkit-transform .3s .3s; transition: opacity .3s .5s, transform .3s .3s; transition: opacity .3s .5s, transform .3s .3s, -webkit-transform .3s .3s; opacity: 0; }
	.header .overlay { opacity: 0; -webkit-transform: translate(0, 100%); transform: translate(0, 100%); -webkit-transition: opacity .3s 0s, -webkit-transform .3s .3s; transition: opacity .3s 0s, -webkit-transform .3s .3s; transition: opacity .3s 0s, transform .3s .3s; transition: opacity .3s 0s, transform .3s .3s, -webkit-transform .3s .3s; }
	.is_openside .header .nav, .is_openside .header .nav .nav_bg, .is_openside .header .nav_cont { opacity: 1; -webkit-transform: scale(1) translateY(0); transform: scale(1) translateY(0); -webkit-transition: opacity .3s .2s, transform .3s 0s; -webkit-transition: opacity .3s .2s, -webkit-transform .3s 0s; transition: opacity .3s .2s, -webkit-transform .3s 0s; transition: opacity .3s .2s, transform .3s 0s; transition: opacity .3s .2s, transform .3s 0s, -webkit-transform .3s 0s; }
	.is_openside .nav_wrapper { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; -webkit-transition: opacity .2s 0s, -webkit-transform .3s .1s; transition: opacity .2s 0s, -webkit-transform .3s .1s; transition: opacity .2s 0s, transform .3s .1s; transition: opacity .2s 0s, transform .3s .1s, -webkit-transform .3s .1s; }
	.is_openside .header .overlay { opacity: 1; -webkit-transform: translate(0, 0); transform: translate(0, 0); -webkit-transition: opacity .3s .3s, -webkit-transform .3s 0s; transition: opacity .3s .3s, -webkit-transform .3s 0s; transition: opacity .3s .3s, transform .3s 0s; transition: opacity .3s .3s, transform .3s 0s, -webkit-transform .3s 0s; }
	.toggle span { display: block; height: 2px; width: 20px; background: #333; margin: 0 auto; -webkit-transform: rotate(0deg) translate(0, 0); transform: rotate(0deg) translate(0, 0); -webkit-transition: all .4s 0s; transition: all .4s 0s; }
	.is_openside .toggle span { -webkit-transition: all .2s 0s; transition: all .2s 0s; }
	.is_openside .toggle span.t1 { -webkit-transform: rotate(45deg) translate(5px, 5px); transform: rotate(45deg) translate(5px, 5px); }
	.is_openside .toggle span.t2 { opacity: 0; }
	.is_openside .toggle span.t3 { -webkit-transform: rotate(-45deg) translate(5px, -5px); transform: rotate(-45deg) translate(5px, -5px); }
	@-webkit-keyframes spanTt {
		0% { -webkit-transform: rotate(0deg) translate(0, 0); transform: rotate(0deg) translate(0, 0); opacity: 1; }
		50% { -webkit-transform: rotate(0deg) translate(0, 7px); transform: rotate(0deg) translate(0, 7px); opacity: 0; }
		100% { -webkit-transform: rotate(45deg) translate(5px, 5px); transform: rotate(45deg) translate(5px, 5px); opacity: 1; }
	}
	@-webkit-keyframes spanTb {
		0% { -webkit-transform: rotate(-0deg) translate(0, 0); transform: rotate(-0deg) translate(0, 0); opacity: 1; }
		50% { -webkit-transform: rotate(-0deg) translate(0, -7px); transform: rotate(-0deg) translate(0, -7px); opacity: 0; }
		100% { -webkit-transform: rotate(-45deg) translate(5px, -5px); transform: rotate(-45deg) translate(5px, -5px); opacity: 1; }
	}

	.i-arrowD, .i-arrowL, .i-arrowR { line-height: 60px; }	
	.firstview { margin-top: 60px }
	.firstview .bg-beige { height: calc(100% + 11%); }
	.slider_top { width: 100%; margin-top: 40%; height: 40%;}
	.slider-progress { right: initial; left: 20px; bottom: 40%; }
	.top.main {  height: 100%; }
	.top.main .trim-title {width: calc(100% - 20px); margin-top: calc(40% - 15px); height: 40%; top: 0; }
	.top.main .trim-title span { top: -2em; left: 20px; font-size: 11vw; line-height: 0.9;}
	.top .scrl { position: absolute; bottom: 10%; left: 0; width: 100%; }
	.top .scrl a { display: block; width: 300px; margin: 30px auto; }
	
	.footer._top { margin-top: 40vw; }
	.footer .in { height: 30vw; }
	.footer .left { display: block; width: 100%; }
	.footer .links { display: block; margin: 40px auto 50px; padding: 0; width: 300px; }
	.footer .links li a { line-height: 60px; }
	/* .footer .in { height: initial; } */
	.footer .belt { padding: 20px;}
	.footer_bottom { padding: 0 30px 20px; color: #d3d2d2; }
	.footer_bottom > * { line-height: 40px; }
	.footer_bottom .sns { float: none; width: 100%; text-align: left;}
	.footer_bottom .sns ul { margin-left: 6px;}
	.footer_bottom .sns li a { color: #d3d2d2; }
	.footer_bottom .copyright { width: 100%; }
	.footer_bottom .copyright .logo_wrap { display: none; }
	.footer_bottom .goup { display: block; position: absolute; right: 0; bottom: 0; background: #000; width: 50px; height: 50px; text-align: center; }
	.footer_bottom .goup a { display: block; font-size: 20px; color: #fff; line-height: 50px; transform: rotate(90deg); }
	.footer/* ._sub */ { margin-top: 30vw; }
	.footer/* ._sub */ .in.right { position: absolute; top: -30vw; width: 100%; }
	.footer/* ._sub */ .in.left { height: initial; }
	.footer/* ._sub */ .imgarea { top: 1px; }
	.footer/* ._sub */ .imgarea .inner{ padding: 0 20px; }
	.footer/* ._sub */ .imgarea .trim-title span {     left: 0; font-size: 6vw; width: 50%; font-weight: 900; letter-spacing: 0em;}
	.footer .imgarea .button { bottom: calc(50% - 30px); left: 52%; }
	.trim-title span { font-size: 13vw; }

	h3 { line-height: 1.4; }
	h3.display { font-size: 30px; font-weight: 900; }
	p { font-size: 12px; }
	.button { width: 250px; margin: 20px 0 0; }
	.txtL, .txtR { display: block;}
	.txtL { width: 100%; }
	.txtR { width: 100%; }
	.txtL .inner, .txtR .inner { padding: 0 5px; }
	.location_inner { margin-bottom: 20px; }
	.head { margin: -30px 0 0 10px; }
	.head span { margin: 0 0 10px; }
	.head h2 { padding-bottom: 30px; }
	.head .quote:before { left: -0.6em; top: -0.2em; }
	.container { margin: 0 auto 5vw; }
	.container .guide-ja { margin: 15px 0 4px; }
	.img_holder .pdR { right: 0; }
	.img_holder .pdL { left: 0; }
	.img_holder .top { margin-top: 0; }
	.img_holder .imgM { width: 95%; top: 60%; }
	.img_holder .imgS {width: 65%; height: 70%; z-index: 2; }
	.img_holder.double { margin-bottom: 35%; }
	.img_holder.double.flip { margin-bottom: 30%; }
	.img_holder.single { margin-top: 0px; margin-bottom: 10px; }
	.topinfo .button { position: relative; }
	.topinfo .inner { width: 50%; }
	.topinfo .head { margin-left: 0; }
	.info_dl { margin: 10px 0 20px }
	.info_dl dd, .info_dl dt  { margin-bottom: 0px;}

	.main .inner { width: 100%;  }
	.sub .main { height: 200px; margin: 0 0 80px; }
	.sub .main .trim-img { top: 0; width: 79%; height: 90%; position: relative; }
	.sub .main .trim-img:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #000; opacity: 0.2; }
	.sub .main .trim-title span { top: calc(50% - 0.6em); }
	.sub .main .trim-title { height: 90%; }
	.sub .scrl { display: none; }
	.sub .firstview .bg-beige { height: calc(100% + 20px); }
	
	.delaySlider .dlWrap.left { left: 0; width: 95%; top: 0%; z-index: 2; }
	.delaySlider .dlWrap.right { width: 65%; height: 90%; top: 90%; }
	.mkgctrl { left: 0; top: 0; height: 50px; width: 100%; right: 0; }
	.mkgctrl ul { right: 5%; left: initial; }
	.mkgctrl a { width: 50px; height: 50px; }
	.mkgctrl a span { line-height: 50px; }
	.slider_about{ margin: 20% 0 35%; }
	.slider_about .trim-area { width: 100%; left: 0; top: 90%; }
	.slider_about .trim-title { height: 90%; top: 0; width: 65%; line-height: 1em; left: initial; right: 0; }
	.slider_about .trim-title span { font-size: 9vw; width: 120%; box-sizing: border-box; top: 37%; left: -45%; }
	.float_box { margin-bottom: 20%;}	
	.float_box .boxes { position: relative; width: 100%; height: 100%; }
	.float_box .lower { top: 0; }
	.float_box .flR { display: block; padding: 10px 0 30px; box-sizing: initial; padding-right: 0; z-index: 1; top: 0; height: initial; }
	.float_box .flL {  height: 100%; }
	.float_box .txt .inner { padding: 20px; }
	.float_box .txt h3 { padding: 0 0 20px; margin: 0 0 20px; }
	#chef .float_box .flL .cover { background-position: top!important;  }
	.link_social {margin: 0 auto 40px; max-width: 500px; }
	.link_social li { margin: 5px auto; width: 100%; }

	.reservation-list.two-cols li { margin: 50px 0 -30px; }

	.menu_list { width: 100%; padding: 0 10%; }
	.menu_list > ul > li { width: 100%; float: none; padding: 0 20px; }
	.menu_list .thumb { height: 320px; }
	.menu_list .data { margin: 10px 0 30px; padding: 0 0 30px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
	.menu_list > ul > li:last-child .data { border-bottom: none; margin: 10px 0 ; }
	.menu_list h3 { margin: 10px 0 15px; }
	.menu_list .bg-beige.shift { height: calc(100% - 110px); }
	.sliderM .slick-arrow{ opacity: 1; width: 50px; background: rgba(255, 255, 255, 0);}
	.sliderM .slick-arrow span { background: rgba(255, 255, 255, .5); padding: 0 10px; }
	.sliderM .slick-next { right: -25px; }
	.sliderM .slick-prev { left: -25px; }
	.slideT-wrap, .slideM-wrap { z-index: 0; opacity: 0; }

	.ex_head { padding: 0 5% 20%; }
	.examples .menu_list .bg-beige { top: 0; height: 100%; }
	.ex_content .memo { margin: 10px 0 20px; }
	.lineup li { line-height: 1.2; }
	.lineup { padding: 0; }
	.spec_table { padding: 5px 25px; }
	.spec_table th, .spec_table td { padding: 15px 0; font-size: 13px; line-height: 1.3; letter-spacing: .01em;vertical-align: top;}
	.spec_table th { width: 35%; padding-right: 5%; }
	.spec_table td { width: 60%; }
	.spec_table tr:last-child th, .spec_table tr:last-child td { border-bottom: none; }
	.contact .txtR { width: 100%; }
	.contact .info_dl dd { width: 100%; }
	.map { width: 100%; height: 200px; }
	.map_area { margin: 0 0 20px; padding: 0 20px; }
	.map_holder.double { margin-bottom: 160px; }
	.map_holder.img_holder .imgS { width: 70%; height: 50%; z-index: 1; top: -35%; }
	.map_holder.img_holder .imgM { position: relative; width: 90%; height: 70%; left: 5%; top: 0; margin-top: 20%; z-index: 2; }
	.map_txt { display: block; position: relative; width: auto; top: initial; left: initial; height: initial; margin: 20px 5vw; }
	.map_txt h3.display { text-align: right; font-size: 20px; }
	.map_txt .button { float: right; }
	.contact .txtL { width: 100%; }
	.mail_box { height: initial; }
	.mail_box li { position: relative; width: 100%; display: block; height: initial; padding: 40px 0; }
	.mail_box li.border:after { height: 1px; width: calc(100% - 40px); left: 20px; top: initial; bottom: 0; }
	.mailto .vr { margin: 10px auto; }
	.mailto h2 { font-size: 23px;line-height: 1.7; }

	.spacer { height: 180px; }
	.spacerH { height: 0px; }

	.gallery { padding: 0 0 20%; }
	.gallery .float_box .flL { height: 80%; top: 0; margin: 0; }
	.gallery .float_box .flR { height: 70%; top: -20%; padding: 0; }
}
/* 768px以下 〜 640pxまで  */
@media screen and (min-width: 640px) and (max-width: 768px)  {
	.slider_about {margin: 15% 0 20%; }
	.img_holder.double.wh2 { padding: 0 0 260px; box-sizing: border-box; padding: 0; }
	.map_holder.img_holder.double.wh2 { padding: 0; }
	.map_holder.img_holder .imgM { height: 100%; }
	.map_holder.double { margin-bottom: 240px; }
	.float_box {max-width: 650px; margin: 0 auto; max-height: 370px;}
	.float_box .txt .inner {padding: 20px; margin: 0 auto; }
}

/* Mobile */
@media screen and (max-width:425px) { 
	.menu_list { padding: 0; }
	.menu_list .thumb { height: 200px; }
	.slider_about .trim-area { top: 96%; }	
	.slider_about {margin: 20% 0 20%; }
	/* .link_social { margin: 250px auto 20px; } */
	.slider_about .trim-title span { top: 50%; }
	.slider_about .trim-area { top: 90%; }
	.top.main .trim-title { margin-top: calc(40% - 7px); }
	.topinfo .inner { display: block; width: 100%; float: none; }
	.img_holder.double { margin-bottom: 50%; }
	.img_holder.double.flip { margin-bottom: 40%; }

	.reservation .inner { margin: 0 0 40px; }
	.reservation .inner .button { margin: 30px auto 0; }
	.reservation .head { margin: 0 auto; }
	.reservation .head span { margin: 0 0 0px; line-height: 1; }
	/* .reservation .img_holder.single { margin-bottom: -40px; } */
	.reservation .inner h2 { padding-bottom: 0px; }
	.reservation .inner h2:after { display: none; }
	.reservation .inner .telephone { font-size: 20px; }
	.reservation-list { display: block; }
	.reservation-list.two-cols li { width: 100%; margin: 15px 0; padding-bottom: 30px; position: relative; }
	.reservation-list.two-cols li:after { content: ""; position: absolute; display: block; width: 60px; height: 1px; background: #bd9f77; bottom: 0; left: 50%; margin-left: -30px; }

	.gallery {padding: 0 0 50%; }
	.gallery .float_box .flR { top: 0; height: 90%; }
	.footer .imgarea .button { width: 160px; }
	
}

/* //////////////////////////////////////////////

IE

////////////////////////////////////////////// */

.is_ie { letter-spacing: 0; }


/*add 2023.01.26*/
.lineup.cf > li {
position:relative;
padding-left:1.5em;
}
.lineup.cf > li::before{
position:absolute;
left:0;
top:0;
float:none;

}
.loader {

}
.loader img {
width:100px;
height:100px;
}


.menu_list .ex_content {
width:100%;
display:flex;
justify-content:space-between;
flex-wrap:wrap;

}
