#kv {
  position: relative;
  width: 100%; }
  @media screen and (min-width: 769px) {
    #kv {
      height: 800px; } }
  @media screen and (max-width: 768px) {
    #kv {
      height: 117rem; } }

.slider_set {
  position: relative;
  width: 100%;
  height: 100%; }

@media screen and (min-width: 769px) {
  #kv .slide1 {
    background: url("../img/top/kv_1.jpg") center center no-repeat;
    background-size: cover; } }
@media screen and (max-width: 768px) {
  #kv .slide1 {
    background: url("../img/top/sp/kv_1.jpg") center center no-repeat;
    background-size: cover; } }

@media screen and (min-width: 769px) {
  #kv .slide2 {
    background: url("../img/top/kv_2.jpg") center center no-repeat;
    background-size: cover; } }
@media screen and (max-width: 768px) {
  #kv .slide2 {
    background: url("../img/top/sp/kv_2.jpg") center center no-repeat;
    background-size: cover; } }

@media screen and (min-width: 769px) {
  #kv .slide3 {
    background: url("../img/top/kv_3.jpg") center center no-repeat;
    background-size: cover; } }
@media screen and (max-width: 768px) {
  #kv .slide3 {
    background: url("../img/top/sp/kv_3.jpg") center center no-repeat;
    background-size: cover; } }

#kv .ttl {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10; }

@media screen and (min-width: 769px) {
  #kv .ttl h1 {
    width: 30rem; } }
@media screen and (max-width: 768px) {
  #kv .ttl h1 {
    width: 33rem; } }

.view {
  position: relative;
  display: table;
  font-family: 'Shippori Mincho', serif;
  color: #A30008;
  margin: 0 0 0 auto;
  font-weight: 700; }
  @media screen and (min-width: 769px) {
    .view {
      line-height: 1em;
      font-size: 1.6rem;
      background: url("../img/arrow3.svg") right bottom no-repeat;
      background-size: 40px auto;
      padding-right: 50px;
      margin-top: 4rem; } }
  @media screen and (max-width: 768px) {
    .view {
      line-height: 1em;
      font-size: 2.8rem;
      background: url("../img/arrow3.svg") right bottom no-repeat;
      background-size: 8rem auto;
      padding-right: 10rem;
      margin-top: 7rem; } }

.view {
  transition: ease-out 0.6s all; }

.view:hover {
  opacity: 0.6; }

/*section*/
.index_sec .inner {
  position: relative;
  margin: 0 auto;
  display: flex; }
  @media screen and (min-width: 769px) {
    .index_sec .inner {
      align-items: stretch;
      justify-content: space-between;
      width: 100rem; } }
  @media screen and (max-width: 768px) {
    .index_sec .inner {
      align-items: flex-start;
      justify-content: flex-start;
      width: 63.6rem;
      flex-wrap: wrap; } }

@media screen and (min-width: 769px) {
  .index_sec .inner figure {
    width: 50rem; } }
@media screen and (max-width: 768px) {
  .index_sec .inner figure {
    width: 100%; } }

.index_sec .inner .box {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: left; }
  @media screen and (min-width: 769px) {
    .index_sec .inner .box {
      width: 50rem; } }
  @media screen and (max-width: 768px) {
    .index_sec .inner .box {
      width: 100%;
      padding-top: 7rem; } }

.inner dt {
  position: relative;
  font-family: 'Shippori Mincho', serif;
  font-weight: 500; }
  @media screen and (min-width: 769px) {
    .inner dt {
      line-height: 1.334em;
      font-size: 3rem;
      padding-bottom: 5rem; } }
  @media screen and (max-width: 768px) {
    .inner dt {
      line-height: 1.5em;
      font-size: 4.8rem;
      padding-bottom: 6rem; } }

.inner dt span {
  position: relative; }
  @media screen and (min-width: 769px) {
    .inner dt span {
      display: block;
      line-height: 1.5em;
      font-size: 2rem; } }
  @media screen and (max-width: 768px) {
    .inner dt span {
      display: block;
      line-height: 1.278em;
      font-size: 3.6rem; } }

.inner dd {
  position: relative; }
  @media screen and (min-width: 769px) {
    .inner dd {
      line-height: 2.143em;
      font-size: 1.4rem; } }
  @media screen and (max-width: 768px) {
    .inner dd {
      line-height: 2.143em;
      font-size: 2.8rem;
      white-space: nowrap; } }

@media screen and (min-width: 769px) {
  #sec1 {
    padding: 10rem 0; } }
@media screen and (max-width: 768px) {
  #sec1 {
    padding: 20rem 0; } }

