@charset "UTF-8";
/* line-heightの上下をなくす
===================================================== */
/* letter-spacingの文末をなくす
===================================================== */
/* clearfix
===================================================== */
/* hover
===================================================== */
/* linkcolor
===================================================== */
/* z-index
===================================================== */
/* rem変換
===================================================== */
/* vw変換(SP用)
===================================================== */
/* vw変換(PC用) minとmax
===================================================== */
/* spサイズをpcへ引き伸ばし
===================================================== */
/* ラインハイト計算
===================================================== */
/* レタースペーシング計算
===================================================== */
/* right-arrow
===================================================== */
/* aspect-area(padding-top)
===================================================== */
/* aspect-area-h(height)
===================================================== */
/* youtube
===================================================== */
/* margin: 0 auto
===================================================== */
/* color
===================================================== */
/* font-size
===================================================== */
/* font-family
===================================================== */
/* コンテンツ幅
===================================================== */
/* 余白
===================================================== */
/* メディアクエリー
===================================================== */
/* loopslide
============================================ */
/* fadeinWrap
============================================ */
/* fadein
============================================ */
/* fadeup
============================================ */
/* slide
===================================================== */
/* 読み込み
===================================================== */
/*
===================================================== */
.featuresHead {
  font-family: "ivypresto-display", serif;
  font-weight: 100;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .featuresHead {
    font-size: min(4.7368421053vw, 45px);
  }
}
@media screen and (max-width: 767px) {
  .featuresHead {
    font-size: 7.4666666667vw;
  }
}

/* .top
===================================================== */
@media screen and (min-width: 768px) {
  .top {
    padding-top: min(3.6842105263vw, 35px);
  }
}
@media screen and (max-width: 767px) {
  .top {
    padding-top: 8vw;
  }
}
.top .featuresGood {
  font-family: dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .top .featuresGood {
    font-size: min(2.4210526316vw, 23px);
    margin-bottom: min(1.2631578947vw, 12px);
  }
}
@media screen and (max-width: 767px) {
  .top .featuresGood {
    font-size: 5.0666666667vw;
    margin-bottom: 7.4666666667vw;
  }
}
.top .pageHead {
  text-align: center;
  font-family: "A1明朝 B JIS2004 AP", serif;
  font-weight: normal;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .top .pageHead {
    font-size: min(2.3157894737vw, 22px);
    margin-bottom: max(-0.6315789474vw, -6px);
  }
}
@media screen and (max-width: 767px) {
  .top .pageHead {
    font-size: 4.8vw;
    margin-bottom: 0.5333333333vw;
  }
}
.top .pageHead span {
  font-family: "ivypresto-display", serif;
  font-weight: 100;
  font-style: italic;
  display: block;
  text-transform: uppercase;
}
@media screen and (min-width: 768px) {
  .top .pageHead span {
    font-size: min(8.3157894737vw, 79px);
    margin-top: max(-3.6842105263vw, -35px);
  }
}
@media screen and (max-width: 767px) {
  .top .pageHead span {
    font-size: 17.0666666667vw;
    margin-top: -6.1333333333vw;
  }
}
.top .featuresImg {
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}
@media screen and (min-width: 768px) {
  .top .featuresImg {
    width: min(96.8421052632vw, 920px);
    margin-bottom: min(14.5263157895vw, 138px);
    transform: translateX(max(-2vw, -19px));
  }
}
@media screen and (max-width: 767px) {
  .top .featuresImg {
    width: 94.6666666667vw;
    margin-bottom: 17.3333333333vw;
  }
}

/* .key, .color
===================================================== */
.key,
.color {
  text-align: center;
}

/* .key
===================================================== */
@media screen and (min-width: 768px) {
  .key {
    margin-bottom: min(9.1578947368vw, 87px);
  }
}
@media screen and (max-width: 767px) {
  .key {
    margin-bottom: 10.6666666667vw;
  }
}
.key .keyPint {
  font-family: dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .key .keyPint {
    font-size: min(2.7368421053vw, 26px);
    margin-bottom: min(3.6842105263vw, 35px);
    margin-top: max(-0.6315789474vw, -6px);
  }
}
@media screen and (max-width: 767px) {
  .key .keyPint {
    font-size: 4.5333333333vw;
    margin-bottom: 7.7333333333vw;
  }
}
.key .keyText {
  text-align: center;
  text-align: center;
  font-family: dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
  line-height: 2.1666666667;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .key .keyText {
    width: min(63.1578947368vw, 600px);
    font-size: min(1.4736842105vw, 14px);
  }
}
@media screen and (max-width: 767px) {
  .key .keyText {
    width: 80vw;
    font-size: 3.2vw;
  }
}
.key .keyText span {
  display: block;
}

