@charset "UTF-8";
@import url("colorbox.css");

#header {
 animation: down 0.5s both;
 animation-delay: 1.5s;
}
.header_logo {
 display: none;
}
.contbox {
 width: auto;
 padding: 110px 20px 20px;
}
.subTitle {
 font-size: 3rem;
 margin: 0 0 60px;
 text-align: center;
}
.subTitle i {
 font-size: 4rem;
}
.cont.on {
 animation: f_in 1s both;
 animation-delay: 0.25s;
}
@media only screen and (max-width: 768px) {
 #header {
  animation: none;
 }
 .subTitle {
  margin: 0 0 40px;
 }
 .cont.on {
  animation: none;
 }
}

/*  ---------------------------
			TOP
---------------------------  */
#top {
 width: 100%;
 height: 100vh;
 overflow: hidden;
 z-index: 2;
 position: relative;
 background: #000;
}
#topimgslide {
 width: 100vw;
 height: 100vh;
 z-index: 0;
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
}
#topimgslide .over {
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 display: block;
 width: 100vw;
 height: 100vh;
 background: rgba(0, 0, 0, 1);
 animation: f_out 2s both;
 animation-delay: 1.5s;
 z-index: 1;
}
.bxslider li {
 display: block;
 width: 100vw;
 height: 100vh;
 background: #fff;
 background-repeat: no-repeat;
 background-position: 50% 50%;
 background-size: cover;
}
.bxslider li.top_01 {
 background-image: url(../img/pic_topslide_01.jpg);
}
.bxslider li.top_02 {
 background-image: url(../img/pic_topslide_04.jpg);
}
.bxslider li.top_03 {
 background-image: url(../img/pic_topslide_03.jpg);
}
#top #titleArea {
 width: 50%;
 max-width: 974px;
 padding: 90px 0 0;
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate3d(-50%, -50%, 0);
 -ms-transform: translate3d(-50%, -50%, 0);
 transform: translate3d(-50%, -50%, 0);
}
#top #titleArea #titlelogo {
 animation: up 1s both;
 animation-delay: 1s;
}
/*#top #titleArea #itemDate {
	animation: up 1s both;
	animation-delay: 1.25s;
}*/
.snsbtn {
 width: auto;
 margin: 40px 0 0;
 text-align: center;
}
.snsbtn li {
 display: inline-block;
 margin: 0 14px;
 padding: 0 5px;
 text-align: center;
}
.snsbtn li a {
 width: 60px;
 padding: 58px 0px 0;
 overflow: inherit;
 border-radius: 50%;
 border: 1px solid rgba(255, 255, 255, 0.8);
 background-color: rgba(0, 0, 0, 0.2);
 background-repeat: no-repeat;
 background-position: 50% 50%;
 -webkit-transition: all 0.2s 0s ease-out;
 -moz-transition: all 0.2s 0s ease-out;
 transition: all 0.2s 0s ease-out;
}
.snsbtn li.re {
 animation: up 1s both;
 animation-delay: 2s;
}
.snsbtn li.fb {
 animation: up 1s both;
 animation-delay: 2.25s;
}
.snsbtn li.in {
 animation: up 1s both;
 animation-delay: 2.5s;
}
.snsbtn li.re a {
 background-color: rgba(255, 255, 255, 0.8);
 background-image: url(../img/ico/ico_re_bk.svg);
 background-size: 24px 24px;
}
.snsbtn li.fb a {
 background-image: url(../img/ico/ico_fb_w.svg);
 background-size: 20px 20px;
}
.snsbtn li.in a {
 background-image: url(../img/ico/ico_in_w.svg);
 background-size: 20px 20px;
}
.snsbtn li span {
 color: #fff;
 font-size: 1.32rem;
 letter-spacing: 0.05em;
 padding: 10px 0 0;
 display: block;
}
.snsbtn li span {
 line-height: 1;
}
.snsbtn li a:hover {
 -webkit-transform: scale(1.35);
 -moz-transform: scale(1.35);
 -o-transform: scale(1.35);
 -ms-transform: scale(1.35);
 transform: scale(1.35);
}
#newsBox {
 position: absolute;
 bottom: 24px;
 left: 10px;
 width: 35%;
 color: #fff;
 animation: up 1s both;
 animation-delay: 1.5s;
}
#newsBox .title {
 display: inline-block;
 border: 1px solid rgba(255, 255, 255, 0.8);
 padding: 4px 10px;
 margin: 0 0 10px;
 font-size: 1.4rem;
 letter-spacing: 0.05em;
}
#newsBox .title i {
 font-size: 1.8rem;
}
#newsBox p {
 color: #fff;
 padding: 0px;
 font-size: 1.2rem;
 letter-spacing: 0.05em;
}
#newsBox p time {
 float: left;
}
#newsBox p a {
 color: #fff;
 padding-left: 86px;
 display: block;
 line-height: 1.5;
}
#newsBox p a:hover {
 text-decoration: underline;
}
#infoBox {
 position: absolute;
 bottom: 24px;
 right: 10px;
 text-align: right;
 color: #fff;
 animation: up 1s both;
 animation-delay: 1.5s;
}
#infoBox .address {
 font-size: 1.3rem;
 letter-spacing: 0.1em;
 padding: 0 0 4px;
}
#infoBox mark {
 display: inline-block;
 background: none;
 position: relative;
 top: 6px;
 padding: 10px 0 0;
}
#infoBox mark a {
 display: block;
 width: 24px;
 height: 24px;
 background: url(../img/ico/ico_map_w.svg) no-repeat 100% 50%;
 background-size: auto 100%;
 -webkit-transition: all 0.2s 0s ease-out;
 -moz-transition: all 0.2s 0s ease-out;
 transition: all 0.2s 0s ease-out;
 opacity: 0.7;
}
#infoBox mark a:hover {
 -webkit-transform: scale(1.25);
 -moz-transform: scale(1.25);
 -o-transform: scale(1.25);
 -ms-transform: scale(1.25);
 transform: scale(1.25);
 opacity: 1;
}
#infoBox .tel {
 font-size: 2.2rem;
 line-height: 1.3;
 letter-spacing: 0.08em;
 padding: 0 28px 0 0;
}
#sc {
 position: absolute;
 bottom: 5px;
 left: 50%;
 margin-left: -7px;
 width: 14px;
 height: 95px;
 color: #fff;
 background: url(../img/ico/ico_ar_top.svg) no-repeat 50% 0;
 background-size: 100% auto;
 cursor: pointer;
 opacity: 0.7;
 animation: down_sc 0.5s both;
 animation-delay: 3.5s;
}
#sc span {
 font-size: 1.4rem;
 letter-spacing: 0.1em;
 position: absolute;
 bottom: 30px;
 left: 14px;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 -webkit-transform-origin: left top;
 -ms-transform-origin: left top;
 transform-origin: left top;
 -webkit-transform: rotate(90deg);
 -ms-transform: rotate(90deg);
 transform: rotate(90deg);
}
#sc:hover {
 opacity: 1;
 background-position: 50% 90%;
}
#sc:hover span {
 opacity: 0;
}