#sec1::before {
  left: 0; }
  @media screen and (min-width: 769px) {
    #sec1::before {
      width: 31.25%; } }
  @media screen and (max-width: 768px) {
    #sec1::before {
      width: 21.5rem; } }

@media screen and (min-width: 769px) {
  #sec1 dl {
    padding-left: 5rem; } }

@media screen and (min-width: 769px) {
  #sec2 {
    padding: 0 0 10rem; } }
@media screen and (max-width: 768px) {
  #sec2 {
    padding: 0 0 20rem; } }

#sec2::before {
  right: 0; }
  @media screen and (min-width: 769px) {
    #sec2::before {
      width: 31.25%; } }
  @media screen and (max-width: 768px) {
    #sec2::before {
      width: 21.5rem; } }

@media screen and (min-width: 769px) {
  #sec2 dl {
    order: 1;
    padding-right: 5rem; } }

@media screen and (min-width: 769px) {
  #sec2 figure {
    order: 2; } }

#sec3 .inner {
  position: relative;
  margin: 0 auto; }
  @media screen and (min-width: 769px) {
    #sec3 .inner {
      width: 128rem; } }
  @media screen and (max-width: 768px) {
    #sec3 .inner {
      width: 100%;
      flex-wrap: wrap; } }

@media screen and (min-width: 769px) {
  #sec3 .inner figure {
    width: 114rem; } }
@media screen and (max-width: 768px) {
  #sec3 .inner figure {
    width: 70.8rem; } }

#sec3::before {
  display: block;
  content: "";
  position: absolute;
  top: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #191919;
  transition: .4s ease-in-out;
  z-index: -1; }
  @media screen and (min-width: 769px) {
    #sec3::before {
      height: 58rem; } }
  @media screen and (max-width: 768px) {
    #sec3::before {
      height: 132rem; } }

#sec3 .inner .box {
  text-align: left;
  color: #fff; }
  @media screen and (min-width: 769px) {
    #sec3 .inner .box {
      width: 100rem;
      margin: 0 auto;
      padding: 5rem 0 10rem; } }
  @media screen and (max-width: 768px) {
    #sec3 .inner .box {
      width: 63.6rem;
      margin: 0 auto;
      padding: 7rem 0 20rem; } }

@media screen and (min-width: 769px) {
  #sec4 .inner figure {
    width: 63rem; } }
@media screen and (max-width: 768px) {
  #sec4 .inner figure {
    width: 100%; } }

#sec4 .inner .box {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  text-align: left; }
  @media screen and (min-width: 769px) {
    #sec4 .inner .box {
      width: 37rem; } }
  @media screen and (max-width: 768px) {
    #sec4 .inner .box {
      width: 100%; } }

#sec4::before {
  left: 0; }
  @media screen and (min-width: 769px) {
    #sec4::before {
      width: 31.25%; } }
  @media screen and (max-width: 768px) {
    #sec4::before {
      width: 21.5rem; } }

@media screen and (min-width: 769px) {
  #sec4 .inner1 {
    padding: 0 0 7rem; } }
@media screen and (max-width: 768px) {
  #sec4 .inner1 {
    padding: 0 0 10rem; } }

@media screen and (min-width: 769px) {
  #sec4 .inner1 dl {
    order: 1;
    padding-right: 5rem; } }

@media screen and (min-width: 769px) {
  #sec4 .inner1 figure {
    order: 2; } }

@media screen and (min-width: 769px) {
  #sec4 .inner2 {
    padding: 0 0 10rem; } }
@media screen and (max-width: 768px) {
  #sec4 .inner2 {
    padding: 0 0 10rem; } }

@media screen and (min-width: 769px) {
  #sec4 .inner2 dl {
    padding-left: 5rem; } }

#sec5 .inner {
  position: relative;
  margin: 0 auto; }
  @media screen and (min-width: 769px) {
    #sec5 .inner {
      width: 100rem;
      padding: 5rem 0 10rem; } }
  @media screen and (max-width: 768px) {
    #sec5 .inner {
      width: 63.6rem;
      flex-wrap: wrap;
      padding: 10rem 0 20rem; } }

#sec5 .inner ul {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap; }
  @media screen and (min-width: 769px) {
    #sec5 .inner ul {
      width: 100%; } }
  @media screen and (max-width: 768px) {
    #sec5 .inner ul {
      width: 100%; } }

#sec5 .inner ul li {
  position: relative; }
  @media screen and (min-width: 769px) {
    #sec5 .inner ul li {
      width: 30rem;
      padding: 0 0 5rem; } }
  @media screen and (max-width: 768px) {
    #sec5 .inner ul li {
      width: 30.6rem;
      padding: 0 0 5rem; } }

