/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0; }

/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -webkit-tap-highlight-color: transparent;
  /* 3*/ }

/* Sections */
/* ============================================ */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0; }

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block; }

/* Vertical rhythm */
/* ============================================ */
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0; }

/* Headings */
/* ============================================ */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0; }

/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none; }

/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold; }

dd {
  margin-left: 0; }

/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: inherit;
  /* 2 */ }

address {
  font-style: inherit; }

/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit; }

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  text-decoration: underline dotted;
  /* 2 */ }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: inherit;
  /* 2 */ }

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Replaced content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
svg,
img,
embed,
object,
iframe {
  vertical-align: bottom; }

/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  /* 1 */
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit;
  /* 2 */ }

/**
 * Correct cursors for clickable elements.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer; }

button:disabled,
[type="button"]:disabled,
[type="reset"]:disabled,
[type="submit"]:disabled {
  cursor: default; }

/**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */
:-moz-focusring {
  outline: auto; }

select:disabled {
  opacity: inherit; }

/**
 * Remove padding
 */
option {
  padding: 0; }

/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0; }

legend {
  padding: 0; }

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline; }

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto; }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * Correct the outline style in Safari.
 */
[type="search"] {
  outline-offset: -2px;
  /* 1 */ }

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/**
 * Fix appearance for Firefox
 */
[type="number"] {
  -moz-appearance: textfield; }

/**
 * Clickable labels
 */
label[for] {
  cursor: pointer; }

/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block; }

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item; }

/*
 * Remove outline for editable content.
 */
[contenteditable]:focus {
  outline: auto; }

/* Tables */
/* ============================================ */
/**
1. Correct table border color inheritance in all Chrome and Safari.
*/
table {
  border-color: inherit;
  /* 1 */
  border-collapse: collapse; }

caption {
  text-align: left; }

td,
th {
  vertical-align: top;
  padding: 0; }

th {
  text-align: left;
  font-weight: bold; }

.mv-spacer {
  width: 100%; }

.mv {
  overflow: hidden;
  padding-bottom: 47.5%;
  position: relative;
  font-size: 0; }
  .mv .img {
    position: absolute;
    bottom: -10%;
    left: 0%;
    width: 100%;
    pointer-events: none; }
    .mv .img video {
      width: 100%;
      height: auto; }
    .mv .img .main-img {
      opacity: 0;
      position: absolute;
      top: 0;
      left: 0; }
  @media screen and (max-width: 768px) {
    .mv {
      padding-bottom: 50%; } }
  @media screen and (max-width: 500px) {
    .mv {
      padding-bottom: 0; }
      .mv .img {
        position: relative; } }

.sound-wrap {
  padding: 0rem 0rem;
  position: absolute;
  top: 1rem;
  right: 0rem;
  width: 200px;
  display: grid;
  grid-template-columns: 20px 1fr;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  cursor: pointer; }
  .sound-wrap .sound-pict {
    grid-row: 1/2;
    grid-column: 1/2;
    width: 20px;
    height: 1.5rem;
    position: relative;
    vertical-align: middle; }
    .sound-wrap .sound-pict ul {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      height: 100%; }
      .sound-wrap .sound-pict ul li {
        width: 3px;
        height: 80%;
        background-color: #000;
        transform-origin: center bottom;
        transform: scaleY(5%); }
@keyframes soundMotionWav1 {
  0% {
    transform: scaleY(5%); }
  20% {
    transform: scaleY(20%); }
  40% {
    transform: scaleY(10%); }
  50% {
    transform: scaleY(40%); }
  60% {
    transform: scaleY(15%); }
  70% {
    transform: scaleY(60%); }
  90% {
    transform: scaleY(10%); }
  100% {
    transform: scaleY(5%); } }
@keyframes soundMotionWav2 {
  0% {
    transform: scaleY(20%); }
  20% {
    transform: scaleY(40%); }
  40% {
    transform: scaleY(30%); }
  50% {
    transform: scaleY(80%); }
  60% {
    transform: scaleY(40%); }
  70% {
    transform: scaleY(90%); }
  90% {
    transform: scaleY(40%); }
  100% {
    transform: scaleY(20%); } }
