/*------------------------------------
汎用
------------------------------------*/
html,body {overscroll-behavior: none;}
body {max-width: 768px; min-width: 320px; height: 100%; min-height: calc(100vh - 63px); padding-top: 63px;}

/*コンティナ*/
.container {width: calc(100% - 40px); margin: 0 auto;}

/*汎用flex*/
.flex {display: flex; flex: wrap;}
.flex-wrap {display: flex; flex-wrap: wrap; justify-content: space-around;}
.justify-center {justify-content: center;}

.margin-center {margin: 0 auto;}
.text-center {text-align: center;}

.pc {display: none;}
.tb {display: none;}
.sp {display: block;}

/* 店舗移転のため一時的にモーダルのようなスクロール禁止表示 */
.relocation-modal {
	position: fixed;
	z-index: 9999;
	top: 64px;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.85);
}
.relocation-modal .txt {
	position: fixed;
	z-index: 1;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background: #f2f2f2;
	padding: 20px;
	width: 85%;
}

/*------------------------------------
共通
------------------------------------*/
/* ローディング画面の背景 */
#loading {position: fixed; width: 100vw; height: 100vh; top: 0; left: 0; background: #000; z-index: 9999;}
#loading .animation {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; animation: loadinganimation 2500ms ease-out forwards;}
@keyframes loadinganimation {0% {opacity: 0;} 100% {opacity: 1;}}

/*汎用見出し*/
.arrow-heading {text-align: center; padding: 0 0 80px;}
.arrow-heading span {display: inline-block; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; font-size: 24px; line-height: 1; white-space: nowrap;}
.arrow-heading div {position: relative; width: 100%; height: 30px;}
.arrow-heading div:before,
.arrow-heading div:after {content: ''; position: absolute; display: block; background: #888; width: 50px; height: 1px;}
.arrow-heading div:before {bottom: 0px; left: calc(50% - 21px); transform: translate(-50%,0) rotate(30deg);}
.arrow-heading div:after {bottom: 0px; left: calc(50% + 21px); transform: translate(-50%,0) rotate(-30deg);}
.arrow-heading.title {margin: 0; padding: 80px 0; background: #fff url("../img/bg-fly-gray.png") bottom 20px right -135px no-repeat;}

.arrow-heading.en span {-webkit-writing-mode: horizontal-tb; -ms-writing-mode: horizontal-tb; writing-mode: horizontal-tb; font-size: 30px;}
.arrow-heading.en div:before,
.arrow-heading.en div:after {width: 32px;}
.arrow-heading.en div:before {left: calc(50% - 14px);}
.arrow-heading.en div:after {left: calc(50% + 14px);}

/*汎用見出し2*/
.flower {font-size: 20px; margin-bottom: 30px; text-align: center;}
.flower:before {content: ''; background: url("../img/flower.png") 0 0/20px 19px; display: inline-block; margin:0 5px -3px 0; width: 20px; height: 19px;}
.flower span {display: inline-block; font-size: 14px; margin-left: 1rem;}

/* ボタン */
.btn {text-align: center; margin: 40px 0;}
.btn-cross {
	display: block;
	position: relative;
	padding: 0.5em 0;
	border-top: solid 1px #473111;
	border-bottom: solid 1px #473111;
	font-weight: 700;
	font-size: 15px;
}
.btn-cross:before, .btn-cross:after {
	content: '';
	position: absolute;
	top: -15%;
	width: 1px;
	height: 130%;
	background-color: #473111;
	transform: rotate(0.00deg);
	transition: .3s ease;
}
.btn-cross:before {left: 7px;}
.btn-cross:after {right: 7px;}
.btn-cross:hover {opacity: 1;}
.btn-cross:hover:before {top: 0; left: 0; height: 100%;}
.btn-cross:hover:after {top: 0; right: 0; height: 100%;}

#front .room .btn,
#front .reserve .btn {padding: 0 20px;}

/*GOTOトラベルボタン*/
#single .single-item .btn-center {
	width: 100%;
	text-align: center;
}

#single .single-item .btn-flat-logo {
	position: relative;
	display: inline-block;
	text-align: center;
	padding: 0.5em 5em;
	color: #FFF;
	background: #333;
	transition: .4s;
	text-decoration: none;
	font-size: 15px;
}