#sec5 .inner ul li p {
  position: relative;
  font-family: 'Shippori Mincho', serif;
  font-weight: 500; }
  @media screen and (min-width: 769px) {
    #sec5 .inner ul li p {
      line-height: 1.429em;
      font-size: 1.4rem;
      padding-top: 1rem; } }
  @media screen and (max-width: 768px) {
    #sec5 .inner ul li p {
      line-height: 1.25em;
      font-size: 2.4rem;
      padding-top: 2rem; } }

@media screen and (min-width: 769px) {
  #access_box {
    padding-bottom: 10rem; } }
@media screen and (max-width: 768px) {
  #access_box {
    padding-bottom: 10rem; } }

#access_box::before {
  right: 0; }
  @media screen and (min-width: 769px) {
    #access_box::before {
      width: 31.25%; } }
  @media screen and (max-width: 768px) {
    #access_box::before {
      width: 21.5rem; } }

#access_box .box_set {
  position: relative;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  justify-content: space-between; }
  @media screen and (min-width: 769px) {
    #access_box .box_set {
      width: 100rem; } }
  @media screen and (max-width: 768px) {
    #access_box .box_set {
      width: 63.6rem;
      flex-wrap: wrap; } }

@media screen and (min-width: 769px) {
  #access_box .box_set iframe {
    width: 60rem; } }
@media screen and (max-width: 768px) {
  #access_box .box_set iframe {
    width: 100%;
    height: 80vw !important;
    order: 1; } }

#access_box .box_set .box {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center; }
  @media screen and (min-width: 769px) {
    #access_box .box_set .box {
      text-align: left;
      width: 40rem;
      padding-left: 5rem; } }
  @media screen and (max-width: 768px) {
    #access_box .box_set .box {
      width: 100%;
      order: 2;
      text-align: center;
      padding: 7rem 0 10rem; } }

@media screen and (min-width: 769px) {
  #access_box .box_set .box figure {
    width: 25.6rem; } }
@media screen and (max-width: 768px) {
  #access_box .box_set .box figure {
    width: 30rem;
    margin: 0 auto; } }

@media screen and (min-width: 769px) {
  #access_box .box_set .info {
    font-family: 'Shippori Mincho', serif;
    font-weight: 500;
    line-height: 1.715em;
    font-size: 1.4rem;
    padding-top: 4rem; } }
@media screen and (max-width: 768px) {
  #access_box .box_set .info {
    width: 63.6rem;
    line-height: 1.715em;
    font-size: 2.8rem;
    padding-top: 7rem; } }

/*add 0816*/
#reservation_banner {
  position: absolute;
  text-align: left;
  font-family: 'Shippori Mincho', serif; }
  @media screen and (min-width: 769px) {
    #reservation_banner {
      bottom: 2rem;
      right: 2rem;
      padding: 1rem 2rem;
      background: #A30008;
      z-index: 100; } }
  @media screen and (max-width: 768px) {
    #reservation_banner {
      width: 74rem;
      bottom: 2rem;
      left: 2rem;
      padding: 1.5rem 2rem;
      background: #A30008;
      z-index: 100; } }

#reservation_banner .reservation_ttl {
  font-weight: 700;
  color: #fff; }
  @media screen and (min-width: 769px) {
    #reservation_banner .reservation_ttl {
      line-height: 1.334em;
      font-size: 1.8rem;
      letter-spacing: 0.05em; } }
  @media screen and (max-width: 768px) {
    #reservation_banner .reservation_ttl {
      line-height: 1.313em;
      font-size: 3.2rem;
      letter-spacing: 0.05em; } }

#reservation_banner .reservation_txt {
  font-weight: 500;
  color: #fff; }
  @media screen and (min-width: 769px) {
    #reservation_banner .reservation_txt {
      line-height: 1.75em;
      font-size: 1.6rem;
      letter-spacing: 0.05em; } }
  @media screen and (max-width: 768px) {
    #reservation_banner .reservation_txt {
      line-height: 1.715em;
      font-size: 2.8rem;
      letter-spacing: 0.05em; } }

#reservation_banner .reservation_txt span {
  text-decoration: underline; }

#reservation_banner::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  border: #A30008 0 solid;
  transition: .4s ease-in-out; }

@media screen and (min-width: 769px) {
  #reservation_banner:hover::after {
    border: #fff 6px solid; } }
@media screen and (max-width: 768px) {
  #reservation_banner:hover::after {
    border: #fff 6px solid; } }

.sec_ttl h2,
.sec_ttl h2 img {
  outline: none !important;
  border: none !important;
  background: none !important; }

/*
    @include mq(pc) {
    }
    @include mq(sp) {
    }
*/
/*
divceil(, 10, rem);
*/