@media only screen and (max-width: 768px) {
 #top {
  z-index: 1;
 }
 #topimgslide .over {
  background: rgba(0, 0, 0, 3);
  animation: f_out_sp 2s both;
  animation-delay: 1.5s;
 }
 .bxslider li {
  display: block;
  width: 100vw;
  height: 100vh;
  background: #fff;
  background-repeat: no-repeat;
  background-position: 38% 50%;
  background-size: cover;
 }
 .bxslider li.top_01 {
  background-image: url(../img/pic_topslide_01_sp.jpg);
 }
 .bxslider li.top_02 {
  background-image: url(../img/pic_topslide_04_sp.jpg);
 }
 .bxslider li.top_03 {
  background-image: url(../img/pic_topslide_03_sp.jpg);
 }
 #top #titleArea {
  width: 85%;
  max-width: inherit;
  padding: 110px 0 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
  -ms-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
 }
 #top #titleArea #titlelogo {
  animation: up 1s both;
  animation-delay: 1s;
 }
 #top #titleArea #itemDate {
  animation: up 1s both;
  animation-delay: 1.25s;
 }
 .snsbtn {
  width: auto;
  margin: 20px 0 0;
  text-align: center;
 }
 .snsbtn li {
  margin: 0 8px;
 }
 .snsbtn li a:hover {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
 }
 .snsbtn li a.touch {
  -webkit-transform: scale(1.35);
  -moz-transform: scale(1.35);
  -o-transform: scale(1.35);
  -ms-transform: scale(1.35);
  transform: scale(1.35);
 }
 #newsBox {
  display: none;
  position: relative;
  bottom: inherit;
  left: 0;
  width: 100%;
  color: #000;
  animation: none;
  padding: 30px 15px;
  background: rgba(255, 255, 255, 1);
  text-align: center;
 }
 #newsBox .title {
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 4px 10px;
  margin: 0 auto 15px;
  font-size: 2.2rem;
  letter-spacing: 0.05em;
 }
 #newsBox .title i {
  font-size: 2.6rem;
 }
 #newsBox p {
  color: #000;
  padding: 0px;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  text-align: center;
 }
 #newsBox p time {
  float: none;
  margin: 0 0 5px;
 }
 #newsBox p a {
  color: #000;
  font-size: 1.6rem;
  padding-left: 0;
  display: block;
  line-height: 1.8;
  opacity: 1;
 }
 #newsBox p a:hover {
  opacity: 1;
 }
 #infoBox {
  bottom: 15px;
  right: 5px;
  left: 5px;
  text-align: center;
 }
 #infoBox .address {
  font-size: 1.2rem;
  padding: 0;
 }
 #infoBox mark a:hover {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 0.7;
 }
 #infoBox mark a.touch {
  -webkit-transform: scale(1.25);
  -moz-transform: scale(1.25);
  -o-transform: scale(1.25);
  -ms-transform: scale(1.25);
  transform: scale(1.25);
  opacity: 1;
 }
 #infoBox .tel {
  font-size: 2rem;
  line-height: 1.3;
  letter-spacing: 0.08em;
  padding: 0 24px 0 0;
 }
 #infoBox .tel a {
  color: #fff;
 }
 #sc {
  display: none;
  bottom: 100px;
  margin-left: -6px;
  width: 12px;
  height: 50px;
  background: url(../img/ico/ico_ar_top.svg) no-repeat 50% 90%;
  background-size: 100% auto;
 }
 #sc span {
  display: none;
 }
 #sc:hover {
  opacity: 0.7;
  background-position: 50% 90%;
 }
}