/* ページの先頭へ */
#page_top {
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 50px;
	height: 50px;
	background: rgba(0,0,0, .5);
	opacity: 0;
	visibility: hidden;
	transition: .5s ease;
	z-index: 8000;
}
#page_top img {width: 22px;}
#page_top.active {opacity: 1; visibility: visible;}

/* back-img */
.back-img {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: -1;}
.back-img .img,
.back-img .dot {top:0; left: 0; width: 100%; height: 100vh;}
.back-img .img {position: fixed; background: url(../img/front/front_top.jpg) 50%/cover; z-index: 1;}
.back-img .dot {
	position: absolute;
	background-color: rgba(255, 255, 255, 0.10);
	background-image: radial-gradient(#000000 1%, transparent 18%),
	radial-gradient(#000000 1%, transparent 18%);
	background-position: 0 0, 3px 3px;
	background-repeat:repeat;
	background-size:3px 3px;
	z-index: 2;
}
.back-img-mg {margin-top: 100vh;} /* マージン */
.back-img-mg-under {margin-top: 50vh;} /* マージン(下層ページ) */

/* iPhone電話リンク無効 */
.disable-auto-tel a[href^="tel:"] {color: inherit; text-decoration: none; pointer-events: none;}

/* slider不要部分 */
img.n2-ow.nextend-shadow-image {display: none!important;}

.back-img .page-heading .inner .top-slider {
	width: 100%;
	height: 100vh;
}
.back-img .page-heading .inner .top-slider li {
	width: 100%;
	height: 100vh;
}
.back-img .page-heading .inner .top-slider li img {
	width: 100%;
	height: 100vh;
	object-fit: cover;
}
.n2-ss-slider .n2-ss-slider-controls-above, .n2-ss-slider .n2-ss-slider-controls-below {
	flex-flow: inherit!important;
}
/*------------------------------------
ヘッダー
------------------------------------*/
header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #000 url("../img/front/front-comment-bg.jpg");
	padding: 10px 15px;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
	box-shadow: 0 0 4px 4px rgba(0,0,0, .15);
	z-index: 9000;
}
header .logo {display: inline-flex; align-items: center;}
header .logo .h-logo {display: block; width: 45px; margin-right: 16px;}
header .logo .h-title {display: block; width: 149px;}
header #g-navi {
	display: block;
	position: fixed;
	top: 63px;
	right: 0;
	width: 300px;
	height: calc(100vh - 63px);
	background: #000 url("../img/front/front-comment-bg.jpg");
	transform: translateX(100%);
	transition: .6s ease;
	z-index: 9000;
}
header #g-navi a {
	display: block;
	color: #fff;
	line-height: 1;
	margin: 0 20px;
	padding: 15px 0;
	border-bottom: 1px solid #666;
}
header #g-navi a:last-child {border-bottom: none;}
header #g-navi a span {display: block; color: #fff; text-align: center;}
header #g-navi a span.jp {font-size: 16px; line-height: 1.5;}
header #g-navi a span.en {font-size: 10px; letter-spacing: 2px;}

header #nav-toggle {
	position: absolute;
	right: 15px;
	top: 10px;
	width: 42px;
	height: 42px;
	border: 1px solid #fff;
	border-radius: 5px;
	cursor: pointer;
	z-index: 9001;
}

header #nav-toggle div {
	position: absolute;
	left: 13px;
	width: 16px;
	height: 2px;
	background: #fff;
	opacity: 1;
	transition: .6s ease;
}
header #nav-toggle div:nth-child(1) {top: 14px;}
header #nav-toggle div:nth-child(2) {top: 20px;}
header #nav-toggle div:nth-child(3) {top: 26px;}

