.pc-only {
  display: block;
}

.sp-only {
  display: none;
}

@media screen and (max-width: 750px) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: block;
  }
}
#crayon {
  padding-top: 40px;
  padding-bottom: 70px;
}

.crayon-title {
  display: block;
  text-align: center;
  max-width: 1120px;
  margin: 0 auto 20px;
}
.crayon-title img {
  max-width: 100%;
}
.crayon-sub-title {
  margin-top: 30px;
  margin-bottom: 40px;
}
.crayon-text {
  text-align: center;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
}

#design {
  background: url("../img/design-bg.jpg") repeat;
  padding-top: 110px;
  padding-bottom: 70px;
}

.design-title {
  text-align: center;
  margin-bottom: 2em;
  padding-bottom: 55px;
  margin-bottom: 40px !important;
  background: url("../img/design-title.png") no-repeat center bottom;
}
.design-text {
  text-align: center;
  max-width: 1400px;
  margin: 0 auto 30px;
  padding: 0 58px;
}
.design-image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 1200px;
  margin: 0 auto 110px;
  padding: 20px 65px 0;
}
.design-image > div {
  max-width: 100%;
}
.design-image > div:first-child {
  margin-right: 120px;
}
.design-image > div img {
  max-width: 100%;
  height: auto;
}
.design .slider {
  max-width: 1120px;
  margin: 0 auto 20px;
}
.design .slider .swiper-slide {
  opacity: 0 !important;
}
.design .slider .swiper-slide-active {
  opacity: 1 !important;
}
.design .slider .slider-image {
  max-width: 100%;
  display: block;
}
.design .slider .slider-image img {
  max-width: 100%;
  height: auto;
}
.design .slider-desc {
  padding-top: 25px;
  text-align: center;
}
.design .slider-thumbnail {
  max-width: 580px;
  margin: 0 auto;
}
.design .slider-thumbnail .swiper-wrapper {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.design .slider-thumbnail .swiper-slide {
  max-width: 96px;
  padding: 8px;
}
.design .slider-thumbnail .swiper-slide-thumb-active {
  padding: 6px;
  border: 2px solid #2bace3;
  border-radius: 50%;
}
.design .thumbnail-item {
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
.design .thumbnail-item:hover {
  cursor: pointer;
}
.design .thumbnail-color01 {
  background: #55a7ab;
}
.design .thumbnail-color02 {
  background: #008fa7;
}
.design .thumbnail-color03 {
  background: #005f5b;
}
.design .thumbnail-color04 {
  background: #26417f;
}
.design .thumbnail-color05 {
  background: #84863e;
}
.design .purchase-button {
  max-width: 300px;
  margin: 50px auto;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #fff;
  background: no-repeat right 12% center/auto 15px url(https://www.tiger-corporation.com/wp-content/themes/tiger-corporation/assets/images/arrow-right-white.svg);
  background-color: #333;
  -webkit-transition: opacity 0.4s ease;
  transition: opacity 0.4s ease;
}
.design .purchase-button:hover {
  opacity: 0.7;
}

@media screen and (max-width: 750px) {
  #crayon img,
  #design img {
    max-width: 100%;
    height: auto;
  }
  #crayon {
    padding: 0 8vw 8vw;
  }
  .crayon-title {
    display: block;
    width: 75.3333333333vw;
    margin: 0 auto;
  }
  .crayon-sub-title {
    font-size: 4vw;
    font-weight: bold;
  }
  .crayon-text {
    text-align: left;
    padding: 0;
  }
  #design {
    background: url("../img/design-bg_sp.jpg") repeat center top;
    background-size: auto auto;
    padding-top: 16vw;
    padding-bottom: 16vw;
  }
  .design-title {
    padding-bottom: 8vw;
    background: url("../img/design-title.png") no-repeat center bottom;
    background-size: 72.2666666667vw 5.6vw;
    margin-bottom: 4vw;
  }
  .design-image {
    display: block;
    margin-bottom: 14.6666666667vw;
  }
  .design-image > div {
    width: 84vw;
    margin: 0 auto 6.6666666667vw;
  }
  .design .slider {
    margin-bottom: 1.3333333333vw;
  }
  .design .slider-image {
    width: 100%;
  }
  .design .slider-thumbnail {
    max-width: 85.3333333333vw;
    margin: 0 auto;
  }
  .design .slider-thumbnail .swiper-slide {
    margin: 0;
    padding: 1.0666666667vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    max-width: 15.4666666667vw;
  }
  .design .slider-thumbnail .swiper-slide-thumb-active {
    padding: 0.8vw;
    border-width: 0.2666666667vw;
  }
  .design .thumbnail-item {
    width: 13.3333333333vw;
    height: 13.3333333333vw;
    border-radius: 50%;
  }
  .design .thumbnail-item:hover {
    cursor: pointer;
  }
}

@media (min-width: 751px) {
.lang-en .is-style-link-button a.lineup-button {
font-size: 14px;
  }
}