/* ----------------------
   Base
---------------------- */

@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@900&display=swap");

#ec_goldwin2604 {
  background-color: #fff;
}

.main {
  width: 100%;
  padding-bottom: 0;
}

.inner {
  max-width: 954px;
  margin: 0 auto;
  padding: 0 16px;
}

/* hover */
a.over {
  transition: 0.3s;
}
a.over:hover {
  opacity: 0.6;
}

.n-sf-wrap .n-sf, .n-sf-wrap.n-sf {
  opacity: 0;
  -webkit-transform: translateY(16px);
          transform: translateY(16px);
}
.n-sf-wrap.show .n-sf, .n-sf-wrap.show.n-sf {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: all 0.9s cubic-bezier(0.33, 1, 0.68, 1);
  transition: all 0.9s cubic-bezier(0.33, 1, 0.68, 1);
}
.n-sf-wrap .n-d1 {
  -webkit-transition-delay: 0.1s !important;
          transition-delay: 0.1s !important;
  -webkit-animation-delay: 0.1s !important;
          animation-delay: 0.1s !important;
}
.n-sf-wrap .n-d2 {
  -webkit-transition-delay: 0.2s !important;
          transition-delay: 0.2s !important;
  -webkit-animation-delay: 0.2s !important;
          animation-delay: 0.2s !important;
}
.n-sf-wrap .n-d3 {
  -webkit-transition-delay: 0.3s !important;
          transition-delay: 0.3s !important;
  -webkit-animation-delay: 0.3s !important;
          animation-delay: 0.3s !important;
}
.n-sf-wrap .n-d4 {
  -webkit-transition-delay: 0.4s !important;
          transition-delay: 0.4s !important;
  -webkit-animation-delay: 0.4s !important;
          animation-delay: 0.4s !important;
}
.n-sf-wrap .n-d5 {
  -webkit-transition-delay: 0.5s !important;
          transition-delay: 0.5s !important;
  -webkit-animation-delay: 0.5s !important;
          animation-delay: 0.5s !important;
}
.n-sf-wrap .n-d6 {
  -webkit-transition-delay: 0.6s !important;
          transition-delay: 0.6s !important;
  -webkit-animation-delay: 0.6s !important;
          animation-delay: 0.6s !important;
}
.n-sf-wrap .n-d7 {
  -webkit-transition-delay: 0.7s !important;
          transition-delay: 0.7s !important;
  -webkit-animation-delay: 0.7s !important;
          animation-delay: 0.7s !important;
}
.n-sf-wrap .n-d8 {
  -webkit-transition-delay: 0.8s !important;
          transition-delay: 0.8s !important;
  -webkit-animation-delay: 0.8s !important;
          animation-delay: 0.8s !important;
}
.n-sf-wrap .n-d9 {
  -webkit-transition-delay: 0.9s !important;
          transition-delay: 0.9s !important;
  -webkit-animation-delay: 0.9s !important;
          animation-delay: 0.9s !important;
}
.n-sf-wrap .n-d10 {
  -webkit-transition-delay: 1s !important;
          transition-delay: 1s !important;
  -webkit-animation-delay: 1s !important;
          animation-delay: 1s !important;
}
.n-sf-wrap .n-d11 {
  -webkit-transition-delay: 1.1s !important;
          transition-delay: 1.1s !important;
  -webkit-animation-delay: 1.1s !important;
          animation-delay: 1.1s !important;
}
.n-sf-wrap .n-d12 {
  -webkit-transition-delay: 1.2s !important;
          transition-delay: 1.2s !important;
  -webkit-animation-delay: 1.2s !important;
          animation-delay: 1.2s !important;
}
.n-sf-wrap .n-d13 {
  -webkit-transition-delay: 1.3s !important;
          transition-delay: 1.3s !important;
  -webkit-animation-delay: 1.3s !important;
          animation-delay: 1.3s !important;
}
.n-sf-wrap .n-d14 {
  -webkit-transition-delay: 1.4s !important;
          transition-delay: 1.4s !important;
  -webkit-animation-delay: 1.4s !important;
          animation-delay: 1.4s !important;
}
.n-sf-wrap .n-d15 {
  -webkit-transition-delay: 1.5s !important;
          transition-delay: 1.5s !important;
  -webkit-animation-delay: 1.5s !important;
          animation-delay: 1.5s !important;
}
.n-sf-wrap .n-d16 {
  -webkit-transition-delay: 1.6s !important;
          transition-delay: 1.6s !important;
  -webkit-animation-delay: 1.6s !important;
          animation-delay: 1.6s !important;
}
.n-sf-wrap .n-d17 {
  -webkit-transition-delay: 1.7s !important;
          transition-delay: 1.7s !important;
  -webkit-animation-delay: 1.7s !important;
          animation-delay: 1.7s !important;
}
.n-sf-wrap .n-d18 {
  -webkit-transition-delay: 1.8s !important;
          transition-delay: 1.8s !important;
  -webkit-animation-delay: 1.8s !important;
          animation-delay: 1.8s !important;
}
.n-sf-wrap .n-d19 {
  -webkit-transition-delay: 1.9s !important;
          transition-delay: 1.9s !important;
  -webkit-animation-delay: 1.9s !important;
          animation-delay: 1.9s !important;
}
.n-sf-wrap .n-d20 {
  -webkit-transition-delay: 2s !important;
          transition-delay: 2s !important;
  -webkit-animation-delay: 2s !important;
          animation-delay: 2s !important;
}
.n-sf-wrap2 .n-sf2, .n-sf-wrap2.n-sf2 {
  opacity: 0;
  -webkit-transform: translateY(20px);
          transform: translateY(20px);
}
.n-sf-wrap2 .n-sf3, .n-sf-wrap2.n-sf3 {
  width: 0;
}
.n-sf-wrap2.show .n-sf2, .n-sf-wrap2.show.n-sf2 {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
  transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
}
.n-sf-wrap2.show .n-sf3, .n-sf-wrap2.show.n-sf3 {
  opacity: 1;
  width: 80px;
  -webkit-transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1);
  transition: all 0.8s cubic-bezier(0.33, 1, 0.68, 1);
}
.n-sf-wrap2 .n-d1 {
  -webkit-transition-delay: 0.07s !important;
          transition-delay: 0.07s !important;
  -webkit-animation-delay: 0.07s !important;
          animation-delay: 0.07s !important;
}
.n-sf-wrap2 .n-d2 {
  -webkit-transition-delay: 0.14s !important;
          transition-delay: 0.14s !important;
  -webkit-animation-delay: 0.14s !important;
          animation-delay: 0.14s !important;
}
.n-sf-wrap2 .n-d3 {
  -webkit-transition-delay: 0.21s !important;
          transition-delay: 0.21s !important;
  -webkit-animation-delay: 0.21s !important;
          animation-delay: 0.21s !important;
}
.n-sf-wrap2 .n-d4 {
  -webkit-transition-delay: 0.28s !important;
          transition-delay: 0.28s !important;
  -webkit-animation-delay: 0.28s !important;
          animation-delay: 0.28s !important;
}
.n-sf-wrap2 .n-d5 {
  -webkit-transition-delay: 0.35s !important;
          transition-delay: 0.35s !important;
  -webkit-animation-delay: 0.35s !important;
          animation-delay: 0.35s !important;
}
.n-sf-wrap2 .n-d6 {
  -webkit-transition-delay: 0.42s !important;
          transition-delay: 0.42s !important;
  -webkit-animation-delay: 0.42s !important;
          animation-delay: 0.42s !important;
}
.n-sf-wrap2 .n-d7 {
  -webkit-transition-delay: 0.49s !important;
          transition-delay: 0.49s !important;
  -webkit-animation-delay: 0.49s !important;
          animation-delay: 0.49s !important;
}
.n-sf-wrap2 .n-d8 {
  -webkit-transition-delay: 0.56s !important;
          transition-delay: 0.56s !important;
  -webkit-animation-delay: 0.56s !important;
          animation-delay: 0.56s !important;
}
.n-sf-wrap2 .n-d9 {
  -webkit-transition-delay: 0.63s !important;
          transition-delay: 0.63s !important;
  -webkit-animation-delay: 0.63s !important;
          animation-delay: 0.63s !important;
}
.n-sf-wrap2 .n-d10 {
  -webkit-transition-delay: 0.7s !important;
          transition-delay: 0.7s !important;
  -webkit-animation-delay: 0.7s !important;
          animation-delay: 0.7s !important;
}
.n-sf-wrap2 .n-d11 {
  -webkit-transition-delay: 0.77s !important;
          transition-delay: 0.77s !important;
  -webkit-animation-delay: 0.77s !important;
          animation-delay: 0.77s !important;
}
.n-sf-wrap2 .n-d12 {
  -webkit-transition-delay: 0.84s !important;
          transition-delay: 0.84s !important;
  -webkit-animation-delay: 0.84s !important;
          animation-delay: 0.84s !important;
}
.n-sf-wrap2 .n-d13 {
  -webkit-transition-delay: 0.91s !important;
          transition-delay: 0.91s !important;
  -webkit-animation-delay: 0.91s !important;
          animation-delay: 0.91s !important;
}
.n-sf-wrap2 .n-d14 {
  -webkit-transition-delay: 0.98s !important;
          transition-delay: 0.98s !important;
  -webkit-animation-delay: 0.98s !important;
          animation-delay: 0.98s !important;
}
.n-sf-wrap2 .n-d15 {
  -webkit-transition-delay: 1.05s !important;
          transition-delay: 1.05s !important;
  -webkit-animation-delay: 1.05s !important;
          animation-delay: 1.05s !important;
}
.n-sf-wrap2 .n-d16 {
  -webkit-transition-delay: 1.12s !important;
          transition-delay: 1.12s !important;
  -webkit-animation-delay: 1.12s !important;
          animation-delay: 1.12s !important;
}
.n-sf-wrap2 .n-d17 {
  -webkit-transition-delay: 1.19s !important;
          transition-delay: 1.19s !important;
  -webkit-animation-delay: 1.19s !important;
          animation-delay: 1.19s !important;
}
.n-sf-wrap2 .n-d18 {
  -webkit-transition-delay: 1.26s !important;
          transition-delay: 1.26s !important;
  -webkit-animation-delay: 1.26s !important;
          animation-delay: 1.26s !important;
}
.n-sf-wrap2 .n-d19 {
  -webkit-transition-delay: 1.33s !important;
          transition-delay: 1.33s !important;
  -webkit-animation-delay: 1.33s !important;
          animation-delay: 1.33s !important;
}
.n-sf-wrap2 .n-d20 {
  -webkit-transition-delay: 1.4s !important;
          transition-delay: 1.4s !important;
  -webkit-animation-delay: 1.4s !important;
          animation-delay: 1.4s !important;
}

