@charset "UTF-8";
/*
---------------------------------------------------------------------------------------------------------------------
メインビジュアル
---------------------------------------------------------------------------------------------------------------------
*/
.clear25-page {
  width: 90%;
  margin: auto;
  padding-top: 40px;
  position: relative; }
  @media (min-width: 1024px) {
    .clear25-page {
      width: 94%;
      padding-top: 100px; } }
  .clear25-page .contents {
    margin-top: 60px; }
    @media (min-width: 768px) {
      .clear25-page .contents {
        display: flex; } }
    @media (min-width: 768px) {
      .clear25-page .contents .contents-L {
        width: 50%;
        padding-right: 4%; } }
    .clear25-page .contents .contents-L .txt {
      margin-top: 20px; }
      @media (min-width: 768px) {
        .clear25-page .contents .contents-L .txt {
          margin-top: 0; } }
      .clear25-page .contents .contents-L .txt h2 {
        font-size: 1.5em;
        line-height: 1.4em;
        margin-bottom: 20px; }
        @media (min-width: 1024px) {
          .clear25-page .contents .contents-L .txt h2 {
            font-size: 2.0em; } }
      .clear25-page .contents .contents-L .txt p {
        font-size: 0.9em;
        line-height: 1.6em;
        text-align: justify; }
        @media (min-width: 1024px) {
          .clear25-page .contents .contents-L .txt p {
            font-size: 1.0em; } }
    .clear25-page .contents .contents-L .btn {
      margin-top: 20px;
      display: flex; }
      @media (min-width: 1250px) {
        .clear25-page .contents .contents-L .btn {
          margin-top: 60px; } }
      .clear25-page .contents .contents-L .btn .common-btn:first-child {
        margin-right: 20px; }
    @media (min-width: 768px) {
      .clear25-page .contents .contents-R {
        width: 50%; } }
    .clear25-page .contents .contents-R .photo {
      border-radius: 10px; }
      .clear25-page .contents .contents-R .photo img {
        border-radius: 10px; }

/*
---------------------------------------------------------------------------------------------------------------------
CLWAR25利用方法
---------------------------------------------------------------------------------------------------------------------
*/
#use-flow {
  max-width: 1600px;
  width: 90%;
  margin: auto;
  padding-top: 100px;
  position: relative; }
  @media (min-width: 1024px) {
    #use-flow {
      width: 94%;
      padding-top: 100px; } }
  #use-flow .use-flow-in {
    margin-top: 40px; }
    @media (min-width: 1024px) {
      #use-flow .use-flow-in {
        display: flex; } }
    @media (min-width: 1024px) {
      #use-flow .use-flow-in .step-area {
        width: calc(100% - 340px);
        padding-right: 4%; } }
    #use-flow .use-flow-in .step-area .step-box {
      margin-bottom: 40px; }
      @media (min-width: 768px) {
        #use-flow .use-flow-in .step-area .step-box {
          display: flex; } }
      #use-flow .use-flow-in .step-area .step-box .photo {
        border-radius: 10px; }
        @media (min-width: 768px) {
          #use-flow .use-flow-in .step-area .step-box .photo {
            width: 40%; } }
        #use-flow .use-flow-in .step-area .step-box .photo img {
          border-radius: 10px; }
      #use-flow .use-flow-in .step-area .step-box .step-txt {
        margin-top: 16px; }
        @media (min-width: 768px) {
          #use-flow .use-flow-in .step-area .step-box .step-txt {
            width: 60%;
            padding-left: 4%;
            margin-top: 0; } }
        #use-flow .use-flow-in .step-area .step-box .step-txt .stepNo {
          position: relative;
          width: 100px; }
          @media (min-width: 1250px) {
            #use-flow .use-flow-in .step-area .step-box .step-txt .stepNo {
              width: 120px; } }
          #use-flow .use-flow-in .step-area .step-box .step-txt .stepNo h3 {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 10px;
            display: flex;
            align-items: center;
            font-family: 'Montserrat', sans-serif;
            font-size: 1.0em;
            font-weight: 900;
            line-height: 1.4em; }
            @media (min-width: 1250px) {
              #use-flow .use-flow-in .step-area .step-box .step-txt .stepNo h3 {
                font-size: 1.25em; } }
        #use-flow .use-flow-in .step-area .step-box .step-txt h2 {
          font-size: 1.5em;
          line-height: 1.4em;
          display: inline-block; }
          @media (min-width: 1024px) {
            #use-flow .use-flow-in .step-area .step-box .step-txt h2 {
              font-size: 2.0em; } }
          #use-flow .use-flow-in .step-area .step-box .step-txt h2 span {
            background: linear-gradient(transparent 70%, #ffe51d 70%); }
        #use-flow .use-flow-in .step-area .step-box .step-txt p {
          font-size: 0.9em;
          text-align: justify;
          margin-top: 10px; }
          @media (min-width: 1024px) {
            #use-flow .use-flow-in .step-area .step-box .step-txt p {
              font-size: 1.0em;
              margin-top: 20px; } }
        #use-flow .use-flow-in .step-area .step-box .step-txt ul {
          margin-top: 20px; }
          #use-flow .use-flow-in .step-area .step-box .step-txt ul li {
            font-size: 0.9em; }
            @media (min-width: 1024px) {
              #use-flow .use-flow-in .step-area .step-box .step-txt ul li {
                font-size: 1.0em; } }
    @media (min-width: 1024px) {
      #use-flow .use-flow-in .reservation-btn {
        width: 340px; } }

