@charset "UTF-8";
/* basic layout */
/* 全体の設定
---------------------------------------------------------------------------*/
/* 基本設定
---------------------------------------------------------------------------*/
/* responsive */
/* サイズ */
/* flexbox */
/* フォント */
/* regular: 400, medium: 500, semibold: 600, bold: 700 */
/* medium: 500, bold: 700, black: 900 */
/* regular: 400, medium: 500, semibold: 600, bold: 700 */
/* regular: 400 */
/* 色 */
/* グラデ背景色 */
/* 中央揃え */
/* objectfit */
/* ホバーアクション */
/* 角丸 */
/* ボタン */
/* ボタンの中のspan */
/* フォントサイズ */
/* 余白 */
/* 縦書き */
/* 内径 */
/* mv
---------------------------------------------------------------------------*/
.mv {
  position: relative;
  width: 100%;
  height: 100vh;
  height: 100svh;
  padding: 78px 0 54px; }
  .mv #topSlider {
    height: 100%; }
  .mv-sl {
    position: relative;
    width: 1280px;
    height: 100%;
    margin-left: auto;
    margin-right: auto; }
    @media screen and (max-width: 1300px) {
      .mv-sl {
        width: 90.7692307692vw; } }
    .mv-sl-wrap {
      width: 100%;
      height: 100%;
      border-radius: 80px;
      overflow: hidden; }
      @media screen and (max-width: 1300px) {
        .mv-sl-wrap {
          border-radius: 6.1538461538vw; } }
      @media screen and (max-width: 480px) {
        .mv-sl-wrap {
          border-radius: 21.3333333333vw; } }
      @media screen and (max-width: 480px) {
        .mv-sl-wrap {
          border-radius: 10.6666666667vw; } }
    .mv-sl .swiper-slide img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      font-family: "object-fit: cover; object-position: center;"; }
  .mv-tx {
    position: absolute;
    width: 464px;
    height: 400px;
    left: -40px;
    bottom: 300px;
    z-index: 100; }
    @media screen and (max-width: 1300px) {
      .mv-tx {
        width: 35.6923076923vw;
        height: 30.7692307692vw;
        left: -3.0769230769vw;
        /*bottom: px2vw(300);*/
        bottom: auto;
        top: 21vw; } }
    @media screen and (max-width: 480px) {
      .mv-tx {
        width: 78.4vw;
        height: 66.8vw;
        left: 10.6666666667vw;
        bottom: 0;
        top: auto; } }
    .mv-tx::before, .mv-tx::after {
      position: absolute;
      content: "";
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain; }
    .mv-tx::before {
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background-image: url(../img/top/mv-tx-before.png); }
    .mv-tx::after {
      width: 150px;
      height: 250px;
      left: 50%;
      transform: translateX(-50%);
      bottom: -178px;
      background-image: url(../img/top/mv-tx-after.png); }
      @media screen and (max-width: 1300px) {
        .mv-tx::after {
          width: 11.5384615385vw;
          height: 19.2307692308vw; } }
      @media screen and (max-width: 480px) {
        .mv-tx::after {
          width: 23.3333333333vw;
          height: 39.0666666667vw;
          bottom: 0;
          left: -10.5333333333vw;
          transform: translateX(0); } }
    .mv-tx > div {
      position: relative;
      z-index: 150;
      width: 100%;
      height: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
    .mv-tx-en {
      font-family: "Montserrat", sans-serif;
      font-optical-sizing: auto;
      font-weight: 600;
      font-style: normal;
      color: #CAB7B2;
      font-size: 30px; }
      @media screen and (max-width: 1300px) {
        .mv-tx-en {
          font-size: 2.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .mv-tx-en {
          font-size: 7.111108vw; } }
      @media screen and (max-width: 480px) {
        .mv-tx-en {
          font-size: 5.3333333333vw; } }
    .mv-tx-ja {
      font-size: 26px;
      color: #7A4A3F;
      font-weight: 600;
      letter-spacing: .14em;
      line-height: 2;
      margin-top: 1em; }
      @media screen and (max-width: 1300px) {
        .mv-tx-ja {
          font-size: 2vw; } }
      @media screen and (max-width: 480px) {
        .mv-tx-ja {
          font-size: 6.1629602667vw; } }
      @media screen and (max-width: 480px) {
        .mv-tx-ja {
          font-size: 4.8vw; } }
  .mv-deco {
    position: absolute;
    width: 290px;
    height: 217px;
    bottom: 0;
    right: 60px;
    z-index: 100; }
    @media screen and (max-width: 1300px) {
      .mv-deco {
        width: 22.3076923077vw;
        height: 16.6923076923vw;
        /*right: px2vw(60);*/
        right: 0;
        bottom: 6vw; } }
    @media screen and (max-width: 480px) {
      .mv-deco {
        width: 40.4vw;
        height: 30.2666666667vw;
        right: 0;
        bottom: 0; } }

/* spbrbox
---------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
  .spbrbox .brbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: transparent;
    padding: 4.2666666667vw 0; }
    .spbrbox .brbox .brbox-bestrate {
      width: 43.7333333333vw; }
    .spbrbox .brbox .head-nav-sub-plan {
      width: 42.6666666667vw; }
      .spbrbox .brbox .head-nav-sub-plan a {
        height: 17.4666666667vw; }
        .spbrbox .brbox .head-nav-sub-plan a i {
          padding-left: 5.7333333333vw; }
          .spbrbox .brbox .head-nav-sub-plan a i::before {
            width: 3.4666666667vw;
            height: 3.4666666667vw; } }

/* intr
---------------------------------------------------------------------------*/
.intr {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding-top: 66px;
  padding-bottom: 382px; }
  @media screen and (max-width: 1300px) {
    .intr {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .intr {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .intr {
      padding-top: 5.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .intr {
      padding-top: 12.32vw; } }
  @media screen and (max-width: 1300px) {
    .intr {
      padding-bottom: 29.3846153846vw; } }
  @media screen and (max-width: 480px) {
    .intr {
      padding-bottom: 71.3066666667vw; } }
  @media screen and (max-width: 480px) {
    .intr {
      padding-bottom: 84vw; } }
  .intr-hdl {
    font-size: 32px;
    color: #7A4A3F;
    font-weight: 600;
    letter-spacing: .14em;
    line-height: 1.75;
    margin-bottom: 30px; }
    @media screen and (max-width: 1300px) {
      .intr-hdl {
        font-size: 2.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .intr-hdl {
        font-size: 7.5851818667vw; } }
    @media screen and (max-width: 1300px) {
      .intr-hdl {
        margin-bottom: 2.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .intr-hdl {
        margin-bottom: 5.6vw; } }
  .intr-desc {
    letter-spacing: .14em;
    line-height: 2.44; }
    @media screen and (max-width: 480px) {
      .intr-desc {
        padding-top: 106vw; } }
  .intr .deco {
    position: absolute; }
    .intr .deco.deco01, .intr .deco.deco02 {
      width: 94px;
      height: 156px; }
      @media screen and (max-width: 1300px) {
        .intr .deco.deco01, .intr .deco.deco02 {
          width: 7.2307692308vw;
          height: 12vw; } }
      @media screen and (max-width: 480px) {
        .intr .deco.deco01, .intr .deco.deco02 {
          width: 22.4vw;
          height: 37.3333333333vw; } }
    .intr .deco.deco01 {
      left: -115px;
      top: 500px; }
      @media screen and (max-width: 1300px) {
        .intr .deco.deco01 {
          left: -8.8461538462vw;
          top: 38.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .intr .deco.deco01 {
          left: 0;
          top: 224vw;
          z-index: -1; } }
    .intr .deco.deco02 {
      left: 378px;
      top: 164px; }
      @media screen and (max-width: 1300px) {
        .intr .deco.deco02 {
          left: 29.0769230769vw;
          top: 12.6153846154vw; } }
      @media screen and (max-width: 480px) {
        .intr .deco.deco02 {
          left: auto;
          right: -2vw;
          top: 35vw; } }
    .intr .deco.img01 {
      width: 810px;
      height: 690px;
      top: 42px;
      right: -232px; }
      @media screen and (max-width: 1300px) {
        .intr .deco.img01 {
          width: 62.3076923077vw;
          height: 46.9230769231vw;
          top: 3.2307692308vw;
          right: -17.8461538462vw; } }
      @media screen and (max-width: 480px) {
        .intr .deco.img01 {
          width: 121.6vw;
          height: 95.6vw;
          right: -16vw;
          top: 55vw; } }
    .intr .deco.img02 {
      width: 406px;
      height: 280px;
      top: 538px;
      right: 345px; }
      @media screen and (max-width: 1300px) {
        .intr .deco.img02 {
          width: 31.2307692308vw;
          height: 21.5384615385vw;
          top: 41.3846153846vw;
          right: 26.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .intr .deco.img02 {
          width: 83.6vw;
          height: 57.6vw;
          right: -26.9333333333vw;
          top: 240vw; } }
    .intr .deco.dog {
      width: 177px;
      height: 290px;
      top: 540px;
      left: 35px; }
      @media screen and (max-width: 1300px) {
        .intr .deco.dog {
          width: 13.6153846154vw;
          height: 22.3076923077vw;
          top: 41.5384615385vw;
          left: 2.6923076923vw; } }
      @media screen and (max-width: 480px) {
        .intr .deco.dog {
          width: 32.5333333333vw;
          height: 53.0666666667vw;
          left: -2.2666666667vw;
          top: 260vw; } }

/* charm
---------------------------------------------------------------------------*/
.charm-catch {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 24px;
  color: #7A4A3F;
  letter-spacing: .14em;
  font-weight: 600; }
  @media screen and (max-width: 1300px) {
    .charm-catch {
      font-size: 1.8461538462vw; } }
  @media screen and (max-width: 480px) {
    .charm-catch {
      font-size: 5.6888864vw; } }
  @media screen and (max-width: 480px) {
    .charm-catch {
      font-size: 5.7333333333vw; } }
  .charm-catch span {
    position: relative;
    padding-left: 56px; }
    @media screen and (max-width: 1300px) {
      .charm-catch span {
        padding-left: 4.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .charm-catch span {
        padding-left: 13.8666666667vw; } }
    .charm-catch span::before {
      position: absolute;
      content: "";
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      width: 36px;
      height: 47px;
      background-image: url(../img/top/charm-eyecatch.png);
      left: 0;
      top: 50%;
      transform: translateY(-50%); }
      @media screen and (max-width: 1300px) {
        .charm-catch span::before {
          width: 2.7692307692vw;
          height: 3.6153846154vw; } }
      @media screen and (max-width: 480px) {
        .charm-catch span::before {
          width: 8.6666666667vw;
          height: 11.2vw; } }
.charm-ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 32px;
  letter-spacing: .14em;
  font-weight: 600;
  margin-bottom: 46px;
  margin-top: 22px; }
  @media screen and (max-width: 1300px) {
    .charm-ttl {
      font-size: 2.4615384615vw; } }
  @media screen and (max-width: 480px) {
    .charm-ttl {
      font-size: 7.5851818667vw; } }
  @media screen and (max-width: 1300px) {
    .charm-ttl {
      margin-bottom: 3.5384615385vw; } }
  @media screen and (max-width: 480px) {
    .charm-ttl {
      margin-bottom: 8.5866666667vw; } }
  @media screen and (max-width: 1300px) {
    .charm-ttl {
      margin-top: 1.6923076923vw; } }
  @media screen and (max-width: 480px) {
    .charm-ttl {
      margin-top: 4.1066666667vw; } }
  @media screen and (max-width: 480px) {
    .charm-ttl {
      font-size: 6.9333333333vw; } }
  .charm-ttl strong {
    font-size: 56px;
    color: #7A4A3F;
    margin: 0 .2em;
    font-weight: 600; }
    @media screen and (max-width: 1300px) {
      .charm-ttl strong {
        font-size: 4.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .charm-ttl strong {
        font-size: 13.2740682667vw; } }
    @media screen and (max-width: 480px) {
      .charm-ttl strong {
        font-size: 12.2666666667vw; } }
@media screen and (min-width: 481px) {
  .charm .swiper-wrapper {
    transition-timing-function: linear; } }
.charm .swiper-wrapper .swiper-slide {
  width: 408px;
  height: auto; }
  @media screen and (max-width: 1300px) {
    .charm .swiper-wrapper .swiper-slide {
      width: 31.3846153846vw; } }
  @media screen and (max-width: 480px) {
    .charm .swiper-wrapper .swiper-slide {
      width: 84vw; } }
.charm-sl {
  display: block;
  position: relative;
  height: 100%;
  width: 376px;
  margin: 0 auto; }
  @media screen and (max-width: 1300px) {
    .charm-sl {
      width: 28.9230769231vw; } }
  @media screen and (max-width: 480px) {
    .charm-sl {
      width: 77.6vw; } }
  @media (hover: hover) {
    .charm-sl:hover {
      opacity: 1; }
      .charm-sl:hover .charm-sl-hov {
        opacity: 1; } }
  .charm-sl-img {
    border-radius: 32px;
    overflow: hidden; }
    @media screen and (max-width: 1300px) {
      .charm-sl-img {
        border-radius: 2.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-img {
        border-radius: 8.5333333333vw; } }
  .charm-sl-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 396px;
    width: 138px;
    height: 138px;
    border-radius: 50%;
    background-color: #F4EDEA;
    z-index: 100; }
    @media screen and (max-width: 1300px) {
      .charm-sl-num {
        top: 30.4615384615vw;
        width: 10.6153846154vw;
        height: 10.6153846154vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-num {
        top: 81.6vw;
        width: 26.2666666667vw;
        height: 26.2666666667vw; } }
    .charm-sl-num span {
      font-family: "Montserrat", sans-serif;
      font-optical-sizing: auto;
      font-weight: 600;
      font-style: normal;
      font-size: 64px;
      font-weight: 600;
      letter-spacing: .05em;
      text-align: center;
      color: #BCA49F; }
      @media screen and (max-width: 1300px) {
        .charm-sl-num span {
          font-size: 4.9230769231vw; } }
      @media screen and (max-width: 480px) {
        .charm-sl-num span {
          font-size: 15.1703637333vw; } }
      @media screen and (max-width: 480px) {
        .charm-sl-num span {
          font-size: 12.2666666667vw; } }
  .charm-sl-name {
    position: relative;
    text-align: center;
    font-size: 22px;
    color: #7A4A3F;
    margin-top: 50px;
    letter-spacing: .14em;
    z-index: 200;
    line-height: 1.818;
    font-weight: 600; }
    @media screen and (max-width: 1300px) {
      .charm-sl-name {
        font-size: 1.6923076923vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-name {
        font-size: 5.2148125333vw; } }
    @media screen and (max-width: 1300px) {
      .charm-sl-name {
        margin-top: 3.8461538462vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-name {
        margin-top: 9.3333333333vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-name {
        font-size: 4.2666666667vw;
        letter-spacing: .07em; } }
  .charm-sl-hov {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 456px;
    border-radius: 32px;
    background-color: rgba(244, 237, 234, 0.9);
    border: 8px solid #D7C9C5;
    z-index: 50;
    padding-top: 70px;
    opacity: 0;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease; }
    @media screen and (max-width: 1300px) {
      .charm-sl-hov {
        border-radius: 2.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-hov {
        border-radius: 8.5333333333vw; } }
    @media screen and (max-width: 1300px) {
      .charm-sl-hov {
        padding-top: 5.3846153846vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-hov {
        padding-top: 13.0666666667vw; } }
    @media screen and (max-width: 1300px) {
      .charm-sl-hov {
        height: 35.0769230769vw; } }
    @media screen and (max-width: 480px) {
      .charm-sl-hov {
        position: relative;
        left: auto;
        top: auto;
        border: none;
        border-top: 1px dashed #CAB7B2;
        margin-top: 4vw;
        padding-top: 4vw;
        opacity: 1;
        background-color: transparent;
        border-radius: 0;
        height: auto; } }
    .charm-sl-hov-desc {
      letter-spacing: .14em;
      line-height: 2.44444;
      text-align: center;
      color: #7A4A3F; }
      @media screen and (max-width: 480px) {
        .charm-sl-hov-desc {
          font-size: 3.7333333333vw;
          text-align: left; }
          .charm-sl-hov-desc br {
            display: none; } }
    .charm-sl-hov .btnmore {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      top: 330px; }
      @media screen and (max-width: 1300px) {
        .charm-sl-hov .btnmore {
          top: 25.3846153846vw; } }
      @media screen and (max-width: 480px) {
        .charm-sl-hov .btnmore {
          position: relative;
          margin-left: auto;
          margin-right: auto;
          left: auto;
          transform: translateX(0);
          top: auto;
          margin-top: 2.9333333333vw; } }

/* dogmark
---------------------------------------------------------------------------*/
.dogmark {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 54px;
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .dogmark {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .dogmark {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .dogmark {
      margin-top: 4.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .dogmark {
      margin-top: 10.08vw; } }
  @media screen and (max-width: 1300px) {
    .dogmark {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .dogmark {
      margin-bottom: 14.9333333333vw; } }
  @media screen and (max-width: 480px) {
    .dogmark {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; } }
  .dogmark-icon {
    width: 108px; }
    @media screen and (max-width: 1300px) {
      .dogmark-icon {
        width: 8.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .dogmark-icon {
        width: 26vw; } }
  .dogmark-tx {
    width: 420px;
    padding: 0 1.5em;
    font-size: 16px;
    line-height: 1.875;
    letter-spacing: .14em; }
    @media screen and (max-width: 1300px) {
      .dogmark-tx {
        font-size: 1.2307692308vw; } }
    @media screen and (max-width: 480px) {
      .dogmark-tx {
        font-size: 3.7925909333vw; } }
    @media screen and (max-width: 480px) {
      .dogmark-tx {
        width: 57.6vw;
        padding: 0; } }
  .dogmark-btn {
    width: 360px; }
    @media screen and (max-width: 1300px) {
      .dogmark-btn {
        width: 27.6923076923vw; } }
    @media screen and (max-width: 480px) {
      .dogmark-btn {
        width: 100%;
        margin-top: 8.5333333333vw; } }

/* tp
---------------------------------------------------------------------------*/
.tp-en {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  font-size: 24px;
  letter-spacing: .1em;
  color: #CAB7B2; }
  @media screen and (max-width: 1300px) {
    .tp-en {
      font-size: 1.8461538462vw; } }
  @media screen and (max-width: 480px) {
    .tp-en {
      font-size: 5.6888864vw; } }
  @media screen and (max-width: 480px) {
    .tp-en {
      font-size: 5.8666666667vw; } }

.tp-hdl {
  font-size: 28px;
  font-weight: 600;
  letter-spacing: .14em;
  line-height: 2; }
  @media screen and (max-width: 1300px) {
    .tp-hdl {
      font-size: 2.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .tp-hdl {
      font-size: 6.6370341333vw; } }
  @media screen and (max-width: 480px) {
    .tp-hdl {
      font-size: 6.6666666667vw; } }

.tp-desc {
  font-size: 18px;
  letter-spacing: .14em;
  line-height: 2.444; }
  @media screen and (max-width: 1300px) {
    .tp-desc {
      font-size: 1.3846153846vw; } }
  @media screen and (max-width: 480px) {
    .tp-desc {
      font-size: 4.2666648vw; } }
  @media screen and (max-width: 480px) {
    .tp-desc {
      font-size: 4.2666666667vw; } }

.tp-deco {
  position: absolute;
  width: 93px;
  height: 155px; }
  @media screen and (max-width: 1300px) {
    .tp-deco {
      width: 7.1538461538vw;
      height: 11.9230769231vw; } }
  @media screen and (max-width: 480px) {
    .tp-deco {
      width: 22.4vw;
      height: 37.3333333333vw; } }

/* onsen
---------------------------------------------------------------------------*/
.onsen {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .onsen {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .onsen {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .onsen {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .onsen {
      margin-bottom: 14.9333333333vw; } }
  .onsen-hd {
    position: relative;
    padding-top: 120px;
    margin-bottom: 110px;
    color: #ffffff; }
    @media screen and (max-width: 1300px) {
      .onsen-hd {
        padding-top: 9.2307692308vw; } }
    @media screen and (max-width: 480px) {
      .onsen-hd {
        padding-top: 22.4vw; } }
    @media screen and (max-width: 1300px) {
      .onsen-hd {
        margin-bottom: 8.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .onsen-hd {
        margin-bottom: 20.5333333333vw; } }
    @media screen and (max-width: 480px) {
      .onsen-hd {
        padding-top: 54.6666666667vw;
        margin-bottom: 9.3333333333vw; } }
    .onsen-hd::before {
      position: absolute;
      content: "";
      width: 100vw;
      height: 680px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      background-image: url(../img/top/onsen-hd.jpg);
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      z-index: -1; }
      @media screen and (max-width: 1300px) {
        .onsen-hd::before {
          height: 52.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .onsen-hd::before {
          height: 196.2666666667vw;
          background-image: url(../img/top/onsen-hd-sp.jpg); } }
    .onsen-hd-en {
      margin-bottom: 40px; }
      @media screen and (max-width: 1300px) {
        .onsen-hd-en {
          margin-bottom: 3.0769230769vw; } }
      @media screen and (max-width: 480px) {
        .onsen-hd-en {
          margin-bottom: 7.4666666667vw; } }
    .onsen-hd-ja {
      margin-bottom: 46px; }
      @media screen and (max-width: 1300px) {
        .onsen-hd-ja {
          margin-bottom: 3.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .onsen-hd-ja {
          margin-bottom: 8.5866666667vw; } }
    .onsen-hd-deco {
      top: 30px;
      left: 310px;
      opacity: 0.6; }
      @media screen and (max-width: 1300px) {
        .onsen-hd-deco {
          top: 2.3076923077vw;
          left: 23.8461538462vw; } }
      @media screen and (max-width: 480px) {
        .onsen-hd-deco {
          top: 36vw;
          left: 62.1333333333vw; } }
  .onsen-ft {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 54px; }
    @media screen and (max-width: 1300px) {
      .onsen-ft {
        margin-bottom: 4.1538461538vw; } }
    @media screen and (max-width: 480px) {
      .onsen-ft {
        margin-bottom: 10.08vw; } }
    .onsen-ft li {
      width: 338px; }
      @media screen and (max-width: 1300px) {
        .onsen-ft li {
          width: 26vw; } }
      .onsen-ft li a {
        display: block;
        position: relative; }
        .onsen-ft li a .onsen-ft-icon {
          position: absolute;
          width: 108px;
          height: 108px;
          left: -20px;
          top: -45px; }
          @media screen and (max-width: 1300px) {
            .onsen-ft li a .onsen-ft-icon {
              width: 8.3076923077vw;
              height: 8.3076923077vw;
              left: -1.5384615385vw;
              top: -3.4615384615vw; } }
        @media (hover: hover) {
          .onsen-ft li a:hover {
            opacity: 1; }
            .onsen-ft li a:hover .onsen-ft-img-hov,
            .onsen-ft li a:hover .onsen-ft-img::after {
              opacity: 1; } }
    .onsen-ft-img {
      position: relative;
      border-radius: 32px;
      overflow: hidden; }
      @media screen and (max-width: 1300px) {
        .onsen-ft-img {
          border-radius: 2.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .onsen-ft-img {
          border-radius: 8.5333333333vw; } }
      .onsen-ft-img-hov {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 80px;
        background-color: rgba(244, 237, 234, 0.9);
        opacity: 0;
        transition-property: all;
        transition-duration: 0.3s;
        transition-timing-function: ease; }
      .onsen-ft-img::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        border: 8px solid #CAB7B2;
        border-radius: 32px;
        left: 0;
        top: 0;
        opacity: 0;
        transition-property: all;
        transition-duration: 0.3s;
        transition-timing-function: ease; }
        @media screen and (max-width: 1300px) {
          .onsen-ft-img::after {
            border-radius: 2.4615384615vw; } }
        @media screen and (max-width: 480px) {
          .onsen-ft-img::after {
            border-radius: 8.5333333333vw; } }
    .onsen-ft-name {
      font-size: 22px;
      letter-spacing: .14em;
      text-align: center;
      margin-top: 30px;
      font-weight: 600;
      color: #7A4A3F;
      width: calc(100% + 2em);
      margin-left: -1em;
      margin-right: -1em; }
      @media screen and (max-width: 1300px) {
        .onsen-ft-name {
          font-size: 1.6923076923vw; } }
      @media screen and (max-width: 480px) {
        .onsen-ft-name {
          font-size: 5.2148125333vw; } }
      @media screen and (max-width: 1300px) {
        .onsen-ft-name {
          margin-top: 2.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .onsen-ft-name {
          margin-top: 5.6vw; } }
  .onsen-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
  @media screen and (max-width: 480px) {
    .onsen-sl .swiper-slide {
      width: 82.4vw;
      margin-left: auto;
      margin-right: auto; }
    .onsen-sl-item {
      display: block;
      position: relative;
      width: 76vw;
      margin-left: auto;
      margin-right: auto; }
    .onsen-sl-icon {
      position: absolute;
      width: 26vw;
      height: 26vw;
      top: -11.2vw;
      left: -4.2666666667vw; }
    .onsen-sl-btn {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin-top: 5.0666666667vw;
      margin-bottom: 8.5333333333vw; } }

/* cuisine
---------------------------------------------------------------------------*/
.cuisine {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .cuisine {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .cuisine {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .cuisine {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .cuisine {
      margin-bottom: 14.9333333333vw; } }
  .cuisine-hd {
    padding-top: 145px;
    margin-bottom: 202px; }
    @media screen and (max-width: 1300px) {
      .cuisine-hd {
        padding-top: 11.1538461538vw; } }
    @media screen and (max-width: 480px) {
      .cuisine-hd {
        padding-top: 27.0666666667vw; } }
    @media screen and (max-width: 1300px) {
      .cuisine-hd {
        margin-bottom: 15.5384615385vw; } }
    @media screen and (max-width: 480px) {
      .cuisine-hd {
        margin-bottom: 37.7066666667vw; } }
    @media screen and (max-width: 480px) {
      .cuisine-hd {
        padding-top: 0;
        margin-bottom: 113.8666666667vw; } }
    .cuisine-hd-tx {
      position: relative;
      width: 420px;
      margin-left: auto;
      margin-right: 0; }
      @media screen and (max-width: 1300px) {
        .cuisine-hd-tx {
          width: 32.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .cuisine-hd-tx {
          width: 100%; } }
      .cuisine-hd-tx::before {
        position: absolute;
        content: "";
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        width: 855px;
        height: 780px;
        top: -100px;
        left: -180px;
        z-index: -1;
        background-image: url(../img/top/cuisine-hd-tx.png); }
        @media screen and (max-width: 1300px) {
          .cuisine-hd-tx::before {
            width: 65.7692307692vw;
            height: 60vw;
            top: -7.6923076923vw;
            left: -13.8461538462vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-hd-tx::before {
            width: 130.6666666667vw;
            height: 122.2666666667vw;
            top: -14.9333333333vw;
            left: -28.5333333333vw; } }
      .cuisine-hd-tx-en {
        margin-bottom: 40px; }
        @media screen and (max-width: 1300px) {
          .cuisine-hd-tx-en {
            margin-bottom: 3.0769230769vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-hd-tx-en {
            margin-bottom: 7.4666666667vw; } }
      .cuisine-hd-tx-ja {
        margin-bottom: 46px;
        color: #7A4A3F; }
        @media screen and (max-width: 1300px) {
          .cuisine-hd-tx-ja {
            margin-bottom: 3.5384615385vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-hd-tx-ja {
            margin-bottom: 8.5866666667vw; } }
      .cuisine-hd-tx-desc {
        margin-bottom: 54px; }
        @media screen and (max-width: 1300px) {
          .cuisine-hd-tx-desc {
            margin-bottom: 4.1538461538vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-hd-tx-desc {
            margin-bottom: 10.08vw; } }
      .cuisine-hd-tx-deco {
        top: -170px;
        left: -170px; }
        @media screen and (max-width: 1300px) {
          .cuisine-hd-tx-deco {
            top: -13.0769230769vw;
            left: -13.0769230769vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-hd-tx-deco {
            top: 157.3333333333vw;
            left: 65.2vw; } }
      @media screen and (max-width: 480px) {
        .cuisine-hd-tx-btn {
          display: none; } }
    .cuisine-hd-img {
      position: absolute;
      width: 833px;
      height: 717px;
      top: 0;
      left: -245px; }
      @media screen and (max-width: 1300px) {
        .cuisine-hd-img {
          width: 64.0769230769vw;
          height: 55.1538461538vw;
          left: -18.8461538462vw; } }
      @media screen and (max-width: 480px) {
        .cuisine-hd-img {
          width: 109.8666666667vw;
          height: 94.6666666667vw;
          top: 79.0666666667vw;
          left: -12.6666666667vw; } }
  .cuisine-ft {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    @media screen and (max-width: 480px) {
      .cuisine-ft {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    .cuisine-ft-tx {
      position: relative;
      width: 462px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      @media screen and (max-width: 1300px) {
        .cuisine-ft-tx {
          width: 35.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .cuisine-ft-tx {
          width: 100%;
          margin-bottom: 7.2vw; } }
      .cuisine-ft-tx::before {
        position: absolute;
        content: "";
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        width: 108px;
        height: 108px;
        background-image: url(../img/cmn/icon-dogs.png);
        top: 50px;
        left: 310px; }
        @media screen and (max-width: 1300px) {
          .cuisine-ft-tx::before {
            width: 8.3076923077vw;
            height: 8.3076923077vw;
            top: 3.8461538462vw;
            left: 23.8461538462vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-ft-tx::before {
            width: 24.4vw;
            height: 24.4vw;
            top: 74vw;
            left: 66vw; } }
    .cuisine-ft-img {
      width: 50%; }
      @media screen and (max-width: 480px) {
        .cuisine-ft-img {
          width: 100%; } }
      @media screen and (min-width: 481px) {
        .cuisine-ft-img > div {
          width: 624px;
          margin-left: 0;
          margin-right: -84px; } }
  @media screen and (min-width: 481px) and (max-width: 1300px) {
    .cuisine-ft-img > div {
      width: 48vw;
      margin-right: -6.4615384615vw; } }

      .cuisine-ft-img img {
        border-radius: 32px; }
        @media screen and (max-width: 1300px) {
          .cuisine-ft-img img {
            border-radius: 2.4615384615vw; } }
        @media screen and (max-width: 480px) {
          .cuisine-ft-img img {
            border-radius: 8.5333333333vw; } }
  @media screen and (max-width: 480px) {
    .cuisine-btn {
      margin-top: 8.5333333333vw; } }

/* rooms
---------------------------------------------------------------------------*/
.rooms {
  position: relative;
  z-index: 800;
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .rooms {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .rooms {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .rooms {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .rooms {
      margin-bottom: 14.9333333333vw; } }
  .rooms-hd {
    position: relative;
    padding-top: 120px;
    margin-bottom: 110px;
    color: #ffffff; }
    @media screen and (max-width: 1300px) {
      .rooms-hd {
        padding-top: 9.2307692308vw; } }
    @media screen and (max-width: 480px) {
      .rooms-hd {
        padding-top: 22.4vw; } }
    @media screen and (max-width: 1300px) {
      .rooms-hd {
        margin-bottom: 8.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .rooms-hd {
        margin-bottom: 20.5333333333vw; } }
    @media screen and (max-width: 480px) {
      .rooms-hd {
        padding-top: 54.6666666667vw;
        margin-bottom: 9.3333333333vw; } }
    .rooms-hd::before {
      position: absolute;
      content: "";
      width: 100vw;
      height: 680px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      background-image: url(../img/top/rooms-hd.jpg);
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      z-index: -1; }
      @media screen and (max-width: 1300px) {
        .rooms-hd::before {
          height: 52.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .rooms-hd::before {
          height: 410.6666666667vw;
          background-image: url(../img/top/rooms-hd-sp.jpg); } }
    .rooms-hd-tx {
      position: relative;
      width: 420px;
      margin-left: auto;
      margin-right: 0; }
      @media screen and (max-width: 1300px) {
        .rooms-hd-tx {
          width: 32.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .rooms-hd-tx {
          width: 100%; } }
    .rooms-hd-en {
      margin-bottom: 40px; }
      @media screen and (max-width: 1300px) {
        .rooms-hd-en {
          margin-bottom: 3.0769230769vw; } }
      @media screen and (max-width: 480px) {
        .rooms-hd-en {
          margin-bottom: 7.4666666667vw; } }
    .rooms-hd-ja {
      margin-bottom: 46px; }
      @media screen and (max-width: 1300px) {
        .rooms-hd-ja {
          margin-bottom: 3.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .rooms-hd-ja {
          margin-bottom: 8.5866666667vw; } }
    .rooms-hd-deco {
      top: -70px;
      right: 36px;
      opacity: 0.6; }
      @media screen and (max-width: 1300px) {
        .rooms-hd-deco {
          top: -5.3846153846vw;
          right: 2.7692307692vw; } }
      @media screen and (max-width: 480px) {
        .rooms-hd-deco {
          top: -20vw;
          right: 2.9333333333vw; } }
  .rooms-ft {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    @media screen and (max-width: 480px) {
      .rooms-ft {
        display: none; } }
    .rooms-ft-menu {
      width: 476px;
      padding-top: 224px; }
      @media screen and (max-width: 1300px) {
        .rooms-ft-menu {
          padding-top: 17.2307692308vw; } }
      @media screen and (max-width: 480px) {
        .rooms-ft-menu {
          padding-top: 41.8133333333vw; } }
      @media screen and (max-width: 1300px) {
        .rooms-ft-menu {
          width: 36.6153846154vw; } }
      .rooms-ft-menu .roomsftsl-pagination {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; }
        .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet {
          position: relative;
          width: 477px;
          height: 75px;
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
          opacity: 1;
          background-color: transparent;
          border-radius: 0; }
          @media screen and (max-width: 1300px) {
            .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet {
              width: 36.6923076923vw;
              height: 5.7692307692vw; } }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet::before {
            position: absolute;
            content: "";
            width: 100%;
            height: 100%;
            background-color: #EBE4E2;
            top: -1px;
            left: 0;
            opacity: 0;
            transition-property: all;
            transition-duration: 0.3s;
            transition-timing-function: ease;
            z-index: -1; }
            @media screen and (max-width: 1300px) {
              .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet::before {
                width: 62.1538461538vw;
                top: -0.0769230769vw; } }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
            background-color: transparent; }
            .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
              opacity: 1; }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(1) {
            background-image: url(../img/top/rooms-ft-menu01.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(2) {
            background-image: url(../img/top/rooms-ft-menu02.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(3) {
            background-image: url(../img/top/rooms-ft-menu03.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(4) {
            background-image: url(../img/top/rooms-ft-menu04.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(5) {
            background-image: url(../img/top/rooms-ft-menu05.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(6) {
            background-image: url(../img/top/rooms-ft-menu06.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(7) {
            background-image: url(../img/top/rooms-ft-menu07.png); }
          .rooms-ft-menu .roomsftsl-pagination .swiper-pagination-bullet:nth-of-type(8) {
            background-image: url(../img/top/rooms-ft-menu08.png); }
    .rooms-ft-main {
      position: relative;
      width: 50%; }
      .rooms-ft-main .roomsftsl {
        width: 840px;
        margin-left: 0;
        margin-right: -300px; }
        @media screen and (max-width: 1300px) {
          .rooms-ft-main .roomsftsl {
            width: 64.6153846154vw;
            margin-right: -23.0769230769vw; } }
      .rooms-ft-main::before {
        position: absolute;
        content: "";
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        background-image: url(../img/top/rooms-ft-main-bg.png);
        width: 1071px;
        height: 976px;
        top: -323px;
        left: -85px;
        z-index: -2; }
        @media screen and (max-width: 1300px) {
          .rooms-ft-main::before {
            width: 82.3846153846vw;
            height: 75.0769230769vw; } }
      .rooms-ft-main-item {
        display: block; }
      .rooms-ft-main-img {
        margin-bottom: 22px; }
        @media screen and (max-width: 1300px) {
          .rooms-ft-main-img {
            margin-bottom: 1.6923076923vw; } }
        @media screen and (max-width: 480px) {
          .rooms-ft-main-img {
            margin-bottom: 4.1066666667vw; } }
        .rooms-ft-main-img img {
          border-radius: 32px; }
          @media screen and (max-width: 1300px) {
            .rooms-ft-main-img img {
              border-radius: 2.4615384615vw; } }
          @media screen and (max-width: 480px) {
            .rooms-ft-main-img img {
              border-radius: 8.5333333333vw; } }
        .rooms-ft-main-img.wizdog {
          position: relative; }
          .rooms-ft-main-img.wizdog::after {
            position: absolute;
            content: "";
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
            width: 108px;
            height: 108px;
            background-image: url(../img/cmn/icon-dogs.png);
            left: -10px;
            bottom: -16px; }
            @media screen and (max-width: 1300px) {
              .rooms-ft-main-img.wizdog::after {
                width: 8.3076923077vw;
                height: 8.3076923077vw;
                left: -0.7692307692vw;
                bottom: -1.2307692308vw; } }
            @media screen and (max-width: 480px) {
              .rooms-ft-main-img.wizdog::after {
                width: 24.4vw;
                height: 24.4vw; } }
      .rooms-ft-main-tx {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
        .rooms-ft-main-tx .name {
          width: 100%;
          font-size: 22px;
          color: #7A4A3F;
          font-weight: 600;
          letter-spacing: .14em;
          line-height: 1.8;
          margin-bottom: 14px; }
          @media screen and (max-width: 1300px) {
            .rooms-ft-main-tx .name {
              font-size: 1.6923076923vw; } }
          @media screen and (max-width: 480px) {
            .rooms-ft-main-tx .name {
              font-size: 5.2148125333vw; } }
          @media screen and (max-width: 1300px) {
            .rooms-ft-main-tx .name {
              margin-bottom: 1.0769230769vw; } }
          @media screen and (max-width: 480px) {
            .rooms-ft-main-tx .name {
              margin-bottom: 2.6133333333vw; } }
          .rooms-ft-main-tx .name small {
            font-size: 16px; }
            @media screen and (max-width: 1300px) {
              .rooms-ft-main-tx .name small {
                font-size: 1.2307692308vw; } }
            @media screen and (max-width: 480px) {
              .rooms-ft-main-tx .name small {
                font-size: 3.7925909333vw; } }
        .rooms-ft-main-tx .icons {
          width: 50%; }
          .rooms-ft-main-tx .icons img {
            width: 165px; }
            @media screen and (max-width: 1300px) {
              .rooms-ft-main-tx .icons img {
                width: 12.6923076923vw; } }
  .rooms-btn {
    margin-top: 64px; }
    @media screen and (max-width: 1300px) {
      .rooms-btn {
        margin-top: 4.9230769231vw; } }
    @media screen and (max-width: 480px) {
      .rooms-btn {
        margin-top: 11.9466666667vw; } }
  @media screen and (max-width: 480px) {
    .rooms-sp ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      gap: 6.2666666667vw 0; }
      .rooms-sp ul li {
        width: 43.0666666667vw; }
    .rooms-sp-img {
      position: relative; }
      .rooms-sp-img img {
        border-radius: 4.2666666667vw; }
      .rooms-sp-img.wizdog {
        position: relative; }
        .rooms-sp-img.wizdog::after {
          position: absolute;
          content: "";
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain;
          width: 20vw;
          height: 20vw;
          background-image: url(../img/cmn/icon-dogs.png);
          top: -4.8vw;
          right: -1.8666666667vw; }
      .rooms-sp-img .num {
        position: absolute;
        width: 13.8666666667vw;
        height: 13.8666666667vw;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 6.4vw;
        font-family: "Montserrat", sans-serif;
        font-optical-sizing: auto;
        font-weight: 600;
        font-style: normal;
        letter-spacing: .05em;
        color: #BCA49F;
        left: -0.8vw;
        bottom: -3.4666666667vw;
        background-color: #EBE4E2;
        border-radius: 50%; }
    .rooms-sp .name {
      font-size: 4.2666666667vw;
      letter-spacing: .14em;
      line-height: 1.6;
      font-weight: 600;
      top: 3.2vw;
      margin-bottom: 3.2vw;
      margin-top: 3.2vw;
      color: #7A4A3F;
      width: calc(100% + 1em);
      margin-left: 0;
      margin-right: -1em; }
      .rooms-sp .name small {
        font-size: 3.7333333333vw; }
    .rooms-sp .icons {
      width: 31.7333333333vw;
      margin-bottom: 3.2vw; } }

/* location
---------------------------------------------------------------------------*/
.location {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .location {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .location {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .location {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .location {
      margin-bottom: 14.9333333333vw; } }
  .location::before {
    position: absolute;
    content: "";
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 2000px;
    height: 1540px;
    background-image: url(../img/top/location-bg.png);
    left: 50%;
    transform: translateX(-50%);
    top: -165px; }
    @media screen and (max-width: 1300px) {
      .location::before {
        width: 153.8461538462vw;
        height: 118.4615384615vw;
        top: -12.6923076923vw; } }
    @media screen and (max-width: 480px) {
      .location::before {
        background-image: url(../img/top/location-bg-sp.png);
        width: 100vw;
        height: 235.0666666667vw;
        top: 10vw; } }
  .location-tx {
    position: relative;
    width: 420px;
    margin-left: auto;
    margin-right: 0;
    padding-bottom: 549px; }
    @media screen and (max-width: 1300px) {
      .location-tx {
        padding-bottom: 42.2307692308vw; } }
    @media screen and (max-width: 480px) {
      .location-tx {
        padding-bottom: 102.48vw; } }
    @media screen and (max-width: 1300px) {
      .location-tx {
        width: 32.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .location-tx {
        width: 100%;
        padding-bottom: 230vw; } }
  .location-en {
    margin-bottom: 40px; }
    @media screen and (max-width: 1300px) {
      .location-en {
        margin-bottom: 3.0769230769vw; } }
    @media screen and (max-width: 480px) {
      .location-en {
        margin-bottom: 7.4666666667vw; } }
  .location-ja {
    margin-bottom: 46px;
    color: #7A4A3F; }
    @media screen and (max-width: 1300px) {
      .location-ja {
        margin-bottom: 3.5384615385vw; } }
    @media screen and (max-width: 480px) {
      .location-ja {
        margin-bottom: 8.5866666667vw; } }
  .location-deco {
    top: -36px;
    left: -170px;
    opacity: 0.6; }
    @media screen and (max-width: 1300px) {
      .location-deco {
        top: -2.7692307692vw;
        left: -13.0769230769vw; } }
    @media screen and (max-width: 480px) {
      .location-deco {
        top: -10.1333333333vw;
        left: auto;
        right: 1.0666666667vw; } }
  .location-img {
    position: absolute;
    left: -437px;
    top: 0;
    width: 1022px;
    height: 936px; }
    @media screen and (max-width: 1300px) {
      .location-img {
        left: -33.6153846154vw;
        width: 78.6153846154vw;
        height: 72vw; } }
    @media screen and (max-width: 480px) {
      .location-img {
        left: -17.4666666667vw;
        top: 185vw;
        width: 148.1333333333vw;
        height: 135.6vw;
        z-index: -1; } }
  .location-btn {
    position: relative;
    z-index: 10;
    margin-top: 64px; }
    @media screen and (max-width: 1300px) {
      .location-btn {
        margin-top: 4.9230769231vw; } }
    @media screen and (max-width: 480px) {
      .location-btn {
        margin-top: 11.9466666667vw; } }

/* sightseeing
---------------------------------------------------------------------------*/
.sightseeing {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding-bottom: 775px;
  z-index: 10; }
  @media screen and (max-width: 1300px) {
    .sightseeing {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .sightseeing {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .sightseeing {
      padding-bottom: 59.6153846154vw; } }
  @media screen and (max-width: 480px) {
    .sightseeing {
      padding-bottom: 144.6666666667vw; } }
  @media screen and (max-width: 480px) {
    .sightseeing {
      padding-bottom: 73.3333333333vw;
      margin-bottom: 80px; } }
  @media screen and (max-width: 480px) and (max-width: 1300px) {
    .sightseeing {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) and (max-width: 480px) {
    .sightseeing {
      margin-bottom: 14.9333333333vw; } }

  .sightseeing::before {
    position: absolute;
    content: "";
    width: 2000px;
    height: 957px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(../img/top/sightseeing-bg.jpg);
    left: 50%;
    transform: translateX(-50%);
    bottom: 144px;
    z-index: -1; }
    @media screen and (max-width: 1300px) {
      .sightseeing::before {
        width: 153.8461538462vw;
        height: 73.6153846154vw;
        bottom: 11.0769230769vw; } }
    @media screen and (max-width: 480px) {
      .sightseeing::before {
        background-image: url(../img/top/sightseeing-bg-sp.jpg);
        width: 100vw;
        height: 186.1333333333vw;
        bottom: 0; } }
  @media screen and (max-width: 480px) {
    .sightseeing-hd {
      margin-bottom: 18.2666666667vw; } }
  .sightseeing-hd-tx {
    position: relative;
    width: 460px; }
    @media screen and (max-width: 1300px) {
      .sightseeing-hd-tx {
        width: 35.3846153846vw; } }
    @media screen and (max-width: 480px) {
      .sightseeing-hd-tx {
        width: 100%; } }
    .sightseeing-hd-tx-en {
      margin-bottom: 40px; }
      @media screen and (max-width: 1300px) {
        .sightseeing-hd-tx-en {
          margin-bottom: 3.0769230769vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-hd-tx-en {
          margin-bottom: 7.4666666667vw; } }
    .sightseeing-hd-tx-ja {
      margin-bottom: 46px;
      color: #7A4A3F; }
      @media screen and (max-width: 1300px) {
        .sightseeing-hd-tx-ja {
          margin-bottom: 3.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-hd-tx-ja {
          margin-bottom: 8.5866666667vw; } }
  @media screen and (max-width: 480px) {
    .sightseeing-ft {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; } }
  .sightseeing-ft-img {
    position: relative; }
    .sightseeing-ft-img-img {
      border-radius: 32px;
      overflow: hidden; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft-img-img {
          border-radius: 2.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft-img-img {
          border-radius: 8.5333333333vw; } }
    .sightseeing-ft-img-hov {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 80px;
      background-color: rgba(244, 237, 234, 0.9);
      opacity: 0;
      transition-property: all;
      transition-duration: 0.3s;
      transition-timing-function: ease;
      border-radius: 32px;
      border-top-left-radius: 0;
      border-top-right-radius: 0; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft-img-hov {
          border-radius: 2.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft-img-hov {
          border-radius: 8.5333333333vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft-img-hov {
          opacity: 1;
          width: 22.8vw;
          height: 9.0666666667vw;
          border-radius: 4.5333333333vw;
          left: 4.6666666667vw;
          bottom: 4.6666666667vw; } }
    .sightseeing-ft-img::after {
      position: absolute;
      content: "";
      width: 100%;
      height: 100%;
      border: 8px solid #CAB7B2;
      border-radius: 32px;
      left: 0;
      top: 0;
      opacity: 0;
      transition-property: all;
      transition-duration: 0.3s;
      transition-timing-function: ease; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft-img::after {
          border-radius: 2.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft-img::after {
          border-radius: 8.5333333333vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft-img::after {
          opacity: 1;
          border-width: 1.6vw; } }
  .sightseeing-ft-icon {
    position: absolute;
    width: 108px;
    height: 108px;
    left: -20px;
    top: -45px;
    z-index: 10; }
    @media screen and (max-width: 1300px) {
      .sightseeing-ft-icon {
        width: 8.3076923077vw;
        height: 8.3076923077vw;
        left: -1.5384615385vw;
        top: -3.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .sightseeing-ft-icon {
        width: 26vw;
        height: 26vw;
        left: -1.6vw;
        top: -10.5333333333vw; } }
  .sightseeing-ft-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: -25px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: 70px;
    color: #ffffff;
    font-size: 22px;
    letter-spacing: .14em;
    z-index: 20;
    text-align: center; }
    @media screen and (max-width: 1300px) {
      .sightseeing-ft-name {
        font-size: 1.6923076923vw; } }
    @media screen and (max-width: 480px) {
      .sightseeing-ft-name {
        font-size: 5.2148125333vw; } }
    @media screen and (max-width: 1300px) {
      .sightseeing-ft-name {
        top: -1.9230769231vw;
        height: 5.3846153846vw; } }
    @media screen and (max-width: 480px) {
      .sightseeing-ft-name {
        top: -5.3333333333vw;
        height: 13.6vw; } }
  .sightseeing-ft a {
    display: block;
    position: absolute; }
    @media screen and (max-width: 480px) {
      .sightseeing-ft a {
        position: relative;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        height: auto !important; } }
    @media (hover: hover) {
      .sightseeing-ft a:hover {
        opacity: 1; }
        .sightseeing-ft a:hover .sightseeing-ft-img-hov,
        .sightseeing-ft a:hover .sightseeing-ft-img::after {
          opacity: 1; } }
    .sightseeing-ft a.sift01 {
      width: 596px;
      height: 760px;
      top: 0;
      left: 50%; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft a.sift01 {
          width: 45.8461538462vw;
          height: 58.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft a.sift01 {
          width: 100%;
          margin-bottom: 8.5333333333vw; } }
      .sightseeing-ft a.sift01 .sightseeing-ft-name {
        width: 418px;
        left: 95px;
        background-image: url(../img/top/sightseeing-name01.png); }
        @media screen and (max-width: 1300px) {
          .sightseeing-ft a.sift01 .sightseeing-ft-name {
            width: 32.1538461538vw;
            left: 7.3076923077vw; } }
        @media screen and (max-width: 480px) {
          .sightseeing-ft a.sift01 .sightseeing-ft-name {
            width: 60vw;
            height: 20.6666666667vw;
            left: 28.5333333333vw;
            top: -9.3333333333vw;
            background-image: url(../img/top/sightseeing-name01-sp.png); } }
    .sightseeing-ft a.sift02 {
      width: 552px;
      height: 280px;
      top: 387px;
      left: -56px; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft a.sift02 {
          width: 42.4615384615vw;
          height: 21.5384615385vw;
          top: 29.7692307692vw;
          left: -4.3076923077vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft a.sift02 {
          width: 100%;
          margin-bottom: 11.4666666667vw; } }
      .sightseeing-ft a.sift02 .sightseeing-ft-name {
        width: 246px;
        right: 7px;
        background-image: url(../img/top/sightseeing-name02.png); }
        @media screen and (max-width: 1300px) {
          .sightseeing-ft a.sift02 .sightseeing-ft-name {
            width: 18.9230769231vw;
            right: 0.5384615385vw; } }
        @media screen and (max-width: 480px) {
          .sightseeing-ft a.sift02 .sightseeing-ft-name {
            width: 53.6vw;
            right: -2.1333333333vw; } }
    .sightseeing-ft a.sift03 {
      width: 280px;
      height: 234px;
      top: 769px;
      left: 0; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft a.sift03 {
          width: 21.5384615385vw;
          height: 18vw;
          top: 59.1538461538vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft a.sift03 {
          width: 38.1333333333vw; } }
      .sightseeing-ft a.sift03 .sightseeing-ft-name {
        width: 238px;
        left: -18px;
        background-image: url(../img/top/sightseeing-name03.png); }
        @media screen and (max-width: 1300px) {
          .sightseeing-ft a.sift03 .sightseeing-ft-name {
            width: 18.3076923077vw;
            left: -1.3846153846vw; } }
        @media screen and (max-width: 480px) {
          .sightseeing-ft a.sift03 .sightseeing-ft-name {
            width: 44.4vw;
            left: -2.6666666667vw; } }
    .sightseeing-ft a.sift04 {
      width: 328px;
      height: 240px;
      top: 798px;
      left: 324px; }
      @media screen and (max-width: 1300px) {
        .sightseeing-ft a.sift04 {
          width: 25.2307692308vw;
          height: 18.4615384615vw;
          top: 61.3846153846vw;
          left: 24.9230769231vw; } }
      @media screen and (max-width: 480px) {
        .sightseeing-ft a.sift04 {
          width: 45.0666666667vw;
          margin-top: 8.5333333333vw; } }
      .sightseeing-ft a.sift04 .sightseeing-ft-name {
        width: 192px;
        left: -6px;
        background-image: url(../img/top/sightseeing-name04.png); }
        @media screen and (max-width: 1300px) {
          .sightseeing-ft a.sift04 .sightseeing-ft-name {
            width: 14.7692307692vw;
            left: -0.4615384615vw; } }
        @media screen and (max-width: 480px) {
          .sightseeing-ft a.sift04 .sightseeing-ft-name {
            width: 39.7333333333vw;
            left: 2.5333333333vw; } }
  .sightseeing-btn {
    position: absolute;
    right: 0;
    bottom: 223px; }
    @media screen and (max-width: 1300px) {
      .sightseeing-btn {
        bottom: 17.1538461538vw; } }
    @media screen and (max-width: 480px) {
      .sightseeing-btn {
        position: relative;
        right: auto;
        bottom: auto;
        margin-top: 8.5333333333vw; } }

/* plan
---------------------------------------------------------------------------*/
.plan {
  margin-bottom: 64px; }
  @media screen and (max-width: 1300px) {
    .plan {
      margin-bottom: 4.9230769231vw; } }
  @media screen and (max-width: 480px) {
    .plan {
      margin-bottom: 11.9466666667vw; } }
  .plan-ttl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 56px; }
    @media screen and (max-width: 1300px) {
      .plan-ttl {
        margin-bottom: 4.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .plan-ttl {
        margin-bottom: 10.4533333333vw; } }
    @media screen and (max-width: 480px) {
      .plan-ttl {
        width: 89.3333333333vw;
        margin-left: auto;
        margin-right: auto;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start; } }
    .plan-ttl .tp-hdl {
      position: relative;
      color: #7A4A3F;
      margin-left: 1em; }
      @media screen and (max-width: 480px) {
        .plan-ttl .tp-hdl {
          margin-left: 0; } }
      .plan-ttl .tp-hdl::after {
        position: absolute;
        content: "";
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        background-image: url(../img/top/intr-deco.png);
        right: -183px;
        top: -100px;
        width: 93px;
        height: 155px; }
        @media screen and (max-width: 1300px) {
          .plan-ttl .tp-hdl::after {
            right: -14.0769230769vw;
            top: -7.6923076923vw;
            width: 7.1538461538vw;
            height: 11.9230769231vw; } }
  .plan .swiper-slide {
    width: 336px;
    height: auto; }
    @media screen and (max-width: 1300px) {
      .plan .swiper-slide {
        width: 25.8461538462vw; } }
    @media screen and (max-width: 480px) {
      .plan .swiper-slide {
        width: 80.5333333333vw; } }
  .plan-sl {
    display: block;
    position: relative;
    width: 312px;
    height: 100%;
    margin: 0 auto;
    background-color: #EBE4E2;
    border-radius: 32px;
    padding: 24px;
    padding-bottom: 96px; }
    @media screen and (max-width: 1300px) {
      .plan-sl {
        border-radius: 2.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .plan-sl {
        border-radius: 8.5333333333vw; } }
    @media screen and (max-width: 1300px) {
      .plan-sl {
        width: 24vw;
        padding: 1.8461538462vw;
        padding-bottom: 7.3846153846vw; } }
    @media screen and (max-width: 480px) {
      .plan-sl {
        width: 74.6666666667vw;
        padding: 5.6vw;
        padding-bottom: 22.9333333333vw; } }
    @media (hover: hover) {
      .plan-sl:hover {
        opacity: 1;
        background-color: #ffffff; } }
    .plan-sl.wizdog::after {
      position: absolute;
      content: "";
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      width: 108px;
      height: 108px;
      background-image: url(../img/cmn/icon-dogs.png);
      left: -12px;
      top: -24px; }
      @media screen and (max-width: 1300px) {
        .plan-sl.wizdog::after {
          width: 8.3076923077vw;
          height: 8.3076923077vw;
          left: -0.9230769231vw;
          top: -1.8461538462vw; } }
      @media screen and (max-width: 480px) {
        .plan-sl.wizdog::after {
          width: 26vw;
          height: 26vw;
          left: -4.5333333333vw;
          top: -2.4vw; } }
    .plan-sl-img {
      margin-bottom: 18px; }
      @media screen and (max-width: 1300px) {
        .plan-sl-img {
          margin-bottom: 1.3846153846vw; } }
      @media screen and (max-width: 480px) {
        .plan-sl-img {
          margin-bottom: 3.36vw; } }
      .plan-sl-img img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        object-position: center;
        font-family: "object-fit: cover; object-position: center;";
        border-radius: 32px; }
        @media screen and (max-width: 1300px) {
          .plan-sl-img img {
            border-radius: 2.4615384615vw; } }
        @media screen and (max-width: 480px) {
          .plan-sl-img img {
            border-radius: 8.5333333333vw; } }
        @media screen and (max-width: 1300px) {
          .plan-sl-img img {
            height: 15.3846153846vw; } }
        @media screen and (max-width: 480px) {
          .plan-sl-img img {
            height: 48vw; } }
    .plan-sl-name {
      line-height: 1.77;
      letter-spacing: .14em; }
    .plan-sl .btnmore {
      position: absolute;
      bottom: 33px;
      left: 50%;
      transform: translateX(-50%);
      width: 167px; }
      @media screen and (max-width: 1300px) {
        .plan-sl .btnmore {
          bottom: 2.5384615385vw;
          width: 12.8461538462vw; } }
      @media screen and (max-width: 480px) {
        .plan-sl .btnmore {
          bottom: 8vw;
          width: 40vw; } }

/* topbrbox
---------------------------------------------------------------------------*/
.topbrbox {
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .topbrbox {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .topbrbox {
      margin-bottom: 14.9333333333vw; } }
  @media screen and (max-width: 480px) {
    .topbrbox {
      margin-bottom: 18.6666666667vw; } }
  .topbrbox .brbox {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    background-color: transparent;
    gap: 64px; }
    @media screen and (max-width: 1300px) {
      .topbrbox .brbox {
        gap: 4.9230769231vw; } }
    @media screen and (max-width: 480px) {
      .topbrbox .brbox {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between; }
        .topbrbox .brbox .brbox-bestrate {
          width: 43.7333333333vw; }
        .topbrbox .brbox .head-nav-sub-plan {
          width: 42.6666666667vw; }
          .topbrbox .brbox .head-nav-sub-plan a {
            height: 17.4666666667vw; }
            .topbrbox .brbox .head-nav-sub-plan a i {
              padding-left: 5.7333333333vw; }
              .topbrbox .brbox .head-nav-sub-plan a i::before {
                width: 3.4666666667vw;
                height: 3.4666666667vw; } }

/* news
---------------------------------------------------------------------------*/
.news {
  /* 1080 */
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 80px; }
  @media screen and (max-width: 1300px) {
    .news {
      width: 83.0769230769vw; } }
  @media screen and (max-width: 480px) {
    .news {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .news {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .news {
      margin-bottom: 14.9333333333vw; } }
  @media screen and (min-width: 481px) {
    .news {
      min-height: 400px; } }
  @media screen and (min-width: 481px) and (max-width: 1300px) {
    .news {
      min-height: 30.7692307692vw; } }

  @media screen and (max-width: 480px) {
    .news {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; } }
  .news-ttl {
    position: relative;
    width: 110px; }
    @media screen and (max-width: 1300px) {
      .news-ttl {
        width: 8.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .news-ttl {
        width: 100%; } }
    .news-ttl::before {
      position: absolute;
      content: "";
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      width: 501px;
      height: 432px;
      left: -255px;
      top: -77px;
      background-image: url(../img/top/news-bg.png);
      z-index: -1; }
      @media screen and (max-width: 1300px) {
        .news-ttl::before {
          width: 38.5384615385vw;
          height: 33.2307692308vw;
          left: -19.6153846154vw;
          top: -5.9230769231vw; } }
      @media screen and (max-width: 480px) {
        .news-ttl::before {
          width: 84vw;
          height: 72.2666666667vw;
          top: -13.0666666667vw;
          left: -18.6666666667vw; } }
    .news-ttl::after {
      position: absolute;
      content: "";
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      width: 147px;
      height: 220px;
      bottom: -40px;
      left: -20px;
      background-image: url(../img/top/news-dog.png); }
      @media screen and (max-width: 1300px) {
        .news-ttl::after {
          width: 11.3076923077vw;
          height: 16.9230769231vw;
          bottom: -3.0769230769vw;
          left: -1.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .news-ttl::after {
          width: 27.8666666667vw;
          height: 45.0666666667vw;
          top: -12vw;
          bottom: auto;
          left: 55.7333333333vw; } }
    .news-ttl-en {
      margin-bottom: 20px; }
      @media screen and (max-width: 1300px) {
        .news-ttl-en {
          margin-bottom: 1.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .news-ttl-en {
          margin-bottom: 3.7333333333vw; } }
    .news-ttl-ja {
      margin-bottom: 44px;
      font-size: 24px;
      color: #7A4A3F; }
      @media screen and (max-width: 1300px) {
        .news-ttl-ja {
          margin-bottom: 3.3846153846vw; } }
      @media screen and (max-width: 480px) {
        .news-ttl-ja {
          margin-bottom: 8.2133333333vw; } }
      @media screen and (max-width: 1300px) {
        .news-ttl-ja {
          font-size: 1.8461538462vw; } }
      @media screen and (max-width: 480px) {
        .news-ttl-ja {
          font-size: 5.6888864vw; } }
    @media screen and (max-width: 480px) {
      .news-ttl .btnmore {
        display: none; } }
  .news-list {
    width: 886px;
    border-top: 1px dashed #CAB7B2; }
    @media screen and (max-width: 1300px) {
      .news-list {
        width: 68.1538461538vw; } }
    @media screen and (max-width: 480px) {
      .news-list {
        width: 100%; } }
    .news-list li {
      border-bottom: 1px dashed #CAB7B2; }
      .news-list li a {
        display: block;
        position: relative;
        padding: 20px 16px; }
        @media screen and (max-width: 1300px) {
          .news-list li a {
            padding: 1.5384615385vw 1.2307692308vw; } }
        @media screen and (max-width: 480px) {
          .news-list li a {
            padding: 4vw 0; } }
        @media (hover: hover) {
          .news-list li a:hover {
            opacity: 1;
            background-color: #EBE4E2; } }
        .news-list li a span {
          display: block; }
          .news-list li a span.date {
            font-family: "Montserrat", sans-serif;
            font-optical-sizing: auto;
            font-weight: 600;
            font-style: normal;
            color: #BCA49F;
            margin-bottom: 0.8em;
            letter-spacing: .1em; }
          .news-list li a span.ttl {
            letter-spacing: .14em;
            line-height: 1.7; }
            @media screen and (max-width: 480px) {
              .news-list li a span.ttl {
                width: 72vw; } }
          .news-list li a span.more {
            position: absolute;
            width: 86px;
            font-family: "Montserrat", sans-serif;
            font-optical-sizing: auto;
            font-weight: 600;
            font-style: normal;
            color: #82a2a9;
            font-size: 16px;
            letter-spacing: .1em;
            right: 20px;
            top: 50%;
            transform: translateY(-50%); }
            @media screen and (max-width: 1300px) {
              .news-list li a span.more {
                font-size: 1.2307692308vw; } }
            @media screen and (max-width: 480px) {
              .news-list li a span.more {
                font-size: 3.7925909333vw; } }
            @media screen and (max-width: 1300px) {
              .news-list li a span.more {
                width: 6.6153846154vw;
                right: 1.5384615385vw; } }
            @media screen and (max-width: 480px) {
              .news-list li a span.more {
                width: 9.3333333333vw;
                height: 8vw;
                text-align: center; } }
            .news-list li a span.more::after {
              position: absolute;
              content: "";
              right: 0;
              top: 50%;
              transform: translateY(-50%);
              border-left: 6px solid #7A4A3F;
              border-top: 6px solid transparent;
              border-bottom: 6px solid transparent; }
              @media screen and (max-width: 1300px) {
                .news-list li a span.more::after {
                  border-left-width: 0.4615384615vw;
                  border-top-width: 0.4615384615vw;
                  border-bottom-width: 0.4615384615vw; } }
              @media screen and (max-width: 480px) {
                .news-list li a span.more::after {
                  border-left-width: 1.4666666667vw;
                  border-top-width: 1.4666666667vw;
                  border-bottom-width: 1.4666666667vw;
                  left: 50%;
                  transform: translateX(-50%);
                  right: auto;
                  bottom: 0;
                  top: auto;
                  transform: translateY(0); } }
  @media screen and (max-width: 480px) {
    .news .view-sp > .btnmore {
      margin-top: 8.5333333333vw; } }

/* insta
---------------------------------------------------------------------------*/
.insta {
  /* 1280 */
  width: 1280px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #EBE4E2;
  border-radius: 32px;
  margin-bottom: 80px;
  padding: 64px 100px; }
  @media screen and (max-width: 1300px) {
    .insta {
      width: 98.4615384615vw; } }
  @media screen and (max-width: 480px) {
    .insta {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .insta {
      border-radius: 2.4615384615vw; } }
  @media screen and (max-width: 480px) {
    .insta {
      border-radius: 8.5333333333vw; } }
  @media screen and (max-width: 1300px) {
    .insta {
      margin-bottom: 6.1538461538vw; } }
  @media screen and (max-width: 480px) {
    .insta {
      margin-bottom: 14.9333333333vw; } }
  @media screen and (max-width: 1300px) {
    .insta {
      padding: 4.9230769231vw 7.6923076923vw; } }
  @media screen and (max-width: 480px) {
    .insta {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 11.2vw 8.5333333333vw 8.5333333333vw; } }
  .insta-hd {
    width: 360px; }
    @media screen and (max-width: 1300px) {
      .insta-hd {
        width: 27.6923076923vw; } }
    @media screen and (max-width: 480px) {
      .insta-hd {
        width: 100%; } }
    .insta-hd-ttl {
      font-family: "Montserrat", sans-serif;
      font-optical-sizing: auto;
      font-weight: 600;
      font-style: normal;
      font-size: 32px;
      letter-spacing: .1em;
      position: relative;
      padding-left: 60px;
      color: #7A4A3F;
      margin-bottom: 46px; }
      @media screen and (max-width: 1300px) {
        .insta-hd-ttl {
          font-size: 2.4615384615vw; } }
      @media screen and (max-width: 480px) {
        .insta-hd-ttl {
          font-size: 7.5851818667vw; } }
      @media screen and (max-width: 1300px) {
        .insta-hd-ttl {
          margin-bottom: 3.5384615385vw; } }
      @media screen and (max-width: 480px) {
        .insta-hd-ttl {
          margin-bottom: 8.5866666667vw; } }
      @media screen and (max-width: 1300px) {
        .insta-hd-ttl {
          padding-left: 4.6153846154vw; } }
      @media screen and (max-width: 480px) {
        .insta-hd-ttl {
          padding-left: 14.9333333333vw; } }
      .insta-hd-ttl::before {
        position: absolute;
        content: "";
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        width: 32px;
        height: 32px;
        left: 0;
        background-image: url(../img/top/insta-icon.png);
        top: 50%;
        transform: translateY(-50%); }
        @media screen and (max-width: 1300px) {
          .insta-hd-ttl::before {
            width: 2.4615384615vw;
            height: 2.4615384615vw; } }
        @media screen and (max-width: 480px) {
          .insta-hd-ttl::before {
            width: 8vw;
            height: 8vw; } }
    .insta-hd-btn {
      margin-top: 54px; }
      @media screen and (max-width: 1300px) {
        .insta-hd-btn {
          margin-top: 4.1538461538vw; } }
      @media screen and (max-width: 480px) {
        .insta-hd-btn {
          margin-top: 10.08vw; } }
  .insta-bd {
    width: 664px; }
    @media screen and (max-width: 1300px) {
      .insta-bd {
        width: 51.0769230769vw; } }
    @media screen and (max-width: 480px) {
      .insta-bd {
        width: 100%;
        margin-top: 8.5333333333vw; } }
    @media screen and (max-width: 480px) {
      .insta-bd-btn {
        margin-top: 8.5333333333vw; } }

/* specialbana
---------------------------------------------------------------------------*/
.specialbana {
  position: relative;
  /* 1280 */
  width: 1280px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 75px;
  padding: 32px 100px;
  border-radius: 32px;
  background-image: url(../img/top/specialbana-bg.jpg);
  background-size: 100% auto;
  background-position: center top;
  background-repeat: no-repeat; }
  @media screen and (max-width: 1300px) {
    .specialbana {
      width: 98.4615384615vw; } }
  @media screen and (max-width: 480px) {
    .specialbana {
      width: 89.3333333333vw; } }
  @media screen and (max-width: 1300px) {
    .specialbana {
      margin-bottom: 5.7692307692vw; } }
  @media screen and (max-width: 480px) {
    .specialbana {
      margin-bottom: 14vw; } }
  @media screen and (max-width: 1300px) {
    .specialbana {
      border-radius: 2.4615384615vw; } }
  @media screen and (max-width: 480px) {
    .specialbana {
      border-radius: 8.5333333333vw; } }
  @media screen and (max-width: 1300px) {
    .specialbana {
      padding: 2.4615384615vw 7.6923076923vw; } }
  @media screen and (max-width: 480px) {
    .specialbana {
      padding: 8vw 5.3333333333vw;
      background-size: cover; } }
  .specialbana-icon {
    position: absolute;
    left: 80px;
    top: -30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 103px;
    height: 103px;
    border-radius: 50%;
    background-color: #c1272d;
    text-align: center; }
    @media screen and (max-width: 1300px) {
      .specialbana-icon {
        width: 7.9230769231vw;
        height: 7.9230769231vw;
        left: 6.1538461538vw;
        top: -2.3076923077vw; } }
    @media screen and (max-width: 480px) {
      .specialbana-icon {
        width: 20.5333333333vw;
        height: 20.5333333333vw;
        left: 2vw;
        top: -8vw; } }
    .specialbana-icon small {
      width: 100%;
      color: #ffffff;
      font-size: 22px;
      letter-spacing: .14em;
      line-height: 1.35;
      font-weight: 600; }
      @media screen and (max-width: 1300px) {
        .specialbana-icon small {
          font-size: 1.6923076923vw; } }
      @media screen and (max-width: 480px) {
        .specialbana-icon small {
          font-size: 5.2148125333vw; } }
  .specialbana-bd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    @media screen and (max-width: 480px) {
      .specialbana-bd {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
    .specialbana-bd-tx {
      width: 620px; }
      @media screen and (max-width: 1300px) {
        .specialbana-bd-tx {
          width: 47.6923076923vw; } }
      @media screen and (max-width: 480px) {
        .specialbana-bd-tx {
          width: 100%; } }
      .specialbana-bd-tx-ttl {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: #c1272d;
        line-height: 1.3;
        letter-spacing: .14em;
        margin-top: 50px; }
        @media screen and (max-width: 1300px) {
          .specialbana-bd-tx-ttl {
            margin-top: 3.8461538462vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-ttl {
            margin-top: 9.3333333333vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-ttl {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: start;
            -ms-flex-align: start;
            align-items: flex-start; } }
        .specialbana-bd-tx-ttl strong {
          font-size: 48px;
          font-weight: 600; }
          @media screen and (max-width: 1300px) {
            .specialbana-bd-tx-ttl strong {
              font-size: 3.6923076923vw; } }
          @media screen and (max-width: 480px) {
            .specialbana-bd-tx-ttl strong {
              font-size: 11.3777728vw; } }
          @media screen and (max-width: 480px) {
            .specialbana-bd-tx-ttl strong {
              font-size: 8vw; } }
        .specialbana-bd-tx-ttl span {
          background-color: #F1E4BD;
          font-size: 40px;
          padding: 0 .5em;
          font-weight: 600;
          border-radius: 16px;
          margin-left: 0.5em; }
          @media screen and (max-width: 1300px) {
            .specialbana-bd-tx-ttl span {
              font-size: 3.0769230769vw; } }
          @media screen and (max-width: 480px) {
            .specialbana-bd-tx-ttl span {
              font-size: 9.4814773333vw; } }
          @media screen and (max-width: 1300px) {
            .specialbana-bd-tx-ttl span {
              border-radius: 1.2307692308vw; } }
          @media screen and (max-width: 480px) {
            .specialbana-bd-tx-ttl span {
              border-radius: 4.2666666667vw; } }
          @media screen and (max-width: 480px) {
            .specialbana-bd-tx-ttl span {
              margin-left: 0;
              margin-top: 0.3em;
              font-size: 7vw; } }
      .specialbana-bd-tx-desc {
        font-size: 18px;
        line-height: 2.44;
        letter-spacing: .14em;
        margin-top: 16px; }
        @media screen and (max-width: 1300px) {
          .specialbana-bd-tx-desc {
            font-size: 1.3846153846vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-desc {
            font-size: 4.2666648vw; } }
        @media screen and (max-width: 1300px) {
          .specialbana-bd-tx-desc {
            margin-top: 1.2307692308vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-desc {
            margin-top: 2.9866666667vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-desc {
            line-height: 1.8; } }
      .specialbana-bd-tx-btn {
        margin-top: 25px; }
        @media screen and (max-width: 1300px) {
          .specialbana-bd-tx-btn {
            margin-top: 1.9230769231vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-btn {
            margin-top: 4.6666666667vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-tx-btn {
            display: none; } }
        .specialbana-bd-tx-btn .btn.btn-def {
          display: inline-block;
          width: auto; }
          @media screen and (max-width: 480px) {
            .specialbana-bd-tx-btn .btn.btn-def {
              width: 100%; } }
          .specialbana-bd-tx-btn .btn.btn-def a {
            background-color: #c1272d;
            height: auto;
            min-height: 80px;
            padding: .5em 20px; }
            @media screen and (max-width: 1300px) {
              .specialbana-bd-tx-btn .btn.btn-def a {
                min-height: 6.1538461538vw;
                padding: 0.5em 1.5384615385vw; } }
            @media screen and (max-width: 480px) {
              .specialbana-bd-tx-btn .btn.btn-def a {
                min-height: 19.2vw;
                padding: 2vw 1.5384615385vw; } }
            .specialbana-bd-tx-btn .btn.btn-def a span strong {
              margin-right: 2em;
              line-height: 1.4; }
            .specialbana-bd-tx-btn .btn.btn-def a span i {
              color: #e39da0; }
              .specialbana-bd-tx-btn .btn.btn-def a span i::after {
                background-image: url(../img/cmn/btn-icon-coralpink.png); }
            @media (hover: hover) {
              .specialbana-bd-tx-btn .btn.btn-def a:hover {
                color: #c1272d;
                background-color: #e39da0; }
                .specialbana-bd-tx-btn .btn.btn-def a:hover span i {
                  color: #c1272d; } }
    .specialbana-bd-img {
      width: 418px; }
      @media screen and (max-width: 1300px) {
        .specialbana-bd-img {
          width: 32.1538461538vw; } }
      @media screen and (max-width: 480px) {
        .specialbana-bd-img {
          width: 100%;
          margin-top: 8vw; } }
      .specialbana-bd-img ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 8px; }
        @media screen and (max-width: 1300px) {
          .specialbana-bd-img ul {
            gap: 0.6153846154vw; } }
        @media screen and (max-width: 480px) {
          .specialbana-bd-img ul {
            gap: 2vw; } }
        .specialbana-bd-img ul li img {
          width: 100%;
          object-fit: cover;
          object-position: center;
          font-family: "object-fit: cover; object-position: center;"; }
        .specialbana-bd-img ul li:nth-of-type(1) {
          width: 100%; }
          .specialbana-bd-img ul li:nth-of-type(1) img {
            height: 205px; }
            @media screen and (max-width: 1300px) {
              .specialbana-bd-img ul li:nth-of-type(1) img {
                height: 15.7692307692vw; } }
            @media screen and (max-width: 480px) {
              .specialbana-bd-img ul li:nth-of-type(1) img {
                height: 45vw; } }
        .specialbana-bd-img ul li:nth-of-type(2), .specialbana-bd-img ul li:nth-of-type(3) {
          width: 205px; }
          @media screen and (max-width: 1300px) {
            .specialbana-bd-img ul li:nth-of-type(2), .specialbana-bd-img ul li:nth-of-type(3) {
              width: 15.7692307692vw; } }
          @media screen and (max-width: 480px) {
            .specialbana-bd-img ul li:nth-of-type(2), .specialbana-bd-img ul li:nth-of-type(3) {
              width: calc((100% - 2vw) / 2); } }
          .specialbana-bd-img ul li:nth-of-type(2) img, .specialbana-bd-img ul li:nth-of-type(3) img {
            height: 115px; }
            @media screen and (max-width: 1300px) {
              .specialbana-bd-img ul li:nth-of-type(2) img, .specialbana-bd-img ul li:nth-of-type(3) img {
                height: 8.8461538462vw; } }
            @media screen and (max-width: 480px) {
              .specialbana-bd-img ul li:nth-of-type(2) img, .specialbana-bd-img ul li:nth-of-type(3) img {
                height: 28vw; } }
  .specialbana-spbtn {
    display: none; }
    @media screen and (max-width: 480px) {
      .specialbana-spbtn {
        display: block; } }
    @media screen and (max-width: 480px) {
      .specialbana-spbtn .specialbana-bd-tx-btn {
        display: block;
        margin-top: 8vw; } }

/* bana
---------------------------------------------------------------------------*/
.bana {
  margin-bottom: 120px; }
  @media screen and (max-width: 1300px) {
    .bana {
      margin-bottom: 9.2307692308vw; } }
  @media screen and (max-width: 480px) {
    .bana {
      margin-bottom: 22.4vw; } }
  @media screen and (max-width: 480px) {
    .bana {
      margin-bottom: 10.6666666667vw; } }
  @media screen and (min-width: 481px) {
    .bana .swiper-wrapper {
      transition-timing-function: linear; } }
  .bana .swiper-wrapper .swiper-slide {
    width: 344px;
    height: auto; }
    @media screen and (max-width: 1300px) {
      .bana .swiper-wrapper .swiper-slide {
        width: 26.4615384615vw; } }
    @media screen and (max-width: 480px) {
      .bana .swiper-wrapper .swiper-slide {
        width: 82.6666666667vw; } }
  .bana-sl {
    display: block;
    position: relative;
    height: 100%;
    width: 320px;
    margin: 0 auto; }
    @media screen and (max-width: 1300px) {
      .bana-sl {
        width: 24.6153846154vw; } }
    @media screen and (max-width: 480px) {
      .bana-sl {
        width: 76.8vw; } }