/* ----------------------
   Title
---------------------- */

.ttl-en {
  text-align: center;
  padding-bottom: 20px;
  position: relative;
}

.ttl-en__inner {
  font-family: "Playfair Display", serif;
  font-size: 24px;
  font-weight: 900;
}

.ttl-en .line {
  width: 80px;
  height: 2px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 0;
  background: #262626;
}

/* ----------------------
   MV
---------------------- */

.mv {
  background: #fff;
  margin-bottom: 200px;
}

.mv .inner {
  position: relative;
}

.mv__img {
  width: 420px;
  position: absolute;
  left: 0;
  top: 60px;
}

.mv .pr_mark {
  position: absolute;
  right: 0;
  top: 40px;
}

.mv__detail {
  padding-left: 420px;
  text-align: center;
  padding-top: 4em;
}

.mv__detail__ttl-sub,
.mv__detail__ttl-sub2 {
  font-size: 20px;
  line-height: 1.7;
  color: #c1ab05;
}

.mv__detail__ttl {
  font-family: 'Shippori Mincho', serif;
  color: #67b5b7;
  font-size: 38px;
  margin: 20px 0;
  line-height: 1.4;
}

.mv__detail__txt {
  max-width: 460px;
  margin: 0 auto;
  font-size: 16px;
  line-height: 1.8;
  text-align: justify;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif;
}

