@charset "UTF-8";

/*==================================================================================================

       リセット

===================================================================================================*/

html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	}
ul { 
	letter-spacing: -1em;
	word-spacing: -1em;
	}
:root ul {
	letter-spacing: -1px;
	word-spacing: -1px;
	}
li { 
	letter-spacing: normal;
	word-spacing: normal;
	*display: inline;
	*zoom: 1;
	}
figure { margin:0;}
img,iframe	{ vertical-align:bottom;}

/*==================================================================================================

       メイン設定

===================================================================================================*/

html,body { width:100%; min-width: 320px; *width:320px; font-size:16px; }
body {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	letter-spacing: 0.03em;
	color: #000000;
	text-shadow: 0 0 0 #000000;
	font-weight: 200;
	text-align: left;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 15
		0%;
	font-feature-settings: "palt" 1;
  	}
    .en { font-family: 'Crimson Text', serif; }

    .wrapper    { overflow:hidden;}
    article		{ position:relative; width:100%; z-index: 0;}
    section		{ position:relative; }

    .section	{ padding-top:2rem; padding-bottom:2rem; }
    .section.second	{ padding-top:2rem; }
    .section.third	{ padding-top:3rem; }
    .outer		{ padding-left:50px; padding-right:50px; box-sizing:border-box; }
    .wrap-l     { width:100%; max-width:1400px; margin-left:auto; margin-right:auto; }
    .wrap       { width:100%; max-width:1180px; margin-left:auto; margin-right:auto; }
    .wrap-s     { width:100%; max-width:1080px; margin-left:auto; margin-right:auto; }
    .wrap-1000  { width:100%; max-width:1000px; margin-left:auto; margin-right:auto; }
    .wrap-750   { width:100%; max-width: 750px; margin-left:auto; margin-right:auto; }

    .row			{ margin-left:auto; margin-right:auto; position: relative;}
    .row .row		{ min-width: 0px; }
    .row:before,
    .row:after      { content:""; display:table; }
    .row:after      { clear: both; }
    .row            { zoom: 1; }

	.center		{ text-align:center;}
    .center-left{ text-align:center;}
    .left-center{ text-align: left;}
	.text-l		{ text-align:left;}
    .text-r		{ text-align:right;}
	.float-l	{ float:left; }
	.float-r	{ float:right; }
    .margin-auto { margin-left:auto; margin-right:auto; }

    h1,h2,h3,h4,h5 { font-weight:300; letter-spacing: .05em;}
    
    small { font-size:.75rem; }
    .bold { font-weight:bold;}
    .serif{ font-family: 'Noto Serif JP', serif;}

@media screen and (max-width: 1087px) {
    html,body, .wrapper	{ font-size:15px; line-height: 180%;}
    .outer			   { padding-left:30px; padding-right:30px; }
    .section	       { padding-top:2rem; padding-bottom:3rem; }
    .section.second	   { padding-top:1rem; }
    .section.third	   { padding-top:1.5rem; }
    .center-left    { text-align:left;}
    .left-center    { text-align:center;}
    }