#overlay {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: -1;
	background: #000;
	opacity: 0;
	visibility: hidden;
	transition: .6s ease;
	cursor: pointer;
}
.nav-open header #g-navi {transform: translateX(0);}
.nav-open header #nav-toggle div:nth-child(1) {transform: rotate(45deg); top: 20px;}
.nav-open header #nav-toggle div:nth-child(2) {opacity: 0;}
.nav-open header #nav-toggle div:nth-child(3) {transform: rotate(-45deg); top: 20px;}
.nav-open #overlay {opacity: .5; visibility: visible; z-index: 8999;}

/*-------------------------------------
フッター
--------------------------------------*/
footer {background: #fff; padding: 30px 0;}

footer .reserve {background: #fff; padding: 80px 20px 30px;}
footer .reserve a {text-decoration: none;}
footer .reserve .tel {display: inline-flex; justify-content: center; align-items: center;}
footer .reserve .tel img {width: 40px; margin: 0 10px 5px 0;}
footer .reserve .tel span {font-size: 26px;}
footer .reserve .time {font-size: 16px;}

footer .info .footer-title {display: inline-block; font-size: 16px;}
footer .info .icon {display: block; margin: 0 auto 15px;}
footer .info address {font-size: 12px; margin:0 0 20px;}
footer .info .copy {font-size: 10px;}

/*-------------------------------------
トップページ
--------------------------------------*/
/* comment */
#front .comment {background: url("../img/bg-fly.png") 50% 95% no-repeat, #fff url("../img/front/front-comment-bg.jpg") center; padding: 80px 0; text-align: center;}
#front .comment h1 img {display: block; width: 79px; margin: 0 auto 50px;}
#front .comment p {-webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-align: left; vertical-align: middle; display: inline-block; margin: 0 auto; font-size: 16px; color: #fff; white-space: nowrap;}

/* open
#front .open {text-align: center; background: #fff; padding: 60px 0 60px;}
#front .open h2 {font-size: 18px;}
#front .open p {font-size: 14px; line-height: 1.5;color: #5E3819;}
*/

/* menu */
#front .menu {background:#fff url("../img/front/front-menu-bg.jpg") no-repeat center center/cover; padding: 80px 20px 20px;}
#front .menu > .flex {display: block;}
#front .menu .circle{
	font-size: 25px;
	display: block;
	margin: 0 auto 0;
	width: 125px;
	height: 125px;
	border: 1px solid #000;
	border-radius: 50%;
	text-align:center;
	line-height: 127px;
	margin-bottom: 30px;
}
#front .menu .lunch,
#front .menu .dinner {display: block; margin-bottom: 40px;}
#front .menu .lunch .circle {background: none; color: #000;}
#front .menu .dinner .circle {background: #000; color: #fff;}
#front .menu .menu-text {text-align: center;}
#front .menu .menu-text div {display: inline-block;}
#front .menu .menu-text div p {font-size: 19px; line-height: 1.5; text-align: left;}
#front .menu .menu-text div p:nth-child(2) {margin-bottom: 10px;}
#front .menu .menu-text .menu-details {font-size:13px;}
#front .menu .menu-text .indent {text-indent: -0.5rem;}

/* room */
#front .room {background: #fff; padding: 80px 0 10px; text-align: center;}
#front .room .room-about {display: inline-block;}
#front .room .room-about dl {display: flex;}
#front .room .room-about dl dt {margin-right: 15px;}
#front .room .room-about dl dt,
#front .room .room-about dl dd{font-size: 16px;}
#front .room .room-img {display: flex; flex-wrap: wrap; margin-bottom: 30px; width: 100%;}
#front .room .room-img img {margin: 0 auto; width: 50%; height:130px; display:block; object-fit: cover; object-position: 50%; font-family: ('object-fit: cover; object-position: 50%;');}

/* newly */
#front .newly {background:#fff url("../img/front/front-news-bg.jpg") top left; text-align: center; padding: 80px 0 0;}
#front .newly .newly-box {display: block; margin: 0 20px; padding-bottom: 60px;}
#front .newly .newly-box dl {border-bottom: 1px solid #aaa; padding: 8px 10px;}
#front .newly .newly-box dl:last-of-type {border-bottom: none;}
#front .newly .newly-box dl a {display: block; text-align: left;}
#front .newly .newly-box dl dt,
#front .newly .newly-box dl dd {font-size: 15px; line-height: 1.8;}
#front .newly .newly-box dl dt {font-size: 13px;}
#front .newly .newly-more {display: inline-flex; align-items: center; margin: 10px 0 0 0; float: right;}
#front .newly .newly-more span {display: block; font-size: 14px; line-height: 1;}
#front .newly .newly-more img {margin-left: 8px; width: 14px;}

#front .newly .img-item-nav {cursor: pointer; cursor: hand;}

/*-------------------------------------
お品書きページ　menu
--------------------------------------*/
/* menu 共通 */
#nemu-img .back-img .img {position: fixed; background-image: url(../img/menu/menu_top.jpg); z-index: 1;}

#menu .container {padding: 40px 0;}
#menu .menu-box .menu-item {flex-direction:column;}
#menu .menu-box .menu-item .flex-center {padding: 40px 0;}
#menu .menu-box .menu-item .menu-img {width: calc(100% + 40px); height: 240px; margin: 0 -20px;}
#menu .menu-box .menu-item .menu-img img {margin: 0 auto; width: 100%; height:100%; display:block; object-fit: cover; object-position: 50%; font-family: ('object-fit: cover; object-position: 50%;');}
#menu .menu-box .menu-item .menu-text {text-align: center;}
#menu .menu-box .menu-item .menu-text h3 {font-size: 22px; line-height: 1.5; text-align: center;}
#menu .menu-box .menu-item .menu-text h3 span {display: block; line-height: 1.5; margin-bottom: 5px;}
#menu .menu-box .menu-item .menu-text .price {display: block; font-size: 19px; margin-bottom: 20px;}
#menu .menu-box .menu-item .menu-text .course {font-size: 14px; line-height: 1.75; text-align: left; margin: 10px 0 0;}
#menu .menu-box .menu-item .menu-text .tax {display: inline-block; color: #5E3819; font-size: 12px; letter-spacing: 0; border: 1px solid #5E3819; margin-top: 25px; padding: 2px 10px;}
#menu .menu-box .menu-item .menu-text .an-image {font-size: 12px; margin-top: 5px;}

/* lunch */
#menu .lunch {background: #F2F2F2;}
#menu .lunch .menu-box .menu-item .menu-text{background: url("../img/rhombus.png") center top no-repeat; padding-top: 60px;}
#menu .lunch .menu-box .menu-item .menu-text .price {color:#4d4d4d;}

/* dinner */
#menu .dinner {background: #000 url("../img/front/front-comment-bg.jpg") center/auto;}
#menu .dinner small,
#menu .dinner .menu-box h3,
#menu .dinner .menu-box h3 span,
#menu .dinner .menu-box .menu-item p {color: #fff;}
#menu .dinner .menu-box .menu-item .menu-text{background: url("../img/wave.png") center top no-repeat; padding-top: 40px;}
#menu .dinner .menu-box .menu-item .menu-text .tax {border-color:#fff; color: #fff;}

#menu small {display: block; font-size: 12px;}
#menu small.explan {margin: -20px 0 40px; text-align: center;}
#menu .notice {margin-top: 25px;}

#menu.en .menu-box .menu-item .menu-text h3 {font-size: 22px;}
#menu.en .menu-box .menu-item .menu-text .price {font-size: 19px;}
#menu.en .menu-box .menu-item .menu-text .course {font-size: 13px;}

/*-------------------------------------
お部屋ページ　room
--------------------------------------*/
#room-img .back-img .img {
	position: fixed;
	background-image: url(../img/room/counter_03.jpg);
	z-index: 1;
	object-fit: contain;
	top: -250px;
}