@keyframes soundMotionWav3 {
  0% {
    transform: scaleY(20%); }
  20% {
    transform: scaleY(50%); }
  40% {
    transform: scaleY(10%); }
  50% {
    transform: scaleY(50%); }
  60% {
    transform: scaleY(30%); }
  70% {
    transform: scaleY(70%); }
  90% {
    transform: scaleY(60%); }
  100% {
    transform: scaleY(20%); } }
@keyframes soundMotionWav4 {
  0% {
    transform: scaleY(7%); }
  20% {
    transform: scaleY(20%); }
  40% {
    transform: scaleY(15%); }
  50% {
    transform: scaleY(30%); }
  60% {
    transform: scaleY(10%); }
  70% {
    transform: scaleY(30%); }
  90% {
    transform: scaleY(40%); }
  100% {
    transform: scaleY(7%); } }
        .sound-wrap .sound-pict ul li:nth-child(1) {
          animation: soundMotionWav1 2s ease 0s infinite; }
        .sound-wrap .sound-pict ul li:nth-child(2) {
          animation: soundMotionWav2 2s ease 0s infinite; }
        .sound-wrap .sound-pict ul li:nth-child(3) {
          animation: soundMotionWav3 2s ease 0s infinite; }
        .sound-wrap .sound-pict ul li:nth-child(4) {
          animation: soundMotionWav4 2s ease 0s infinite; }
  .sound-wrap .sound-txt {
    grid-row: 1/2;
    grid-column: 2/3;
    color: #000;
    font-size: 1rem;
    line-height: 1;
    vertical-align: middle;
    margin-left: 1rem; }
  .sound-wrap .sound-on,
  .sound-wrap .sound-off {
    grid-row: 2/3;
    grid-column: 1/3;
    margin-top: 0.5rem;
    width: 100%;
    text-align: center;
    font-size: 1.2rem; }
    .sound-wrap .sound-on .txt-off,
    .sound-wrap .sound-off .txt-off {
      opacity: 0.5; }
  .sound-wrap .sound-off {
    display: none; }
  .sound-wrap.active .sound-on {
    display: none; }
  .sound-wrap.active .sound-off {
    display: block; }
  @media screen and (max-width: 768px) {
    .sound-wrap {
      top: 15px;
      right: 0px;
      width: 160px;
      grid-template-columns: 16px 1fr; }
      .sound-wrap .sound-txt {
        font-size: 0.8rem; }
      .sound-wrap .sound-on,
      .sound-wrap .sound-off {
        margin-top: 0.2rem;
        font-size: 1rem; }
      .sound-wrap .sound-pict {
        width: 16px; } }
  @media screen and (max-width: 500px) {
    .sound-wrap {
      top: auto;
      bottom: 5%;
      right: auto;
      left: 50%;
      width: auto;
      transform: translateX(-50%);
      background-color: #fff;
      border-radius: 50px;
      padding: 1rem 2rem; }
      .sound-wrap .sound-txt {
        font-size: 1rem; } }

.sound-player {
  display: none; }

.info-wrap {
  width: 100%;
  padding: 3rem 0;
  position: relative;
  margin-top: 6rem; }
  .info-wrap .inner {
    position: relative; }
  .info-wrap::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #fff;
    opacity: 0.41;
    mix-blend-mode: screen; }
  .info-wrap .info-tree {
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 10%;
    width: 20%;
    max-width: 260px;
    transform: translateY(-50%);
    filter: drop-shadow(10px 10px 10px rgba(0, 0, 0, 0.3)); }
    .info-wrap .info-tree img {
      transition: transform 1s cubic-bezier(0, 0, 0.13, 1) 0s;
      transform: translateX(-50%); }
    .info-wrap .info-tree .img.aos-animate img {
      transform: translateX(0%); }
  .info-wrap .info-bird {
    pointer-events: none;
    position: absolute;
    bottom: 0;
    left: 10%;
    width: 30%;
    max-width: 300px;
    transform: translateY(50%);
    filter: drop-shadow(10px 10px 20px rgba(0, 0, 0, 0.5)); }
    .info-wrap .info-bird img {
      transition: transform 1s cubic-bezier(0, 0, 0.13, 1) 0s;
      transform: translateX(50%); }
    .info-wrap .info-bird .img.aos-animate img {
      transform: translateX(0%); }
  @media screen and (max-width: 1366px) {
    .info-wrap .info-tree {
      right: 0; }
    .info-wrap .info-bird {
      left: 0; } }
  @media screen and (max-width: 768px) {
    .info-wrap .info-tree {
      right: 0;
      width: 35%; }
    .info-wrap .info-bird {
      left: 0;
      width: 45%; } }