@media only screen and (max-width: 767px) {
    html,body, .wrapper	{ letter-spacing: 1px; line-height: 160%;}
	body			{ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
    .outer			{ padding-left:15px; padding-right:15px; }
    .wrap-l, .wrap, .wrap-s, .wrap-1000, .wrap-750  { max-width:480px; }
    }
@media only screen and (max-width:374px) {
    html,body, .wrapper	{ font-size:14px; }
    }

/*==================================================================================================

       padding margin 設定

===================================================================================================*/
.pt-1-2{ padding-top:0.5rem;}
	.pt-1em		{ padding-top:1rem;}
	.pt-2em		{ padding-top:2rem;}
	.pt-3em		{ padding-top:3rem;}
	.pt-4em		{ padding-top:4rem;}
	.pt-5em		{ padding-top:5rem;}

    .pb-1em		{ padding-bottom:1rem;}
	.pb-2em		{ padding-bottom:2rem;}
	.pb-3em		{ padding-bottom:3rem;}
	.pb-4em		{ padding-bottom:4rem;}
	.pb-5em		{ padding-bottom:5rem;}

    .pl-3em     { padding-left:3em;}

    .mt-1em		{ margin-top:1rem;}
	.mt-2em		{ margin-top:2rem;}
	.mt-3em		{ margin-top:3rem;}
	.mt-4em		{ margin-top:4rem;}
	.mt-5em		{ margin-top:5rem;}

	.mb-1em		{ margin-bottom:1rem;}
	.mb-2em		{ margin-bottom:2rem;}
	.mb-3em		{ margin-bottom:3rem;}
	.mb-4em		{ margin-bottom:4rem;}
	.mb-5em		{ margin-bottom:5rem;}

    .pt-2-1		{ padding-top:2rem;}
    .pt-3-2		{ padding-top:3rem;}
    .pb-2-1		{ padding-bottom:2rem;}
    .pb-3-1		{ padding-bottom:3rem;}
    .pb-3-2		{ padding-bottom:3rem;}
    .pb-4-3		{ padding-bottom:4rem;}
    .mb-2-1		{ margin-bottom:2rem;}
    .mb-3-1		{ margin-bottom:3rem;}
    .mb-3-2		{ margin-bottom:3rem;}
    .mb-5-2		{ margin-bottom:5rem;}

@media only screen and (max-width: 767px) {
    .pl-3em     { padding-left:1.5em;}
    
    .pt-2-1		{ padding-top:1rem;}
    .pt-3-2		{ padding-top:2rem;}
    .pb-2-1		{ padding-bottom:1rem;}
    .pb-3-1		{ padding-bottom:1rem;}
    .pb-3-2		{ padding-bottom:2rem;}
    .pb-4-3		{ padding-bottom:3rem;}
    .mb-2-1		{ margin-bottom:1rem;}
    .mb-3-1		{ margin-bottom:1rem;}
    .mb-3-2		{ margin-bottom:2rem;}
    .mb-5-2		{ margin-bottom:2rem;}
	.pt-3-1		{ padding-top:2rem;}
}

/*==================================================================================================

       Link

===================================================================================================*/

a {
	text-decoration:none;
	color:#d5d5d5;
	cursor:pointer;
	}
	a:hover {
	color:#AAA;
	}
	a img {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	}
	a:hover img {
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
	}

/*==================================================================================================

       Font

===================================================================================================*/

    .font-18 { font-size:1.125rem; }
    .font-21 { font-size:1.3125rem; }
    .font-24 { font-size:1.5rem; }
    .font-27 { font-size:1.6875rem; }
    .font-30 { font-size:1.875rem; }
    .font-36 { font-size:2.25rem; }

@media only screen and (max-width: 767px) {
    .font-18 { font-size:1.06667rem; }
    .font-21 { font-size:1.125rem; }
    .font-24 { font-size:1.25rem; }
    .font-27 { font-size:1.5rem; }
    .font-30 { font-size:1.6rem; }
    .font-36 { font-size:1.75rem; }
}

/*==================================================================================================

       Other

===================================================================================================*/

    img {
        max-width: 100%;
        height: auto;
        width /***/:auto;
        vertical-align:bottom;
        }
    .flexslider-wrap {
        position: relative;
        width:100%;
	
        }
    .flexslider-wrap:after {
        content: "";
        display: block;
        padding-bottom:60%;
		
        }
        .flexslider-wrap .flexslider {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;}
    .radius,
    .radius video,
    .radius img {
        border-radius:         4px;
        moz-border-radius:     4px;
        -webkit-border-radius: 4px;
        -o-border-radius:      4px;
        -ms-border-radius:     4px;
        }
    .shadow	{
        box-shadow:	        0px 3px 5px rgba(0,0,0,0.3);
        -moz-box-shadow:	0px 3px 5px rgba(0,0,0,0.3);
        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.3);
        -o-box-shadow:		0px 3px 5px rgba(0,0,0,0.3);
        -ms-box-shadow:		0px 3px 5px rgba(0,0,0,0.3);
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        }
        .shadow:hover {
        box-shadow:	        0px 3px 5px rgba(0,0,0,0);
        -moz-box-shadow:	0px 3px 5px rgba(0,0,0,0);
        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0);
        -o-box-shadow:		0px 3px 5px rgba(0,0,0,0);
        -ms-box-shadow:		0px 3px 5px rgba(0,0,0,0);
        }
    .anchor	{
        padding-top:120px;
        margin-top:-120px;
        z-index: -1;
        }
    .centered-outer { position: relative; height:100%; }
    .centered-inner {
        position: absolute;
        width:100%;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        -webkit-transform: translateY(-50%) translateX(-50%);
        }





@media screen and (max-width: 1087px) {
    .onsen_mi img{ width: 82px; height: auto;}
    }
@media only screen and (max-width: 767px) {
    .onsen_mi img{ width: 82px; height: auto;}
    }
@media only screen and (max-width:374px) {
    .onsen_mi img{ width: 82px; height: auto;}
    }

@media only screen and (max-width:374px) {
    .top_mi img{ width: 50%; height: auto;}
    }
/*==================================================================================================

      　hover_zoom

===================================================================================================*/

.hover-zoom__image {
    overflow: hidden;
    position: relative;
    width:100%;
    background: #000;
    -webkit-transition-duration: 0.5s;
    transition-duration:         0.5s;
    -webkit-transition  : all .5s ease-in;
        -moz-transition : all .5s ease-in;
        -ms-transition  : all .5s ease-in;
            transition  : all .5s ease-in;
    }
    .hover-zoom__image figure {
    -webkit-transition-duration: 0.5s;
    transition-duration:         0.5s;
    -webkit-transition  : all .5s ease-out;
        -moz-transition : all .5s ease-out;
        -ms-transition  : all .5s ease-out;
            transition  : all .5s ease-out;
    }
    .hover-zoom__image:hover figure {
    opacity: 1;
    -moz-transform:    scale(1.2);
    -webkit-transform: scale(1.2);
    -ms-transform:     scale(1.2);
    transform:         scale(1.2);
    }
    .hover-zoom__image a img {
	opacity:.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	}
    .hover-zoom__image a:hover img {
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	}

/*==================================================================================================

       デバイス

===================================================================================================*/

    .sp-none        { display:block;}
    .sp-inline-none { display:inline-block;}
	.sp-on{ display:none;}
	.tablet-on		{ display:none;}
	.tablet-none	{ display:block;}
@media screen and (max-width: 1200px) {
    
	.tablet-none2 img{ display:none;}
    }


@media screen and (max-width: 991px) {
    .tablet-on		{ display:block !important;}
	.tablet-none	{ display:none;}
    }
@media screen and (max-width: 767px) {
    .sp-none		{ display:none;}
    .sp-inline-none { display:none;}
	.sp-on{ display:block;}
	.sp-text-l		{ text-align:left !important;}
	.sp-center		{ text-align:center;}
    }


/*==================================================================================================

       Flex

===================================================================================================*/

.column .inner { width:100%; max-width:500px; margin:0 auto; }
.vertical-center {
    display: flex;
    align-items: center;
    }