#room {background: #fff url("../img/room/room_bg.jpg") top left/contain;}
#room .container {padding: 40px 0;}
#room .box {margin-bottom: 40px;}
#room .box figure {display: block; width: 100%; margin-bottom: 20px;}
#room .box figure:last-child {margin-bottom: 0;}
#room .box figure img {display: block; width: 100%; height: 280px; object-fit: cover; object-position: 50%; font-family: ('object-fit: cover; object-position: 50%;');}
#room .box figcaption {font-size: 14px; background: #fff; padding: 5px 10px;}
#room .btn {margin: 40px auto;}
#room .btn-cross:hover:before {top: -15%; left: 7px; height: 130%;}
#room .btn-cross:hover:after {top: -15%; right: 7px; height: 130%;}
/*-------------------------------------
メインスライダー　room
--------------------------------------*/
#room.room {
	position: relative;
}
#room.room .container_room {
	padding: 40px 0;
}
#room.room .container_room h3 {
	width: 100%;
	text-align: left;
	padding-left: 20px;
}
#room.room .container_room figcaption {
	width: 90%;
	margin: auto;
	font-size: 16px;
	padding: 20px 0 5px;
}
#room.room .heading-box {
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
	height: 60rem;
}
#room.room .heading-box .text-treat {
	position: absolute;
}
#room.room .heading-box h2 {
	position: absolute;
	height: auto;
	color: #fff;
	font-weight: 700;
	line-height: 1;
	font-size: 3.6rem;
	padding: 9.4rem 0 4.1rem 3.6rem;
	margin-left: 35.4%;
}
#room.room .heading-box h2 span {
	color: #fff;
	display: inline-block;
	margin-left: 4rem;
}
#room.room .heading-box h2:before {
	content: "";
	height: 0;
	display: block;
	position: absolute;
	left: 0;
	background: #988061;
	transition: all .5s cubic-bezier(0.05, 0.54, 0.6, 0.94);
	transition-delay: .1s;
	width: 0.2rem;
	top: -3.4rem;
	background: linear-gradient(180deg, #988061 19%, #fff 19%);
}
#room.room .heading-box h2.effect_on:before {
	height: 17.9rem;
}
#room.room .slick-wrap {
	justify-content: center;
    flex-direction: column;
    align-items: center;
}
#room.room .desc-wrap {
	padding: 9rem 17.7% 24rem;
}
#room.room .slick-wrap .room-slider {
	width: 95%;
}
#room.room .slick-wrap .room-thumb-list {
	width: 90%;
    display: flex;
    flex-wrap: wrap;
    margin: 1rem auto 0;
}
#room.room .slick-wrap .room-thumb-list li {
	height: 100px;
	width: calc(100% / 2 - 3px);
	margin-top: 7px;
}
#room.room .slick-wrap .room-slider .slick-list ,
#room.room .slick-wrap .room-slider .slick-list .slick-track,
#room.room .slick-wrap .room-slider .slick-list .slick-track,
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide,
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div,
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li,
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li,
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li img {
	height: 252px;
	margin: auto;
}
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li .img {
	position: relative;
	background: #fff;
}
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li .img img {
	object-fit: cover;
	object-position: 50%;
	font-family: "object-fit: cover; object-position: 50%;";
}
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li:last-child .img img {
	max-width: 75rem;
}
#room.room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li:last-child .img img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	object-fit: contain;
	font-family: "object-fit: contain;";
}
#room.room .slick-wrap .room-thumb-list li {
	cursor: pointer;
	position: relative;
	transition: .2s ease;
	margin-right: 6px;
}
#room.room .slick-wrap .room-thumb-list li:nth-child(even) {
	margin-right: 0;
}
#room.room .slick-wrap .room-thumb-list li:hover {
	opacity: .6;
	cursor: pointer;
}
#room.room .slick-wrap .room-thumb-list li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
	font-family: "object-fit: cover; object-position: 50% 50%;";
}
#room.room .desc-wrap .desc-text {
	border-bottom: 1px solid #988061;
}
#room.room .facility_link {
	color: #988061;
	float: right;
}
#room.room .facility_link:hover {
	opacity: 1;
	color: #ec6e03;
}
#room.room dl {
	flex-wrap: wrap;
	padding: 7.5rem 0 11rem;
}
#room.room dl dt {
	width: 22%;
}
#room.room dl dd {
	width: 78%;
}
#room.room .slick-slide img {
	height: auto;
    object-fit: cover;
}
#room.room:nth-of-type(2) .heading-box .text-treat {
	top: -1rem;
	left: -5rem;
	width: 26.7rem;
}
#room.room:nth-of-type(3) .heading-box .text-treat {
	top: -2rem;
	left: 0;
	width: 20.6rem;
}
#room.room:nth-of-type(4) .heading-box .text-treat {
	top: -3.5rem;
	left: -1rem;
	width: 21.2rem;
}
#room.room:nth-of-type(5) .heading-box .text-treat {
	top: -1rem;
	left: -0.8rem;
	width: 21.2rem;
}
#room.room .desc-wrap .desc-text {
	padding-bottom: 8rem;
}
/*-------------------------------------
アクセスページ　access
--------------------------------------*/
#access-img .back-img .img {position: fixed; background: url(../img/access/access_top.jpg) 50% 40%/cover; z-index: 1;}