@media only screen and (max-width: 350px) {
 #top #titleArea {
  width: 94%;
  padding: 30px 0 0;
 }
 #sc {
  bottom: 80px;
 }
}

/*  ---------------------------
			menu
---------------------------  */
#menu {
 width: 100%;
 position: relative;
 color: #000;
 padding: 80px 0px 60px;
 background: #493828;
}
#menu .contbox {
 padding: 0;
 background: url(../img/item_menu_bg_middle.jpg) repeat-y 50% 0;
}
#menu .contbox:before {
 content: "";
 display: block;
 width: auto;
 height: 120px;
 background: url(../img/item_menu_bg_over.jpg) no-repeat 50% 0;
}
#menu .contbox:after {
 content: "";
 display: block;
 width: auto;
 height: 100px;
 background: url(../img/item_menu_bg_under.jpg) no-repeat 50% 100%;
}
#menu .inner {
 width: 1000px;
 margin: 0 auto;
 padding: 36px 0 0;
}
#menu .subTitle div {
 display: inline-block;
 margin: 0 auto;
 padding: 1px 0;
 border-top: 3px solid #000;
 border-bottom: 1px solid #000;
}
#menu .subTitle div span {
 display: inline-block;
 margin: 0 auto;
 padding: 2px 30px;
 border-top: 1px solid #000;
 border-bottom: 3px solid #000;
}
#menu .subTitle {
 font-size: 3.6rem;
 margin: 0 0 48px;
}
#menu .subTitle i {
 font-size: 4.4rem;
}
/* #selectTab */
#selectTab {
 overflow: hidden;
 margin: 0 0 40px;
}
#selectTab ul {
 padding: 0px;
 height: 50px;
}
#selectTab ul:before,
#selectTab ul:after {
 content: "";
 display: block;
 float: left;
 display: block;
 width: 330px;
 height: 50px;
 border-bottom: 1px solid rgba(0, 0, 0, 1);
}
#selectTab ul li {
 float: left;
 display: block;
 width: 170px;
 height: 50px;
}
#selectTab ul li a {
 display: block;
 width: 170px;
 height: 50px;
 font-size: 2rem;
 padding: 10px 0 0;
 border-top: 1px solid rgba(0, 0, 0, 0);
 border-bottom: 1px solid rgba(0, 0, 0, 1);
 text-align: center;
 cursor: pointer;
}
#selectTab ul li.current a {
 border: 1px solid rgba(0, 0, 0, 1);
 border-bottom: none;
}
#selectTab ul li a:hover span {
 opacity: 0.5;
}
/* tabbox */
.tabbox {
 overflow: hidden;
}
.tabbox .left {
 float: left;
 width: 480px;
 padding: 0 30px;
}
.tabbox .right {
 float: right;
 width: 480px;
 padding: 0 30px;
}
.tabbox .menu {
 overflow: hidden;
 margin: 0 0 40px;
}
.tabbox .menu_title {
 font-size: 1.8rem;
 border-top: 1px solid rgba(0, 0, 0, 1);
 border-bottom: 1px solid rgba(0, 0, 0, 1);
 padding: 4px 0;
 margin: 0 0 20px;
 text-align: center;
}
.tabbox .menu .name {
 text-align: center;
 font-size: 1.6rem;
 font-style: italic !important;
 padding: 10px 0 10px;
 margin: 0 0 10px;
 border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.item {
 overflow: hidden;
 position: relative;
 padding: 0 110px 0 0;
 margin: 0 0 15px;
}
.item p {
 line-height: 1.4;
 padding: 0;
}
.item p.title {
 font-size: 1.8rem;
 line-height: 1.4;
 padding: 0 0 4px;
}
.item p.title small {
 display: block;
 font-size: 1.2rem;
}
.item span {
 display: block;
 font-size: 1.3rem;
}
.item p.price {
 position: absolute;
 right: 0;
 top: 0;
 text-align: right;
 font-size: 1.8rem;
 line-height: 1.4;
}
.item p.price em {
 font-size: 1.4rem;
}
.item.dolce {
 border-top: 1px solid rgba(0, 0, 0, 1);
 padding: 20px 110px 0 0;
}
.item.dolce p.price {
 top: 20px;
}
.tabbox .menu_title,
.tabbox .menu .name,
.item p.title,
.item p.price {
 font-style: normal;
 font-weight: 100;
 font-family: "Abril Fatface", cursive;
 letter-spacing: 0.05em;
}
.item p.title small {
 font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
}
.biko {
 clear: both;
 border-top: 1px solid rgba(0, 0, 0, 1);
 text-align: right;
 padding: 10px 0 0;
}
.biko p {
 text-align: right;
 font-size: 1.5rem !important;
 line-height: 1.3;
 padding: 0 10px 0 0;
}
.biko span {
 text-align: right;
 font-size: 1.2rem;
}
.update {
 display: block;
 padding: 0 30px 20px;
 text-align: right;
 font-size: 1.4rem;
 font-weight: 100;
 font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 Pr6 W6", "Hiragino Mincho Pro", "HGS明朝E", "メイリオ", "ＭＳ Ｐ明朝", "MS PMincho", Meiryo, serif;
 line-height: 1.3;
}
.update p {
 padding: 0;
 display: inline;
}

@media only screen and (max-width: 768px) {
 #menu {
  padding: 0;
  background: #493828;
 }
 #menu .contbox {
  padding: 40px 0px 60px;
  background: url(../img/item_menu_bg_middle.jpg) repeat-y 50% 0;
 }
 #menu .contbox:before,
 #menu .contbox:after {
  display: none;
 }
 #menu .inner {
  width: 94%;
  margin: 0 auto;
  padding: 0;
 }
 #menu .subTitle {
  font-size: 3rem;
  margin: 0 0 40px;
 }
 #menu .subTitle i {
  font-size: 4rem;
 }
 /* #selectTab */
 #selectTab {
  margin: 0 0 30px;
 }
 #selectTab ul {
  padding: 0px;
  height: 50px;
 }
 #selectTab ul:before,
 #selectTab ul:after {
  display: none;
 }
 #selectTab ul li {
  width: 50%;
 }
 #selectTab ul li a {
  width: 100%;
 }
 #selectTab ul li a:hover span {
  opacity: 1;
 }
 /* tabbox */
 .tabbox {
  padding: 0 5px;
 }
 .tabbox .left,
 .tabbox .right {
  float: none;
  width: 100%;
  padding: 0;
 }
 .tabbox .menu {
  overflow: hidden;
  margin: 0 0 20px;
 }
 .tabbox .menu_title {
  font-size: 1.8rem;
  margin: 0 0 20px;
 }
 .tabbox .menu .name {
  font-size: 1.5rem;
  padding: 0 0 10px;
 }
 .item {
  padding: 0 70px 0 0;
  margin: 0 0 15px;
 }
 .item p.title {
  font-size: 1.6rem;
 }
 .item p.title small {
  font-size: 1.2rem;
 }
 .item span {
  font-size: 1.15rem;
 }
 .item p.price {
  font-size: 1.6rem;
 }
 .item p.price em {
  font-size: 1.2rem;
 }
 .item.dolce {
  padding: 10px 70px 0 0;
 }
 .item.dolce p.price {
  top: 10px;
 }
 .biko {
  margin: 0 5px;
 }
 .biko p {
  font-size: 1.3rem !important;
 }
 .biko span {
  font-size: 1.15rem;
 }
 .update {
  padding: 0 0 20px;
  font-size: 1.35rem;
 }
}