/* ----------------------
   Item
---------------------- */

.item {
  padding: 100px 0 0;
}

.item.item01,
.item.item03 {
  background: #f3f3f2;
  padding: 4em 0;
  margin: 3em 0;
}

.item__content {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-top: 40px;
}

.item__content.reverse {
  flex-direction: row-reverse;
}

.item__content__detail {
  flex: 1;
}

.item__content__img {
  flex: 1;
}

.item__content__img img {
  width: 100%;
  height: auto;
}

/* text */
.ttl1 {
  font-family: 'Shippori Mincho', serif;
  color: #67b5b7;
  font-size: 22px;
  line-height: 1.5em;
}

.txt {
  margin-top: 20px;
  font-size: 16px;
  line-height: 1.8;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif;
}

.credit {
  margin-top: 20px;
  font-size: 12px;
  color: #666;
  line-height: 1.5em;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif;
}

/* ----------------------
   Button
---------------------- */

.online-shop-btn {
  margin-top: 30px;
}

.online-shop-btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
  border: 1px solid #67b5b7;
  color: #67b5b7;
  text-decoration: none;
}

/* ----------------------
   Bottom
---------------------- */

.item-bottom {
  padding: 100px 0;
  text-align: center;
}

.official-btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 460px;
  height: 70px;
  margin: 0 auto;
  background: #67b5b7;
  color: #fff;
}