#access {background: #000 url("../img/front/front-comment-bg.jpg") 0/100%;}
#access .container {padding: 40px 0;}
#access h2{color: #fff;}
#access .access-img{margin-bottom: 40px;}
#access .access-img img{margin-bottom: 25px; width:100%; height: 250px; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50% 50%;';}
#access dl{margin-bottom: 40px;}
#access dl dt{width: 104px; padding:5px 8px; border:#fff solid 1px; font-size: 17px; color: #fff; display: flex; justify-content: space-around; margin: 0 auto 20px;}
#access dl dt span{color: #fff; font-size: 17px;}
#access dl dd{color: #fff; font-size: 18px; margin-left: 1rem;text-align: center; margin: 0; line-height: 1.5;}
#access dl dd a {color: #fff;}
#access .access-map {width: 100%; height: 65vh; background: #fff; margin-bottom: 40px;}
#access .access-map iframe {width: 100%; height: 100%;}
#access .access h3 {align-items: baseline; color: #fff; font-size: 20px;}
#access .access h3 img {display: block; width: 14px; margin-right: 8px;}
#access .access p {color: #fff; font-size: 16px;}
#access .notice {margin-top: 20px;}
#access .notice p {color: #fff;}
#access .notice a {color: #fff; text-decoration: underline;}
#access .about {margin: 20px 0 50px;}
#access .about .logo {justify-content: center; align-items: center;}
#access .about .logo .h-logo {display: block; width: 68px; margin-right: 16px;}
#access .about .logo .h-title {display: block; width: 224px;}
#access .about p {color: #fff; text-align: center; margin-top: 10px;}