.side-menu {
  position: sticky;
  top: 100px; }
  .side-menu .side-menu-in .menu-item ul li a p {
    font-size: 1.25em; }
    @media (min-width: 1024px) {
      .side-menu .side-menu-in .menu-item ul li a p {
        font-size: 1.25em; } }

#price-table {
  max-width: 1600px;
  padding: 40px 0 80px; }
  @media (min-width: 1024px) {
    #price-table {
      padding: 80px 0 120px; } }
  #price-table .price-table-in {
    margin: auto;
    width: 90%; }
    @media (min-width: 1024px) {
      #price-table .price-table-in {
        width: 94%; } }
  #price-table .table-photo {
    margin-top: 40px;
    padding-left: 5%;
    overflow: scroll; }
    @media (min-width: 1024px) {
      #price-table .table-photo {
        padding: 0 3%; } }
    #price-table .table-photo .table-photo-in {
      width: 800px;
      padding-right: 5%; }
      @media (min-width: 768px) {
        #price-table .table-photo .table-photo-in {
          width: 100%; } }
      @media (min-width: 1024px) {
        #price-table .table-photo .table-photo-in {
          padding-right: 0; } }
      #price-table .table-photo .table-photo-in img {
        border-radius: 10px; }
  #price-table h4 {
    font-size: 1.125em;
    margin-top: 40px; }
    @media (min-width: 1024px) {
      #price-table h4 {
        font-size: 1.50em; } }
  #price-table ul {
    margin-top: 10px; }
    #price-table ul li {
      font-size: 0.9em;
      text-align: justify;
      padding-left: 1em;
      text-indent: -1em;
      margin-bottom: 10px; }
      @media (min-width: 1024px) {
        #price-table ul li {
          font-size: 1.0em; } }
      #price-table ul li .redtxt {
        font-weight: 700;
        color: #C80003; }

/*アコーディオン全体*/
ul.accordion-area {
  list-style: none;
  color: #000; }
  ul.accordion-area li {
    /*アコーディオンタイトル*/ }
    ul.accordion-area li:last-child {
      margin-bottom: 18px; }
    ul.accordion-area li .title {
      font-size: 1.125em;
      font-weight: 700;
      color: #000;
      position: relative;
      cursor: pointer;
      padding: 12px 0 12px 0;
      transition: all .5s ease;
      transition: .5s; }
      @media (min-width: 1024px) {
        ul.accordion-area li .title {
          font-size: 1.5em; } }
      ul.accordion-area li .title::before, ul.accordion-area li .title::after {
        position: absolute;
        content: '';
        width: 15px;
        height: 2px;
        background-color: #000; }
      ul.accordion-area li .title::before {
        top: 50%;
        right: 15px;
        transform: rotate(0deg); }
      ul.accordion-area li .title::after {
        top: 50%;
        right: 15px;
        transform: rotate(90deg); }
      ul.accordion-area li .title.close::before {
        transform: rotate(45deg); }
      ul.accordion-area li .title.close::after {
        transform: rotate(-45deg); }
    ul.accordion-area li .box-1 {
      display: none;
      /*はじめは非表示*/ }
      ul.accordion-area li .box-1 ul.menu {
        margin: 0;
        padding: 0; }
        ul.accordion-area li .box-1 ul.menu li {
          padding: 0;
          position: relative; }
          ul.accordion-area li .box-1 ul.menu li a {
            font-size: 0.9em;
            color: #000;
            position: relative;
            transition: .5s;
            padding: 5px 0 5px 16px; }
            @media (min-width: 1024px) {
              ul.accordion-area li .box-1 ul.menu li a {
                font-size: 1.0em; } }
            ul.accordion-area li .box-1 ul.menu li a:hover {
              color: #0b198c; }
              ul.accordion-area li .box-1 ul.menu li a:hover::before {
                background-color: #0b198c;
                transform: scale(2); }
            ul.accordion-area li .box-1 ul.menu li a::before {
              content: "";
              position: absolute;
              left: 0;
              top: 1px;
              bottom: 0;
              display: flex;
              margin: auto;
              width: 5px;
              height: 5px;
              background-color: #000;
              border-radius: 50%;
              transition: .5s; }
  ul.accordion-area li.txt {
    padding: 15px 0 15px 0; }
  ul.accordion-area li h3 {
    font-size: 1.125em;
    font-weight: 700; }
    @media (min-width: 1024px) {
      ul.accordion-area li h3 {
        font-size: 1.5em; } }
    ul.accordion-area li h3 a {
      position: relative;
      color: #000;
      transition: .5s; }
      ul.accordion-area li h3 a:hover {
        color: #0b198c; }