/* SNS */
.sns {
  margin-top: 30px;
  display: flex;
  justify-content: center;
  gap: 20px;
}

.sns__item {
  width: 28px;
}

/* ----------------------
   Responsive
---------------------- */

@media screen and (max-width: 767px) {

  .mv {
    margin-bottom: 60px;
  }

  .mv .pr_mark {
    right: 20px;
    top: 10px;
  }

  .mv__img {
    position: static;
    width: 100%;
  }

  .mv__detail {
    padding: 20px 0 0;
  }

  .mv__detail__ttl {
    font-size: 24px;
  }

  .mv__detail__ttl-sub, .mv__detail__ttl-sub2 {
    font-size: 16px;
  }

  .mv__detail__txt {
    font-size: 14px;
  }

  .item {
    padding-top: 60px;
  }

  .item__content {
    display: flex;
    flex-direction: column;
  }

  .item__content__detail {
    display: contents;
  }

  .item-bottom {
    padding: 60px 20px;
}

  .ttl {
    order: 1;
  }

  .item__content__img {
    order: 2;
  }

  .txt {
    order: 3;
  }

  .credit {
    order: 4;
    font-size: 12px;
    margin: 0 0 3em 0;
  }

  .item__content.reverse {
    flex-direction: column;
  }

  .ttl1 {
    font-size: 17px;
    text-align: center;
  }

  .txt {
    font-size: 14px;
  }

  .online-shop-btn {
    order: 5;
    margin-top: 20px;
    width: 100%;
  }

  .official-btn a {
    margin-bottom: 3em;
}
}

@media screen and (min-width: 768px) and (max-width: 1024px) {

  /* 全体余白を少し広げる */
  .inner {
    padding: 50px 25px;
  }

  .mv {
    margin-bottom: 120px;
  }

  .mv__img {
    width: 45%;
    top: 40px;
  }

  .mv__detail {
    padding-left: 45%;
    padding-top: 2em;
  }

  .mv__detail__ttl {
    font-size: 30px;
  }

  .mv__detail__txt {
    font-size: 15px;
  }

  .item {
    padding-top: 80px;
  }

  .item__content {
    gap: 24px;
  }

  .item__content__img {
    flex: 0.9;
  }

  .item__content__detail {
    flex: 1.1;
  }

  .ttl1 {
    font-size: 20px;
  }

  .txt {
    font-size: 15px;
  }

  .credit {
    font-size: 11px;
  }

  /* ボタン少しコンパクトに */
  .online-shop-btn a {
    height: 54px;
    font-size: 14px;
  }

}