.info {
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 3rem;
  padding: 3rem 2rem;
  text-align: center; }
  .info .info-ttl {
    font-size: 2rem;
    line-height: 1;
    color: #231815;
    text-align: center;
    letter-spacing: .1em;
    border: 2px solid #231815;
    display: inline-block;
    padding: 1rem 4rem 1rem;
    font-weight: bold; }
  .info .info-backnumber {
    margin: 3rem auto;
    display: flex;
    justify-content: center; }
    .info .info-backnumber ul li {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      padding: 0.4rem;
      font-size: 1.4rem;
      margin-bottom: 1rem; }
    .info .info-backnumber ul .info-backnumber-txt,
    .info .info-backnumber ul .info-be0 {
      text-align: left; }
  .info .holiday {
    margin: 2rem auto 0;
    padding: 1rem 2rem;
    text-align: center;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.4;
    color: #a13627;
    font-feature-settings: "palt";
    border: 1px solid #a13627; }
    .info .holiday .txt {
      display: inline-block;
      text-align: left; }
  @media screen and (max-width: 480px) {
    .info {
      padding: 2rem; }
      .info .info-ttl {
        font-size: 1.6rem; } }

.flow {
  margin-top: 3rem;
  padding-bottom: 5rem; }
  .flow .flow-ttl img, .flow .line02 img {
    width: 100%;
    height: auto; }
  .flow .flow-ttl {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    text-align: center;
    margin-bottom: 4rem; }
    .flow .flow-ttl * {
      min-height: 0%; }
    .flow .flow-ttl .txt {
      display: inline-block;
      padding: 0 2rem;
      font-size: 1.42rem;
      line-height: 1.5; }
  .flow .flow-list {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    position: relative; }
    .flow .flow-list .pic-cls {
      position: absolute;
      filter: drop-shadow(4px 4px 3px rgba(0, 0, 0, 0.4));
      opacity: 0;
      transition: 1s cubic-bezier(0, 0, 0.13, 1) 0s transform, 1s cubic-bezier(0, 0, 0.13, 1) 0s opacity; }
    .flow .flow-list .pic01 {
      top: -25%;
      right: 0;
      width: 18%;
      z-index: 2;
      transform: translateY(80%); }
    .flow .flow-list .pic02 {
      top: 45%;
      right: 3%;
      width: 17%;
      z-index: 3;
      transform: translateY(60%); }
    .flow .flow-list .pic03 {
      top: 61%;
      right: 0;
      width: 17%;
      z-index: 1;
      transform: translateY(40%); }
  .flow.aos-animate .flow-list .pic01 {
    opacity: 1;
    transition-delay: 0s;
    transform: translateY(0%); }
  .flow.aos-animate .flow-list .pic02 {
    opacity: 1;
    transition-delay: 0.3s;
    transform: translateY(0%); }
  .flow.aos-animate .flow-list .pic03 {
    opacity: 1;
    transition-delay: 0.6s;
    transform: translateY(0%); }
  @media screen and (max-width: 768px) {
    .flow .flow-ttl {
      display: block;
      position: relative; }
    .flow .flow-list {
      max-width: 560px; }
      .flow .flow-list .pic01 {
        top: -4%;
        right: 0;
        width: 41%; }
      .flow .flow-list .pic02 {
        top: 28%;
        right: 3%;
        width: 41%; }
      .flow .flow-list .pic03 {
        top: 64%;
        right: 0;
        width: 41%; } }

.merit-wrap {
  padding: 10rem 0; }
  .merit-wrap .inner {
    width: 80%;
    max-width: 680px;
    margin: 0 auto;
    overflow: hidden; }
    .merit-wrap .inner .border-cls {
      width: 100%;
      height: 4px;
      position: absolute;
      left: 0; }
      .merit-wrap .inner .border-cls::before, .merit-wrap .inner .border-cls::after {
        display: block;
        content: "";
        width: 100%;
        height: 2px;
        background-color: #715249; }
      .merit-wrap .inner .border-cls.border-over {
        top: 0;
        transform: translateX(-100%);
        transition: 1s cubic-bezier(0, 0, 0.13, 1) 0s transform; }
        .merit-wrap .inner .border-cls.border-over::after {
          margin-top: 2px;
          height: 4px; }
      .merit-wrap .inner .border-cls.border-under {
        bottom: 4px;
        transform: translateX(100%);
        transition: 1s cubic-bezier(0, 0, 0.13, 1) 0s transform; }
        .merit-wrap .inner .border-cls.border-under::before {
          margin-bottom: 2px;
          height: 4px; }
    .merit-wrap .inner.aos-animate .border-cls.border-over {
      transform: translateX(0%); }
    .merit-wrap .inner.aos-animate .border-cls.border-under {
      transform: translateX(0%); }

.luxurydays-wrap {
  width: 100%;
  position: relative;
  overflow: hidden; }
  .luxurydays-wrap .inner {
    max-width: 1600px;
    text-align: center; }
  .luxurydays-wrap .luxurydays-ttl {
    margin-bottom: 6rem;
    font-size: 4rem;
    color: #231815;
    display: inline-block; }
  .luxurydays-wrap .txt {
    text-align: center; }
  .luxurydays-wrap .ranking-ttl {
    max-width: 400px;
    width: 80%;
    margin: 0 auto 5rem; }
    .luxurydays-wrap .ranking-ttl img {
      transform-origin: center bottom; }
@keyframes rankingTtlMotion {
  0% {
    transform: scale(1, 1); }
  40% {
    transform: scale(1.05, 1.05); }
  60% {
    transform: scale(0.95, 0.95); }
  100% {
    transform: scale(1, 1); } }
    .luxurydays-wrap .ranking-ttl.aos-animate img {
      animation: rankingTtlMotion 0.6s ease-out 0s forwards; }
  .luxurydays-wrap .ranking-ditail {
    padding-bottom: 6rem;
    margin-bottom: 4rem; }
    .luxurydays-wrap .ranking-ditail .ranking-list-inner {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;
      align-items: flex-start;
      max-width: 1600px;
      margin: 0 auto;
      padding-bottom: 4rem;
      border-bottom: 4.65px solid #c6af87; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-num {
        width: 25%;
        text-align: center;
        margin-top: -3%; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-num img {
          padding: 12% 10%;
          width: 70%;
          position: relative;
          transform: scale(1.5, 1.5);
          transition: transform 0.5s cubic-bezier(0.06, 0.54, 0.28, 1) 0s; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-num::before {
          content: "";
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          width: 100%;
          height: 100%;
          background-image: url("../img/top/img-ranking-no-bg.png");
          background-position: center center;
          background-size: contain;
          background-repeat: no-repeat;
          transform: translate(-50%, -50%) scale(0.5, 0.5);
          transition: transform 0.5s cubic-bezier(0.06, 0.54, 0.28, 1) 0s; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner .visual {
        width: 25.625%; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .visual img {
          opacity: 0;
          transform: scale(0.8, 0.8);
          transition: transform 1s cubic-bezier(0.06, 0.54, 0.28, 1) 0s, opacity 0.5s ease 0s; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-copy {
        width: 33.375%;
        text-align: left; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-copy img {
          opacity: 0;
          margin-bottom: 2rem;
          transform: scale(0.9, 0.9);
          transition: transform 1s cubic-bezier(0.06, 0.54, 0.28, 1) 0s, opacity 0.5s ease 0s; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner.aos-animate .ranking-num img {
        transform: scale(1, 1);
        transition-delay: 0s; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner.aos-animate .ranking-num::before {
        transform: translate(-50%, -50%) scale(1, 1);
        transition-delay: 0s; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner.aos-animate .visual img {
        opacity: 1;
        transform: scale(1, 1);
        transition-delay: 0.2s; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner.aos-animate .ranking-copy img {
        opacity: 1;
        transform: scale(1, 1);
        transition-delay: 0.4s; }
    .luxurydays-wrap .ranking-ditail.reverse .ranking-list-inner {
      flex-direction: row-reverse; }
    .luxurydays-wrap .ranking-ditail#ranking-1 .ranking-list-inner .ranking-copy {
      margin-left: 2%; }
    .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .ranking-num {
      width: 23.75%; }
      .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .ranking-num img {
        padding: 16% 3%; }
    .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .visual {
      width: 29.0625%; }
    .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .ranking-copy {
      width: 31.875%; }
    .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .ranking-num {
      width: 23.75%; }
      .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .ranking-num img {
        padding: 16% 3%; }
    .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .visual {
      margin-left: 2%;
      width: 24.5%; }
    .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .ranking-copy {
      width: 31.875%;
      margin-left: 2%; }
    .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .ranking-num {
      width: 23.75%; }
      .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .ranking-num img {
        padding: 16% 3%; }
    .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .visual {
      width: 22.25%; }
    .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .ranking-copy {
      width: 39.875%; }
    .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .ranking-num {
      width: 23.75%; }
      .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .ranking-num img {
        padding: 16% 3%; }
    .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .visual {
      width: 24.875%;
      margin-right: 4%; }
    .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .ranking-copy {
      margin-top: 2%;
      width: 34.375%; }
    .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .ranking-note {
      width: 100%;
      text-align: right; }
    .luxurydays-wrap .ranking-ditail:last-child {
      margin-bottom: 0rem; }
      .luxurydays-wrap .ranking-ditail:last-child .ranking-list-inner {
        border-bottom: none; }
  .luxurydays-wrap .ranking-more {
    margin: 0 auto;
    padding: 0 0 10rem;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center; }
    .luxurydays-wrap .ranking-more .dot {
      display: block;
      width: 14px;
      height: 14px;
      background-color: #231815;
      border-radius: 50%;
      margin-bottom: 1.5rem; }
    .luxurydays-wrap .ranking-more .more-txt {
      width: 70%;
      max-width: 240px;
      text-align: center;
      padding: 2rem 0 1rem; }
    .luxurydays-wrap .ranking-more .more-click {
      width: 90%;
      max-width: 440px;
      margin: 0 auto;
      padding: 2rem;
      filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.5)); }
      .luxurydays-wrap .ranking-more .more-click img {
        width: 100%;
        height: auto; }
      .luxurydays-wrap .ranking-more .more-click a {
        display: block;
        transition: filter 0.3s linear 0s;
        overflow: hidden;
        position: relative;
        border-radius: 50px; }
        .luxurydays-wrap .ranking-more .more-click a:hover {
          filter: brightness(1.4); }
@keyframes moreClickEffectMotion {
  0% {
    transform: translateX(-100%); }
  30% {
    transform: translateX(100%); }
  100% {
    transform: translateX(100%); } }
        .luxurydays-wrap .ranking-more .more-click a::before {
          content: "";
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          background-image: url("../img/top/img-ranking-more-effect.png");
          background-position: center center;
          background-size: cover;
          mix-blend-mode: overlay;
          animation: moreClickEffectMotion 2s ease-in-out 0s infinite; }
  @media screen and (max-width: 768px) {
    .luxurydays-wrap .luxurydays-ttl {
      margin-bottom: 3rem;
      font-size: 3rem; }
    .luxurydays-wrap .ranking-ttl {
      margin: 0 auto 2rem; }
    .luxurydays-wrap .ranking-more {
      padding: 0 0 4rem;
      margin-top: 5rem; }
    .luxurydays-wrap .ranking-ditail {
      padding-bottom: 4rem;
      margin-bottom: 6rem;
      border-bottom: 2px solid #c6af87; }
      .luxurydays-wrap .ranking-ditail:last-child {
        border-bottom: none; }
      .luxurydays-wrap .ranking-ditail .note.sp {
        width: 100%;
        text-align: left; }
      .luxurydays-wrap .ranking-ditail .ranking-note {
        padding-top: 2rem; }
      .luxurydays-wrap .ranking-ditail .ranking-list-inner {
        display: grid;
        grid-template-rows: 45% 50% 1fr;
        grid-template-columns: 45% 1fr 50%;
        border-bottom: none;
        padding-bottom: 0; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-num {
          grid-row: 1/2;
          grid-column: 1/2;
          width: 100%;
          margin-top: -20%;
          margin-left: -10%; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-copy {
          grid-row: 1/3;
          grid-column: 3/4;
          width: 100%; }
          .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-copy img {
            margin-bottom: 0; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .visual {
          grid-row: 2/3;
          grid-column: 1/2;
          width: 100%; }
        .luxurydays-wrap .ranking-ditail .ranking-list-inner .ranking-note {
          grid-column: 1/4;
          grid-row: 3/4; }
      .luxurydays-wrap .ranking-ditail.reverse .ranking-list-inner {
        grid-template-columns: 50% 1fr 45%; }
        .luxurydays-wrap .ranking-ditail.reverse .ranking-list-inner .ranking-num {
          grid-row: 1/2;
          grid-column: 3/4;
          width: 100%;
          margin-top: -20%;
          margin-left: -10%; }
        .luxurydays-wrap .ranking-ditail.reverse .ranking-list-inner .ranking-copy {
          grid-row: 1/3;
          grid-column: 1/2;
          width: 100%; }
        .luxurydays-wrap .ranking-ditail.reverse .ranking-list-inner .visual {
          grid-row: 2/3;
          grid-column: 3/4;
          width: 100%; }
      .luxurydays-wrap .ranking-ditail#ranking-1 {
        margin-top: 6rem; }
        .luxurydays-wrap .ranking-ditail#ranking-1 .ranking-list-inner .visual {
          margin-bottom: 1rem; }
      .luxurydays-wrap .ranking-ditail#ranking-1 .ranking-list-inner .ranking-num, .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .ranking-num, .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .ranking-num, .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .ranking-num, .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .ranking-num {
        width: 130%; }
      .luxurydays-wrap .ranking-ditail#ranking-1 .ranking-list-inner .ranking-copy, .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .ranking-copy, .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .ranking-copy, .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .ranking-copy, .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .ranking-copy {
        width: 100%;
        margin-left: 0%; }
      .luxurydays-wrap .ranking-ditail#ranking-1 .ranking-list-inner .visual, .luxurydays-wrap .ranking-ditail#ranking-2 .ranking-list-inner .visual, .luxurydays-wrap .ranking-ditail#ranking-3 .ranking-list-inner .visual, .luxurydays-wrap .ranking-ditail#ranking-4 .ranking-list-inner .visual, .luxurydays-wrap .ranking-ditail#ranking-5 .ranking-list-inner .visual {
        width: 100%;
        margin-left: 0%; } }

.humanlux-wrap {
  position: relative; }
  .humanlux-wrap .inner {
    width: 100%;
    max-width: none; }
  .humanlux-wrap .logo {
    width: 60%;
    max-width: 600px;
    margin: 0 auto; }
  .humanlux-wrap .visual-1 {
    width: 100%;
    padding-top: 10rem; }
    .humanlux-wrap .visual-1 .img {
      mask-image: url("../img/top/img-humanlux-visual-1-mask.png");
      mask-size: cover;
      mask-position: center center; }
  .humanlux-wrap .overview {
    position: relative;
    padding: 15rem 2rem;
    text-align: center; }
    .humanlux-wrap .overview .txt {
      position: relative;
      font-size: 1.5rem;
      line-height: 2.5; }
    .humanlux-wrap .overview::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url("../img/top/img-humanlux-bg.jpg");
      background-size: cover;
      background-position: center center;
      mix-blend-mode: multiply; }
  .humanlux-wrap .visual-2 {
    width: 100%; }
  @media screen and (max-width: 768px) {
    .humanlux-wrap .visual-1 {
      padding-top: 5rem; }
    .humanlux-wrap .overview {
      padding: 9rem 2rem; } }

.page-note {
  padding: 12rem 0 0 0; }
  @media screen and (max-width: 768px) {
    .page-note {
      padding-top: 8rem; } }