@charset "UTF-8";
/* reset
**********************************************************************/
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;500;700;900&display=swap");
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  text-decoration: none;
  outline: none; }

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

*,
*::before,
*::after {
  box-sizing: border-box; }

/* font */
/* media query */
/* SP縦から */
/* SP横から */
/* タブレット縦から */
/* フルワイド */
html {
  font-size: 62.5%; }

body {
  color: #231815;
  font-family: 游明朝, "Yu Mincho", YuMincho, 'Noto Serif JP', "Hiragino Mincho ProN", serif;
  font-size: 1.6rem;
  font-weight: 500;
  font-feature-settings: "palt";
  letter-spacing: 0.02em;
  line-height: 1.5; }

a {
  color: #231815;
  transition: all 0.5s ease-out; }
  a:hover {
    opacity: 0.7; }

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle; }

@media all and (max-width: 896px) {
  .pconly {
    display: none; } }

.sponly {
  display: none; }
  @media all and (max-width: 896px) {
    .sponly {
      display: block; } }

.portraitonly {
  display: none; }
  @media all and (max-width: 480px) {
    .portraitonly {
      display: block; } }

@media all and (max-width: 896px) {
  .spnone {
    display: none; } }

@media all and (max-width: 480px) {
  .portraitnone {
    display: none; } }

.wrapper {
  overflow: hidden; }

.w1000 {
  max-width: 1000px;
  padding: 0 10px 0;
  margin: 0 auto; }