/*-------------------------------------
ご予約ページ　reserve
--------------------------------------*/
#reserve {background: #f2f2f2; position: relative;}
#reserve .container {padding: 40px 0;}


/* aikou  反映済み*/
#reserve .container > .note{
	margin-bottom: 30px;
}
#reserve .container > .note p:first-child{
	margin-bottom: 8px;
}


#reserve .reserve-form {background: #f2f2f2; padding: 0;}
#reserve .reserve-form dl {margin: 0 auto 20px;}
#reserve .reserve-form dl dt {}
#reserve .reserve-form dl dt span {color: #FF0000; font-size: 12px; margin-left: 0.5rem;}
#reserve .reserve-form dl dt .requ {color:#fff; background: #f30; margin-right: 1rem; padding: 3px 5px;}
#reserve .reserve-form dl dd {}

#reserve .reserve-form input[type="text"],
#reserve .reserve-form input[type="email"],
#reserve .reserve-form input[type="tel"],
#reserve .reserve-form input[type="date"],
#reserve .reserve-form input[type="number"],
#reserve .reserve-form select {max-width: 100%; border: #ccc solid 1px; padding: 3px 10px; background: #fff; box-sizing: border-box;}
#reserve .reserve-form input[type="text"],
#reserve .reserve-form input[type="email"],
#reserve .reserve-form input[type="tel"] {width: 100%;}

