@charset "UTF-8";
/* ==========================================================================
   components
   ========================================================================== */
.c-contentsWrap {
  width: auto;
}

@media only screen and (max-width: 1024px) {
  .c-contentsWrap {
    width: 92.67%;
  }
}

.c-cuticleContainer {
  width: 83.33%;
  max-width: 1000px;
  margin: 0 auto;
  padding-bottom: 80px;
}

@media only screen and (max-width: 1024px) {
  .c-cuticleContainer {
    width: 100%;
    padding-bottom: 10.66667vw;
  }
}

.c-cuticleContainer-ttl {
  font-size: 2.4rem;
  line-height: 1.67;
  letter-spacing: 5px;
}

@media only screen and (max-width: 1024px) {
  .c-cuticleContainer-ttl {
    font-size: 4.26667vw;
    letter-spacing: 0.04em;
  }
}

.c-cuticleContainer-lead {
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  padding-top: 15px;
  font-size: 1.6rem;
  line-height: 1.75;
  margin-bottom: 160px;
}

@media only screen and (max-width: 1024px) {
  .c-cuticleContainer-lead {
    padding-top: 1.33333vw;
    font-size: 2.93333vw;
    margin-bottom: 10.66667vw;
  }
}

.c-linkBtn {
  margin-top: 50px;
  text-align: center;
}

@media only screen and (max-width: 1024px) {
  .c-linkBtn {
    margin-top: 10.66667vw;
  }
}

.c-pointContainer-btn {
  text-align: center;
}

/* ==========================================================================
   modules
   ========================================================================== */
/* colorList---------------------------------------------------------------------------------------*/
.m-colorList {
  width: 91.17%;
  max-width: 1094px;
  margin: 0 auto 80px;
}

@media only screen and (max-width: 1024px) {
  .m-colorList {
    width: 100%;
    margin-bottom: 13.6vw;
  }
}

.m-colorList-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 20px;
}

@media only screen and (max-width: 1024px) {
  .m-colorList-item {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding-bottom: 9.2vw;
  }
}

.m-colorList-item:last-child {
  padding-bottom: 0;
}

.m-colorList-img {
  width: 12.89%;
}

@media only screen and (max-width: 1024px) {
  .m-colorList-img {
    width: 27.75%;
  }
}

.m-colorList-txt {
  width: 80.99%;
}

@media only screen and (max-width: 1024px) {
  .m-colorList-txt {
    width: 69.15%;
  }
}

.m-colorList-ttl {
  font-size: 1.9rem;
  font-weight: bold;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  display: block;
  margin-bottom: 5px;
}

@media only screen and (max-width: 1024px) {
  .m-colorList-ttl {
    font-size: 2.93333vw;
    margin-bottom: 1.33333vw;
  }
}

.m-colorList-desc {
  font-size: 1.6rem;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}

@media only screen and (max-width: 1024px) {
  .m-colorList-desc {
    font-size: 2.66667vw;
  }
}

/* level---------------------------------------------------------------------------------------*/
.m-level {
  text-align: center;
}

.m-level-txt {
  font-size: 1.5rem;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  padding-bottom: 5px;
  line-height: 2;
}

@media only screen and (max-width: 1024px) {
  .m-level-txt {
    font-size: 2.66667vw;
    padding-bottom: 2.4vw;
  }
}

.m-level-note {
  font-size: 1.1rem;
  display: block;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  padding-bottom: 25px;
}

@media only screen and (max-width: 1024px) {
  .m-level-note {
    font-size: 2.26667vw;
    padding-bottom: 6vw;
  }
}

.m-level-img {
  display: block;
  margin: 0 auto;
  width: 78.58%;
}

@media only screen and (max-width: 1024px) {
  .m-level-img {
    width: 80%;
  }
}

/* variationBox---------------------------------------------------------------------------------------*/
.m-variationBox.-ba .m-variationBox-info {
  background-color: #a1a7bc;
}

.m-variationBox.-og .m-variationBox-info {
  background-color: #a5a99d;
}

.m-variationBox.-pa .m-variationBox-info {
  background-color: #a6a7a9;
}

.m-variationBox.-la .m-variationBox-info {
  background-color: #b3adb8;
}

.m-variationBox.-n .m-variationBox-info {
  background-color: #c5b990;
}

.m-variationBox.-mb .m-variationBox-info {
  background-color: #d4b9a4;
}

.m-variationBox.-sg .m-variationBox-info {
  background-color: #c5ada7;
}

.m-variationBox.-bp .m-variationBox-info {
  background-color: #f7c4c9;
}

/* ==========================================================================
   parts
   ========================================================================== */