@media screen and (max-width: 767px) {
}
@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (max-width: 991px) {
}
@media (max-width: 991px) {
}
@media (min-width: 992px) {
}
@media (min-width: 992px) {
}
.index-homepage-jp {
  min-width: 320px;
}
.index-homepage-jp h2,
.index-homepage-jp h3,
.index-homepage-jp h4,
.index-homepage-jp p {
  font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'Osaka', 'MS Pゴシック', 'MS PGothic', sans-serif;
  font-weight: 300;
  margin: 0;
}
.index-homepage-jp .free-dktp-jp {
  width: 172px;
  height: 61px;
  display: initial;
  position: relative;
  left: -4px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-dktp-jp {
    left: -4px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .free-dktp-jp {
    width: 327px;
    height: 116px;
    display: initial;
    position: relative;
    left: -8px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .free-dktp-jp {
    left: -8px;
  }
}
.index-homepage-jp .features-jp {
  width: 193px;
  height: 90px;
  display: initial;
  position: relative;
  left: -2px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-jp {
    left: -2px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .features-jp {
    width: 374px;
    height: 174px;
    display: initial;
    position: relative;
    left: -6px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .features-jp {
    left: -6px;
  }
}
.index-homepage-jp .adv-ft-dktp-jp {
  width: 461px;
  height: 110px;
  display: initial;
  position: relative;
  left: -8px;
}
@media (min-width: 768px) {
  .index-homepage-jp .adv-ft-dktp-jp {
    left: -8px;
  }
}
.index-homepage-jp .adv-ft-mobile-jp {
  width: 165px;
  height: 86px;
  display: initial;
  position: relative;
  left: -8px;
}
@media (min-width: 768px) {
  .index-homepage-jp .adv-ft-mobile-jp {
    left: -8px;
  }
}
.index-homepage-jp .about-light-jp {
  width: 221px;
  height: 90px;
  display: initial;
  position: relative;
  left: -3px;
}
@media (min-width: 768px) {
  .index-homepage-jp .about-light-jp {
    left: -3px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .about-light-jp {
    width: 420px;
    height: 170px;
    display: initial;
    position: relative;
    left: -8px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .about-light-jp {
    left: -8px;
  }
}
.index-homepage-jp .about-dktp-jp {
  width: 625px;
  height: 105px;
  display: initial;
  position: relative;
  left: -8px;
}
@media (min-width: 768px) {
  .index-homepage-jp .about-dktp-jp {
    left: -8px;
  }
}
.index-homepage-jp .about-subhead-dktp-jp {
  width: 645px;
  height: 42px;
  display: initial;
  position: relative;
  left: -8px;
  margin-top: 40px;
}
@media (min-width: 768px) {
  .index-homepage-jp .about-subhead-dktp-jp {
    left: -8px;
  }
}
.index-homepage-jp .about-mobile-jp {
  width: 225px;
  height: 89px;
  display: initial;
  position: relative;
  left: -8px;
  margin: 0 auto;
  display: block;
}
@media (min-width: 768px) {
  .index-homepage-jp .about-mobile-jp {
    left: -8px;
  }
}
.index-homepage-jp .about-subhead-mobile-jp {
  width: 258px;
  height: 54px;
  display: initial;
  position: relative;
  left: -8px;
  margin: 28px auto 0;
  display: block;
}
@media (min-width: 768px) {
  .index-homepage-jp .about-subhead-mobile-jp {
    left: -8px;
  }
}
.index-homepage-jp .free-plan {
  display: initial;
  left: -3px;
  width: 280px;
  height: 64px;
  position: relative;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-plan {
    left: -3px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .free-plan {
    width: 470px;
    height: 107px;
    display: initial;
    position: relative;
    left: -6px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .free-plan {
    left: -6px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .free-plan {
    width: 500px;
    height: 107px;
    margin-top: 24px;
  }
}
.index-homepage-jp .playlist-header {
  display: initial;
  position: relative;
  left: -8px;
  width: 200px;
  height: 47px;
}
@media (min-width: 768px) {
  .index-homepage-jp .playlist-header {
    left: -8px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .playlist-header {
    width: 370px;
    height: 86px;
  }
}
.index-homepage-jp .share-header {
  display: initial;
  position: relative;
  left: -8px;
  width: 80px;
  height: 20px;
}
@media (min-width: 768px) {
  .index-homepage-jp .share-header {
    left: -8px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .share-header {
    width: 156px;
    height: 38px;
  }
}
.index-homepage-jp .lyrics-header {
  display: initial;
  position: relative;
  left: -8px;
  width: 104px;
  height: 22px;
}
@media (min-width: 768px) {
  .index-homepage-jp .lyrics-header {
    left: -8px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .lyrics-header {
    width: 188px;
    height: 40px;
  }
}
.index-homepage-jp .medium-phone {
  width: 132px;
  height: 270px;
  fill: #FFF;
}
@media (min-width: 768px) {
  .index-homepage-jp .medium-phone {
    width: 251px;
    height: 515px;
  }
}
.index-homepage-jp .color-hero {
  color: #FFF;
}
.index-homepage-jp .color-hero .container {
  height: 340px;
  min-height: 340px;
}
@media (min-width: 768px) {
  .index-homepage-jp .color-hero .container {
    height: 650px;
    min-height: 650px;
  }
}
.index-homepage-jp .color-hero h2 {
  font-size: 13px;
  line-height: 18px;
  margin-top: 12px;
}
@media (min-width: 768px) {
  .index-homepage-jp .color-hero h2 {
    font-size: 24px;
    line-height: 36px;
    margin-top: 12px;
  }
}
.index-homepage-jp .color-hero h2 + p {
  font-size: 9px;
  line-height: 18px;
  margin-top: 12px;
}
@media (min-width: 768px) {
  .index-homepage-jp .color-hero h2 + p {
    font-size: 12px;
    line-height: 18px;
    margin-top: 8px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .hero-dktp-jp {
    width: 440px;
    height: 66px;
    display: initial;
    position: relative;
    left: -5px;
  }
  .index-homepage-jp .slide-playlists-dktp-jp {
    width: 452px;
    height: 63px;
    display: initial;
    position: relative;
    left: -4px;
  }
  .index-homepage-jp .slide-radio-dktp-jp {
    width: 516px;
    height: 63px;
    display: initial;
    position: relative;
    left: -4px;
  }
  .index-homepage-jp .slide-premium-dktp-jp {
    width: 462px;
    height: 62px;
    display: initial;
    position: relative;
    left: -4px;
  }
  .index-homepage-jp .hero-dktp-jp.spring-promo {
    width: 440px;
    height: 66px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .hero-dktp-jp {
    left: -5px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .slide-playlists-dktp-jp {
    left: -4px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .slide-radio-dktp-jp {
    left: -4px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .slide-premium-dktp-jp {
    left: -4px;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .hero-dktp-jp.winter-promo {
    width: 260px;
    height: 46px;
    display: initial;
    position: relative;
    left: -5px;
  }
  .index-homepage-jp .hero-dktp-jp.spring-promo {
    width: 152px;
    height: 72px;
  }
  .index-homepage-jp .hero-mobile-jp {
    width: 165px;
    height: 80px;
    display: initial;
    position: relative;
    left: -5px;
  }
  .index-homepage-jp .slide-playlists-mobile-jp {
    width: 200px;
    height: 80px;
    display: initial;
    position: relative;
    left: -6px;
  }
  .index-homepage-jp .slide-radio-mobile-jp {
    width: 242px;
    height: 82px;
    display: initial;
    position: relative;
    left: -6px;
  }
  .index-homepage-jp .slide-premium-mobile-jp {
    width: 152px;
    height: 74px;
    display: initial;
    position: relative;
    left: 0;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .index-homepage-jp .hero-dktp-jp.winter-promo {
    left: -5px;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .index-homepage-jp .hero-mobile-jp {
    left: -5px;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .index-homepage-jp .slide-playlists-mobile-jp {
    left: -6px;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .index-homepage-jp .slide-radio-mobile-jp {
    left: -6px;
  }
}
@media (max-width: 767px) and (min-width: 768px) {
  .index-homepage-jp .slide-premium-mobile-jp {
    left: 0;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-control.left,
  .index-homepage-jp .carousel-control.right {
    top: 460px;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-control.left {
    left: 25%;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-control.right {
    right: 26%;
  }
}
.index-homepage-jp .icon-prev,
.index-homepage-jp .icon-next {
  width: 35px;
  height: 35px;
  border: 0;
  background-image: url(/i/home/carousel-chevron.svg);
}
.index-homepage-jp .icon-prev::before,
.index-homepage-jp .icon-next::before,
.index-homepage-jp .icon-prev::after,
.index-homepage-jp .icon-next::after {
  display: none;
}
@media (max-width: 767px) {
  .index-homepage-jp .icon-prev,
  .index-homepage-jp .icon-next {
    width: 24px;
    height: 24px;
  }
}
.index-homepage-jp .icon-next {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.index-homepage-jp .carousel-indicators {
  bottom: 29px;
  width: 80px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.index-homepage-jp .carousel-indicators li {
  border: 1px solid transparent;
  background-color: #C1C3C6;
  width: 8px;
  height: 8px;
}
.index-homepage-jp .carousel-indicators li.winter-promo {
  background-color: #919496;
}
.index-homepage-jp .carousel-indicators .active {
  background-color: #000;
  margin: 1px;
}
.index-homepage-jp .carousel-hero-jp h3 {
  margin-top: 12px;
  margin-bottom: 28px;
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp h3 {
    font-size: 14px;
    line-height: 20px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp h3 {
    margin-top: 8px;
    margin-bottom: 36px;
  }
}
.index-homepage-jp .carousel-hero-jp h3.winter-promo {
  margin-top: 0;
  margin-bottom: 12px;
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .premium .btn {
    max-width: 312px;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .btn {
    width: 100%;
    display: block;
    max-width: 260px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .btn {
    display: inline-block;
  }
}
.index-homepage-jp .carousel-hero-jp .utm-signup-hero-slide1.winter-promo {
  margin: 0 auto;
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .btn-green,
  .index-homepage-jp .carousel-hero-jp .btn-stroked-light.winter-promo {
    margin-bottom: 16px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .btn-green,
  .index-homepage-jp .carousel-hero-jp .btn-stroked-light.winter-promo {
    margin-right: 16px;
  }
}
.index-homepage-jp .carousel-hero-jp .carousel-caption {
  width: 100%;
  padding: 0;
  left: 0;
  right: 0;
  margin-top: 75px;
  margin-bottom: 50px;
  text-align: left;
  position: relative;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .carousel-caption {
    margin-bottom: 50px;
    padding: 0 50px;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-premium .carousel-caption {
  margin-top: 142px;
}
.index-homepage-jp .carousel-hero-jp .slide-main .carousel-caption {
  margin-top: 112px;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-main .carousel-caption {
    margin-top: 95px;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-main .carousel-caption.winter-promo {
  margin-top: 100px;
  text-align: center;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-main .carousel-caption.winter-promo {
    margin-top: 64px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-playlists .carousel-caption {
    margin-top: 110px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-radio .carousel-caption {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .carousel-hero-jp .slide-playlists .carousel-caption,
  .index-homepage-jp .carousel-hero-jp .slide-radio .carousel-caption,
  .index-homepage-jp .carousel-hero-jp .slide-premium .carousel-caption {
    margin-top: 130px;
  }
}
.index-homepage-jp .carousel-hero-jp .carousel-inner {
  background-color: #2D46B9;
  background: linear-gradient(45deg, #2D46B9, #509BF5, #B5B5A1);
  margin-top: 54px;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .carousel-inner .container {
    position: relative;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .carousel-hero-jp .carousel-inner {
    margin-top: 80px;
  }
}
.index-homepage-jp .carousel-hero-jp .carousel-inner.winter-promo {
  background-color: #FFC864;
  background: linear-gradient(45deg, #FFC864, #FBB64A, #F59B23);
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .container.carousel-controls {
    position: absolute;
    left: 0;
    right: 0;
    top: 280px;
  }
  .index-homepage-jp .carousel-hero-jp .carousel-control.right {
    right: 0;
  }
  .index-homepage-jp .carousel-hero-jp .carousel-control.left {
    left: 0;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-main {
  width: 100%;
  height: 500px;
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main_mobile.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (max-width: 767px) and only screen and (-webkit-min-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min--moz-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min-resolution: 192dpi), (max-width: 767px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main_mobile_2x.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main_2x.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main.jpg") no-repeat;
    background-position: center center;
  }
}
@media (min-width: 992px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min-resolution: 192dpi), (min-width: 992px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main_2x.jpg") no-repeat;
    background-position: center center;
  }
}
@media (min-width: 1496px) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (min-width: 1496px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min-resolution: 192dpi), (min-width: 1496px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main {
    background: url("/i/home/jp/intro_slide_main_2x.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .slide-main h3:not('winter-promo') {
    width: 65%;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
  width: 100%;
  height: 500px;
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217_mobile.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (max-width: 767px) and only screen and (-webkit-min-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min--moz-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min-resolution: 192dpi), (max-width: 767px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217_mobile_2x.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217.jpg") no-repeat;
    background-position: center bottom;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217_2x.jpg") no-repeat;
    background-position: center bottom;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217.jpg") no-repeat;
    background-position: center bottom;
  }
}
@media (min-width: 992px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min-resolution: 192dpi), (min-width: 992px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217_2x.jpg") no-repeat;
    background-position: center bottom;
  }
}
@media (min-width: 1496px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217.jpg") no-repeat;
    background-position: center bottom;
    background-size: cover;
  }
}
@media (min-width: 1496px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min-resolution: 192dpi), (min-width: 1496px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.winter-promo {
    background: url("/i/home/jp/intro_slide_main_1217_2x.jpg") no-repeat;
    background-position: center bottom;
    background-size: cover;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
  width: 100%;
  height: 500px;
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318_mobile.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (max-width: 767px) and only screen and (-webkit-min-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min--moz-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min-device-pixel-ratio: 2), (max-width: 767px) and only screen and (min-resolution: 192dpi), (max-width: 767px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318_mobile_2x.jpg") no-repeat;
    background-position: center center;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318.jpg") no-repeat;
    background-position: center top;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318_2x.jpg") no-repeat;
    background-position: center top;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318.jpg") no-repeat;
    background-position: center top;
  }
}
@media (min-width: 992px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min-device-pixel-ratio: 2), (min-width: 992px) and only screen and (min-resolution: 192dpi), (min-width: 992px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318_2x.jpg") no-repeat;
    background-position: center top;
  }
}
@media (min-width: 1496px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318.jpg") no-repeat;
    background-position: center top;
    background-size: cover;
  }
}
@media (min-width: 1496px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min-device-pixel-ratio: 2), (min-width: 1496px) and only screen and (min-resolution: 192dpi), (min-width: 1496px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background: url("/i/home/jp/intro_slide_main_0318_2x.jpg") no-repeat;
    background-position: center top;
    background-size: cover;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .carousel-hero-jp .slide-main.spring-promo {
    background-size: 845px 550px;
    background-position: center bottom -40px;
  }
}
.index-homepage-jp .carousel-hero-jp .carousel-caption.spring-promo {
  margin-top: 50px;
  padding-left: 0;
}
@media (min-width: 992px) {
  .index-homepage-jp .carousel-hero-jp .carousel-caption.spring-promo {
    margin-top: 110px;
  }
}
.index-homepage-jp .carousel-hero-jp .btn-stroked-light.spring-promo,
.index-homepage-jp .carousel-hero-jp .btn-green.spring-promo {
  margin-bottom: 16px;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .btn-stroked-light.spring-promo {
    margin-right: 16px;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-premium,
.index-homepage-jp .carousel-hero-jp .slide-playlists,
.index-homepage-jp .carousel-hero-jp .slide-radio {
  width: 100%;
  height: 500px;
  background: url("/i/home/jp/hero-bubbles.svg") no-repeat;
  background-size: 1650px 1114px;
  background-position: right -670px bottom -232px;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-premium,
  .index-homepage-jp .carousel-hero-jp .slide-playlists,
  .index-homepage-jp .carousel-hero-jp .slide-radio {
    background-position: left 0 bottom -272px;
  }
}
.index-homepage-jp .carousel-hero-jp .slide-premium.winter-promo,
.index-homepage-jp .carousel-hero-jp .slide-playlists.winter-promo,
.index-homepage-jp .carousel-hero-jp .slide-radio.winter-promo {
  width: 100%;
  height: 500px;
  background: url("/i/home/jp/hero-bubbles_1217.svg") no-repeat;
  background-size: 1650px 1114px;
  background-position: right -670px bottom -232px;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .slide-premium.winter-promo,
  .index-homepage-jp .carousel-hero-jp .slide-playlists.winter-promo,
  .index-homepage-jp .carousel-hero-jp .slide-radio.winter-promo {
    background-position: left 0 bottom -272px;
  }
}
.index-homepage-jp .carousel-hero-jp .carousel-indicators .active {
  background-color: #FFF;
}
.index-homepage-jp .carousel-hero-jp .carousel-indicators {
  bottom: 20px;
}
@media (min-width: 768px) {
  .index-homepage-jp .carousel-hero-jp .carousel-indicators {
    bottom: 32px;
  }
}
.index-homepage-jp .free-desc {
  background: url("/i/home/jp/peace_mobile.jpg") no-repeat;
  background-color: #509BF5;
  background-position: center right;
  background-size: cover;
}
.index-homepage-jp .free-desc .container {
  padding-top: 85px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-desc .container {
    padding-top: 195px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .free-desc {
    background: url("/i/home/jp/peace_mobile_2x.jpg") no-repeat;
    background-color: #509BF5;
    background-position: center right;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .free-desc {
    background-color: #509BF5;
    background: url("/i/home/jp/peace.jpg") no-repeat;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .free-desc {
    background: url("/i/home/jp/peace_2x.jpg") no-repeat;
    background-color: #509BF5;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .free-desc {
    background-position: center center;
    background-size: cover;
  }
}
.index-homepage-jp .free-features {
  background-color: #FFF;
  color: #000;
  padding-top: 40px;
}
.index-homepage-jp .free-features ul {
  margin: 24px 0 20px 0;
  padding: 20px 0 0 25px;
  overflow: hidden;
  border-top: 0.5px solid #000;
  border-bottom: 0.5px solid #000;
}
.index-homepage-jp .free-features li {
  font-size: 13px;
  line-height: 32px;
  padding-left: 13px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-features li {
    font-size: 16px;
    line-height: 40px;
  }
}
.index-homepage-jp .free-features p {
  font-size: 12px;
  line-height: 18px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-features p {
    font-size: 16px;
    line-height: 24px;
  }
}
.index-homepage-jp .free-features h3 {
  font-size: 12px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-features h3 {
    font-size: 18px;
  }
}
.index-homepage-jp .free-features .small {
  font-size: 10px;
}
.index-homepage-jp .free-features .phone-demo {
  text-align: center;
  position: relative;
}
.index-homepage-jp .free-features .phone-cropped-up,
.index-homepage-jp .free-features .phone-cropped-up-mobile {
  position: relative;
  bottom: -7px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-features .phone-cropped-up {
    width: 298px;
    height: 475px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .free-features .phone-cropped-up {
    width: 353px;
    height: 563px;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .free-features .phone-cropped-up-mobile {
    width: 214px;
    height: 200px;
    margin-top: 30px;
  }
}
.index-homepage-jp .free-features .free-plan-screen img {
  width: 200px;
  height: 356px;
  position: absolute;
  right: 0;
  bottom: -200px;
  left: 0;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-features .free-plan-screen img {
    width: 281px;
    height: 500px;
    bottom: -86px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .free-features .free-plan-screen img {
    width: 330px;
    height: 587px;
    bottom: -101px;
  }
}
.index-homepage-jp .free-features .btn {
  margin: 24px 0;
}
@media (max-width: 991px) {
  .index-homepage-jp .free-features .btn {
    display: block;
    width: 100%;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .free-features .btn {
    margin: 24px 0 0;
  }
}
.index-homepage-jp .free-features .spotify-free-list,
.index-homepage-jp .free-features .spotify-premium-list {
  list-style-image: url(/i/home/plan-checklist.svg);
  display: list-item;
  padding-left: 45px;
  padding-bottom: 20px;
}
@media (min-width: 768px) {
  .index-homepage-jp .free-features .spotify-free-list,
  .index-homepage-jp .free-features .spotify-premium-list {
    padding-left: 45px;
  }
}
.index-homepage-jp .free-features .spotify-free-list li:last-child,
.index-homepage-jp .free-features .spotify-premium-list li:nth-child(n+4) {
  color: #1DB954;
  font-weight: bold;
  list-style-image: url(/i/home/plan-checklist-green.svg);
}
.index-homepage-jp .free-features .spotify-free-list li:last-child svg,
.index-homepage-jp .free-features .spotify-premium-list li:nth-child(n+4) svg {
  fill: #1DB954;
}
.index-homepage-jp .free-features .modal-content {
  -webkit-box-shadow: none;
          box-shadow: none;
  background-color: transparent;
  top: 5%;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}
@media (max-width: 991px) {
  .index-homepage-jp .free-features .modal-content {
    padding: 15px;
    top: 0;
  }
}
.index-homepage-jp .free-features .modal-content .btn {
  margin: 0;
}
.index-homepage-jp .free-features .modal-header {
  text-align: center;
  padding: 0;
  border-bottom: none;
}
.index-homepage-jp .free-features .modal-body {
  padding: 20px 0 0;
  text-align: center;
}
.index-homepage-jp .free-features .modal-body h2 {
  font-family: 'Circular', Helvetica, Arial, sans-serif;
  font-weight: 700;
}
.index-homepage-jp .free-features .modal-offer-container {
  border-radius: 6px;
  text-align: left;
  padding: 20px;
  background-color: #FFF;
  vertical-align: top;
  margin-bottom: 15px;
}
@media (min-width: 992px) {
  .index-homepage-jp .free-features .modal-offer-container {
    display: inline-block;
    width: 45%;
    margin: 0 1%;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .free-features .modal-offer-container .spotify-free-list,
  .index-homepage-jp .free-features .modal-offer-container .spotify-premium-list {
    height: 400px;
    min-height: 400px;
  }
}
.index-homepage-jp .feature-desc {
  background: url("/i/home/jp/dj_mobile.jpg") no-repeat;
  background-color: #AF2896;
  background-position: center right;
  background-size: cover;
  z-index: 1;
  position: relative;
}
.index-homepage-jp .feature-desc .container {
  padding-top: 100px;
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-desc .container {
    padding-top: 190px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .feature-desc {
    background: url("/i/home/jp/dj_mobile_2x.jpg") no-repeat;
    background-color: #AF2896;
    background-position: center right;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-desc {
    background-color: #AF2896;
    background: url("/i/home/jp/dj.jpg") no-repeat;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .feature-desc {
    background: url("/i/home/jp/dj_2x.jpg") no-repeat;
    background-color: #AF2896;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .feature-desc {
    background-position: center center;
    background-size: cover;
  }
}
.index-homepage-jp .feature-desc h2 {
  margin-top: 4px;
}
.index-homepage-jp .features-basic {
  background-color: #FFF;
  color: #000;
  height: 375px;
  min-height: 375px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-basic {
    height: 370px;
    min-height: 370px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic {
    height: 485px;
    min-height: 485px;
  }
}
.index-homepage-jp .features-basic h4 {
  font-family: 'Circular', Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-basic h4 {
    font-size: 20px;
  }
}
.index-homepage-jp .features-basic p {
  font-size: 14px;
  line-height: 22px;
  margin-top: 8px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-basic p {
    font-size: 13px;
    line-height: 20px;
    margin-top: 8px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic p {
    font-size: 16px;
    line-height: 24px;
    margin-top: 12px;
  }
}
.index-homepage-jp .features-basic .position-feature {
  position: relative;
}
.index-homepage-jp .features-basic .home-feature {
  position: absolute;
  top: 120px;
  left: 15px;
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic .home-feature {
    top: 163px;
    left: 0;
  }
}
@media (min-width: 1200px) {
  .index-homepage-jp .features-basic .home-feature {
    left: 60px;
  }
}
.index-homepage-jp .features-basic .browse-feature {
  position: absolute;
  top: 235px;
  left: 30px;
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic .browse-feature {
    left: 50px;
    top: 316px;
  }
}
@media (min-width: 1200px) {
  .index-homepage-jp .features-basic .browse-feature {
    left: 150px;
    top: 335px;
  }
}
.index-homepage-jp .features-basic .search-feature {
  position: absolute;
  top: 275px;
  left: 0;
  right: 0;
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic .search-feature {
    top: 365px;
  }
}
.index-homepage-jp .features-basic .radio-feature {
  position: absolute;
  top: 235px;
  right: 24px;
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic .radio-feature {
    top: 316px;
    right: 40px;
  }
}
@media (min-width: 1200px) {
  .index-homepage-jp .features-basic .radio-feature {
    top: 335px;
    right: 150px;
  }
}
.index-homepage-jp .features-basic .library-feature {
  position: absolute;
  top: 120px;
  right: 0;
}
@media (min-width: 992px) {
  .index-homepage-jp .features-basic .library-feature {
    top: 163px;
    right: 0;
  }
}
@media (min-width: 1200px) {
  .index-homepage-jp .features-basic .library-feature {
    right: 40px;
  }
}
.index-homepage-jp .features-basic .btn-feature {
  padding-top: 200px;
}
.index-homepage-jp .features-basic .carousel-inner {
  height: 375px;
}
.index-homepage-jp .features-basic .carousel-caption {
  padding-top: 0;
  top: 190px;
}
.index-homepage-jp .features-basic .carousel-control .icon-prev,
.index-homepage-jp .features-basic .carousel-control .icon-next {
  background-image: url(/i/home/carousel-chevron-black.svg);
}
.index-homepage-jp .features-basic .carousel-control.right,
.index-homepage-jp .features-basic .carousel-control.left {
  top: 324px;
}
.index-homepage-jp .phone-ft-dktp {
  width: 214px;
  height: 157px;
  fill: #AF2896;
  position: relative;
  top: 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .phone-ft-dktp {
    width: 255px;
    height: 187px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .phone-ft-dktp {
    width: 384px;
    height: 282px;
  }
}
.index-homepage-jp .phone-ft-mobile {
  width: 214px;
  height: 157px;
  fill: #AF2896;
  position: relative;
  top: 0;
}
.index-homepage-jp .phone-ft-screen-mobile {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
}
.index-homepage-jp .home img {
  width: 202px;
  height: 179px;
  margin: 0 auto;
}
.index-homepage-jp .browse img,
.index-homepage-jp .search img,
.index-homepage-jp .radio img {
  width: 200px;
  height: 180px;
  margin: 0 auto;
}
.index-homepage-jp .library img {
  width: 203px;
  height: 181px;
  margin: 0 auto;
}
.index-homepage-jp .phone-ft-screen-dktp img {
  width: 200px;
  height: 123px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .index-homepage-jp .phone-ft-screen-dktp img {
    width: 238px;
    height: 146px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .phone-ft-screen-dktp img {
    width: 360px;
    height: 200px;
  }
}
.index-homepage-jp .phone-ft-lines-md-dktp,
.index-homepage-jp .phone-ft-lines-lg-dktp {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .index-homepage-jp .phone-ft-lines-md-dktp {
    width: 400px;
    height: 104px;
    top: 130px;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .phone-ft-lines-md-dktp {
    width: 525px;
    height: 155px;
    top: 177px;
  }
}
.index-homepage-jp .phone-ft-lines-lg-dktp {
  width: 605px;
  height: 150px;
  top: 177px;
}
.index-homepage-jp .ft-basic-toggle {
  z-index: 150;
  position: relative;
  text-align: center;
  height: 100px;
}
.index-homepage-jp .ft-basic-toggle .btn-stroked-light {
  position: relative;
  top: 36px;
}
.index-homepage-jp .addon-accordion .collapsing {
  -webkit-transition-property: none;
  transition-property: none;
  -webkit-transition-duration: none;
  transition-duration: none;
  -webkit-transition-timing-function: none;
  transition-timing-function: none;
}
.index-homepage-jp .addon-accordion .btn.btn-play:before {
  content: "\25B6";
  padding-right: 12px;
}
.index-homepage-jp .black-bg {
  background: #000;
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.index-homepage-jp .ft-basic-collapse {
  position: relative;
}
.index-homepage-jp .ft-adv-collapse p {
  margin: 20px 0 36px;
}
@media (min-width: 768px) {
  .index-homepage-jp .ft-adv-collapse p {
    margin: 16px 0 28px;
  }
}
.index-homepage-jp .features-expanded {
  color: #FFF;
}
.index-homepage-jp .features-expanded h3 {
  font-family: 'Circular', Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 20px;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded h3 {
    font-size: 40px;
    line-height: 56px;
    margin-bottom: 20px;
  }
}
.index-homepage-jp .features-expanded p {
  font-size: 14px;
  line-height: 24px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded p {
    font-size: 20px;
    line-height: 36px;
  }
}
.index-homepage-jp .features-expanded .feature-sections {
  padding-top: 25px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .feature-sections {
    padding-top: 48px;
    padding-bottom: 88px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .feature-row {
    display: -moz-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: -webkit-box;
    display: flex;
    -moz-align-items: center;
    -ms-align-items: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.index-homepage-jp .features-expanded .phone-demo {
  text-align: center;
  position: relative;
}
.index-homepage-jp .features-expanded .phone-basic {
  width: 132px;
  height: 270px;
  fill: #FFF;
  position: relative;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .phone-basic {
    width: 251px;
    height: 514px;
  }
}
@media (max-width: 767px) {
  .index-homepage-jp .features-expanded .copy {
    margin-top: 20px;
    padding-top: 40px;
    padding-bottom: 60px;
    background-color: rgba(255, 255, 255, 0.1);
  }
}
.index-homepage-jp .features-expanded .home img {
  width: 132px;
  height: 224px;
  position: absolute;
  margin: 0 auto;
  top: 30px;
  right: 0;
  left: -10.5px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .home img {
    width: 252px;
    height: 442px;
    top: 50px;
    left: -21.5px;
  }
}
.index-homepage-jp .features-expanded .browse img {
  width: 121px;
  height: 227px;
  position: absolute;
  margin: 0 auto;
  top: 30px;
  right: 0;
  left: 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .browse img {
    width: 234px;
    height: 442px;
    top: 50px;
  }
}
.index-homepage-jp .features-expanded .search img {
  width: 120px;
  height: 214px;
  position: absolute;
  margin: 0 auto;
  top: 30px;
  right: 0;
  left: 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .search img {
    width: 234px;
    height: 416px;
    top: 50px;
  }
}
.index-homepage-jp .features-expanded .radio img {
  width: 121px;
  height: 226px;
  position: absolute;
  margin: 0 auto;
  bottom: 30px;
  right: 0;
  left: 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .radio img {
    width: 234px;
    height: 438px;
    bottom: 50px;
  }
}
.index-homepage-jp .features-expanded .library img {
  width: 128px;
  height: 229px;
  position: absolute;
  margin: 0 auto;
  top: 30px;
  right: 0;
  left: 8px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .library img {
    width: 244px;
    height: 444px;
    top: 50px;
    left: 12px;
  }
}
.index-homepage-jp .features-expanded .playlist img,
.index-homepage-jp .features-expanded .share img,
.index-homepage-jp .features-expanded .lyrics img {
  width: 120px;
  height: 214px;
  position: absolute;
  margin: 0 auto;
  top: 30px;
  right: 0;
  left: 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-expanded .playlist img,
  .index-homepage-jp .features-expanded .share img,
  .index-homepage-jp .features-expanded .lyrics img {
    width: 234px;
    height: 416px;
    top: 50px;
  }
}
.index-homepage-jp .feature-adv {
  background: url("/i/home/jp/head-phones_mobile.jpg") no-repeat;
  background-color: #AF2896;
  background-position: center right;
  background-size: cover;
}
.index-homepage-jp .feature-adv .container {
  padding-top: 75px;
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-adv .container {
    padding-top: 200px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .feature-adv {
    background: url("/i/home/jp/head-phones_mobile_2x.jpg") no-repeat;
    background-color: #AF2896;
    background-position: center right;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-adv {
    background-color: #AF2896;
    background: url("/i/home/jp/head-phones.jpg") no-repeat;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .feature-adv {
    background: url("/i/home/jp/head-phones_2x.jpg") no-repeat;
    background-color: #AF2896;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .feature-adv {
    background-position: center center;
    background-size: cover;
  }
}
.index-homepage-jp .feature-adv-details {
  background-color: #FFF;
  padding-bottom: 40px;
}
.index-homepage-jp .feature-adv-details .container {
  padding-top: 45px;
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-adv-details .container {
    padding-top: 70px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-adv-details {
    padding-bottom: 45px;
  }
}
.index-homepage-jp .feature-adv-details p {
  font-size: 14px;
  line-height: 24px;
  margin-top: 0px;
  text-align: left;
}
@media (min-width: 768px) {
  .index-homepage-jp .feature-adv-details p {
    font-size: 20px;
    line-height: 36px;
    margin-top: 0px;
    text-align: center;
  }
}
.index-homepage-jp .abt-spotify {
  background: url("/i/home/jp/concert_mobile.jpg") no-repeat;
  background-color: #FFC864;
  background-position: center right;
  background-size: cover;
}
.index-homepage-jp .abt-spotify .container {
  padding-top: 54px;
}
@media (min-width: 768px) {
  .index-homepage-jp .abt-spotify .container {
    padding-top: 148px;
  }
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .abt-spotify {
    background: url("/i/home/jp/concert_mobile_2x.jpg") no-repeat;
    background-color: #FFC864;
    background-position: center right;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .abt-spotify {
    background-color: #FFC864;
    background: url("/i/home/jp/concert.jpg") no-repeat;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 768px) and only screen and (-webkit-min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min--moz-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-device-pixel-ratio: 2), (min-width: 768px) and only screen and (min-resolution: 192dpi), (min-width: 768px) and only screen and (min-resolution: 2dppx) {
  .index-homepage-jp .abt-spotify {
    background: url("/i/home/jp/concert_2x.jpg") no-repeat;
    background-color: #FFC864;
    background-position: right -240px center;
    background-size: cover;
  }
}
@media (min-width: 992px) {
  .index-homepage-jp .abt-spotify {
    background-position: center center;
    background-size: cover;
  }
}
.index-homepage-jp .abt-spotify-desc {
  padding-bottom: 52px;
  background-color: #FFF;
  z-index: 1;
  color: #000;
}
.index-homepage-jp .abt-spotify-desc .container {
  padding-top: 40px;
}
@media (min-width: 768px) {
  .index-homepage-jp .abt-spotify-desc .container {
    padding-top: 100px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .abt-spotify-desc {
    padding-bottom: 125px;
  }
}
.index-homepage-jp .abt-spotify-desc p {
  font-size: 14px;
  line-height: 24px;
  margin-top: 30px;
}
.index-homepage-jp .abt-spotify-desc p:first-of-type {
  margin-top: 24px;
}
@media (min-width: 768px) {
  .index-homepage-jp .abt-spotify-desc p {
    font-size: 20px;
    line-height: 36px;
    margin-top: 30px;
  }
  .index-homepage-jp .abt-spotify-desc p:first-of-type {
    margin-top: 12px;
  }
}
.index-homepage-jp .abt-spotify-desc p {
  margin-top: 30px;
}
.index-homepage-jp .abt-spotify-desc p:first-of-type {
  margin-top: 24px;
}
@media (min-width: 768px) {
  .index-homepage-jp .abt-spotify-desc p:first-of-type {
    margin-top: 12px;
  }
}
.index-homepage-jp .features h3 {
  font-size: 13px;
  line-height: 26px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features h3 {
    font-size: 16px;
    line-height: 28px;
  }
}
.index-homepage-jp .features p {
  font-size: 12px;
  line-height: 18px;
  margin: 10px 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .features p {
    font-size: 16px;
    line-height: 24px;
    margin: 20px 0;
  }
}
.index-homepage-jp .features .container {
  height: 620px;
  min-height: 620px;
  padding-top: 100px;
}
@media (min-width: 768px) {
  .index-homepage-jp .features .container {
    height: 608px;
    min-height: 608px;
    padding-top: 280px;
  }
}
.index-homepage-jp .diagram {
  text-align: center;
}
.index-homepage-jp .diagram h3 {
  font-weight: bold;
  font-size: 18px;
  line-height: 26px;
  margin-bottom: 8px;
}
@media (min-width: 768px) {
  .index-homepage-jp .diagram h3 {
    font-size: 24px;
    line-height: 34px;
    margin-bottom: 15px;
  }
}
.index-homepage-jp .diagram p {
  font-size: 14px;
  line-height: 22px;
}
@media (min-width: 768px) {
  .index-homepage-jp .diagram p {
    font-size: 16px;
    line-height: 24px;
  }
}
@media (min-width: 768px) {
  .index-homepage-jp .diagram .container {
    height: 594px;
    min-height: 594px;
    padding-top: 478px;
  }
}
.index-homepage-jp .features-list {
  margin-top: 0.5px solid #000;
  margin-bottom: 0.5px solid #000;
  margin: 10px 0;
  padding: 10px 0;
}
@media (min-width: 768px) {
  .index-homepage-jp .features-list {
    margin: 20px 0;
    padding: 20px 0;
  }
}
.index-homepage-jp .lets-play {
  background-color: #2D46B9;
  background: linear-gradient(145deg, #2D46B9, #509BF5, #B5B5A1);
  color: white;
  position: relative;
  overflow: hidden;
}
.index-homepage-jp .lets-play .container {
  height: 360px;
  min-height: 360px;
}
@media (min-width: 768px) {
  .index-homepage-jp .lets-play .container {
    height: 650px;
    min-height: 650px;
  }
}
.index-homepage-jp .lets-play .container {
  padding-top: 110px;
}
@media (min-width: 768px) {
  .index-homepage-jp .lets-play .container {
    padding-top: 240px;
  }
}
.index-homepage-jp .lets-play h2 {
  font-family: 'Circular', Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 40px;
  margin-bottom: 24px;
}
@media (min-width: 768px) {
  .index-homepage-jp .lets-play h2 {
    font-size: 48px;
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 1.15;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .index-homepage-jp .lets-play h2 {
    font-size: 64px;
  }
}
@media (min-width: 768px) and (min-width: 992px) {
  .index-homepage-jp .lets-play h2 {
    font-size: 80px;
  }
}
.index-homepage-jp .lets-play .container {
  position: relative;
}
.index-homepage-jp .lets-play-bubbles {
  width: 720px;
  height: 486px;
  background: url(/i/home/jp/lets-play-bubbles.svg) no-repeat;
  position: absolute;
  left: -130px;
  top: -20px;
  overflow-x: hidden;
}
@media (min-width: 768px) {
  .index-homepage-jp .lets-play-bubbles {
    width: 1650px;
    height: 1114px;
    top: -354px;
    left: -160px;
  }
}
.index-homepage-jp footer {
  z-index: 1;
}