/*  ---------------------------
			gallery
---------------------------  */
#gallery {
 width: 100%;
 position: relative;
 text-align: center;
 background: #0b2211 url(../img/item_gallery_bg.jpg) no-repeat 50% 50%;
 background-size: cover;
 background-attachment: fixed;
}
#gallery .contbox {
 width: auto;
 padding: 160px 40px 60px;
}
#gallery .block {
 height: auto;
}
.photo {
 margin: 0;
 overflow: hidden;
}
.photo > li {
 float: left;
 overflow: hidden;
 width: 25%;
}
.photo > ul:after,
.photo > li:after {
 content: "";
 display: table;
 clear: both;
}
.photo figure {
 display: block;
 width: 100%;
 text-align: center;
}
.photo figure a {
 display: block;
}
.photo figure img {
 width: auto;
 height: auto;
}
@media only screen and (max-width: 768px) {
 #gallery .contbox {
  width: auto;
  padding: 40px 0px 60px;
 }
 #gallery .block {
  width: 94%;
  padding: 0px;
  margin: 0 auto 5px;
 }
 .photo > li {
  float: left;
  overflow: hidden;
  width: 33.33%;
 }
}

/*  ---------------------------
			view
---------------------------  */
#view {
 width: 100%;
 position: relative;
 text-align: center;
 background: #372714;
}
#view .contbox {
 width: auto;
 padding: 160px 40px 60px;
}
#streetview-canvas {
 width: 100%;
 height: 600px;
}
@media only screen and (max-width: 768px) {
 #view .contbox {
  width: auto;
  padding: 40px 0px 60px;
 }
 #view .block {
  width: 94%;
  padding: 0px;
  margin: 0 auto 5px;
 }
 #view .block iframe {
  height: 320px !important;
 }
 #streetview-canvas {
  width: 100%;
  height: 320px;
 }
}