#reserve .reserve-form input[type="submit"] {
	display: block;
	width: 50%;
	margin: 40px auto 0;
	padding: 15px;
	border-radius: 10px;
	box-shadow: 0 3px 0 #000;
	background: #333;
	color: #fff;
}
#reserve .reserve-form input[type="submit"]:active {box-shadow: none; transform: translate3d(0px, 3px, 1px);}

.wpcf7-validation-errors{border: none!important; text-align: center; color: #f30;}

/*-------------------------------------
新着情報アーカイブ
--------------------------------------*/
#news{background: #f2f2f2;}
#news .container {padding: 40px 0;}
#news .news-item {display: block; background: #fff; margin-bottom: 20px; padding: 15px; box-sizing: border-box;}
#news .news-item .news-img {width: 100%; height: 240px; margin-bottom: 15px; border: 1px solid #f2f2f2;}
#news .news-item .news-img img {width: 100%; height: 100%;  object-fit: cover; object-position: center; font-family: 'object-fit: cover; object-position: center;'}
#news .news-item .news-text {width: 100%;}
#news .news-item .news-text h2 {font-size: 20px; line-height: 1.5; margin-bottom: 5px;}
#news .news-item .news-text time {align-items: center; font-size: 14px; margin-bottom: 5px;}
#news .news-item .news-text time img {width: 14px; margin-right: 5px;}
#news .news-item .news-text p {font-size: 13px;}

#news .pager {justify-content: center; margin-top: 60px;}
#news .pager span,
#news .pager a {margin-left: -1px;}
#news .pager a {display: block;}
#news .pager a:hover{background: #000; color: #fff; opacity: 1;}
#news .pager .current{background: #000; color: #fff;}
#news .pager .page-numbers{border: 1px solid #000; padding: 12px 16px;}

/*-------------------------------------
新着情報シングルページ
--------------------------------------*/
#single {background: #f2f2f2 url("../img/bg-fly-gray.png") bottom 20px right -135px no-repeat;}
#single .container {padding: 40px 0;}
#single h1.title {padding-top: 143px;}
#single h1.head {font-size: 20px; line-height: 1.5; margin: 0 0 5px; padding-bottom: 8px; border-bottom: 1px solid #000; text-align: left; text-indent:-1.3em; padding-left: 1.3em;}
#single time {align-items: center; font-size: 12px; margin: 0 0 20px 3px;}
#single time img {width: 12px; margin-right: 5px;}
#single .single-item .single-img {margin-bottom: 30px; width: 100%; height: 300px;}
#single .single-item .single-img img {width: 100%; height: 100%;  object-fit: cover; object-position: center; font-family: 'object-fit: cover; object-position: center;'}

#single .post-link {margin-top: 30px;}
#single .post-link a {
	margin-bottom: 10px;
	position: relative;
	display: block;
	padding: .6em 1.5em;
	background-color: #333;
	border: 2px solid #333;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: all .3s;
	font-size: 11px;
}
#single .post-link .next a{padding-left: 3em;}
#single .post-link .next a:after {
	position: absolute;
	top: 50%;
	left: .3em;
	content: '';
	margin-top: -5px;
	border: 7px solid transparent;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-left-color: #fff;
	transition: all .3s;
	transform: rotate(180deg);
}
#single .post-link .home a{}
#single .post-link .previous a{padding-right: 3em;}
#single .post-link .previous a:after {
	position: absolute;
	top: 50%;
	right: .3em;
	content: '';
	margin-top: -5px;
	border: 7px solid transparent;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-left-color: #fff;
	transition: all .3s;
}
#single .post-link a:active {
	background-color: #fff;
	color: #000;
}
#single .post-link a:active:after {
	border-left-color: #333;
}

