@charset "UTF-8";
@import url("https://use.typekit.net/aob0oor.css");
html {
  overflow-y: scroll; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

img {
  vertical-align: bottom; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal; }

li {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  font-variant: normal; }

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit; }

/*to enable resizing for IE*/
input, textarea, select {
  *font-size: 100%; }

/*because legend doesn't inherit in IE */
legend {
  color: #000; }

del, ins {
  text-decoration: none; }

/******************************************************

base

******************************************************/
.information {
  /**background: url("../images/top/info-bg.jpg") center center;
  background-size: cover;**/
  background: linear-gradient(to right, #dfdcd2, #fafafa); }
  .information .inner {
    display: flex;
    align-items: flex-start;
    max-width: 1100px; }
    .information .inner .info-text {
      flex: 1;
      box-sizing: border-box;
      padding: 0 6rem 0 5rem; }
      .information .inner .info-text .title {
        text-align: left;
        padding-bottom: 2rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.3);
        color: #282828;
        font-size: 2rem;
        line-height: 1.5;
        font-family: "big-caslon-fb", "游明朝", "yu-mincho-pr6n", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        font-weight: 700;
        font-style: normal; }
      .information .inner .info-text .txt-l {
        font-size: 3.2rem;
        letter-spacing: 0.2rem;
        line-height: 1.5;
        color: #282828;
        font-family: "游明朝", "yu-mincho-pr6n", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        font-weight: 300;
        -webkit-font-smoothing: antialiased;
        font-feature-settings: "palt"; }
      .information .inner .info-text .txt-s {
        font-size: 1.4rem;
        line-height: 1.5;
        color: #282828;
        margin-top: 1rem; }
      .information .inner .info-text .info-con {
        border-bottom: 1px dotted rgba(0, 0, 0, 0.3);
        font-family: "游明朝", "yu-mincho-pr6n", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
        font-weight: 300;
        -webkit-font-smoothing: antialiased;
        font-feature-settings: "palt";
        color: #282828;
        padding: 1.3rem 0 1.8rem; }
        .information .inner .info-text .info-con .event-txt {
          font-size: 1.7rem;
          line-height: 1.5;
          font-weight: lighter; }
          .information .inner .info-text .info-con .event-txt b {
            font-weight: lighter;
            font-size: 2.6rem; }
          .information .inner .info-text .info-con .event-txt.new {
            position: relative; }
            .information .inner .info-text .info-con .event-txt.new:before {
              content: "NEW";
              position: absolute;
              left: 0;
              top: 1.5rem;
              transform: translateX(-130%);
              color: #fff;
              background: #b39b3a;
              font-size: 1.1rem;
              padding: 0.3rem 0.5rem;
              line-height: 1.2;
              border-radius: 0.3rem;
              display: inline-block;
              vertical-align: middle;
              margin-top: -0.5rem; }
              @media screen and (max-width: 768px) {
                .information .inner .info-text .info-con .event-txt.new:before {
                  position: relative;
                  left: inherit;
                  top: inherit;
                  transform: translateX(0%);
                  margin-right: 1rem; } }
        .information .inner .info-text .info-con .text01 {
          margin-top: 0.1rem;
          font-size: 1.3rem;
          line-height: 1.5; }
        .information .inner .info-text .info-con .info-btn {
          display: block;
          max-width: 14rem;
          background: #666356;
          width: 100%;
          height: 2rem;
          position: relative;
          margin-top: 0.5rem;
          padding: 0 1rem;
          transition: opacity 0.5s; }
          .information .inner .info-text .info-con .info-btn .txt {
            position: absolute;
            top: 50%;
            left: 50%;
            font-size: 1.2rem;
            line-height: 1;
            transform: translateX(-50%) translateY(-50%);
            color: #fff;
            white-space: nowrap; }
          .information .inner .info-text .info-con .info-btn:hover {
            opacity: 0.5; }
          @media screen and (max-width: 768px) {
            .information .inner .info-text .info-con .info-btn {
              margin: auto;
              margin-top: 1rem; } }
    .information .inner .conver-btn {
      width: 36rem; }
      .information .inner .conver-btn .event {
        margin-top: 2rem; }
      .information .inner .conver-btn .bana-img {
        margin-top: 2rem; }
        .information .inner .conver-btn .bana-img img {
          width: 100%;
          height: auto;
          transition: filter 0.5s; }
        .information .inner .conver-btn .bana-img a {
          display: block;
          position: relative; }
          .information .inner .conver-btn .bana-img a .new {
            color: #fff;
            background: #8a070f;
            font-size: 1rem;
            width: 3.5rem;
            height: 3.5rem;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
            font-family: "游明朝", "yu-mincho-pr6n", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
            font-weight: 300;
            -webkit-font-smoothing: antialiased;
            font-feature-settings: "palt";
            font-weight: bold;
            text-align: center;
            line-height: 3.5rem;
            border-radius: 50%;
            transform: translateX(-20%) translateY(-20%); }
          .information .inner .conver-btn .bana-img a:hover img {
            filter: brightness(120%); }
    @media screen and (max-width: 900px) {
      .information .inner .conver-btn {
        width: 28rem; } }
    @media screen and (max-width: 700px) {
      .information .inner {
        display: block; }
        .information .inner .info-text {
          flex: auto;
          padding: 0 0rem 0 0rem;
          text-align: center; }
          .information .inner .info-text .title {
            text-align: center; }
        .information .inner .conver-btn {
          width: 100%;
          max-width: 40rem;
          margin: auto;
          margin-top: 4rem; } }

.concept {
  padding-bottom: 5rem; }
  .concept::after {
    background-color: transparent; }
  .concept .inner.page-head::after {
    display: none; }
  .concept .page-name2 .img {
    width: 100%;
    max-width: 420px;
    margin: 0 auto 10rem; }
  .concept .page-name {
    opacity: 1;
    transform: translateY(50%);
    transition: transform 0s ease-out 0.5s, opacity 0s ease-out 0.5s; }
    .concept .page-name .img {
      width: 100%;
      max-width: 692px;
      margin: 0 auto 4rem; }
  .concept .copy {
    margin-bottom: 6rem;
    opacity: 0;
    transform: translateY(20%);
    transition: transform 0s ease-out 0.5s, opacity 0s ease-out 0.5s; }
  .concept .midashi {
    margin-bottom: 2rem; }
  .concept .concept-point {
    width: 90%;
    margin: 0 auto;
    position: relative; }
    .concept .concept-point::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      width: 20%;
      height: 50%;
      background-color: #767367;
      opacity: 0;
      transform: translate(-50%, -50%);
      transition: width 0s cubic-bezier(0.32, 0.82, 0.58, 1) 0.5s, opacity 0s ease-out 0.5s; }
    .concept .concept-point ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      .concept .concept-point ul li {
        width: 43%;
        opacity: 0;
        transform: scale(0.7, 0.7);
        transition: transform 0s cubic-bezier(0.32, 0.82, 0.58, 1) 0.5s, opacity 0s ease-out 0.5s; }
        .concept .concept-point ul li:nth-child(1), .concept .concept-point ul li:nth-child(2) {
          margin-bottom: 7%; }
        .concept .concept-point ul li a {
          display: block; }
          .concept .concept-point ul li a img {
            transition: filter 0.5s; }
          .concept .concept-point ul li a:hover img {
            filter: brightness(1.7); }
  @media screen and (max-width: 900px) {
    .concept .concept-point {
      width: 100%; } }
  @media screen and (max-width: 768px) {
    .concept .concept-point::before {
      width: 50%;
      height: 100%;
      padding: 2rem; }
    .concept .concept-point ul {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      .concept .concept-point ul li {
        width: 100%; }
        .concept .concept-point ul li:nth-child(1), .concept .concept-point ul li:nth-child(2), .concept .concept-point ul li:nth-child(3) {
          margin-bottom: 2rem; } }
  .concept.aos-animate .page-name2,
  .concept.aos-animate .page-name,
  .concept.aos-animate .copy {
    opacity: 1;
    transform: translateY(0%);
    transition-duration: 1s;
    transition-delay: 0s; }
  .concept.aos-animate .concept-point::before {
    opacity: 0.25;
    width: 50%;
    transition-delay: 0s;
    transition-duration: 1.0s; }
  .concept.aos-animate .concept-point li {
    opacity: 1;
    transform: scale(1, 1);
    transition-duration: 0.5s; }
    .concept.aos-animate .concept-point li:nth-child(1) {
      transition-delay: 0.5s; }
    .concept.aos-animate .concept-point li:nth-child(2) {
      transition-delay: 0.7s; }
    .concept.aos-animate .concept-point li:nth-child(3) {
      transition-delay: 0.9s; }
    .concept.aos-animate .concept-point li:nth-child(4) {
      transition-delay: 1.1s; }
  @media screen and (max-width: 768px) {
    .concept.aos-animate .concept-point::before {
      width: 100%; } }

.cont-wrap {
  width: 100%;
  margin: 0 auto;
  background-color: #fff;
  padding-bottom: 1px; }
  .cont-wrap .cont-box {
    width: 100%;
    position: relative;
    margin-bottom: 10rem; }
    .cont-wrap .cont-box::before, .cont-wrap .cont-box::after {
      content: "";
      width: 100%;
      height: 90%;
      display: block;
      position: absolute; }
    .cont-wrap .cont-box::before {
      top: 0;
      right: 0;
      height: 95%;
      background-image: -webkit-linear-gradient(0deg, #e6e4dc 0%, #e1dfd6 25%, #c4c1b6 50%, #a8a497 75%, #a09d8f 100%);
      background-image: linear-gradient(90deg, #e6e4dc 0%, #e1dfd6 25%, #c4c1b6 50%, #a8a497 75%, #a09d8f 100%);
      transform: translateX(-100%);
      transition: 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s transform; }
    .cont-wrap .cont-box::after {
      height: 80%;
      width: calc(100% - 5rem);
      right: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, 0.25);
      transform: translateX(100%);
      transition: 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s transform; }
  .cont-wrap .cont-inner {
    width: 90%;
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-end;
    align-content: center;
    position: relative;
    z-index: 2; }
    .cont-wrap .cont-inner .cont-flower {
      position: absolute;
      top: 5%;
      right: -20%;
      width: 62.1818181818%;
      transform: translateY(-10%);
      opacity: 0;
      transition: 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s transform, 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s opacity; }
    .cont-wrap .cont-inner .visual {
      margin-top: 5%;
      position: relative;
      width: 65.8181818182%;
      display: grid;
      justify-content: space-between;
      align-content: space-between;
      grid-template-rows: 48% 50%;
      grid-template-columns: 88% 6%;
      transform: translateX(20%);
      opacity: 0;
      transition: 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s transform, 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s opacity; }
      .cont-wrap .cont-inner .visual .img {
        width: 100%;
        height: 100%;
        overflow: hidden; }
        .cont-wrap .cont-inner .visual .img img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          object-position: center center; }
      .cont-wrap .cont-inner .visual .name img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: top center; }
      .cont-wrap .cont-inner .visual .grid02 {
        grid-row: 1/3;
        grid-column: 2/3; }
    .cont-wrap .cont-inner .more {
      width: 24.5454545455%;
      margin-bottom: 5%;
      transform: translateX(-20%);
      opacity: 0;
      transition: 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s transform, 0s cubic-bezier(0.13, 0.69, 0.58, 1) 0.5s opacity; }
      .cont-wrap .cont-inner .more .more-txt {
        width: 100%;
        text-align: center;
        display: flex;
        justify-content: center;
        flex-direction: row-reverse;
        margin-bottom: 2rem; }
        .cont-wrap .cont-inner .more .more-txt .midashi,
        .cont-wrap .cont-inner .more .more-txt .lead {
          color: #fff;
          text-align: left;
          writing-mode: vertical-rl;
          font-feature-settings: "vkrn"; }
        .cont-wrap .cont-inner .more .more-txt .midashi {
          margin-left: 15%; }
      .cont-wrap .cont-inner .more .more-btn {
        position: relative; }
        .cont-wrap .cont-inner .more .more-btn::before {
          content: "";
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          background-image: -moz-linear-gradient(0deg, rgba(0, 0, 0, 0.50196) 0%, rgba(0, 0, 0, 0.85) 100%, rgba(0, 0, 0, 0.85098) 100%);
          background-image: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 0.50196) 0%, rgba(0, 0, 0, 0.85) 100%, rgba(0, 0, 0, 0.85098) 100%);
          background-image: -ms-linear-gradient(0deg, rgba(0, 0, 0, 0.50196) 0%, rgba(0, 0, 0, 0.85) 100%, rgba(0, 0, 0, 0.85098) 100%);
          opacity: 0.3;
          transition: opacity 0.3s ease 0s; }
        .cont-wrap .cont-inner .more .more-btn::after {
          content: "";
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          border-style: solid;
          border-width: 1px;
          border-color: white;
          opacity: 0.3;
          transition: opacity 0.3s ease 0s;
          pointer-events: none; }
        .cont-wrap .cont-inner .more .more-btn:hover::after {
          opacity: 1; }
        .cont-wrap .cont-inner .more .more-btn a {
          position: relative;
          display: block;
          width: 100%;
          padding: 1rem 0;
          text-decoration: none;
          overflow: hidden; }
          .cont-wrap .cont-inner .more .more-btn a::after {
            content: "";
            display: block;
            width: 2rem;
            height: 2rem;
            background-image: url("../images/top/cont-btn-arrow.png");
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center center;
            position: absolute;
            top: 50%;
            right: 1.5em;
            transform: translateY(-50%); }
          .cont-wrap .cont-inner .more .more-btn a p {
            font-family: "游明朝", "yu-mincho-pr6n", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
            font-weight: 300;
            -webkit-font-smoothing: antialiased;
            font-feature-settings: "palt";
            font-size: 1.647rem;
            color: #fff;
            text-align: center;
            margin-left: -1em; }
  .cont-wrap .cont-box.aos-animate .cont-flower {
    opacity: 1;
    transform: translateY(0%);
    transition-duration: 1.5s;
    transition-delay: 1s; }
  .cont-wrap .cont-box.aos-animate .visual {
    opacity: 1;
    transform: translateX(0%);
    transition-duration: 1.5s;
    transition-delay: 0.2s; }
  .cont-wrap .cont-box.aos-animate .more {
    opacity: 1;
    transform: translateX(0%);
    transition-duration: 1.5s;
    transition-delay: 0.2s; }
  .cont-wrap .cont-box.aos-animate::before {
    transform: translateX(0%);
    transition-duration: 1s;
    transition-delay: 0s; }
  .cont-wrap .cont-box.aos-animate::after {
    transform: translateX(0%);
    transition-duration: 1s;
    transition-delay: 0s; }
  .cont-wrap .cont-box:nth-child(even)::before {
    transform: translateX(100%);
    right: auto;
    left: 0;
    background-image: -webkit-linear-gradient(180deg, #e6e4dc 0%, #e1dfd6 25%, #c4c1b6 50%, #a8a497 75%, #a09d8f 100%);
    background-image: linear-gradient(270deg, #e6e4dc 0%, #e1dfd6 25%, #c4c1b6 50%, #a8a497 75%, #a09d8f 100%); }
  .cont-wrap .cont-box:nth-child(even)::after {
    transform: translateX(-100%);
    right: auto;
    left: 0; }
  .cont-wrap .cont-box:nth-child(even) .cont-inner .cont-flower {
    right: auto;
    left: -20%; }
  .cont-wrap .cont-box:nth-child(even) .cont-inner .visual {
    opacity: 0;
    transform: translateX(-20%);
    order: 2;
    grid-template-rows: 100% 1fr;
    grid-template-columns: 6% 88%; }
    .cont-wrap .cont-box:nth-child(even) .cont-inner .visual .grid02 {
      grid-row: 1/2;
      grid-column: 1/2; }
  .cont-wrap .cont-box:nth-child(even) .cont-inner .more {
    order: 1;
    transform: translateX(20%); }
  .cont-wrap .cont-box:nth-child(even).aos-animate .cont-flower {
    opacity: 1;
    transform: translateY(0%);
    transition-duration: 1.5s;
    transition-delay: 1s; }
  .cont-wrap .cont-box:nth-child(even).aos-animate .visual {
    opacity: 1;
    transform: translateX(0%);
    transition-duration: 1.5s;
    transition-delay: 0.2s; }
  .cont-wrap .cont-box:nth-child(even).aos-animate .more {
    opacity: 1;
    transform: translateX(0%);
    transition-duration: 1.5s;
    transition-delay: 0.2s; }
  .cont-wrap .cont-box:nth-child(even).aos-animate::before {
    transform: translateX(0%);
    transition-duration: 1s;
    transition-delay: 0s; }
  .cont-wrap .cont-box:nth-child(even).aos-animate::after {
    transform: translateX(0%);
    transition-duration: 1s;
    transition-delay: 0s; }
  .cont-wrap .spa .cont-inner .visual {
    grid-template-rows: 100% 1fr;
    grid-template-columns: 88% 6%; }
    .cont-wrap .spa .cont-inner .visual .grid02 {
      grid-row: 1/2;
      grid-column: 2/3; }
  .cont-wrap .quality .cont-inner .visual {
    grid-template-rows: 49% 49%;
    grid-template-columns: 43.5% 43.5% 1fr 8%; }
    .cont-wrap .quality .cont-inner .visual .grid01 {
      grid-row: 1/2;
      grid-column: 1/3; }
    .cont-wrap .quality .cont-inner .visual .grid02 {
      grid-row: 1/2;
      grid-column: 4/5; }
    .cont-wrap .quality .cont-inner .visual .grid03 {
      grid-row: 2/3;
      grid-column: 1/2; }
      .cont-wrap .quality .cont-inner .visual .grid03 .img {
        width: 98%; }
    .cont-wrap .quality .cont-inner .visual .grid04 {
      grid-row: 2/3;
      grid-column: 2/3; }
      .cont-wrap .quality .cont-inner .visual .grid04 .img {
        width: 98%;
        margin-left: 2%; }
  @media screen and (max-width: 1000px) {
    .cont-wrap .cont-box {
      padding: 5% 0; }
      .cont-wrap .cont-box .cont-inner .visual {
        margin-top: 0%; }
      .cont-wrap .cont-box .cont-inner .more {
        margin-bottom: 0%; } }
  @media screen and (max-width: 900px) {
    .cont-wrap .cont-box {
      padding: 10% 0; }
      .cont-wrap .cont-box .cont-inner {
        align-items: center; }
        .cont-wrap .cont-box .cont-inner .more a::after {
          width: 1.5rem;
          height: 1.5rem;
          right: 1rem; } }
  @media screen and (max-width: 768px) {
    .cont-wrap .cont-box {
      padding: 10% 0; }
      .cont-wrap .cont-box::before {
        height: 100%; }
      .cont-wrap .cont-box::after {
        width: 95%; }
      .cont-wrap .cont-box .cont-inner {
        margin-right: 5%;
        width: 85%; }
        .cont-wrap .cont-box .cont-inner .cont-flower {
          top: auto;
          width: 70%;
          bottom: 10%; }
        .cont-wrap .cont-box .cont-inner .visual {
          width: 100%;
          margin-bottom: 2rem; }
        .cont-wrap .cont-box .cont-inner .more {
          width: 100%; }
          .cont-wrap .cont-box .cont-inner .more .more-txt {
            flex-direction: column; }
            .cont-wrap .cont-box .cont-inner .more .more-txt .midashi,
            .cont-wrap .cont-box .cont-inner .more .more-txt .lead {
              writing-mode: horizontal-tb; }
            .cont-wrap .cont-box .cont-inner .more .more-txt .midashi {
              margin-left: 0%;
              margin-bottom: 2rem; }
    .cont-wrap .cont-box:nth-child(even) .cont-inner {
      margin-right: 10%; }
      .cont-wrap .cont-box:nth-child(even) .cont-inner .visual {
        order: 1; }
      .cont-wrap .cont-box:nth-child(even) .cont-inner .more {
        order: 2; } }