.vertical-side-center { /* IE でバグあり */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    }
    /* IE でのflex+figure バグ対策 */
    @media all and (-ms-high-contrast: none) {
    .vertical-side-center figure { width:100%; height:100%; }
    }
.reverse-row-order {
    flex-direction: row-reverse;
    }

@media only screen and (max-width: 1087px) {
    .column .inner { max-width:100%; }
}

/*==================================================================================================

       btn

===================================================================================================*/

    a.more {
        color:#FFF;
        padding: 1em 1.7em;
        width:100%;
        max-width: 300px;
        border: 1px solid #C18259;
        border-radius: 0px;
        background: #C18259;
        line-height: 1;
        white-space: nowrap;
        text-decoration:none !important;
        position: relative;
        z-index: 1;
        -webkit-transition: color 0.3s ease;
        -moz-transition: color 0.3s ease;
        -ms-transition: color 0.3s ease;
        -o-transition: color 0.3s ease;
        transition: color 0.3s ease;
        letter-spacing: .15em;
        display: inline-block;
        }
        a.more:after {
        border-radius: 0px;
        position: absolute;
        content: "";
        width: 0;
        height: 100%;
        top: 0;
        right: 0;
        z-index: -1;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
        background: #4D3626;
        }
        a.more:hover {
        color: #d5d5d5;
        }
        a.more:hover:after {
        left: 0;
        width: 100%;
        }
        a.more:active {
        top: 0px;
        }

/*==================================================================================================

       ヘッダー

===================================================================================================*/

header {
	position:relative;
	height:60px;
	width:100%;
	z-index:9999;
	}
	.header-wrap {
	height:75px;
	width:100%;
	position: relative;
    z-index:9999;
	background: url("../img/index/gnav_bg.png");
	
	}
	.navigation-wrap {
	width:100%;
    max-width:1200px;
    padding:0 0px;
    box-sizing:border-box;
    margin:0 auto;
	position:relative;
	}
.logo {
		position:relative;
		float:left;
		width:310px;
		text-align:left;
		line-height:1;
		padding:6px 0 0;
		z-index:100;
			
		}
		.navigation {
		float:right;
		width:850px;
		position:relative;
		
		}
		.main-nav {
		float:right;
		position:relative;
        padding-top:25px;
        }
            .main-nav li {
            float:left;
            line-height:1;
            padding:0 0 0 2rem;
            text-align: center;
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
            }
            .main-nav li:first-child {
            padding-left:0 !important;
            }
            .main-nav li img {
       
            width:auto;
            vertical-align: middle;
            }
            .main-nav li a {
            padding:0;
            }
            .main-nav a:hover {
            text-decoration:none;
            }
            .main-nav li.phone {
                position: absolute;
                right:0;
                top:5px;
                }
                .main-nav li.phone img {
              
                width: auto;
                }
            
                
    /*=================================================
            hover bar
    ==================================================*/

    .main-nav li a {
        position: relative;
        display: inline-block;
        transition: .3s;
        padding-bottom:10px;
        }
        

.hover_line a {
	position: relative;
	display: inline-block;
	transition: .3s;
}
.hover_line a:after {
	position: absolute;
	bottom: 5px;
	left: -1px;
	content: '';
	width: 0;
	height: 1px;
	background-color: #ffffff;
	transition: .3s;
}