.txt_green {
  color: #72ab2d; }

.txt_color {
  color: #e4721f; }

.txt_small {
  font-size: 0.85em; }

/*-----文字の背景が伸びる-----*/
.slide-in {
  overflow: hidden;
  display: inline-block; }

.slide-in_inner {
  display: inline-block; }

.leftAnime {
  opacity: 0;
  /*事前に透過0にして消しておく*/ }

.slideAnimeLeftRight {
  animation-name: slideText-100;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes slideText-100 {
  from {
    transform: translateX(-100%);
    /*要素を左の枠外に移動*/
    opacity: 0; }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1; } }
.slideAnimeRightLeft {
  animation-name: slideText100;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes slideText100 {
  from {
    transform: translateX(100%);
    /*要素を右の枠外に移動*/
    opacity: 0; }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1; } }
/* fadeIn */
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 3s;
  /*ゆっくり出現するため数値変更*/
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeInAnime {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
.mainvisual {
  background-image: url(../images/bg_mainvisual.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center bottom 12%;
  text-align: center; }
  @media all and (max-width: 896px) {
    .mainvisual {
      background-position: center bottom 20%; } }

.area_ttl_mainvisual {
  padding: 8vw 15px 22vw;
  color: #fff;
  line-height: 1.2; }
  @media all and (max-width: 1025px) {
    .area_ttl_mainvisual {
      padding: 16vw 15px 44vw; } }
  @media all and (max-width: 480px) {
    .area_ttl_mainvisual {
      padding: 32vw 15px 88vw; } }

.subttl_mainvisual {
  font-size: 2.8rem;
  font-weight: bold;
  letter-spacing: 0.1em;
  text-shadow: 0 0 8px #000;
  margin-bottom: 10px; }
  @media all and (max-width: 896px) {
    .subttl_mainvisual {
      font-size: 1.8rem; } }

.ttl_mainvisual {
  font-size: 5.6rem;
  font-weight: bold;
  letter-spacing: 0.14em;
  text-shadow: 0 0 8px #000; }
  @media all and (max-width: 896px) {
    .ttl_mainvisual {
      font-size: 3.2rem; } }

.block_about {
  padding: 60px 0 120px;
  text-align: center; }
  @media all and (max-width: 896px) {
    .block_about {
      padding: 30px 0 50px; } }

.txt_summerbuffet {
  max-width: 320px;
  margin: 0 auto 40px; }
  @media all and (max-width: 896px) {
    .txt_summerbuffet {
      max-width: 200px;
      margin-bottom: 20px; } }
  .txt_summerbuffet span {
    display: block; }
  .txt_summerbuffet img {
    width: 100%; }

.area_ttl {
  margin-bottom: 60px; }
  @media all and (max-width: 896px) {
    .area_ttl {
      margin-bottom: 30px; } }
  @media all and (max-width: 896px) {
    .area_ttl img {
      max-width: 160px; } }

.ttl_about {
  font-size: 4rem;
  font-weight: bold;
  padding: 5px 0; }
  @media all and (max-width: 896px) {
    .ttl_about {
      font-size: 2rem; } }

.txt_about {
  font-size: 2.8rem;
  font-weight: bold; }
  @media all and (max-width: 896px) {
    .txt_about {
      font-size: 1.8rem; } }

.block_nav {
  padding: 40px 15px;
  background: #72ab2d; }
  @media all and (max-width: 896px) {
    .block_nav {
      padding: 20px 15px 15px; } }

.list_nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-size: 2.2rem;
  font-weight: bold;
  text-align: left; }
  @media all and (max-width: 896px) {
    .list_nav {
      font-size: 1.8rem; } }
  .list_nav > li {
    position: relative;
    width: 180px;
    transition: .5s;
    color: #fff;
    cursor: pointer; }
    .list_nav > li::before {
      content: "＞"; }
    @media all and (max-width: 896px) {
      .list_nav > li {
        width: 150px;
        margin-bottom: 5px; } }
    .list_nav > li .sublist_nav {
      position: absolute;
      z-index: 10;
      top: 2.2em;
      left: 0;
      font-size: 1.6rem;
      width: 100%;
      transition: .5s; }
      .list_nav > li .sublist_nav > li {
        overflow: hidden;
        height: 0;
        transition: .5s; }
        .list_nav > li .sublist_nav > li > a {
          display: block;
          box-sizing: border-box;
          padding: 10px;
          width: 100%;
          height: 100%;
          background: #fff;
          color: #72ab2d;
          border-bottom: 2px solid transparent; }
          .list_nav > li .sublist_nav > li > a:hover {
            opacity: 1;
            border-bottom: 2px solid #72ab2d; }
    .list_nav > li:hover .sublist_nav > li {
      overflow: visible;
      height: auto; }

.block_area {
  padding: 30px 0 120px; }
  @media all and (max-width: 896px) {
    .block_area {
      padding-bottom: 50px; } }
  .block_area.bg_green {
    background: #ecf4d9; }

.area_name {
  margin-bottom: 40px;
  text-align: center; }
  @media all and (max-width: 896px) {
    .area_name {
      margin-bottom: 20px; } }
  .area_name > img {
    margin-bottom: 10px; }
    @media all and (max-width: 896px) {
      .area_name > img {
        margin-bottom: 5px;
        max-width: 100px; } }
  .area_name > h3 {
    font-size: 3.6rem;
    font-weight: bold; }
    @media all and (max-width: 896px) {
      .area_name > h3 {
        font-size: 2.2rem; } }

.list_restaurant > li {
  border-top: 10px solid #72ab2d;
  padding: 40px 0 50px; }
  @media all and (max-width: 896px) {
    .list_restaurant > li {
      padding: 30px 0; } }

.box_restaurant {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; }
  .box_restaurant.box_restaurant_reverse {
    flex-direction: row-reverse; }
  .box_restaurant > dt {
    width: 52%; }
    @media all and (max-width: 896px) {
      .box_restaurant > dt {
        width: 100%; } }
  .box_restaurant > dd {
    width: 48%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; }
    @media all and (max-width: 896px) {
      .box_restaurant > dd {
        width: 80%;
        height: 65vw; } }
    @media all and (max-width: 480px) {
      .box_restaurant > dd {
        width: 100%;
        height: 80vw; } }
    .box_restaurant > dd.dinner_img01 {
      background-image: url(../images/dinner_img01.jpg); }
    .box_restaurant > dd.dinner_img02 {
      background-image: url(../images/dinner_img02.jpg); }
    .box_restaurant > dd.dinner_img03 {
      background-image: url(../images/dinner_img03.jpg); }
    .box_restaurant > dd.dinner_img04 {
      background-image: url(../images/dinner_img04.jpg); }
    .box_restaurant > dd.dinner_img05 {
      background-image: url(../images/dinner_img05.jpg); }
    .box_restaurant > dd.dinner_img06 {
      background-image: url(../images/dinner_img06.jpg); }
    .box_restaurant > dd.dinner_img07 {
      background-image: url(../images/dinner_img07.jpg); }
    .box_restaurant > dd.dinner_img08 {
      background-image: url(../images/dinner_img08.jpg); }
    .box_restaurant > dd.dinner_img09 {
      background-image: url(../images/dinner_img09.jpg); }
    .box_restaurant > dd.dinner_img10 {
      background-image: url(../images/dinner_img10.jpg); }
    .box_restaurant > dd.dinner_img11 {
      background-image: url(../images/dinner_img11.jpg); }
    .box_restaurant > dd.dinner_img12 {
      background-image: url(../images/dinner_img12.jpg); }
    .box_restaurant > dd.dinner_img13 {
      background-image: url(../images/dinner_img13.jpg); }
    .box_restaurant > dd.dinner_img14 {
      background-image: url(../images/dinner_img14.jpg); }
    .box_restaurant > dd.dinner_img15 {
      background-image: url(../images/dinner_img15.jpg); }

.ttl_restaurant {
  box-sizing: border-box;
  padding: 0 10% 10px 5%;
  text-align: center;
  border-bottom: 1px solid #231815;
  font-size: 2.4rem;
  font-weight: bold;
  margin-bottom: 15px; }
  @media all and (max-width: 896px) {
    .ttl_restaurant {
      font-size: 2rem;
      padding: 0 10px 10px; } }

.menu_restaurant {
  box-sizing: border-box;
  padding: 0 10% 10px 5%;
  text-align: center;
  border-bottom: 1px solid #231815;
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 15px;
  letter-spacing: 0; }
  @media all and (max-width: 896px) {
    .menu_restaurant {
      font-size: 1.6rem;
      padding: 0 10px 10px; } }

.txt_restaurant {
  font-size: 1.4rem;
  box-sizing: border-box;
  padding: 0 15% 10px 5%;
  border-bottom: 1px solid #231815;
  margin-bottom: 15px; }
  @media all and (max-width: 896px) {
    .txt_restaurant {
      padding: 0 20px 10px; } }

.box_plan {
  display: flex;
  justify-content: space-between;
  padding: 0 10% 0 0;
  text-align: center; }
  @media all and (max-width: 896px) {
    .box_plan {
      width: 80%;
      margin: 0 auto;
      padding: 15px 0 0; } }
  @media all and (max-width: 480px) {
    .box_plan {
      width: 100%; } }
  .box_plan > li {
    width: 47%; }
    @media all and (max-width: 896px) {
      .box_plan > li {
        width: 48%; } }

.box_breakfast {
  font-size: 1.8rem;
  font-weight: bold; }
  @media all and (max-width: 896px) {
    .box_breakfast {
      font-size: 1.6rem; } }
  .box_breakfast img {
    margin-bottom: 10px; }

.txt_breakfast {
  letter-spacing: 0; }

.link_plan > a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 200px;
  box-sizing: border-box;
  background: #ecf4d9;
  border-top: 5px solid #72ab2d;
  padding: 15px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, sans-serif; }
  @media all and (max-width: 896px) {
    .link_plan > a {
      font-size: 1.4rem;
      height: auto; } }

.link_plan_double > a {
  border-top: 5px solid #72ab2d;
  box-sizing: border-box;
  display: block;
  width: 100%;
  padding: 15px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, sans-serif;
  background: #fff; }
  @media all and (max-width: 896px) {
    .link_plan_double > a {
      font-size: 1.4rem; } }
.link_plan_double .txt_link_plan {
  display: inline-block; }

.txt_link_plan {
  text-align: left;
  border-bottom: 1px solid #231815;
  padding-bottom: 5px;
  margin-bottom: 15px; }

.txt_annotation {
  margin-top: 10px;
  font-size: 0.8em;
  text-align: left; }

.box_restaurant_reverse .ttl_restaurant {
  padding: 0 5% 10px 10%; }
  @media all and (max-width: 896px) {
    .box_restaurant_reverse .ttl_restaurant {
      padding: 0 10px 10px; } }
.box_restaurant_reverse .menu_restaurant {
  padding: 0 5% 10px 10%; }
  @media all and (max-width: 896px) {
    .box_restaurant_reverse .menu_restaurant {
      padding: 0 10px 10px; } }
.box_restaurant_reverse .txt_restaurant {
  padding: 0 5% 10px 15%; }
  @media all and (max-width: 896px) {
    .box_restaurant_reverse .txt_restaurant {
      padding: 0 20px 10px; } }
.box_restaurant_reverse .box_plan {
  padding: 0 0 0 10%; }
  @media all and (max-width: 896px) {
    .box_restaurant_reverse .box_plan {
      padding: 15px 0 0; } }

.bg_green .link_plan a {
  background: #fff; }

.block_comments {
  text-align: center;
  padding: 40px 15px 120px;
  border-top: 4px solid #0e7c9d; }
  @media all and (max-width: 896px) {
    .block_comments {
      padding: 20px 15px 80px; } }

.txt_comments {
  font-size: 2.4rem;
  color: #0e7c9d;
  margin-bottom: 40px; }
  @media all and (max-width: 896px) {
    .txt_comments {
      font-size: 1.6rem;
      margin-bottom: 20px; } }
  @media all and (max-width: 480px) {
    .txt_comments {
      text-align: left; } }

.btn_comments {
  width: 100%;
  max-width: 340px;
  margin: 0 auto; }
  .btn_comments a {
    display: block;
    box-sizing: border-box;
    padding: 0.6em;
    background: #0e7c9d;
    color: #fff;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, sans-serif;
    font-size: 2.4rem;
    font-weight: 400;
    border-radius: 40px; }
    @media all and (max-width: 896px) {
      .btn_comments a {
        font-size: 1.6rem; } }

.pagetop {
  z-index: 99;
  position: fixed;
  right: 20px; }
  @media all and (max-width: 480px) {
    .pagetop {
      right: 15px; } }
  .pagetop a {
    display: block;
    width: 50px;
    height: 50px;
    box-sizing: border-box;
    border-radius: 50%;
    background: #72ab2d;
    color: #fff;
    transition: .3s;
    position: relative; }
    @media all and (max-width: 480px) {
      .pagetop a {
        width: 40px;
        height: 40px; } }
    .pagetop a::before {
      content: "▲";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 2rem; }
      @media all and (max-width: 480px) {
        .pagetop a::before {
          font-size: 1.6rem; } }
    .pagetop a:hover {
      opacity: 1; }

@media print {
  .pagetop {
    display: none; } }