#single .single-item {font-size: 14px;}
#single .single-item p {margin-bottom: 30px;}
#single .single-item h2 {font-size: 22px; font-weight: 700; line-height: 1.5; margin: 0 0 30px;}
#single .single-item h3 {font-size: 19px; font-weight: 700; line-height: 1.5; margin: 0 0 30px;}
#single .single-item h4 {font-size: 16px; font-weight: 700; line-height: 1.5; margin: 0 0 30px;}

#single .single-item a {text-decoration: underline;}
#single .single-item strong {font-weight: 700;}
#single .single-item em {font-style: italic;}
#single .single-item ul,
#single .single-item ol {margin-bottom: 30px; padding-left: 1.5rem;}
#single .single-item ul li {list-style-type: disc;}
#single .single-item ol li {list-style-type: decimal;}
#single .single-item blockquote {background: #fff; padding: 1.25rem 1.75rem; margin-bottom: 30px;}
#single .single-item blockquote p:last-child {margin-bottom: 0;}
#single .single-item hr {border-color: #000; margin: 30px 0;}

#single .single-item img {display: block;}
#single .single-item .alignleft {margin-right: auto; float: none;}
#single .single-item .aligncenter {margin: 0 auto; float: none;}
#single .single-item .alignright {margin-left: auto; float: none;}
#single .single-item .wp-caption {max-width: 100%; margin: 0 0 30px; float: none;}
#single .single-item .wp-caption img {width: 100%; height: auto;}
#single .single-item .wp-caption .wp-caption-text {background: #fff; margin: 0; padding: 5px 10px; box-sizing: border-box;}

/*-------------------------------------
404ページ
--------------------------------------*/
#no-page{background: #f2f2f2 url("../img/bg-fly-gray.png") bottom 20px right -135px no-repeat; height: 100vh; display: flex; justify-content: center; align-items: center;}
#no-page .container {text-align: center;}
#no-page h1 {font-size: 36px; font-weight: 700; line-height: 1; margin-top: 40px;}
#no-page p {font-size: 16px;}
#no-page p.small {font-size: 13px; margin: 10px 0 30px;}






/*-------------------------------------
店舗移転前ご予約ページ修正 aikou 反映済み
--------------------------------------*/
.container {
    width: calc(100% - 20px);
    margin: 0 auto;
}

#reserve .reserve-form input[type="text"],
#reserve .reserve-form input[type="email"],
#reserve .reserve-form input[type="tel"] {
	width: 100%;
	box-sizing: border-box;
}
#reserve .reserve-form .caption dd{
  margin-bottom: 30px;
  padding-left: 6px;
}
#reserve .reserve-form dl {
	/* width: 740px; */
}
#reserve .reserve-form dl.group-lunch dd select,
#reserve .reserve-form dl.group-dinner dd select {
	width: 100%;
	cursor: pointer;
	font-size: 11px;
	padding: 7px 5px;
}
#reserve .reserve-form dl.group-dinner {
	/* position: relative; */
	/* top: 0px; */
}
#reserve .reserve-form .selectable dd {
	margin-top: -20px;
}

.reserve-page .btn.opac {
	position: relative;
}
.reserve-page .btn.opac .external-icon {
	width: 12px;
	height: 12px;
	object-fit: contain;
	position: absolute;
	top: 50%;
	left: unset;
	right: 28%;
	transform: translate(-50%, -50%);
}