.hover_line a:hover::after {
	width: 100%;
}

    /*=================================================
            Fixed
    ==================================================*/

    .header-wrap.fixed {
        margin-left:0;
        margin-top:0;
        top: 0;
        width:100%;
      
        position:fixed;
        background:url("../img/index/gnav_bg.png");
        -webkit-animation-duration:1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode:both;
        animation-fill-mode: both;
        -webkit-animation-name:fadeInDown;
        animation-name:fadeInDown;
        }
        .header-wrap.fixed .logo { padding-top:7px;}
        .header-wrap.fixed .navigation { padding-top:0px;}

    /*=================================================
            スマホ ハンバーガーメニュー
    ==================================================*/

    .nav-toggle { display: none; position: absolute; right:17px; top:18px; width: 20px; height:20px; cursor:pointer; z-index:999; }
	.nav-toggle div { position: relative; }
	.nav-toggle span { display: block; position: absolute; height: 2px; width:100%; background: #FFF; -moz-border-radius:2px; -webkit-border-radius:2px; -o-border-radius:2px; -ms-border-radius:2px;
	left: 0; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out; }
	.nav-toggle span:nth-child(1) { top: 0; }
	.nav-toggle span:nth-child(2) { top: 6px; }
	.nav-toggle span:nth-child(3) { top: 12px; }

    @media screen and (max-width: 1240px) {
        .navigation-wrap { padding:0 15px; }
        .navigation { width:890px; }
        .main-nav li { font-size:0.9375rem; padding-left:1em; }
    }

    @media screen and (max-width: 1087px) {
    
        header { height:47px; width:100%;}
        .header-wrap { margin-left:0; margin-top:0; top: 0; width:100%;  height:47px; background:#0F0D0B;}
        .navigation-wrap { padding:0; height:47px; }
        .sp-navigation { position: relative; width:100%; height:47px; z-index: 10; background:#0F0D0B;}
        .logo { position: absolute; left: 12px; padding-top:2px; width:220px; z-index: 10;}
        .navigation { position: absolute; z-index: 1; top:-755px; width:100%; text-align:center; padding:0; -webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;transition:.5s ease-in-out;}

        .main-nav li a:after { display:none; }
        .main-nav li span:before { content:" / ";}
        .sub-nav li{ background:#0F0D0B; }
        .navigation ul { position:static; height:auto; border:none; float: none; padding:0; background:#0F0D0B;}
        .navigation li { float:none; position:static; width:100%; padding:0; margin:0;border-bottom:1px solid #222; font-size:13px; line-height:1; text-align: center; }
        .navigation li:hover { background: rgba(255,255,255,.15); }
        .main-nav li.reservation a { background: rgba(178,66,36,1); }

        .header-wrap.fixed { box-shadow:none; padding-top: 0; height: 46px;}
        .header-wrap.fixed .logo { padding-top:4px; width:200px;}
        .header-wrap.fixed .navigation { width:100%; padding-top:0;}
        .header-wrap.fixed .navigation-wrap { height:46px; padding:0;}
        .header-wrap .navigation li a,
        .header-wrap.fixed .navigation li a { width: 100%; display: block; padding: 17px 0; text-indent:1.5em;}

        .nav-toggle { display: block;}
        .open .nav-toggle span:nth-child(1) {top: 6px;-webkit-transform: rotate(315deg);-moz-transform: rotate(315deg);transform: rotate(315deg);}
        .open .nav-toggle span:nth-child(2) {width: 0;left: 50%;}
        .open .nav-toggle span:nth-child(3) {top: 6px;-webkit-transform: rotate(-315deg);-moz-transform: rotate(-315deg);transform: rotate(-315deg);}
        .open .navigation {-moz-transform: translateY(800px);-webkit-transform: translateY(800px);transform: translateY(800px);}
    }

/*==================================================================================================

       Movie

===================================================================================================*/

.movie{
position: relative;
width: 100%;
height: auto;

background-size:cover;
text-align: center;
margin-top: 13px;
}
    .movie:before {
    content: "";
    display: block;
    padding-top: 41.5%; /* 調整ください */
    }
.movie_inner{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 0;
    }
    .movie_inner video{
	width:100%;
	height:auto !important;
	margin-left:auto;
	margin-right:auto;
	/*object-fit: cover;*/
    }
    .movie_inner:after {
	content:"";
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
z-index: 1;
    }
.movie-catch {
    position: absolute;
    width:100%;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    z-index: 10;
    }
    .movie-catch h1 {
    width:210px;
    margin:0 auto;
    padding-bottom:2.5rem;
    }
    .movie-catch p {
    margin: 0 auto;
    width:476px;
    }
@media screen and (max-width: 1087px) {
    .movie{ top:0px; margin-bottom:0px; }
}
@media screen and (max-width: 767px) {
   /* .movie:before { padding-top: 80%;   }　調整ください */
    .movie-catch h1 { width:140px; padding-bottom:1rem; }
    .movie-catch p { width:300px; }
}

/*==================================================================================================

       背景

===================================================================================================*/

.bg-light    { background: #FDF2D6; }
.bg-moyou    { background: url("../images/img/cuisine/bg.png") center center repeat; padding:3.5rem ; box-sizing: border-box;}

/*==================================================================================================

       見出し

===================================================================================================*/

.line-title {
    line-height:120%;
    letter-spacing: .1em;
    text-align:center;
    padding-bottom:.25em;
    margin-bottom:.5em;
    position: relative;
    overflow: hidden;
    }
    .line-title:after {
        position: absolute;
        content: "";
        width:150px;
        height:1px;
        background:#C18259;
        bottom:10px;
        left:50%;
        margin-left:-125px;
        transform: scale(0, 1);
        transform-origin: left top;
        transition: transform .5s;
        transition-delay : .2s;
        }
        .line-title:before {
        position: absolute;
        content: "";
        width:150px;
        height:1px;
        background:#C18259;
        bottom:0;
        left:50%;
        margin-left:-35px;
        transform: scale(0, 1);
        transform-origin: left top;
        transition: transform .5s;
        transition-delay : .7s;
        }
        .move.line-title:after {
        transform: scale(1, 1);
        }
        .move.line-title:before {
        transform: scale(1, 1);
        }

.line-title-left {
    line-height:120%;
  
    text-align: left;
    padding-bottom:0.5em;
    margin-bottom:0em;
    position: relative;
    overflow: hidden;
    }
    .line-title-left.en { letter-spacing: .1em; padding-bottom:.75em;}
    .line-title-left:after {
        position: absolute;
        content: "";
        width:100px;
        height:1px;
        background:#C18259;
        bottom:10px;
        left:0px;
        transform: scale(0, 1);
        transform-origin: left top;
        transition: transform .5s;
        transition-delay : .2s;
        }
        .line-title-left:before {
        position: absolute;
        content: "";
        width:100%;
        height:1px;
        background:#C18259;
        bottom:0;
        left:40px;
        transform: scale(0, 1);
        transform-origin: left top;
        transition: transform .5s;
        transition-delay : .2s;
        }
        .move.line-title-left:after {
        transform: scale(1, 1);
        }
        .move.line-title-left:before {
        transform: scale(1, 1);
        }

.one-line-title {
    line-height:150%;
    letter-spacing: .2em;
    text-align: left;
    padding:.5em 0;
    margin-bottom:.625em;
    position: relative;
    overflow: hidden;
    }
    .one-line-title.center { text-align:center; max-width:450px; margin:0 auto;}
    .one-line-title:before {
        position: absolute;
        content: "";
        width:100%;
        height:1px;
        background:#C18259;
        bottom:0;
        left:0;
        transform: scale(1, 1);
        transform-origin: left top;
        transition: transform .5s;
        transition-delay : .2s;
        }

.graybg-title {
    background: #22201F;
    padding:.5em 1em;
    margin-bottom:1em;
    }
@media screen and (max-width: 767px) {
    .line-title:after      { bottom:7px; }
    .line-title-left:after { bottom:7px; }
    }
/*==================================================================================================

       空室検索 レスポンシブ

===================================================================================================*/

.search-wrap {
    width:100%;
    background: url("../img/index/wasi_bg.png") center center repeat;
    box-sizing:border-box;
    
    }

.search-inner {
    margin:0 auto;
    width:100%;
    max-width:1180px;
	padding: 12px 0 8px;
	
	
    }
    .search-title-wrap {
        text-align: center;
        width:100%;
        height:100%;
        min-height:69px;
        position: relative;
		padding-top: 30px;
        }
        .search-title img {
        width:226px;
			height: 69px;
        }
	.search-form{
        width:100%;
        padding:20px 15px 15px 70px;
        box-sizing:border-box;
		color: #000000;
        }
        .search-content {
            }
            .search-content div {
            float: left;
            padding:3px 10px;
            font-size:13px;
            height:32px;
            line-height:1;
            display: inline-table;
            }
            .search-content div p {
            float: left;
            padding-top:8px;
            }
            .search-content div p span {
            font-size:.8em;
            }
            .search-content div input,
            .search-content div select {
            margin-left:10px;
            vertical-align: middle;
            height: 28px;
            border: 1px solid #999;
            }
            .search-content div.check input {
            height: 23px;
            }

	.search-btn {
		 background-color: #000;
        }
        .submit_btn {
            border: 0px;
            width:117px;
            height:37px;
            margin: 0 auto;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
           
            }
            .submit_btn:hover {
            cursor: pointer;
            opacity:0.6;
            }
    .flex-search-title {
        min-width:226px;
        width:226px!important;
        }
    .flex-search-btn {
        min-width:117px;
        width:117px;
		height: auto;
        }
@media screen and (max-width: 1087px) {
    .flex-wrap.is-search { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; 
	flex-direction: column; }
    .flex-search-title { min-width:100%; flex: none; display: block; }
    .search-form { max-width:670px; margin-left:auto; margin-right:auto; padding-bottom: 30px; }
    .search-title img { width: auto; padding-top: 35px;}
    }
@media only screen and (max-width: 767px) {
    .flex-search-btn { min-width:100%; flex: none; display: block; padding-top: 20px;}
    .search-content { max-width:310px; }
    .search-btn { min-height: 37px;}
    .search-content div p { padding-top:2px; }
    .search-content div input, .search-content div select { font-size: .75rem;}
	.search-title img { width: auto; padding-top: 35px;}

    }


/*==================================================================================================

      　おススメプラン

===================================================================================================*/

a .plan-img-wrap {
    margin-bottom:1rem;
    }
    a .plan-title {
    font-size:1rem;
    font-weight:200;
    position: relative;
    border-bottom:1px solid #C18259;
    padding-bottom:1rem;
    line-height: 180%;
    }
    a .plan-title:after {
        position: absolute;
        bottom: -1px;
        left: 0;
        content: '';
        width: 100%;
        height: 2px;
        background: #24201B;
        transform: scale(0, 1);
        transform-origin: right top;
        transition: transform .3s;
        }
        a .plan-title:hover::after {
        transform-origin: left top;
        transform: scale(1, 1);
        }
@media only screen and (max-width: 767px) {
    .plan-wrap { width:100%; max-width:360px; margin:0 auto; }
}

/*==================================================================================================

      　NEWS

===================================================================================================*/

.news-list {
    padding-top:1rem;
    padding-bottom:1rem;
    }
.news {
    width:100%;
    height: 100%;
    line-height: 135%;
    box-sizing:border-box;
    border-collapse:collapse;
    border-spacing: 0;
    }
    .news li {
    text-align: left;
    letter-spacing: .05rem;
    font-weight:200;
    }
    .news .date {
    float:left;
    padding-right:1rem;
    }
    .news a {
    padding:.425rem 0;
    }
    .news a .news-item {
    transition: all .3s;
    }
    .news a:hover .news-item {
    transform: translate(5px,0px);
    }

@media screen and (max-width: 767px) {
    .news .date-wrap { width:100% !important; padding-bottom:.75rem; }
    .news .news-item { width:100% !important; }
}


/*==================================================================================================

       下層共通

===================================================================================================*/

#page-header {
	position: relative;
    width: 100%;
    height: auto;
    top:-60px;
    margin-bottom:-60px;
    }
    #page-header:before {
    content: "";
    display: block;
    padding-top: 36%; /* 調整ください */
    }
.page-title {
    position: absolute;
	top: 51%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    
    text-align: center;
    z-index: 10;
    }



 
.page-greeting {
    position: relative;
    height: 18em;
    }
    .page-greeting p {
    height: 18em;
    -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
    position:absolute;
    top:0;
    left:50%;
    line-height:230%;
    letter-spacing: .35rem;
    display:inline;
    transform:translate(-50%, 0%);
    }

@media screen and (max-width: 1087px) {
    #page-header { top:0px; margin-bottom:-1px; }
    .page-greeting { height: 14em; }
    .page-greeting.gh-18 { height: 18em; }
}

 .table {
        width:100%;
        border-collapse: separate;
        border-spacing:2;
        line-height:150%;
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  color: #000000;
        }
        .table tr {
        }
        .table th {
        width:12rem;
        padding:.75rem 0.9rem;
        vertical-align: middle;
        text-align: center;
        background: #f6eab2;
        }
        .table td {
        text-align: left;
        padding:.75rem 1rem;
        background: #FDFAEF;
        }

@media screen and (max-width: 767px) {
    .table    { border: none; }
    .table tr { border: none; }
    .table th { width:100% !important; display: block !important; padding:.625em 1em; box-sizing: border-box; border:1px solid #CCC; text-align: left; }
    .table td { width:100% !important; display: block !important; padding:.625em 1em 1.25em; box-sizing: border-box; background: none;}
}
.list {
    padding-left:1.75rem;
    }
    .list li {
    list-style-type: disc;
    line-height:150%;
    padding:.25em 0;
    }

.side-img { position: relative; width:100%; }
    .side-img:after { content:""; display: block; padding-bottom: 45%;}

.side-img-r { position: absolute; right:0%; top:12%; width:66%; }
.side-img-l { position: absolute; left:0%; top:12%; width:66%; }

@media screen and (max-width: 767px) {
    .side-img:after { padding-bottom: 65%;}
    .side-img-r { top:7%; width:100%; }
    .side-img-l { top:7%; width:100%; }
}

/*==================================================================================================

       cuisine

===================================================================================================*/

.food-menu {
    position: relative;
    height: 26em;
    }
    .food-menu p {
    height: 27em;
    -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
    position:absolute;
    top:1.5rem;
    left:50%;
    line-height:230%;
    letter-spacing: .05rem;
    display:inline;
    transform:translate(-50%, 0%);
    }
@media screen and (max-width: 767px) {
    .food-menu p { top:1rem; line-height:180%; }
}

/*==================================================================================================

       facilities

===================================================================================================*/

.failities-map {
    background: #E5E5E5;
    padding:2rem;
}
.map-1,.map-2 {
    position: relative;
    }
    .map-1 figure,
    .map-2 figure {
    position: relative;
    z-index: 1;
    }
    .map-1 .pin_01 a { width: 8%; height: 7%; top:73.4%; left:49.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_02 a { width: 8%; height: 8%; top:65.2%; left:49.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_03 a { width:29%; height:14%; top:71.8%; left:57.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_04 a { width:18%; height:14%; top:27.8%; left:31%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_05 a { width:24%; height:9%; top:51.8%; left:70.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_06 a { width:14%; height:24%; top: 9.8%; left:72.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_07 a { width:12%; height:24%; top:20.8%; left:86.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_08 a { width:17%; height:16%; top: 2.8%; left:51.5%; position: absolute; display: block; z-index: 10; }
    .map-1 .pin_09 a { width:17%; height:14%; top:27.8%; left:14.5%; position: absolute; display: block; z-index: 10; }

    .map-2 .pin_01 a { width:47%; height:16%; top:63.4%; left: 4.5%; position: absolute; display: block; z-index: 10; }
    .map-2 .pin_02 a { width:17%; height:32%; top:  40%; left:55.5%; position: absolute; display: block; z-index: 10; }
    .map-2 .pin_03 a { width:19%; height:27%; top:70.8%; left:  75%; position: absolute; display: block; z-index: 10; }
    .map-2 .pin_04 a { width:20%; height:28%; top: 1.8%; left:25.5%; position: absolute; display: block; z-index: 10; }
    .map-2 .pin_05 a { width:19%; height:28%; top: 1.8%; left:74.5%; position: absolute; display: block; z-index: 10; }

/*==================================================================================================

       access

===================================================================================================*/

.map {
    position: relative;
    padding-bottom: 45%;
    margin-bottom:1em;
    height: 0;
    border: 1px solid #cead8b;
    overflow: hidden;
    }
    .map iframe,
    .map object,
    .map embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }
@media screen and (max-width: 767px) {
    .map { padding-bottom: 90%;
    height: 0;
    border: 5px solid #999;
    overflow: hidden;
    }
}

/*==================================================================================================

       contact

===================================================================================================*/

.kome { font-size:12px; color:#C96789; font-weight:bold;}
.form {
    width:100%;
    max-width:600px;
    float:left;
    }
.button, .input, .textarea, .select select, .file-cta, .file-name, .pagination-previous, .pagination-next, .pagination-link, .pagination-ellipsis { border-radius: 2px; }

html>/**/body #submit_button {
	cursor: pointer;
	display: block;
	color:#FFF;
    margin: 0 auto;
    width: 100%;
	max-width: 300px;
	height: 60px;
	border: none;
	border-radius: 2px;
	background-color:#C18259;
    -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
    font-family: 'Noto Serif JP', serif;
	}
    html>/**/body #submit_button:hover {
	background-color:#2D2B29;
	}
html>/**/body #reset_button {
	cursor: pointer;
	display: block;
	color:#FFF;
    margin: 0 auto;
    width: 100%;
	max-width: 300px;
	height: 60px;
	border: none;
	border-radius: 2px;
	background-color:#71706F;
    -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
    font-family: 'Noto Serif JP', serif;
	}
    html>/**/body #reset_button:hover {
	background-color:#2D2B29;
	}

.privacy-section {
    padding-bottom:2.5rem;
    }
/*==================================================================================================

       フッター

===================================================================================================*/

footer {
	color: #ffffff;
	background: url("../img/index/f_bg.png");
    
    }
    .footer-content {
        width:100%;
        background:#000;
        position:relative;
        z-index: 0;
        padding:3rem 0;
        }
        .footer-logo {
        width:100%;
        max-width:310px;
        margin:0 auto;
        }
        .footer-menu {
            margin:0 auto;
            padding-top:1rem;
            }
            .footer-menu li {
            line-height: 125%;
            padding-bottom: 6px;
            display: inline-block;
            }
            .footer-menu li:last-child {
            padding-bottom:0;
            }
            .footer-menu li a {
            padding:0 .5rem;
            }
            .footer-menu li a:hover {
            text-decoration:underline;
            }

.copyright {
    height:60px;
    line-height: 60px;
	text-align:center;
	letter-spacing:0;
	z-index:10;
	position:relative;
	color:#FFF;
	font-size:.8rem;
	}
    .copyright img { vertical-align: middle; }

@media screen and (max-width: 1588px) {
    footer:after { width:8%; }
}
@media screen and (max-width: 1216px) {
    footer:after { display:none; }
}
@media screen and (max-width: 1087px) {
    .cta-wrap {  padding-top:5rem; padding-bottom:5rem; }
    .footer-logo { max-width:250px; }
    }
@media only screen and (max-width: 767px) {
    .cta-wrap {  padding-top:4rem; padding-bottom:4rem; }
    .cta-wrap-min {  padding-top:2.5rem; padding-bottom:2.5rem; }
    .footer-logo { max-width:200px; }
    .freedial a { font-size:36px; }
    .freedial span { width:46px; height:30px; }
    .freedial-w { width:20px; height:13px; }
    footer { font-size:14px; }
    }

/*=================================================

		ページトップ

 ==================================================*/

#totop {
	display:none;
	*display:block; /* IE 7 and below */
	position:fixed;
	bottom:0px;
	right:0px;
	z-index:999999999;
	}
    :root *> #totop { display:none;	}
    #totop { display:block9; }
    *+html #totop { display:block; }
    #totop.open { display:block; }
    a.totop{ background: url("../img/index/page_top.png") no-repeat center top; background-size:cover;width:76px;height:64px;display:block;cursor:pointer;}
    a.totop:hover{ background-position:center bottom;}
@media only screen and (max-width: 767px) {
    #totop { bottom:0; right:0;}
	a.totop{ width:40px;height:auto;}
}


.web_bn{
	margin-top:-0.3rem;
}




.color_bg {
background-color: #FDF2D6;
}

.illu_bg {
margin: 0px auto;
background:url("../img/index/paple_bg4.png")top 100px right, url("../img/index/illu.png")top 50px left ;
background-repeat: no-repeat;
}

.illu_bg2 {
margin: 0px auto;
background:url("../img/facility/kasou_bg.png")top 30px right, url("../img/facility/kasou_bg2.png")top 200px left ;
background-repeat: no-repeat;
}


.illu_bg3 {
margin: 0px auto;
background:url("../img/facility/kasou4.png")top 30px right, url("../img/facility/kasou5.png")top 120px left ;
background-repeat: no-repeat;
}

.illu_bg4 {
margin: 0px auto;
background:url("../img/facility/kasou5.png")top 0px left;
background-repeat: no-repeat;
}
@media (max-width:1200px){
    .illu_bg,.illu_bg2,.illu_bg3,.illu_bg4 { background:none !important;}
}

.top_text {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
line-height: 2.5em;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
height: 420px;
letter-spacing: 0.1em;
margin-top: 20px;
	color: #000000;

}

.float-right{float:right!important}


 .sp-none        { display:block;}
    .sp-inline-none { display:inline-block;}
	.sp-on{ display:none;}
	.tablet-on		{ display:none;}
	.tablet-none	{ display:block;}
@media screen and (max-width: 1200px) {
    
	.tablet-none2 img{ display:none;}
    }


@media screen and (max-width: 991px) {
    .tablet-on		{ display:block !important;}
	.tablet-none	{ display:none;}
    }
@media screen and (max-width: 767px) {
    .sp-none		{ display:none;}
    .sp-inline-none { display:none;}
	.sp-on{ display:block;}
	.sp-text-l		{ text-align:left !important;}
	.sp-center		{ text-align:center;}
    }


.welcome_sp img{width:193px;
	height: 364px;}

@media screen and (max-width: 1087px) {
    .welcome_sp img{ width: 180px!important; height: auto;}
    }
@media only screen and (max-width: 767px) {
.welcome_sp img{ width: 160px!important; height: auto;}
    }
@media only screen and (max-width:400px) {
.welcome_sp img{ width: 120px!important; height: auto; }
    }



@media screen and (max-width: 1200px) {
    .br-sp { display:none; }
}


.container2 {
  display: grid;
  place-items: center;
}

.paragraph {
  display: flex;
  justify-content: center;
  align-items: center;
}


.reverse-row-order {
  flex-direction: row-reverse;
}
.color_bg3 {

	background: url("../img/index/wasi_bg.png");
}


/*==================================================================================================
Flex
===================================================================================================*/

.flex-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:center;
    align-items: center;
    align-content:stretch;
    display: -webkit-flex;
    -webkit-flex-direction: row;
    -webkit-flex-wrap: nowrap;
	display: -ms-flex;
    -ms-flex-direction: row;
    -ms-flex-wrap: nowrap;
    }
    .flex-wrap.is-align-stretch { /* 上端揃え */
    align-items: stretch;
    }
    .flex-side-center { /* 子要素の左右の中央揃え IE一部バグあり */
    display: flex;
    justify-content: center;
    }
    .flex {
    flex: none;
    display: block;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
    width: 100%;
    box-sizing: border-box;
    }

@media screen and (max-width: 1087px) {
    .flex-wrap.is-tablet { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    .flex-wrap.is-tablet.is-pb-1 .flex { padding-bottom:1rem; }
    .flex-wrap.is-tablet.is-pb-2 .flex { padding-bottom:2rem; }
    .flex-wrap.is-tablet.is-pb-1 .flex:last-child { padding-bottom:0; }
    .flex-wrap.is-tablet.is-pb-2 .flex:last-child { padding-bottom:0; }
    }
@media screen and (max-width: 767px) {
    .flex-wrap.is-mobile { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    .flex-wrap.is-mobile.is-pb-1 .flex { padding-bottom:1rem; }
    .flex-wrap.is-mobile.is-pb-2 .flex { padding-bottom:2rem; }
    .flex-wrap.is-mobile.is-pb-1 .flex:last-child { padding-bottom:0; }
    .flex-wrap.is-mobile.is-pb-2 .flex:last-child { padding-bottom:0; }
    }


 .sp-none        { display:block;}
    .sp-inline-none { display:inline-block;}
	.sp-on{ display:none;}
	.tablet-on		{ display:none;}
	.tablet-none	{ display:block;}
@media screen and (max-width: 1200px) {
    
	.tablet-none2 img{ display:none;}
    }


@media screen and (max-width: 1024px) {
    .tablet-on		{ display:block !important;}
	.tablet-none	{ display:none;}
    }
@media screen and (max-width: 767px) {
    .sp-none		{ display:none;}
    .sp-inline-none { display:none;}
	.sp-on{ display:block;}
	.sp-text-l		{ text-align:left !important;}
	.sp-center		{ text-align:center;}
    }




.blog_bg {
width: 100%;
background:url("../img/index/blog_bg2.jpg") center no-repeat;
margin: 20px auto 0px!important;
height: 420px;

}

.f_bg{
background:url("../img/index/kari8.png");
	background-repeat: no-repeat;
	background-position:center bottom;
	padding:10px 0 20px;
	z-index: 99999;
}

.ap_bg2 {
	background: url("../img/index/kari6.png") center no-repeat;
}
.ap_bg {
	background: url("../img/index/kari5.png") center no-repeat;
}
.top_tel{
	position:absolute;
	left: 1%;
	top: 77%;
z-index: 9999999;

}
@media only screen and (orientation:landscape) {
  .top_tel{
	 top: 77%; 
	}
}


.sight-title {
    font-size:1.3125rem;
    color:#000000;
    font-weight:600;
    padding-top:.5rem;
	margin-bottom: -0.01rem;
  
    }

.cu_bg {
	background: url("../img/cuisine/cu_ttl_bg.png") center top;
	background-repeat: no-repeat;
}

#acs_logo img{
	text-align: center!important;
	display: block;
	margin-left: 2.5em;
}
#room_info img {
	width:622px;
	height: 119px;
}
@media screen and (max-width: 1087px) {
   #room_info img{width: 622px; height: auto;}
    }
@media only screen and (max-width: 767px) {
   #room_info img{width: 830px; height: auto;}
    }

#brerak_mi{
	width:240px;
	height: 95px;
	margin: 0px auto;
}

@media only screen and (max-width: 767px) {
   #brerak_mi img{width: 200px; height: auto;}
    }

#wa_room{
	width:274px;
	height: 49px;}

@media only screen and (max-width: 767px) {
   #wa_room img{width: 200px; height: auto;}
    }

#kensaku_mado{
	width:280px;
	height: 57px;}
@media only screen and (max-width: 767px) {
   #kensaku_mado img{width: 250px; height: auto;}
    }


.movie2{
width: auto;
text-align: center;
margin-bottom: 0;
}

  .movie2:before {
    content: "";
    display: block;
    padding-top: 49%; /* 調整ください */
    }
  
.movie_inner2{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
z-index: 999999999;
	
    }
    .movie_inner2 video{
	width:50%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
		margin-bottom: 0;
	/*object-fit: cover;*/
    }
    .movie_inner2:after {
	content:"";
    display: block;
    position: absolute;
    top:0;
    left:0;
	bottom: 0;
    width:100%;
   
z-index: 1;
    }

@media screen and (max-width: 1480px) {
    .movie2 video{ width: 80%; margin-bottom: 0;}
	.movie2:before {
padding-top: 58%; /* 調整ください */
    }
}
@media screen and (max-width: 1200px) {
    .movie2 video{ width: 80%; margin-bottom: 0;}
	.movie2:before {
padding-top: 44%; /* 調整ください */
    }
}
@media screen and (max-width: 767px) {
   /* .movie:before { padding-top: 80%;   }　調整ください */
       .movie2 video{ width: 100%;}
}


.movie3{
width: auto;
text-align: center;
margin-bottom: 0;
}

  .movie3:before {
    content: "";
    display: block;
    padding-top: 48%; /* 調整ください */
    }
  
.movie_inner3{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
z-index: 999999999;
	
    }
    .movie_inner3 video{
	width:100%;
	height:auto !important;
	margin-left:auto;
	margin-right:auto;
		margin-bottom: 0;
	/*object-fit: cover;*/
    }
    .movie_inner3:after {
	content:"";
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
   
z-index: 1;
    }

@media screen and (max-width: 1480px) {
    .movie3 video{ width: 100%; margin-bottom: 0;}
	.movie3:before {
padding-top: 58%; /* 調整ください */
    }
}
@media screen and (max-width: 1200px) {
    .movie3 video{ width: 100%; margin-bottom: 0;}
	.movie3:before {
padding-top: 44%; /* 調整ください */
    }
}
@media screen and (max-width: 767px) {
   /* .movie:before { padding-top: 80%;   }　調整ください */
       .movie3 video{ width: 100%;}
}