/* .color
===================================================== */
.color {
  background-color: #fff;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .color {
    margin-bottom: max(-3.3684210526vw, -32px);
    width: min(80vw, 760px);
    padding: min(2.9473684211vw, 28px) 0 min(4.2105263158vw, 40px);
  }
}
@media screen and (max-width: 767px) {
  .color {
    margin-bottom: -3.4666666667vw;
    width: 93.3333333333vw;
    padding: 4vw 0 7.4666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .color .colorBlock:first-of-type {
    margin-top: min(1.1578947368vw, 11px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorBlock:first-of-type {
    margin-top: 5.6vw;
  }
}
@media screen and (min-width: 768px) {
  .color .colorBlock:not(:last-of-type) {
    margin-bottom: min(6vw, 57px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorBlock:not(:last-of-type) {
    margin-bottom: 9.0666666667vw;
  }
}
.color .colorHead {
  font-family: "ivypresto-display", serif;
  font-weight: 100;
  font-style: normal;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .color .colorHead {
    font-size: min(2.9473684211vw, 28px);
    margin-bottom: min(1.5789473684vw, 15px);
    gap: 0 min(1.6842105263vw, 16px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorHead {
    font-size: 4.8vw;
    margin-bottom: 2.1333333333vw;
    gap: 0 2.6666666667vw;
  }
}
.color .colorHead::before, .color .colorHead::after {
  content: "";
  display: block;
  background-color: #333333;
}
@media screen and (min-width: 768px) {
  .color .colorHead::before, .color .colorHead::after {
    height: 1px;
    width: min(9.4736842105vw, 90px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorHead::before, .color .colorHead::after {
    width: 14.6666666667vw;
    height: 0.2666666667vw;
  }
}
.color .colorText {
  font-family: dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .color .colorText {
    font-size: min(1.8947368421vw, 18px);
    margin-bottom: min(2.1052631579vw, 20px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorText {
    font-size: 3.2vw;
    margin-bottom: 2.6666666667vw;
  }
}
.color .colorList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .color .colorList {
    width: min(50vw, 475px);
    gap: min(2.1052631579vw, 20px) min(1.7894736842vw, 17px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorList {
    width: 77.8666666667vw;
    gap: 2.6666666667vw 3.2vw;
  }
}
.color .colorList .colorList_item {
  border-radius: 50%;
  border-style: solid;
}
@media screen and (min-width: 768px) {
  .color .colorList .colorList_item {
    border-width: 1px;
    width: min(4.4210526316vw, 42px);
    height: min(4.4210526316vw, 42px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorList .colorList_item {
    width: 6.9333333333vw;
    height: 6.9333333333vw;
    border-width: 0.2666666667vw;
  }
}
.color .colorAttention {
  font-family: dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .color .colorAttention {
    font-size: min(1.3684210526vw, 13px);
    margin-top: min(4.2105263158vw, 40px);
  }
}
@media screen and (max-width: 767px) {
  .color .colorAttention {
    font-size: 2.6666666667vw;
    margin-top: 6.1333333333vw;
  }
}

/* .featuresNav
===================================================== */
.featuresNav {
  background-color: #dce5dc;
}
@media screen and (min-width: 768px) {
  .featuresNav {
    padding-top: min(8.8421052632vw, 84px);
    padding-bottom: min(11.5789473684vw, 110px);
  }
}
@media screen and (max-width: 767px) {
  .featuresNav {
    padding-top: 24vw;
    padding-bottom: 22.6666666667vw;
  }
}
.featuresNav .navList {
  display: flex;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .featuresNav .navList {
    justify-content: space-between;
    width: min(82.7368421053vw, 786px);
    gap: min(2.8421052632vw, 27px) 0;
    margin-bottom: min(7.5789473684vw, 72px);
    margin-top: min(4vw, 38px);
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList {
    flex-direction: column;
    width: 85.3333333333vw;
    gap: 5.0666666667vw 0;
    margin-bottom: 16vw;
    margin-top: 6.6666666667vw;
  }
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_item {
    border-radius: min(1.0526315789vw, 10px);
    width: min(25.6842105263vw, 244px);
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_item {
    border-radius: 2.6666666667vw;
  }
}
.featuresNav .navList .navList_link {
  width: 100%;
  position: relative;
  display: block;
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_link {
    padding: min(1.4736842105vw, 14px) 0 min(4.7368421053vw, 45px);
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_link {
    display: flex;
    justify-content: space-between;
    padding: 5.3333333333vw 5.3333333333vw 5.3333333333vw 0;
  }
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_img {
    width: min(12.5263157895vw, 119px);
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_img {
    flex-shrink: 0;
    width: 31.7333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_data {
    margin-top: min(0vw, 0px);
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_data {
    margin-top: 2.9333333333vw;
  }
}
.featuresNav .navList .navList_color {
  font-family: dnp-shuei-gothic-gin-std, sans-serif;
  font-weight: 600;
  font-style: normal;
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_color {
    font-size: min(1.6842105263vw, 16px);
    margin-bottom: min(1.0526315789vw, 10px);
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_color {
    font-size: 4.2666666667vw;
    margin-bottom: 0.2666666667vw;
  }
}
.featuresNav .navList .navList_text {
  line-height: 1.7272727273;
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_text {
    font-size: min(1.1578947368vw, 11px);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_text {
    font-size: 2.9333333333vw;
  }
}
.featuresNav .navList .navList_check {
  position: absolute;
  font-family: "futura-pt", sans-serif;
  font-weight: 500;
  font-style: normal;
  text-decoration: underline;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .featuresNav .navList .navList_check {
    bottom: min(1.6842105263vw, 16px);
    right: min(3.0526315789vw, 29px);
    font-size: min(1.4736842105vw, 14px);
  }
}
@media screen and (max-width: 767px) {
  .featuresNav .navList .navList_check {
    bottom: 4.5333333333vw;
    right: 4.5333333333vw;
    font-size: 3.7333333333vw;
  }
}

.wrapper.features.spring .navList .navList_item__spring {
  display: none;
}

.wrapper.features.summer .navList .navList_item__summer {
  display: none;
}

.wrapper.features.autumn .navList .navList_item__autumn {
  display: none;
}

.wrapper.features.winter .navList .navList_item__winter {
  display: none;
}/*# sourceMappingURL=features.css.map */