/*  ---------------------------
			info
---------------------------  */
#info {
 width: 100%;
 position: relative;
 color: #000;
 text-align: center;
 background: #fff;
}
#info .contbox {
 width: auto;
 padding: 160px 40px 60px;
}
#info .contbox a {
 color: #999;
}
#info .contbox a:hover {
 text-decoration: underline;
}
#info #map-canvas {
 width: 100%;
 height: 400px;
}
#info .largemap {
 padding: 10px 0 0;
 text-align: right;
}
#info .largemap a {
 font-size: 1.2rem;
}
#info .infomation p {
 font-size: 1.4rem;
 line-height: 2.7;
}
/*#info .infomation time {
	display:block;
	font-size:1.8rem;
	line-height:1.4;
	letter-spacing:0.1em;
	margin:0 0 20px;
}*/
#info .infomation .hours {
 display: inline-block;
 font-size: 1.6rem;
 line-height: 1.4;
 margin: 20px auto;
}
#info .infomation .hours dl {
 width: 100%;
 letter-spacing: 0.15em;
}
#info .infomation .hours dl dt {
 display: table-cell;
 vertical-align: top;
}
#info .infomation .hours dl dd {
 display: table-cell;
 vertical-align: top;
}
#info .infomation .hours dl dd em {
 font-size: 1.3rem;
 letter-spacing: 0em;
}
.snsbtn_info {
 width: auto;
 margin: 0;
 text-align: center;
}
.snsbtn_info li {
 display: inline-block;
 margin: 0 14px;
 padding: 0 5px;
 text-align: center;
}
.snsbtn_info li a {
 width: 50px;
 padding: 50px 0px 0;
 border-radius: 50%;
 border: 1px solid rgba(0, 0, 0, 0.8);
 background-repeat: no-repeat;
 background-position: 50% 50%;
 -webkit-transition: all 0.2s 0s ease-out;
 -moz-transition: all 0.2s 0s ease-out;
 transition: all 0.2s 0s ease-out;
}
.snsbtn_info li.fb a {
 background-image: url(../img/ico/ico_fb_bk.svg);
 background-size: 20px 20px;
}
.snsbtn_info li.in a {
 background-image: url(../img/ico/ico_in_bk.svg);
 background-size: 20px 20px;
}
.snsbtn_info li a:hover {
 -webkit-transform: scale(1.2);
 -moz-transform: scale(1.2);
 -o-transform: scale(1.2);
 -ms-transform: scale(1.2);
 transform: scale(1.2);
}
@media only screen and (max-width: 768px) {
 #info .contbox {
  width: auto;
  padding: 40px 0px 30px;
 }
 #info #map-canvas {
  width: 94%;
  height: 320px;
  padding: 0px;
  margin: 0 auto 5px;
 }
 #info .largemap {
  width: 94%;
  padding: 0px 0 30px;
  margin: 0 auto;
 }
 #info .infomation p {
  font-size: 1.3rem;
  line-height: 1.8;
 }
 #info .infomation p.contact {
  font-size: 1.6rem;
  line-height: 1.5;
 }
 #info .infomation time {
  display: block;
  font-size: 1.8rem;
  line-height: 1.4;
  margin: 0 0 20px;
  letter-spacing: 0.1em;
 }
 .snsbtn_info li {
  margin: 0 8px;
 }
 .snsbtn_info li a:hover {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
 }
 .snsbtn_info li a.touch {
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
 }
}