@charset "UTF-8";
html {
  scroll-behavior: smooth;
  font-size: 10px; }

/*---------------------------
共通スタイル
---------------------------*/
/*-- フォントサイズ --*/
.f30 {
  font-size: 3rem; }

.f38 {
  font-size: 3.8rem; }

.f40 {
  font-size: 4rem; }

.f46 {
  font-size: 4.6rem; }

.f48 {
  font-size: 4.8rem; }

.f50 {
  font-size: 5rem; }

.f52 {
  font-size: 5.2rem; }

.f56 {
  font-size: 5.6rem; }

.f60 {
  font-size: 6rem; }

.f62 {
  font-size: 6.2rem; }

.f72 {
  font-size: 7.2rem; }

.f80 {
  font-size: 8rem; }

/*-- マージン --*/
.mt30 {
  margin-top: 3rem; }

.mb30 {
  margin-bottom: 3rem; }

/*-- カラー --*/
.black {
  color: #505050; }

.gray {
  color: #999596; }

.blue {
  color: #787890; }

.l_blue {
  color: #e7eef5; }

.green {
  color: #798c87; }

.gold {
  color: #b2a58b; }

.red {
  color: #c48971; }

.lred {
  color: #f7f1ee; }

/*-- フォントスタイル --*/
.b {
  font-weight: bold; }

.i {
  font-style: italic; }

/*-- フォントファミリー --*/
.font-ja-min-r {
  font-family: "Shippori Mincho", serif;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.05em; }

.font-ja-min {
  font-family: "Shippori Mincho", serif;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em; }

.font-en {
  font-family: "Cormorant Infant", serif;
  font-weight: 500;
  font-style: normal; }

.font-en-sb {
  font-family: "Cormorant Infant", serif;
  font-weight: 600;
  font-style: normal; }

.font-en-it {
  font-family: "Cormorant Infant", serif;
  font-weight: 600;
  font-style: italic; }

/*---------------------------
Body
---------------------------*/
body {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-size: 3rem;
  color: #505050;
  line-height: 1.8em;
  background: white;
  position: relative;
  letter-spacing: 0.05em; }

/*---------------------------
Link
---------------------------*/
a {
  text-decoration: none;
  word-break: break-all; }

a:hover {
  transition-duration: .3s;
  opacity: .7; }

.link-txt {
  text-decoration: underline; }

/*---------------------------
Img
---------------------------*/
img {
  max-width: 100%;
  height: auto; }

/*---------------------------
中央揃え・配列用スタイル
---------------------------*/
.t-center {
  text-align: center; }

/*-- 画像センター用 --*/
.img_center {
  display: block;
  margin: 0 auto; }

/*-- ブロック要素 --*/
.display_b {
  display: block; }

/*-- 横並び --*/
.display_f {
  display: flex;
  justify-content: center;
  align-items: center; }

/*-- 縦並び --*/
.display_f2 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column; }

/*---------------------------
アニメーション
---------------------------*/
/*------- 下から上へフェードイン用 -------*/
/* アニメーション前 */
.u-fade-type-up {
  transform: translateY(50px);
  opacity: 0; }

/* トリガー発火でis-activeを付与 */
.u-fade-type-up.is-active {
  transition: .6s;
  transform: translateY(0);
  opacity: 1; }

/*------- 複数 / 下から上へフェードイン用 -------*/
/* アニメーション前 */
.u-fade-type-up {
  transform: translateY(50px);
  opacity: 0; }

/* トリガー発火でis-activeを付与 */
.is-active .u-fade-type-up {
  transition: .6s;
  transform: translateY(0);
  opacity: 1; }

.is-active .u-fade-type-up:nth-child(2) {
  transition-delay: .2s; }

.is-active .u-fade-type-up:nth-child(3) {
  transition-delay: .4s; }

.is-active .u-fade-type-up:nth-child(4) {
  transition-delay: .6s; }

.is-active .u-fade-type-up:nth-child(5) {
  transition-delay: .8s; }

.is-active .u-fade-type-up:nth-child(6) {
  transition-delay: 1s; }

.is-active .u-fade-type-up:nth-child(7) {
  transition-delay: 1.2s; }

.is-active .u-fade-type-up:nth-child(8) {
  transition-delay: 1.4s; }

.is-active .u-fade-type-up:nth-child(9) {
  transition-delay: 1.6s; }

.is-active .u-fade-type-up:nth-child(10) {
  transition-delay: 1.8s; }

.is-active .u-fade-type-up:nth-child(11) {
  transition-delay: 2s; }

.is-active .u-fade-type-up:nth-child(12) {
  transition-delay: 2.2s; }

/*------- 上から下へフェードイン用 -------*/
/* アニメーション前 */
.u-fade-type-down {
  transform: translateY(0);
  opacity: 0; }

/* トリガー発火でis-activeを付与 */
.u-fade-type-down.is-active {
  transition: .6s;
  transform: translateY(50px);
  opacity: 1; }

/*------- リスト用 / 右から順番にスライドイン用 -------*/
/* アニメーション前 */
.u-fade-type-left {
  transform: translateX(50px);
  opacity: 0; }

/* トリガー発火でis-activeを付与 */
.is-active .u-fade-type-left {
  transition: .6s;
  transform: translateX(0);
  opacity: 1; }

.is-active .u-fade-type-left:nth-child(2) {
  transition-delay: .2s; }

.is-active .u-fade-type-left:nth-child(3) {
  transition-delay: .4s; }

.is-active .u-fade-type-left:nth-child(4) {
  transition-delay: .6s; }

.is-active .u-fade-type-left:nth-child(5) {
  transition-delay: .8s; }

.is-active .u-fade-type-left:nth-child(6) {
  transition-delay: 1s; }

.is-active .u-fade-type-left:nth-child(7) {
  transition-delay: 1.2s; }

.is-active .u-fade-type-left:nth-child(8) {
  transition-delay: 1.4s; }

/*------- 見出し用 / 左からスライドイン用 -------*/
/* アニメーション前 */
.u-fade-type-right {
  transform: translateX(-50px);
  opacity: 0; }

/* トリガー発火でis-activeを付与 */
.is-active .u-fade-type-right {
  transition: .6s;
  transform: translateX(0);
  opacity: 1; }

/*------- テキスト用 / 左からスライドイン用 -------*/
/*全共通*/
.slide-in {
  overflow: hidden;
  display: inline-block; }

.slide-in_inner {
  display: inline-block; }

/*左右のアニメーション*/
.leftAnime {
  opacity: 0;
  /*事前に透過0にして消しておく*/ }

.slideAnimeLeftRight {
  animation: slideTextX100 0.8s forwards;
  -webkit-animation: slideTextX100 0.8s forwards;
  opacity: 0; }

@keyframes slideTextX100 {
  from {
    transform: translateX(-100%);
    /*要素を左の枠外に移動*/
    opacity: 0; }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1; } }
@-webkit-keyframes slideTextX100 {
  from {
    -webkit-transform: translateX(-100%);
    /*要素を左の枠外に移動*/
    opacity: 0; }
  to {
    -webkit-transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1; } }
.slideAnimeRightLeft {
  animation: slideTextX-100 0.8s forwards;
  -webkit-animation: slideTextX-100 0.8s forwards;
  opacity: 0; }

@keyframes slideTextX-100 {
  from {
    transform: translateX(100%);
    /*要素を右の枠外に移動*/
    opacity: 0; }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1; } }
@-webkit-keyframes slideTextX-100 {
  from {
    -webkit-transform: translateX(100%);
    /*要素を右の枠外に移動*/
    opacity: 0; }
  to {
    -webkit-transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1; } }
/*-- マーカー --*/
.marker {
  background: linear-gradient(transparent 50%, #f8e9e3 50%);
  display: inline;
  background-repeat: no-repeat;
  background-size: 0% 100%;
  transition: background-size 1.2s; }

.marker.is-active {
  background-size: 100% 100%; }

/*-- キラっと光るボタン --*/
@keyframes shiny {
  0% {
    left: -20%; }
  10% {
    left: 120%; }
  100% {
    left: 120%; } }
/*---------------------------
@mixin
---------------------------*/
/*-- Webフォント用 --*/
/*-- 左右センター用 --*/
/*-- コンテンツトップ斜めボーダー用（ネイビー） --*/
/*-- 流れ斜めボーダー用（グレー） --*/
/*-- コンテンツボトム三角用 --*/
/*-- アコーディオンボックス用 --*/
/*-- 斜めタイトル用（キャンペーン・流れ） --*/
/*-- 流れコンテンツ用 --*/
/*-- 左右に- -が入るh3用 --*/
/*-- テーブル用 --*/
/*-- 予約ボタン用 --*/
/*---------------------------
Pc
---------------------------*/
.pc-container {
  width: 100%;
  height: 100%;
  position: fixed;
  display: flex;
  justify-content: space-between; }
  .pc-container .pc-left {
    position: relative;
    width: calc(50% - 33rem);
    height: 100%;
    background: url(../img/left_bg.jpg) center center no-repeat;
    background-size: cover; }
    @supports (background: url(../img/left_bg.webp)) {
      .pc-container .pc-left .background {
        background: url(../img/left_bg.webp); } }
    .pc-container .pc-left .pc-dh-logo {
      position: absolute;
      top: 6%;
      max-width: 37.1rem;
      width: 100%;
      height: auto;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      z-index: 10; }
  .pc-container .pc-right {
    position: relative;
    width: calc(50% - 33rem);
    height: 100%;
    background: url(../img/right_bg.jpg) right center no-repeat;
    background-size: cover; }
    @supports (background: url(../img/right_bg.webp)) {
      .pc-container .pc-right .background {
        background: url(../img/right_bg.webp); } }
    .pc-container .pc-right .pc-right-wrap {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      margin: 0 auto;
      height: 100%; }
      .pc-container .pc-right .pc-right-wrap .pc-ms-logo {
        position: absolute;
        top: 6%;
        text-align: center;
        max-width: 32.7rem;
        width: 100%;
        height: auto;
        z-index: 10; }
      .pc-container .pc-right .pc-right-wrap .pc-btn {
        position: absolute;
        bottom: 8%;
        display: block;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        bottom: 8%;
        z-index: 10;
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-style: normal;
        white-space: nowrap;
        color: white;
        font-size: 4.2rem;
        text-align: center;
        line-height: 1em;
        letter-spacing: 0.05em;
        background: #bd9482;
        background: linear-gradient(311deg, #138953 0%, #138953 100%);
        border-radius: 0.3rem;
        box-shadow: 0 1.3rem 1.6rem -0.6rem rgba(99, 73, 20, 0.2);
        padding: 4.5rem; }
        .pc-container .pc-right .pc-right-wrap .pc-btn::before {
          content: "";
          position: absolute;
          bottom: 6%;
          right: 6%;
          width: 4.8rem;
          height: 4.8rem;
          background: url(../img/pc_calendar.png) 0 0 no-repeat;
          background-size: contain; }
          @supports (background: url(../img/pc_calendar.webp)) {
            .pc-container .pc-right .pc-right-wrap .pc-btn::before .background {
              background: url(../img/pc_calendar.webp); } }
        .pc-container .pc-right .pc-right-wrap .pc-btn::after {
          content: "";
          position: absolute;
          top: 50%;
          right: 4%;
          width: 2.1rem;
          height: 0.8rem;
          background: url(../img/arrow_pc.svg) 0 0 no-repeat;
          background-size: contain; }

.pc-container.bg-lazy {
  background-image: none !important; }

.no-webp .pc-container {
  background: url(../img/pc_bg.jpg) 0 0 no-repeat;
  background-size: cover; }
  @supports (background: url(../img/pc_bg.webp)) {
    .no-webp .pc-container .background {
      background: url(../img/pc_bg.webp); } }
.no-webp .pc-container.bg-lazy {
  background-image: none !important; }

/*------------------------------------------------------
Sp
------------------------------------------------------*/
.sp-container {
  box-shadow: 0 1rem 2.5rem 0 rgba(154, 147, 132, 0.5);
  width: 66rem;
  background: white; }

/*---------------------------
■共通パーツ
---------------------------*/
/*---- 無料体験ボタンのリンクテキスト ----*/
.link a {
  text-decoration: underline; }
  .link a:hover {
    color: #505050; }

/*---------------------------
■パーツ調整
---------------------------*/
/*---- 01.Header ----*/
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 2rem 0 3rem; }
  .header .logo {
    width: 23.2rem;
    height: auto; }
  .header .access {
    display: flex;
    flex-direction: column;
    align-items: center; }
    .header .access .lean01 {
      display: flex;
      align-items: center; }
      .header .access .lean01 .normal {
        font-size: 2.4rem;
        color: #999596;
        display: inline-block;
        margin-right: 1rem; }
      .header .access .lean01 .b-box {
        font-size: 3.2rem;
        color: white;
        display: inline-block;
        background: #9a9aa6;
        line-height: 1em;
        padding: 1rem 1.8rem; }
    .header .access .lean02 {
      font-size: 2.4rem;
      color: #999596; }
      .header .access .lean02 .num {
        font-family: "Cormorant Infant", serif;
        font-weight: 500;
        font-style: normal;
        font-size: 5.4rem; }

/*---- 02.メイン画像（First View） ----*/
.fv {
  position: relative;
  width: 100%;
  height: 84rem;
  background: url(../img/main_bg.jpg) 0 0 no-repeat;
  background-size: contain; }
  @supports (background: url(../img/main_bg.webp)) {
    .fv .background {
      background: url(../img/main_bg.webp); } }
  .fv .catch-copy {
    position: absolute;
    display: block;
    font-family: "Shippori Mincho", serif;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-size: 5.6rem;
    margin: 3rem 0 0 4rem; }
    .fv .catch-copy .lean01 {
      display: flex;
      margin-bottom: 2.5rem; }
      .fv .catch-copy .lean01 .dot {
        position: relative;
        font-size: 4.8rem; }
        .fv .catch-copy .lean01 .dot::before {
          content: "";
          position: absolute;
          top: -0.5rem;
          left: 0;
          right: 0;
          width: 0.6rem;
          height: 0.7rem;
          margin: auto;
          padding-top: 1rem;
          background: url(../img/dot.png) 0 0 no-repeat;
          background-size: contain; }
          @supports (background: url(../img/dot.webp)) {
            .fv .catch-copy .lean01 .dot::before .background {
              background: url(../img/dot.webp); } }
      .fv .catch-copy .lean01 .bubble {
        position: relative;
        font-size: 4rem;
        color: white;
        background: #bd9382;
        line-height: 1em;
        padding: 0.8rem 1.2rem;
        margin-left: 1rem; }
        .fv .catch-copy .lean01 .bubble::after {
          content: "";
          position: absolute;
          bottom: -2rem;
          left: 2.5rem;
          border-top: 2.5rem solid #bd9382;
          border-right: 1.6rem solid transparent;
          width: 0;
          height: 0; }
    .fv .catch-copy .lean02 .num {
      font-family: "Cormorant Infant", serif;
      font-weight: 500;
      font-style: normal;
      font-size: 10rem;
      color: #b2a58b; }
    .fv .catch-copy .lean02 .ls005 {
      letter-spacing: -0.05em; }
    .fv .catch-copy .lean02 .ls02 {
      letter-spacing: -0.2em; }
    .fv .catch-copy .lean03 {
      color: #b2a58b;
      margin: 7rem 0 0 -0.5rem;
      text-shadow: 0.2rem 0.2rem 0.2rem white , -0.2rem 0.2rem 1rem white , 0.2rem -0.2rem 1rem white , -0.2rem -0.2rem 1rem white; }
      .fv .catch-copy .lean03 .big {
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 400;
        letter-spacing: 0.05em;
        font-size: 15rem; }
      .fv .catch-copy .lean03 .small {
        font-size: 8rem; }
      .fv .catch-copy .lean03 .ls001 {
        letter-spacing: -0.01em; }
  .fv .catch-en {
    position: absolute;
    top: 44rem;
    right: 2rem;
    width: 40rem;
    height: auto; }
  .fv .btm-area {
    position: absolute;
    display: flex;
    align-items: flex-start;
    left: 3rem;
    bottom: 2rem; }
    .fv .btm-area picture {
      margin: 4.5rem 2.5rem 0 0;
      width: 13.4rem;
      height: auto; }
    .fv .btm-area .btm-txt {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin: -2rem 2rem 0 0;
      color: white;
      text-align: center; }
      .fv .btm-area .btm-txt .lean01-02 {
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        letter-spacing: 0.1em;
        margin-bottom: 0.5rem; }
      .fv .btm-area .btm-txt .lean03 {
        display: flex;
        align-items: baseline; }
        .fv .btm-area .btm-txt .lean03 .lean03-txt {
          font-family: "Shippori Mincho", serif;
          font-style: normal;
          font-weight: 500;
          letter-spacing: 0.05em;
          margin-left: 0.5rem; }
      .fv .btm-area .btm-txt .lean04 {
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        font-size: 3.2rem; }
      .fv .btm-area .btm-txt .lean05 {
        font-size: 2rem;
        margin-top: -0.5rem; }

/*---- 03.パターン背景 ----*/
.fv-btm {
  font-family: "Shippori Mincho", serif;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em;
  letter-spacing: 0.1em;
  background: url(../img/bg_pattern.jpg) 0 0 repeat;
  padding: 8rem 0 15rem; }
  @supports (background: url(../img/bg_pattern.webp)) {
    .fv-btm .background {
      background: url(../img/bg_pattern.webp); } }
  .fv-btm .fv-btm-h2 {
    text-align: center;
    font-size: 6rem;
    line-height: 1.1em;
    letter-spacing: 0.05em; }
    .fv-btm .fv-btm-h2 .font-en {
      font-family: "Cormorant Infant", serif;
      font-weight: 500;
      font-style: normal;
      font-size: 7.4rem;
      padding-right: 1rem;
      letter-spacing: 0.01em; }
  .fv-btm .flex-g-box3 {
    position: absolute;
    display: flex;
    align-items: center;
    margin: 3.5rem auto 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%); }
    .fv-btm .flex-g-box3 .g-box {
      display: inline-block;
      font-family: "Shippori Mincho", serif;
      font-style: normal;
      font-weight: 400;
      letter-spacing: 0.05em;
      font-size: 4.2rem;
      color: white;
      white-space: nowrap;
      background: #c3ba95;
      padding: 1.5rem 2rem;
      line-height: 1em; }
    .fv-btm .flex-g-box3 .x {
      display: inline-block;
      color: #b2a58b;
      font-size: 3.4rem;
      margin: 0 1rem; }
  .fv-btm .box-btm-txt {
    position: relative;
    font-size: 3.8rem;
    text-align: center;
    margin-top: 13.5rem;
    line-height: 2em; }
    .fv-btm .box-btm-txt .ls02 {
      letter-spacing: -0.2em; }
  .fv-btm .bubble-txt {
    position: relative;
    display: inline-block;
    font-size: 2.5rem;
    line-height: 1.5em;
    background: white;
    border: 0.1rem solid #c48971;
    padding: 1.5rem 3.5rem 0.7rem;
    margin-top: 2rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%); }
    .fv-btm .bubble-txt::before {
      content: "";
      position: absolute;
      width: 2.8rem;
      height: 4.3rem;
      left: 5rem;
      top: -4.2rem;
      background: url(../img/bubble_top.png) 0 0 no-repeat;
      background-size: contain;
      z-index: 3; }
      @supports (background: url(../img/bubble_top.webp)) {
        .fv-btm .bubble-txt::before .background {
          background: url(../img/bubble_top.webp); } }
  .fv-btm .last-txt {
    font-size: 6rem;
    line-height: 1.5em;
    text-align: center;
    margin-top: 3rem; }

/*---- 04.キャンペーン ----*/
.campaign {
  position: relative;
  transform: skewY(-5deg) translateY(-9rem);
  background: #f7f1ee;
  border-top: 0.9rem solid #9a9aa6; }
  .campaign .campaign-wrap {
    transform: skewY(5deg) translateY(9rem);
    background: #f7f1ee;
    border-bottom: 0.9rem solid #9a9aa6;
    padding-bottom: 6.5rem; }
    .campaign .campaign-wrap .campaign-ttl {
      text-align: center;
      letter-spacing: 0.1em; }
      .campaign .campaign-wrap .campaign-ttl .lean01 {
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        font-size: 4.6rem;
        margin-bottom: 1rem; }
      .campaign .campaign-wrap .campaign-ttl .lean02 {
        position: relative;
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-style: normal;
        font-size: 5.8rem;
        display: inline-block;
        margin-top: 0.5rem auto; }
        .campaign .campaign-wrap .campaign-ttl .lean02::before {
          content: "";
          position: absolute;
          width: 2.6rem;
          height: 2.6rem;
          top: 1.5rem;
          left: -4.5rem;
          background-size: contain;
          background: url(../img/shine.png) 0 0 no-repeat;
          background-size: contain; }
          @supports (background: url(../img/shine.webp)) {
            .campaign .campaign-wrap .campaign-ttl .lean02::before .background {
              background: url(../img/shine.webp); } }
        .campaign .campaign-wrap .campaign-ttl .lean02::after {
          content: "";
          position: absolute;
          width: 2.6rem;
          height: 2.6rem;
          top: 1.5rem;
          right: -4.5rem;
          background-size: contain;
          background: url(../img/shine.png) 0 0 no-repeat;
          background-size: contain; }
          @supports (background: url(../img/shine.webp)) {
            .campaign .campaign-wrap .campaign-ttl .lean02::after .background {
              background: url(../img/shine.webp); } }
      .campaign .campaign-wrap .campaign-ttl .lean03 {
        font-family: "Cormorant Infant", serif;
        font-weight: 500;
        font-style: normal;
        font-size: 9.7rem;
        margin-top: 2rem;
        color: #787890; }
    .campaign .campaign-wrap .campaign-ticket {
      position: relative;
      width: 90%;
      background: #9a9aa6;
      padding: 1.8rem 1.5rem;
      margin: 4.5rem auto;
      letter-spacing: 0.1em; }
      .campaign .campaign-wrap .campaign-ticket .ticket-inner {
        color: white;
        width: 100%; }
        .campaign .campaign-wrap .campaign-ticket .ticket-inner::before {
          content: "";
          position: relative;
          top: 0;
          left: 0;
          display: block;
          width: 100%;
          height: 1.2rem;
          background: url(../img/skew_blue_b.jpg) 0 0 repeat-x; }
          @supports (background: url(../img/skew_blue_b.webp)) {
            .campaign .campaign-wrap .campaign-ticket .ticket-inner::before .background {
              background: url(../img/skew_blue_b.webp); } }
        .campaign .campaign-wrap .campaign-ticket .ticket-inner::after {
          content: "";
          position: relative;
          top: 0;
          left: 0;
          display: block;
          width: 100%;
          height: 1.2rem;
          background: url(../img/skew_blue_b.jpg) 0 0 repeat-x; }
          @supports (background: url(../img/skew_blue_b.webp)) {
            .campaign .campaign-wrap .campaign-ticket .ticket-inner::after .background {
              background: url(../img/skew_blue_b.webp); } }
        .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-ttl-00 {
          position: relative;
          text-align: center;
          display: inline-block;
          left: 50%;
          transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          margin-top: 3.5rem; }
        .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-ttl {
          position: relative;
          text-align: center;
          display: inline-block;
          left: 50%;
          transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          margin-top: 3.5rem; }
          .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-ttl .off-en {
            font-family: "Cormorant Infant", serif;
            font-weight: 600;
            font-style: normal;
            font-size: 7.8rem; }
          .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-ttl .off-ja {
            font-family: "Shippori Mincho", serif;
            font-style: normal;
            font-weight: 500;
            letter-spacing: 0.05em;
            font-size: 3.8rem; }
          .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-ttl::before {
            content: "";
            position: absolute;
            top: 50%;
            left: -9rem;
            width: 8rem;
            height: 0.1rem;
            background: white;
            transform: rotate(70deg); }
          .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-ttl::after {
            content: "";
            position: absolute;
            top: 50%;
            right: -9rem;
            width: 8rem;
            height: 0.1rem;
            background: white;
            transform: rotate(-70deg); }
        .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price {
          position: relative;
          display: flex;
          align-items: end;
          justify-content: space-between;
          margin: 0.5rem 0.5rem 1.5rem; }
          .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price {
            display: flex;
            flex-direction: column;
            align-items: center;
            line-height: 0.5em; }
            .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price .lean01 {
              font-size: 2rem; }
            .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price .lean02 {
              display: inline-block;
              width: 17.6rem;
              color: #505050;
              font-size: 1.5rem;
              text-align: center;
              background: white;
              padding: 0.8rem 0 0.5rem;
              margin-bottom: 1rem;
              line-height: 1em; }
              .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price .lean02 .num {
                font-family: "Cormorant Infant", serif;
                font-weight: 500;
                font-style: normal;
                font-size: 2.8rem; }
            .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price .lean03 {
              font-size: 2.6rem;
              position: relative; }
              .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price .lean03::before {
                content: "";
                transform: rotate(-9deg);
                width: 100%;
                border-top: 0.3rem solid black;
                position: absolute;
                top: 50%;
                left: 0; }
              .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .normal-price .lean03 .num {
                font-family: "Cormorant Infant", serif;
                font-weight: 500;
                font-style: normal;
                font-size: 5.3rem; }
          .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .special-price {
            font-size: 4.2rem;
            position: relative;
            top: 1.5rem; }
            .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .special-price .num {
              font-family: "Cormorant Infant", serif;
              font-weight: 600;
              font-style: normal;
              font-size: 10.5rem;
              background: linear-gradient(170deg, #dad5b6 15%, white 50%, #ddd5a7 85%);
              background-clip: text;
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
              letter-spacing: 0; }
              .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .special-price .num::before {
                content: "";
                width: 2.1rem;
                height: 3.5rem;
                position: absolute;
                top: 1.5rem;
                left: -4rem;
                background: url(../img/arrow_campaign.svg) 0 0 no-repeat;
                background-size: contain; }
        .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-p {
          text-align: center;
          font-size: 1.8rem;
          margin-bottom: 1rem; }
    .campaign .campaign-wrap .ticket-btm-txt {
      width: 90%;
      margin: 0 auto 0.5rem;
      text-align: center; }
      .campaign .campaign-wrap .ticket-btm-txt h3 {
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        font-size: 5rem;
        margin-bottom: 3rem; }
      .campaign .campaign-wrap .ticket-btm-txt p {
        font-size: 3.2rem; }
    .campaign .campaign-wrap .reservation-btn-wrap {
      position: relative;
      width: 90%;
      margin: 5rem auto 0; }
      .campaign .campaign-wrap .reservation-btn-wrap a::before {
        content: "";
        position: absolute;
        width: 11.5rem;
        height: 11.7rem;
        top: -6rem;
        left: 1rem;
        z-index: 10;
        background: url(../img/circle_left.png) 0 0 no-repeat;
        background-size: contain; }
        @supports (background: url(../img/circle_left.webp)) {
          .campaign .campaign-wrap .reservation-btn-wrap a::before .background {
            background: url(../img/circle_left.webp); } }
        .campaign .campaign-wrap .reservation-btn-wrap a::before:hover, .campaign .campaign-wrap .reservation-btn-wrap a::before:visited {
          z-index: 1000; }
      .campaign .campaign-wrap .reservation-btn-wrap a::after {
        content: "";
        position: absolute;
        width: 4.7rem;
        height: 1rem;
        bottom: 2.5rem;
        right: 2.5rem;
        background: url(../img/arrow_bnr.svg) 0 0 no-repeat;
        background-size: contain; }
      .campaign .campaign-wrap .reservation-btn-wrap .reservation-btn {
        position: relative;
        display: block;
        width: 100%;
        background: #138953;
        border: 0.2rem solid white;
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        color: white;
        font-size: 4.2rem;
        text-align: center;
        letter-spacing: 0.1em;
        padding: 6rem 0;
        overflow: hidden; }
        .campaign .campaign-wrap .reservation-btn-wrap .reservation-btn::before {
          content: '';
          position: absolute;
          top: -10%;
          left: -20%;
          width: 40px;
          height: 100%;
          transform: scale(2) rotate(20deg);
          background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.5) 100%, rgba(255, 255, 255, 0) 0%);
          /* アニメーション */
          animation-name: shiny;
          animation-duration: 4s;
          animation-timing-function: ease-in-out;
          animation-iteration-count: infinite; }

/*---- 05.こんなお悩みありませんか？ ----*/
.worries-check {
  position: relative;
  padding: 9rem 9rem 12rem 5rem;
  background: url(../img/worries_bg.jpg) 0 0 no-repeat;
  background-size: cover;
  background-position: 40% 0, 0 0; }
  @supports (background: url(../img/worries_bg.webp)) {
    .worries-check .background {
      background: url(../img/worries_bg.webp); } }
  .worries-check::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 7.8rem;
    left: 0;
    bottom: -1rem;
    background: url(../img/b-polygon.png) 0 0 no-repeat;
    background-size: contain; }
    @supports (background: url(../img/b-polygon.webp)) {
      .worries-check::after .background {
        background: url(../img/b-polygon.webp); } }
  .worries-check .check-wrap h2 {
    font-family: "Shippori Mincho", serif;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-bottom: 2rem; }
    .worries-check .check-wrap h2::after {
      content: "";
      position: absolute;
      width: 13.9rem;
      height: 8.8rem;
      top: 10.5rem;
      right: 9.5rem;
      background: url(../img/check.svg) 0 0 no-repeat;
      background-size: contain; }
  .worries-check .check-wrap .check-list {
    font-size: 2.6rem; }
    .worries-check .check-wrap .check-list li {
      position: relative;
      border-bottom: 0.1rem dotted #999596;
      line-height: 1.3em;
      padding: 2.5rem 0 2rem 4rem; }
      .worries-check .check-wrap .check-list li:first-child {
        width: 78%; }
      .worries-check .check-wrap .check-list li::before {
        content: "";
        position: absolute;
        width: 2.2rem;
        height: 2.5rem;
        top: 2.5rem;
        left: 0;
        background: url(../img/check_s.png) 0 0 no-repeat;
        background-size: contain; }
        @supports (background: url(../img/check_s.webp)) {
          .worries-check .check-wrap .check-list li::before .background {
            background: url(../img/check_s.webp); } }

/*---- 06.そのお悩み解決します！ ----*/
.solution {
  position: relative;
  font-family: "Shippori Mincho", serif;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: white;
  letter-spacing: 0.1em;
  background: #c3ba95;
  padding: 4rem 0 7rem; }
  .solution .solution-wrap {
    width: 90%;
    margin: 0 auto; }
    .solution .solution-wrap .solution-h2 {
      text-align: center;
      font-size: 6rem;
      line-height: 1.3em; }
      .solution .solution-wrap .solution-h2 .font-en {
        font-family: "Cormorant Infant", serif;
        font-weight: 500;
        font-style: normal;
        font-size: 7.4rem;
        padding-right: 1rem; }
    .solution .solution-wrap .white-wrap {
      position: relative;
      background: white;
      padding: 3rem;
      margin: 3rem auto 5rem; }
      .solution .solution-wrap .white-wrap .flex-r-box3 {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%); }
        .solution .solution-wrap .white-wrap .flex-r-box3 .r-box {
          display: inline-block;
          font-family: "Shippori Mincho", serif;
          font-style: normal;
          font-weight: 400;
          letter-spacing: 0.05em;
          font-size: 4.2rem;
          color: white;
          white-space: nowrap;
          background: #bd9382;
          padding: 1.5rem 2rem;
          line-height: 1em; }
        .solution .solution-wrap .white-wrap .flex-r-box3 .x {
          display: inline-block;
          color: #b2a58b;
          font-size: 3.4rem;
          margin: 0 1rem; }
    .solution .solution-wrap .box-btm-txt {
      font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
      font-size: 3.2rem; }

/*---- 07.イラスト3 ----*/
.illust03 {
  position: relative;
  padding-bottom: 3rem;
  background: #e7eef5; }
  .illust03::before {
    content: "";
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 1.2rem;
    background: url(../img/skew_blue_b32.png) 0 0 repeat-x;
    background: url(../img/skew_blue_b.jpg) 0 0 repeat-x; }
    @supports (background: url(../img/skew_blue_b32.webp)) {
      .illust03::before .background {
        background: url(../img/skew_blue_b32.webp); } }
    @supports (background: url(../img/skew_blue_b.webp)) {
      .illust03::before .background {
        background: url(../img/skew_blue_b.webp); } }
  .illust03::after {
    content: "";
    position: absolute;
    height: 12rem;
    width: 100%;
    clip-path: polygon(50% 50%, 0 0, 100% 0);
    left: 0;
    bottom: -11.9rem;
    background: #e7eef5; }
  .illust03 .illust03-wrap {
    width: 90%;
    margin: 8rem auto 0; }
    .illust03 .illust03-wrap .illust03-ttl {
      position: relative;
      margin-bottom: 6rem; }
      .illust03 .illust03-wrap .illust03-ttl::after {
        content: "";
        position: absolute;
        display: block;
        width: 2.8rem;
        height: 1.6rem;
        left: 50%;
        bottom: -3rem;
        background: url(../img/arrow_down.svg) 0 0 no-repeat;
        background-size: contain; }
      .illust03 .illust03-wrap .illust03-ttl .illust03-h2 {
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        font-size: 4.2rem;
        text-align: center;
        display: block;
        line-height: 1.4em; }
        .illust03 .illust03-wrap .illust03-ttl .illust03-h2 .lean01 {
          display: flex;
          justify-content: center;
          align-items: flex-start; }
          .illust03 .illust03-wrap .illust03-ttl .illust03-h2 .lean01 img {
            width: 27.9rem;
            height: auto;
            margin-bottom: 3rem; }
          .illust03 .illust03-wrap .illust03-ttl .illust03-h2 .lean01 .lean01-txt {
            font-size: 3.6rem;
            margin-left: 0.5rem; }
      .illust03 .illust03-wrap .illust03-ttl .illust03-caution {
        position: relative;
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        font-size: 3.4rem;
        margin: 3.5rem 0 1rem 2rem;
        padding-left: 11rem;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%); }
        .illust03 .illust03-wrap .illust03-ttl .illust03-caution::before {
          content: "";
          position: absolute;
          width: 8.7rem;
          height: 7.6rem;
          top: 2rem;
          left: 0;
          background: url(../img/caution.png) 0 0 no-repeat; }
          @supports (background: url(../img/caution.webp)) {
            .illust03 .illust03-wrap .illust03-ttl .illust03-caution::before {
              background-size: contain; }
              .illust03 .illust03-wrap .illust03-ttl .illust03-caution::before .background {
                background: url(../img/caution.webp); } }
    .illust03 .illust03-wrap .illust-box {
      position: relative;
      background: white;
      padding-right: 2rem;
      margin-top: 3rem;
      display: flex; }
      .illust03 .illust03-wrap .illust-box:first-child {
        margin-top: 6rem; }
      .illust03 .illust03-wrap .illust-box .illust-wrap {
        position: relative;
        width: 37%; }
        .illust03 .illust03-wrap .illust-box .illust-wrap .illust {
          position: absolute;
          bottom: 0;
          max-width: 100%;
          height: auto;
          margin-left: 1rem; }
      .illust03 .illust03-wrap .illust-box .box {
        position: relative;
        width: 63%; }
        .illust03 .illust03-wrap .illust-box .box .box-p {
          font-size: 2.4rem;
          line-height: 1.5em;
          padding: 4rem 0 1rem 0; }
        .illust03 .illust03-wrap .illust-box .box .box-p-big01 {
          padding-bottom: 4rem;
          font-size: 4.2rem; }
        .illust03 .illust03-wrap .illust-box .box .box-p-big02 {
          padding-bottom: 4rem;
          font-size: 3.5rem; }

/*---- 08.重大な2つの問題点 ----*/
.problem .problem-h2 {
  width: 90%;
  font-family: "Shippori Mincho", serif;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em;
  font-size: 5.7rem;
  text-align: center;
  line-height: 2em;
  margin: 13rem auto 3rem;
  line-height: 1.3em; }
.problem .problem01, .problem .problem02 {
  color: white; }
  .problem .problem01 .problem-wrap, .problem .problem02 .problem-wrap {
    width: 90%;
    margin: 0 auto; }
    .problem .problem01 .problem-wrap .problem-h3, .problem .problem02 .problem-wrap .problem-h3 {
      font-family: "Shippori Mincho", serif;
      font-style: normal;
      font-weight: 500;
      letter-spacing: 0.05em;
      font-size: 5.6rem;
      text-align: center;
      line-height: 1.3em;
      letter-spacing: 0.1em; }
      .problem .problem01 .problem-wrap .problem-h3 .r-box-en, .problem .problem02 .problem-wrap .problem-h3 .r-box-en {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-style: normal;
        font-size: 3.5rem;
        display: inline-block;
        background: #bd9382;
        border: 0.1rem solid white;
        padding: 1.5rem 2rem 1rem;
        margin-bottom: 3.5rem;
        line-height: 1em;
        letter-spacing: 0.05em; }
.problem .problem01 {
  background: #bd9382;
  padding: 6rem 0 6.5rem; }
  .problem .problem01 .accordion-box {
    background: white;
    padding: 2.4rem 2.4rem 1.5rem;
    line-height: 1.3em;
    margin-bottom: 3rem; }
    .problem .problem01 .accordion-box .accordion-h4 {
      position: relative;
      font-size: 3.5rem;
      line-height: 1em;
      padding-right: 5rem;
      line-height: 1.3em;
      color: #798c87; }
      .problem .problem01 .accordion-box .accordion-h4.open::after {
        content: "-"; }
      .problem .problem01 .accordion-box .accordion-h4::after {
        content: "+";
        position: absolute;
        color: white;
        font-size: 3.2rem;
        line-height: 1em;
        width: 3.8rem;
        height: 3.8rem;
        top: 0;
        right: 0;
        padding: 0.1rem 0 0 0.2rem;
        text-align: center;
        background: #bd9382; }
    .problem .problem01 .accordion-box .accordion-open {
      background: #f4f2ed;
      padding: 2.5rem 2rem;
      margin: 1rem 0;
      display: none; }
      .problem .problem01 .accordion-box .accordion-open p {
        color: #505050;
        font-size: 2.4rem; }
      .problem .problem01 .accordion-box .accordion-open h5 {
        position: relative;
        color: #c48971;
        font-weight: bold;
        margin-bottom: 2rem;
        padding-left: 1.8rem; }
        .problem .problem01 .accordion-box .accordion-open h5::before {
          content: "";
          position: absolute;
          width: 0.5rem;
          height: 1.4rem;
          background: #c48971;
          top: 1.4rem;
          left: 0; }
.problem .problem02 {
  position: relative;
  padding-bottom: 3rem;
  background: #9a9aa6; }
  .problem .problem02::before {
    content: "";
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 1.2rem;
    background: url(../img/skew_blue_b32.png) 0 0 repeat-x; }
    @supports (background: url(../img/skew_blue_b32.webp)) {
      .problem .problem02::before .background {
        background: url(../img/skew_blue_b32.webp); } }
  .problem .problem02::after {
    content: "";
    position: absolute;
    height: 12rem;
    width: 100%;
    clip-path: polygon(50% 50%, 0 0, 100% 0);
    left: 0;
    bottom: -11.9rem;
    background: #9a9aa6; }
  .problem .problem02 .problem-wrap {
    margin: 6rem auto 0; }
    .problem .problem02 .problem-wrap .list-box {
      position: relative;
      background: white;
      font-size: 2.8rem;
      color: #505050;
      line-height: 1.3em;
      padding: 2rem 2.5rem 1rem 6.5rem;
      margin-bottom: 3rem; }
      .problem .problem02 .problem-wrap .list-box::before {
        content: "";
        position: absolute;
        width: 3.1rem;
        height: 3.5rem;
        top: 1.7rem;
        left: 2.5rem;
        background: url(../img/check_m.png) 0 0 no-repeat;
        background-size: contain; }
        @supports (background: url(../img/check_m.webp)) {
          .problem .problem02 .problem-wrap .list-box::before .background {
            background: url(../img/check_m.webp); } }
    .problem .problem02 .problem-wrap .accordion-open {
      background: #f4f2ed;
      padding: 2.5rem 2rem;
      margin-top: 2rem;
      display: none; }
      .problem .problem02 .problem-wrap .accordion-open p {
        color: #505050;
        font-size: 2.4rem; }

/*---- 09.当店で解決！ ----*/
.mico-stella {
  position: relative;
  font-family: "Shippori Mincho", serif;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em; }
  .mico-stella .opening-wrap {
    width: 90%;
    margin: 0 auto; }
    .mico-stella .opening-wrap .logo-mark {
      margin: 12rem auto 3rem;
      width: 20rem;
      height: auto; }
    .mico-stella .opening-wrap .mico-stella-h2 {
      text-align: center;
      font-size: 7.6rem;
      line-height: 1.2em;
      margin-bottom: 4rem; }
    .mico-stella .opening-wrap .machine_people {
      position: absolute;
      width: 58.9rem;
      height: auto;
      top: 44rem;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      z-index: 10; }
  .mico-stella .red-skew {
    position: relative;
    transform: skewY(-5deg) translateY(-9rem);
    background: #c48971;
    margin-top: 66rem; }
    .mico-stella .red-skew .red-skew-wrap {
      transform: skewY(5deg) translateY(9rem);
      background: #c48971;
      padding-bottom: 5.5rem; }
      .mico-stella .red-skew .red-skew-wrap .rs-sub-ttl, .mico-stella .red-skew .red-skew-wrap .rs-h2 {
        width: 90%;
        color: white;
        margin: 0 auto;
        text-align: center; }
      .mico-stella .red-skew .red-skew-wrap .rs-sub-ttl {
        font-size: 3.5rem; }
      .mico-stella .red-skew .red-skew-wrap .rs-h2 {
        font-size: 5.4rem;
        line-height: 1.3em; }
  .mico-stella .rs-after-img {
    width: 100%;
    height: auto; }
  .mico-stella .table-wrap .table-h3 {
    font-size: 5.8rem;
    margin: 8rem auto 5rem;
    text-align: center; }
  .mico-stella .table-wrap .table {
    width: 90%;
    font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
    border: 0.1rem solid #cbc9c1;
    font-size: 2.3rem;
    text-align: center;
    line-height: 1.5em;
    margin: 0 auto 9rem; }
    .mico-stella .table-wrap .table tr {
      border-bottom: 0.1rem solid #cbc9c1; }
      .mico-stella .table-wrap .table tr th {
        background: #f4f2ee;
        vertical-align: middle;
        text-align: center;
        width: 45%;
        border-right: 0.1rem solid #cbc9c1;
        width: 48%; }
      .mico-stella .table-wrap .table tr th, .mico-stella .table-wrap .table tr td {
        padding: 1.5rem 1rem; }
        .mico-stella .table-wrap .table tr th .red, .mico-stella .table-wrap .table tr td .red {
          font-weight: bold;
          font-size: 2.8rem; }

/*---- 10.適切なケアを実現します ----*/
.care {
  position: relative;
  background: #f7f1ee;
  padding: 9rem 0 3rem; }
  .care::after {
    content: "";
    position: absolute;
    height: 12rem;
    width: 100%;
    clip-path: polygon(50% 50%, 0 0, 100% 0);
    left: 0;
    bottom: -11.9rem;
    background: #f7f1ee; }
  .care .care-wrap {
    width: 90%;
    margin: 0 auto; }
    .care .care-wrap .care-h2 {
      font-size: 4.4rem;
      font-family: "Shippori Mincho", serif;
      font-style: normal;
      font-weight: 500;
      letter-spacing: 0.05em;
      margin: 0 auto 6rem;
      text-align: center;
      line-height: 1.5em; }
      .care .care-wrap .care-h2 .red {
        display: inline-block;
        line-height: 1.3em;
        margin-top: 1rem; }
    .care .care-wrap .care-h3 {
      position: relative;
      font-size: 3.5rem;
      display: inline-block;
      line-height: 1em;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%); }
      .care .care-wrap .care-h3::before {
        content: "";
        position: absolute;
        top: 1.5rem;
        left: -4rem;
        width: 1.8rem;
        height: 0.3rem;
        background: #505050; }
      .care .care-wrap .care-h3::after {
        content: "";
        position: absolute;
        top: 1.5rem;
        right: -4rem;
        width: 1.8rem;
        height: 0.3rem;
        background: #505050; }
    .care .care-wrap .care-h3-btm {
      font-size: 2rem;
      text-align: center;
      line-height: 1em;
      margin-bottom: 4.5rem; }
    .care .care-wrap .accordion-box {
      background: white;
      padding: 2.4rem 2.4rem 1.5rem;
      line-height: 1.3em;
      margin-bottom: 3rem;
      border: 0.1rem solid #bd9382; }
      .care .care-wrap .accordion-box .accordion-h4 {
        position: relative;
        font-size: 3.5rem;
        line-height: 1em;
        padding-right: 5rem;
        line-height: 1.3em;
        color: #bd9382; }
        .care .care-wrap .accordion-box .accordion-h4.open::after {
          content: "-"; }
        .care .care-wrap .accordion-box .accordion-h4::after {
          content: "+";
          position: absolute;
          color: white;
          font-size: 3.2rem;
          line-height: 1em;
          width: 3.8rem;
          height: 3.8rem;
          top: 0;
          right: 0;
          padding: 0.1rem 0 0 0.2rem;
          text-align: center;
          background: #bd9382; }
      .care .care-wrap .accordion-box .accordion-open {
        background: #f4f2ed;
        padding: 2.5rem 2rem;
        margin: 1rem 0;
        display: none; }
        .care .care-wrap .accordion-box .accordion-open p {
          color: #505050;
          font-size: 2.4rem; }

/*---- 11.Before & After ----*/
.b-a {
  position: relative; }
  .b-a .b-a-wrap .b-a-h2 {
    font-family: "Cormorant Infant", serif;
    font-weight: 600;
    font-style: normal;
    font-size: 7rem;
    text-align: center;
    line-height: 1em;
    letter-spacing: 0.05em;
    margin: 12rem auto 4rem; }
  .b-a .b-a-wrap .b-a-group .b-a-img {
    width: 90%;
    margin: 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between; }
    .b-a .b-a-wrap .b-a-group .b-a-img .before {
      display: flex;
      align-items: center;
      flex-direction: column; }
      .b-a .b-a-wrap .b-a-group .b-a-img .before .b-h3 {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-style: italic;
        color: #bd9382;
        font-size: 4rem;
        letter-spacing: 0.05em;
        margin-bottom: 1rem; }
      .b-a .b-a-wrap .b-a-group .b-a-img .before .b-img img {
        width: 22rem;
        height: auto; }
    .b-a .b-a-wrap .b-a-group .b-a-img .arrow img {
      max-width: 100%;
      height: auto; }
    .b-a .b-a-wrap .b-a-group .b-a-img .after .a-img img {
      width: 30.3rem;
      height: auto; }
  .b-a .b-a-wrap .b-a-group .b-a-table {
    width: 90%;
    margin: 0 auto;
    border: 0.1rem solid #cbc9c1;
    font-size: 2.3rem;
    text-align: center;
    line-height: 1em;
    margin: 3rem auto 4.5rem; }
    .b-a .b-a-wrap .b-a-group .b-a-table tr {
      border-bottom: 0.1rem solid #cbc9c1; }
      .b-a .b-a-wrap .b-a-group .b-a-table tr th {
        background: #f4f2ee;
        vertical-align: middle;
        text-align: center;
        width: 16%;
        border-right: 0.1rem solid #cbc9c1; }
      .b-a .b-a-wrap .b-a-group .b-a-table tr td {
        width: 34%;
        border-right: 0.1rem solid #cbc9c1; }
        .b-a .b-a-wrap .b-a-group .b-a-table tr td:last-child {
          border-right: none; }
      .b-a .b-a-wrap .b-a-group .b-a-table tr th, .b-a .b-a-wrap .b-a-group .b-a-table tr td {
        padding: 2rem 0; }
  .b-a .b-a-wrap .b-a-group .b-a-p {
    position: relative;
    color: white;
    font-size: 2.6rem;
    background: #93928e;
    line-height: 1.5em;
    padding: 3.5rem 3.5rem 2.5rem;
    margin-bottom: 7rem; }
    .b-a .b-a-wrap .b-a-group .b-a-p::before {
      content: "";
      position: absolute;
      background: #93928e;
      clip-path: polygon(0 100%, 50% 0, 100% 100%);
      width: 3rem;
      height: 2rem;
      top: -1.9rem;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%); }

/*---- 12.ご予約の流れ ----*/
.flow {
  position: relative;
  margin-top: 23rem; }
  .flow .blue-skew {
    position: relative;
    transform: skewY(-5deg) translateY(-9rem);
    background: #9a9aa6; }
    .flow .blue-skew .skew-txt {
      width: 100%;
      position: absolute;
      top: -6rem;
      color: #bd9382;
      font-size: 3rem;
      font-weight: bold;
      font-style: italic;
      text-align: center;
      letter-spacing: 0.1em;
      margin: 0 auto; }
    .flow .blue-skew .blue-skew-wrap {
      transform: skewY(5deg) translateY(9rem);
      background: #9a9aa6;
      padding-bottom: 8.5rem;
      color: white; }
  .flow .flow-ttl {
    position: relative;
    text-align: center;
    letter-spacing: 0.1em; }
    .flow .flow-ttl .lean01 {
      font-family: "Shippori Mincho", serif;
      font-style: normal;
      font-weight: 500;
      letter-spacing: 0.05em;
      font-size: 4.6rem;
      margin-bottom: 1rem; }
    .flow .flow-ttl::after {
      content: "";
      position: absolute;
      width: 11.3rem;
      height: 11.4rem;
      top: -6.5rem;
      right: 7rem;
      background: url(../img/circle_right.png) 0 0 no-repeat;
      background-size: contain; }
      @supports (background: url(../img/circle_right.webp)) {
        .flow .flow-ttl::after .background {
          background: url(../img/circle_right.webp); } }
    .flow .flow-ttl .lean02 {
      position: relative;
      font-family: "Cormorant Infant", serif;
      font-weight: 600;
      font-style: normal;
      font-size: 5.8rem;
      display: inline-block;
      margin-top: 0.5rem auto; }
      .flow .flow-ttl .lean02::before {
        content: "";
        position: absolute;
        width: 2.6rem;
        height: 2.6rem;
        top: 1.5rem;
        left: -4.5rem;
        background-size: contain;
        background: url(../img/shine_gradient.png) 0 0 no-repeat;
        background-size: contain; }
        @supports (background: url(../img/shine_gradient.webp)) {
          .flow .flow-ttl .lean02::before .background {
            background: url(../img/shine_gradient.webp); } }
      .flow .flow-ttl .lean02::after {
        content: "";
        position: absolute;
        width: 2.6rem;
        height: 2.6rem;
        top: 1.5rem;
        right: -4.5rem;
        background-size: contain;
        background: url(../img/shine_gradient.png) 0 0 no-repeat;
        background-size: contain; }
        @supports (background: url(../img/shine_gradient.webp)) {
          .flow .flow-ttl .lean02::after .background {
            background: url(../img/shine_gradient.webp); } }
    .flow .flow-ttl .lean03 {
      font-family: "Cormorant Infant", serif;
      font-weight: 500;
      font-style: normal;
      font-size: 9.7rem;
      margin-top: 2rem; }
  .flow .flow-contents {
    position: relative; }
    .flow .flow-contents .flow-h3 {
      position: relative;
      top: -4rem;
      color: white;
      display: inline-block;
      font-size: 3.2rem;
      text-align: center;
      line-height: 1em;
      letter-spacing: 0.2em;
      background: #bd9382;
      border: 0.1rem solid white;
      border-bottom: none;
      padding: 2rem 4.5rem;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%); }
      .flow .flow-contents .flow-h3::after {
        content: "";
        position: absolute;
        background: #bd9382;
        clip-path: polygon(0 0, 50% 100%, 100% 0);
        width: 2.2rem;
        height: 1.8rem;
        bottom: -1.7rem;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%); }
    .flow .flow-contents .flow-odd, .flow .flow-contents .flow-odd01 {
      width: 90%;
      margin: 5rem auto 6rem; }
      .flow .flow-contents .flow-odd .flow-h4, .flow .flow-contents .flow-odd01 .flow-h4 {
        width: 100%;
        display: flex;
        align-items: flex-end;
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 400;
        letter-spacing: 0.05em;
        font-size: 4.4rem;
        padding-bottom: 1.5rem; }
        .flow .flow-contents .flow-odd .flow-h4 .h4-en, .flow .flow-contents .flow-odd01 .flow-h4 .h4-en {
          color: #c48971;
          font-family: "Cormorant Infant", serif;
          font-weight: 600;
          font-style: italic;
          font-size: 4.2rem;
          margin-right: 1.5rem; }
      .flow .flow-contents .flow-odd .flow-p::before, .flow .flow-contents .flow-odd01 .flow-p::before {
        content: "";
        position: relative;
        top: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 0.9rem;
        margin-bottom: 3.2rem;
        background: url(../img/skew_gold_b.png) 0 0 repeat-x; }
        @supports (background: url(../img/skew_gold_b.webp)) {
          .flow .flow-contents .flow-odd .flow-p::before .background, .flow .flow-contents .flow-odd01 .flow-p::before .background {
            background: url(../img/skew_gold_b.webp); } }
      .flow .flow-contents .flow-odd .flow-btn, .flow .flow-contents .flow-odd01 .flow-btn {
        position: relative;
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        font-size: 3.2rem;
        color: white;
        background: #138953;
        padding: 2rem 10rem;
        margin: 3rem auto 0;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%); }
        .flow .flow-contents .flow-odd .flow-btn::after, .flow .flow-contents .flow-odd01 .flow-btn::after {
          content: "";
          position: absolute;
          width: 4rem;
          height: 1.2rem;
          top: 3.7rem;
          right: 2rem;
          background: url(../img/arrow_btn.svg) 0 0 no-repeat;
          background-size: contain; }
    .flow .flow-contents .flow-odd01 {
      margin-top: 2rem; }
    .flow .flow-contents .flow-odd {
      margin-bottom: 2rem; }
    .flow .flow-contents .flow-even-wrap {
      background: #c7c1a7;
      padding: 3.5rem; }
      .flow .flow-contents .flow-even-wrap .flow-even {
        width: 100%;
        margin: 0 auto;
        color: white; }
        .flow .flow-contents .flow-even-wrap .flow-even .flow-h4 {
          width: 100%;
          display: flex;
          align-items: flex-end;
          font-family: "Shippori Mincho", serif;
          font-style: normal;
          font-weight: 400;
          letter-spacing: 0.05em;
          font-size: 4.4rem;
          padding-bottom: 1.5rem; }
          .flow .flow-contents .flow-even-wrap .flow-even .flow-h4 .h4-en {
            font-family: "Cormorant Infant", serif;
            font-weight: 600;
            font-style: italic;
            font-size: 4.2rem;
            margin-right: 1.5rem; }
        .flow .flow-contents .flow-even-wrap .flow-even .flow-p::before {
          content: "";
          position: relative;
          top: 0;
          left: 0;
          display: block;
          width: 100%;
          height: 0.9rem;
          margin-bottom: 3.2rem;
          background: url(../img/skew_gold_b.png) 0 0 repeat-x; }
          @supports (background: url(../img/skew_gold_b.webp)) {
            .flow .flow-contents .flow-even-wrap .flow-even .flow-p::before .background {
              background: url(../img/skew_gold_b.webp); } }

/*---- 13.Q&A ----*/
.faq {
  background: #e7eef5;
  position: relative;
  padding: 6.5rem 0 9rem; }
  .faq .faq-wrap {
    width: 90%;
    margin: 0 auto 10rem; }
    .faq .faq-wrap .faq-h2 {
      font-family: "Cormorant Infant", serif;
      font-weight: 500;
      font-style: normal;
      color: #787890;
      font-size: 7rem;
      text-align: center;
      margin-bottom: 3rem; }
    .faq .faq-wrap .faq-h3 {
      position: relative;
      font-size: 3.5rem;
      display: inline-block;
      line-height: 1em;
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      margin-bottom: 4.5rem; }
      .faq .faq-wrap .faq-h3::before {
        content: "";
        position: absolute;
        top: 1.5rem;
        left: -4rem;
        width: 1.8rem;
        height: 0.3rem;
        background: #505050; }
      .faq .faq-wrap .faq-h3::after {
        content: "";
        position: absolute;
        top: 1.5rem;
        right: -4rem;
        width: 1.8rem;
        height: 0.3rem;
        background: #505050; }
    .faq .faq-wrap .accordion-box {
      background: white;
      padding: 2.4rem 2.4rem 1.5rem;
      line-height: 1.3em;
      margin-bottom: 3rem;
      border: 0.1rem solid #9a9aa6; }
      .faq .faq-wrap .accordion-box .accordion-h4 {
        position: relative;
        font-size: 3.5rem;
        line-height: 1em;
        padding-right: 5rem;
        line-height: 1.3em;
        position: relative;
        padding-left: 5rem;
        color: #9a9aa6; }
        .faq .faq-wrap .accordion-box .accordion-h4.open::after {
          content: "-"; }
        .faq .faq-wrap .accordion-box .accordion-h4::before {
          content: "Q.";
          position: absolute;
          top: -0.2rem;
          left: 0;
          font-family: "Cormorant Infant", serif;
          font-weight: 500;
          font-style: normal;
          color: #9a9aa6;
          font-size: 3.8rem; }
        .faq .faq-wrap .accordion-box .accordion-h4::after {
          content: "+";
          position: absolute;
          color: white;
          font-size: 3.2rem;
          line-height: 1em;
          width: 3.8rem;
          height: 3.8rem;
          top: 0;
          right: 0;
          padding: 0.1rem 0 0 0.2rem;
          text-align: center;
          background: #9a9aa6; }
      .faq .faq-wrap .accordion-box .accordion-open {
        background: #f4f2ed;
        padding: 2.5rem 2rem;
        margin: 1rem 0;
        display: none; }
        .faq .faq-wrap .accordion-box .accordion-open p {
          color: #505050;
          font-size: 2.4rem; }

/*---- 14.インフォメーション ----*/
.info {
  position: relative; }
  .info::before {
    content: "";
    position: absolute;
    top: -7rem;
    left: 0;
    width: 26.7rem;
    height: 7.6rem;
    background: url(../img/information.svg) 0 0 no-repeat;
    background-size: contain; }
  .info .info-ttl {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 7rem auto 4rem;
    font-family: "Shippori Mincho", serif;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.05em; }
    .info .info-ttl .sub-ttl {
      font-size: 2.8rem;
      text-align: center;
      line-height: 1; }
    .info .info-ttl .info-logo {
      width: 33rem;
      height: 9.7rem;
      margin: 2rem auto 2.5rem; }
    .info .info-ttl .shop-name {
      width: 100%;
      color: white;
      font-size: 3.2rem;
      text-align: center;
      background: #bd9382;
      line-height: 1em;
      padding: 1rem 0; }
  .info .table {
    width: 90%;
    font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
    border: 0.1rem solid #cbc9c1;
    font-size: 2.3rem;
    text-align: center;
    line-height: 1.5em;
    margin: 0 auto 5rem; }
    .info .table tr {
      border-bottom: 0.1rem solid #cbc9c1; }
      .info .table tr th {
        background: #f4f2ee;
        vertical-align: middle;
        text-align: center;
        width: 45%;
        border-right: 0.1rem solid #cbc9c1;
        width: 28%; }
      .info .table tr th, .info .table tr td {
        padding: 1.5rem 2rem; }
      .info .table tr td {
        text-align: left; }

/*---- 15.Footer ----*/
.footer {
  background: #f7f1ee;
  padding: 5.5rem 0 0;
  text-align: center;
  margin-bottom: 6rem; }
  .footer .footer-p {
    color: #787890;
    font-size: 4.2rem;
    font-style: italic;
    font-weight: bold; }
  .footer .footer-link {
    font-size: 1.8rem;
    margin: 2.5rem auto 0; }
  .footer .copyright {
    font-family: "Cormorant Infant", serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.8rem;
    margin-bottom: 3.5rem; }
  .footer::after {
    content: "";
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 1.2rem;
    background: url(../img/skew_blue_b32.png) 0 0 repeat-x;
    bottom: 0; }
    @supports (background: url(../img/skew_blue_b32.webp)) {
      .footer::after .background {
        background: url(../img/skew_blue_b32.webp); } }

/*---------------------------
メディアクエリ
---------------------------*/
@media screen and (max-width: 1279px) {
  .pc-container .pc-right .pc-right-wrap .pc-btn {
    font-size: 3.2rem;
    padding: 2.5rem 3rem;
    line-height: 1.1em; }
    .pc-container .pc-right .pc-right-wrap .pc-btn::before {
      width: 3rem;
      height: 3rem; } }
@media screen and (min-width: 1025px) {
  .sp-container {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%); }

  .fixed-btn {
    display: none; }

  .footer {
    margin-bottom: 0; } }
@media screen and (max-width: 1024px) {
  .pc-container .pc-left .pc-dh-logo {
    display: none; }
  .pc-container .pc-right .pc-right-wrap {
    display: none; }

  .sp-container {
    max-width: 1024px;
    margin: 0 auto;
    position: relative; }

  .fixed-btn {
    width: 100%;
    transition: .5s;
    opacity: 0;
    visibility: hidden;
    cursor: pointer;
    position: sticky;
    bottom: 3.5rem;
    z-index: 1000; }
    .fixed-btn .reservation-btn-wrap {
      position: relative;
      width: 90%;
      margin: 5rem auto 0; }
      .fixed-btn .reservation-btn-wrap a::before {
        content: "";
        position: absolute;
        width: 11.5rem;
        height: 11.7rem;
        top: -6rem;
        left: 1rem;
        z-index: 10;
        background: url(../img/circle_left.png) 0 0 no-repeat;
        background-size: contain; }
        @supports (background: url(../img/circle_left.webp)) {
          .fixed-btn .reservation-btn-wrap a::before .background {
            background: url(../img/circle_left.webp); } }
        .fixed-btn .reservation-btn-wrap a::before:hover, .fixed-btn .reservation-btn-wrap a::before:visited {
          z-index: 1000; }
      .fixed-btn .reservation-btn-wrap a::after {
        content: "";
        position: absolute;
        width: 4.7rem;
        height: 1rem;
        bottom: 2.5rem;
        right: 2.5rem;
        background: url(../img/arrow_bnr.svg) 0 0 no-repeat;
        background-size: contain; }
      .fixed-btn .reservation-btn-wrap .reservation-btn {
        position: relative;
        display: block;
        width: 100%;
        background: #138953;
        border: 0.2rem solid white;
        font-family: "Shippori Mincho", serif;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 0.05em;
        color: white;
        font-size: 4.2rem;
        text-align: center;
        letter-spacing: 0.1em;
        padding: 6rem 0;
        overflow: hidden; }
        .fixed-btn .reservation-btn-wrap .reservation-btn::before {
          content: '';
          position: absolute;
          top: -10%;
          left: -20%;
          width: 40px;
          height: 100%;
          transform: scale(2) rotate(20deg);
          background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.5) 100%, rgba(255, 255, 255, 0) 0%);
          /* アニメーション */
          animation-name: shiny;
          animation-duration: 4s;
          animation-timing-function: ease-in-out;
          animation-iteration-count: infinite; }
    .fixed-btn.fixed {
      opacity: 1;
      visibility: visible;
      transition-property: opacity;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
      transition-duration: 1s;
      pointer-events: auto; } }
@media screen and (max-width: 660px) {
  html {
    font-size: 66%; }

  .tel-link {
    text-decoration: underline; }

  .pc-container {
    display: none; }

  .sp-container {
    width: 100%;
    box-shadow: none;
    overflow: hidden; }

  .fv {
    background-size: cover; }
    .fv .catch-copy .lean01 .dot::before {
      top: -1.5rem; }
    .fv .btm-area picture {
      position: relative;
      width: 15rem;
      bottom: -5rem; }
    .fv .btm-area .btm-txt {
      margin: 0 2.5rem 0.8rem 0; }
      .fv .btm-area .btm-txt .lean03 {
        width: 85%; }

  .campaign .campaign-wrap .campaign-ticket .ticket-inner .ticket-price .special-price .num::before {
    width: 1.5rem;
    height: 2.5rem;
    left: -2rem; }
  .campaign .campaign-wrap .ticket-btm-txt h3 {
    font-size: 4.6rem; }
  .campaign .campaign-wrap .reservation-btn-wrap a::before {
    background-size: cover; }

  .worries-check {
    background-position: 63% 0, 0 0; }
    .worries-check::after {
      bottom: -1.5rem; }
    .worries-check .check-wrap h2::after {
      right: 6.5rem; }

  .illust03 .illust03-wrap .illust-box .illust-wrap .illust {
    max-width: 88%;
    margin: 1rem 1rem 0; }
  .illust03 .illust03-wrap .box .box-p-big01 {
    font-size: 3.8rem; }
  .illust03 .illust03-wrap .box .box-p-big02 {
    font-size: 3rem; }

  .b-a .b-a-wrap .b-a-group .b-a-img .arrow {
    margin-left: 1.5rem; }
    .b-a .b-a-wrap .b-a-group .b-a-img .arrow img {
      width: 60%; }

  .flow .blue-skew .skew-txt {
    font-weight: normal; }
  .flow .flow-contents .flow-odd .flow-h4, .flow .flow-contents .flow-odd01 .flow-h4 {
    font-size: 3.8rem; }

  .footer {
    margin-bottom: 24rem; }
    .footer .footer-p {
      font-weight: normal; }

  .fixed-btn {
    position: fixed; } }
@media screen and (max-width: 450px) {
  html {
    font-size: 45%; } }
@media screen and (max-width: 428px) {
  html {
    font-size: 42.8%; } }
@media screen and (max-width: 414px) {
  html {
    font-size: 41.4%; } }
@media screen and (max-width: 409px) {
  html {
    font-size: 40.9%; } }
@media screen and (max-width: 390px) {
  html {
    font-size: 39%; } }
@media screen and (max-width: 384px) {
  html {
    font-size: 38.4%; } }
@media screen and (max-width: 375px) {
  html {
    font-size: 37.5%; } }
@media screen and (max-width: 360px) {
  html {
    font-size: 36%; } }
@media screen and (max-width: 320px) {
  html {
    font-size: 32%; } }
@media screen and (max-width: 240px) {
  html {
    font-size: 24%; } }
