@charset "utf-8";


/**
 * ================================================================================
 * table of Contents:
 *
 * Common Settings
 * Animation Settings
 * Colorbox Settings
 * Other Settings
 * ================================================================================
 */






/**
 * ================================================================================
 * Common Settings
 * ================================================================================
 */
.header {
  background-color: #fff;
  position: relative;
  z-index: 500;
  }
#headerNavArea {
  position: relative;
  z-index: 499;
  }
.dirpath { margin-top: 0; }
.footer { margin-top: 0 !important; }

.asobi {
  display: block;
  position: relative;
  z-index: 1;
  color: #1A1A1A;
  font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  }

  .asobi * { box-sizing: border-box; }

  .asobi .asobiInner {
    background-repeat: repeat;
    background-size: 40px auto;
    padding-top: calc(100vw * (50 / 1700));
    opacity: 0;
    visibility: hidden;
    }
  .asobi .asobiInner.active {
    opacity: 1;
    visibility: visible;
    }

/* -- Link -- */
.asobi a {
  display: inline-block;
  opacity: 1;
  transition: opacity 0.2s ease-in;
  text-decoration: none;
  }

.asobi a:hover { opacity: 0.6; }

/* -- Element -- */
.asobi .isPC { display: block; }
.asobi br.isPC,
.asobi img.isPC { display: inline-block; }
.asobi .isSP,
.asobi br.isSP, 
.asobi img.isSP { display: none; }

/* -- .wrapper -- */
.asobi .wrapper {
  width: calc(100vw * (1050 / 1700));
  margin: 0 auto;
  position: relative;
  }

/* -- .secTtl -- */
.asobi .secTtl {}

  .asobi .secTtl > span { display: block; }

/* -- .lists -- */
.asobi .lists { list-style: none; }

  .asobi .lists > li {
    padding-left: 1em;
    text-indent: -1em;
    }

/* -- .comments -- */
.asobi .comments { list-style: none; }

  .asobi .comments > li {
    padding-left: 1em;
    text-indent: -1em;
    font-size: calc(100vw * (12.5 / 1700));
    line-height: 1.4;
    }

  .asobi .comments02 { margin-top: calc(100vw * (15 / 1700)) !important; }

    .asobi .comments02 > li { font-size: calc(100vw * (12 / 1700)); }

/* -- .btns -- */
.asobi .btns {
  list-style: none;
  letter-spacing: -.40em;
  }

  .asobi .btns > li {
    display: inline-block;
    vertical-align: top;
    letter-spacing: normal;
    }

    .asobi .btns > li > a {
      display: block;
      padding: calc(100vw * (10 / 1700)) calc(100vw * (40 / 1700)) calc(100vw * (10 / 1700)) calc(100vw * (15 / 1700));
      position: relative;
      }

      .asobi .btns > li > a:after {
        content: "";
        width: 0;
        height: 0;
        margin-top: calc(100vw * (-8 / 1700));
        border-style: solid;
        border-width: calc(100vw * (8 / 1700)) 0 calc(100vw * (8 / 1700)) calc(100vw * (13 / 1700));
        border-color: transparent transparent transparent #1A1A1A;
        position: absolute;
        top: 50%;
        right: calc(100vw * (12 / 1700));
        }

      .asobi .btns > li > a > span {
        display: inline-block;
        font-size: calc(100vw * (17 / 1700));
        font-weight: bold;
        }

/* -- .icons -- */
.asobi .icons {
  margin-left: calc(100vw * (-30 / 1700));
  list-style: none;
  letter-spacing: -.40em;
  }

  .asobi .icons > li {
    display: inline-block;
    margin-left: calc(100vw * (30 / 1700));
    letter-spacing: normal;
    vertical-align: top;
    }

    .asobi .icons > li img { height: calc(100vw * (78 / 1700)); }

/* -- .apps -- */
.asobi .apps { letter-spacing: -.40em; }

  .asobi .apps > dt {
    display: block;
    margin-bottom: calc(100vw * (15 / 1700));
    font-size: calc(100vw * (18 / 1700));
    letter-spacing: normal;
    }

  .asobi .apps > dd {
    display: inline-block;
    margin-right: calc(100vw * (40 / 1700));
    letter-spacing: normal;
    vertical-align: top;
    }
  .asobi .apps > dd:nth-last-of-type(1) { margin-right: 0; }

  .asobi .apps > dd:nth-of-type(1) {}

    .asobi .apps > dd:nth-of-type(1) > ul {
      margin-left: calc(100vw * (-20 / 1700));
      list-style: none;
      letter-spacing: -.40em;
      }

      .asobi .apps > dd:nth-of-type(1) > ul > li {
        display: inline-block;
        width: calc(100vw * (205 / 1700));
        margin-left: calc(100vw * (20 / 1700));
        vertical-align: top;
        letter-spacing: normal;
        }

        .asobi .apps > dd:nth-of-type(1) > ul > li > a { display: block; }

        .asobi .apps > dd:nth-of-type(1) > ul > li img { width: 100%; }

  .asobi .apps > dd:nth-of-type(2) {}

    .asobi .apps > dd:nth-of-type(2) > p {
      font-size: calc(100vw * (12 / 1700));
      line-height: 1.8;
      }

/* -- .models -- */
.asobi .models {
  display: table;
  width: 100%;
  }

  .asobi .models > dt,
  .asobi .models > dd {
    display: table-cell;
    vertical-align: top;
    }

  .asobi .models > dt {
    width: calc(100vw * (170 / 1700));
    font-size: calc(100vw * (16 / 1700));
    font-weight: bold;
    }

  .asobi .models > dd { font-size: calc(100vw * (16 / 1700)); }

    .asobi .models > dd > ul {
      margin: calc(100vw * (-20 / 1700)) 0 0 calc(100vw * (-20 / 1700));
      list-style: none;
      letter-spacing: -.40em;
      }

      .asobi .models > dd > ul > li {
        display: inline-block;
        margin: calc(100vw * (20 / 1700)) 0 0 calc(100vw * (20 / 1700));
        letter-spacing: normal;
        vertical-align: top;
        }

        .asobi .models > dd > ul > li a {
          color: #000;
          text-decoration: underline;
          }


/**
 * Loader
 * -------------------------------
 */
  
.asobi .loader {
  background-color: #EFE0C1;
  background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_loader.gif");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 35px auto;
  width: 100%;
  /* height: calc(100% - 123px); */
  height: calc(100% + 123px);
  position: fixed;
  /* top: 123px; */
  top: 0;
  left: 0;
  z-index: 102;
  }


/**
 * Opening
 * -------------------------------
 */
  
.asobi .op {
  background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_op-bg.jpg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  width: 100%;
  /* height: calc(100% - 123px); */
  height: calc(100% + 123px);
  position: fixed;
  /* top: 123px; */
  top: 0;
  left: 0;
  z-index: 100;
  }

  /* -- .opTtl -- */
  .asobi .op .opTtl {
    width: calc(100vw * (570 / 1700));
    margin-top: calc(100vw * (260 / 1700) / -2);
    margin-left: calc(100vw * (570 / 1700) / -2);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    }

    .asobi .op .opTtl > span { display: block; }
    .asobi .op .opTtl > span:nth-of-type(1) { margin-bottom: calc(100vw * (25 / 1700)); }
    .asobi .op .opTtl > span:nth-of-type(2) { margin-bottom: calc(100vw * (35 / 1700)); }

    .asobi .opTtl img { width: 100%; }

  /* -- .opBg -- */
  .asobi .op .opBg {
    width: calc(100vw * (715 / 1700));
    height: calc(100vw * (420 / 1700));
    margin-top: calc(100vw * (450 / 1700) / -2);
    margin-left: calc(100vw * (715 / 1700) / -2);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    }

    .asobi .opBg img { width: 100%; }


/**
 * Main Visual
 * -------------------------------
 */

.asobi .mv {
  margin-bottom: calc(100vw * (85 / 1700));
  position: relative;
  }

  .asobi .mv:after {
    content: "";
    background-repeat: repeat-x;
    background-size: auto 100%;
    width: 100%;
    position: absolute;
    bottom: -1px;
    left: 0;
    z-index: 3;
    }

  /* -- .mvTtl -- */
  .asobi .mv .mvTtl {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    }

    .asobi .mv .mvTtl > span {
      display: block;
      position: absolute;
      }

      .asobi .mv .mvTtl > span img { width: 100%; }

  /* -- .mvBg -- */
  .asobi .mv .mvBg {
    position: relative;
    z-index: 1;
    }


/**
 * Lead
 * -------------------------------
 */

.asobi .lead { margin-bottom: calc(100vw * (190 / 1700)); }

  /* -- .leadInner -- */
  .asobi .lead .leadInner {}

    .asobi .lead .leadInner > dt { display: block; }

      .asobi .lead .leadInner > dt > span {
        background-repeat: no-repeat;
        background-position: 0 0;
        background-size: 100% auto;
        display: block;
        width: calc(100vw * (1492 / 1700));
        height: calc(100vw * (600 / 1700));
        margin-left: calc(100vw * (208 / 1700));
        margin-top: calc(100vw * (90 / 1700));
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        position: relative;
        }

    .asobi .lead .leadInner > dd {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-flow: row-reverse;
      }

      .asobi .lead .leadInner > dd > h2 {}

      .asobi .lead .leadInner > dd > p {
        padding-left: calc(100vw * (30 / 1700));
        font-size: calc(100vw * (23 / 1700));
        line-height: 2.2;
        }

        .asobi .lead .leadInner > dd > p > span {
          display: block;
          font-weight: bold;
          }


/**
 * Feature
 * -------------------------------
 */

.asobi .feature { padding-bottom: calc(100vw * (100 / 1700)); }

  /* -- .featureLists -- */
  .asobi .feature .featureLists {
    list-style: none;
    position: relative;
    }

    .asobi .feature .featureLists > li {
      padding-bottom: calc(100vw * (130 / 1700));
      margin-bottom: calc(100vw * (130 / 1700));
      position: relative;
      z-index: 1;
      }
    .asobi .feature .featureLists > li:nth-last-of-type(1) {
      padding-bottom: 0;
      margin-bottom: 0;
      }

      .asobi .feature .featureLists > li:after {
        content: "";
        background-position: 0 0;
        background-repeat: no-repeat;
        background-size: 100% auto;
        width: 100%;
        height: calc(100vw * (10 / 1700));
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 2;
        }
      .asobi .feature .featureLists > li:nth-last-of-type(1):after { display: none; }
      .asobi .feature .featureLists > li:nth-child(odd):after { background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_sep01.png"); }
      .asobi .feature .featureLists > li:nth-child(even):after { background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_sep02.png"); }

        .asobi .feature .featureLists > li > dl {
          position: relative;
          z-index: 1;
          }

          .asobi .feature .featureLists > li.featureListsLeft > dl > dt { float: right; }
          .asobi .feature .featureLists > li.featureListsLeft > dl > dd { float: left; }
          .asobi .feature .featureLists > li.featureListsRight > dl > dt { float: left; }
          .asobi .feature .featureLists > li.featureListsRight > dl > dd { float: right; }

          .asobi .feature .featureLists > li > dl > dt {
            display: block;
            width: calc(100vw * (680 / 1700));
            }

            .asobi .feature .featureLists > li > dl > dt .featureListsImg {
              position: relative;
              z-index: 1;
              }

              .asobi .feature .featureLists > li > dl > dt .featureListsImg:before {
                content: "";
                background-repeat: no-repeat;
                position: absolute;
                z-index: -1;
                }

            .asobi .feature .featureLists > li > dl > dt img { width: 100%; }

            .asobi .feature .featureLists > li > dl > dt .btns,
            .asobi .feature .featureLists > li > dl > dt .comments {
              display: inline-block;
              margin-top: calc(100vw * (55 / 1700));
              vertical-align: top;
              position: relative;
              z-index: 2;
              }

            .asobi .feature .featureLists > li > dl > dt .comments {
              margin-left: calc(100vw * (15 / 1700));
              padding-top: calc(100vw * (15 / 1700));
              }

            .asobi .feature .featureLists > li > dl > dt .comments02 {
              display: block;
              margin-left: 0;
              padding-top: 0;
              }
            .asobi .feature .featureLists > li.featureListsLeft > dl > dt .comments02 { text-align: right; }
            .asobi .feature .featureLists > li.featureListsRight > dl > dt .comments02 { text-align: left; }

          .asobi .feature .featureLists > li > dl > dd { display: block; }

            .asobi .feature .featureLists > li > dl > dd .featureListsTtl { margin-bottom: calc(100vw * (35 / 1700)); }
            .asobi .feature .featureLists > li.featureListsLeft > dl > dd { text-align: left; }
            .asobi .feature .featureLists > li.featureListsRight > dl > dd { text-align: right; }

              .asobi .feature .featureLists > li > dl > dd .featureListsTtl span {
                font-weight: bold;
                font-feature-settings: "palt";
                }

              .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span {
                display: block;
                margin-bottom: calc(100vw * (7 / 1700));
                font-size: calc(100vw * (35 / 1700));
                }
              .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span:nth-last-of-type(1) { margin-bottom: 0; }

                .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span > span {
                  display: inline-block;
                  padding: calc(100vw * (8 / 1700));
                  line-height: 1;
                  }

              .asobi .feature .featureLists > li > dl > dd .featureListsTxt {
                font-size: calc(100vw * (18 / 1700));
                line-height: 1.7;
                }

                .asobi .feature .featureLists > li > dl > dd .featureListsTxt > p {
                  display: inline-block;
                  text-align: left;
                  }

              .asobi .feature .featureLists > li > dl > dd .featureListsImg {}

                .asobi .feature .featureLists > li > dl > dd .featureListsImg > span { display: inline-block; }

              .asobi .feature .featureLists > li > dl > dd .featureListsIllust {}

                .asobi .feature .featureLists > li > dl > dd .featureListsIllust > span { display: inline-block; }

                .asobi .feature .featureLists > li > dl > dd .featureListsIllust img { width: 100%; }

  /* -- .featureKv -- */
  .asobi .feature .featureKv {
    background-repeat: repeat;
    background-size: 40px auto;
    padding: calc(100vw * (60 / 1700)) 0;
    margin: calc(100vw * (160 / 1700)) 0;
    position: relative;
    z-index: 2;
    }

    .asobi .feature .featureKv:before,
    .asobi .feature .featureKv:after {
      content: "";
      background-repeat: repeat-x;
      background-size: auto 100%;
      width: 100%;
      position: absolute;
      left: 0;
      }
    .asobi .feature .featureKv:before { top: -1px; }
    .asobi .feature .featureKv:after { bottom: -1px; }

    .asobi .feature .featureKv img {
      width: 100%;
      position: relative;
      z-index: 1;
      }

    .asobi .feature .featureKv > span {
      display: block;
      width: 100%;
      height: 100%;
      }

      .asobi .feature .featureKv > span:after {
        content: "";
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: 100% auto;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        }


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

.asobi .bottom {
  background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_bg01.png");
  background-repeat: repeat;
  background-size: 40px auto;
  }

  /* -- .bottomPagetop -- */
  .asobi .bottom .bottomPagetop {
    padding: calc(100vw * (90 / 1700)) 0 calc(100vw * (100 / 1700)) 0;
    background-repeat: repeat;
    background-size: 40px auto;
    position: relative;
    text-align: center;
    }

    .asobi .bottom .bottomPagetop > dl {
      display: inline-flex;
      align-items: center;
      }

      .asobi .bottom .bottomPagetop > dl > dt,
      .asobi .bottom .bottomPagetop > dl > dd {
        display: block;
        width: 50%;
        }

      .asobi .bottom .bottomPagetop > dl > dt {
        padding-right: calc(100vw * (100 / 1700));
        text-align: right;
        }

      .asobi .bottom .bottomPagetop > dl > dd {
        padding-left: calc(100vw * (170 / 1700));
        position: relative;
        text-align: left;
        }

        .asobi .bottom .bottomPagetop > dl > dd:before {
          content: "";
          background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_sep03.png");
          background-repeat: no-repeat;
          background-position: 50% 0;
          background-size: 100% auto;
          width: calc(100vw * (7 / 1700));
          height: calc(100vw * (124 / 1700));
          margin-top: calc(100vw * (-62 / 1700));
          position: absolute;
          top: 50%;
          left: calc(100vw * (-3.5 / 1700));
          }

        .asobi .bottom .bottomPagetop > dl > dd img { width: calc(100vw * (110 / 1700)); }

  /* -- .bottomKv -- */
  .asobi .bottom .bottomKv {
    padding-top: calc(100vw * (80 / 1700));
    position: relative;
    }

    .asobi .bottom .bottomKv:after {
      content: "";
      background-image: url("../../../../../files/cdb/ZZ/special/navi/asobi/common/zz_special_navi_asobi_common_mask01.png");
      background-repeat: repeat-x;
      background-size: auto 100%;
      width: 100%;
      height: calc(100vw * (12 / 1700));
      position: absolute;
      left: 0;
      top: calc(100vw * (-11 / 1700));
      }

    .asobi .bottom .bottomKv img {
      width: 100%;
      position: relative;
      z-index: 1;
      }

    .asobi .bottom .bottomKv > span {
      display: block;
      width: 100%;
      height: 100%;
      position: relative;
      }

      .asobi .bottom .bottomKv > span:after {
        content: "";
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: 100% auto;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        }

  /* -- .bottomBanner -- */
  .asobi .bottom .bottomBanner { padding: calc(100vw * (130 / 1700)) 0 calc(100vw * (150 / 1700)) 0; }

    .asobi .bottom .bottomBanner > ul {
      margin-top: calc(100vw * (-65 / 1700));
      list-style: none;
      }

      .asobi .bottom .bottomBanner > ul > li { margin-top: calc(100vw * (65 / 1700)); }

        .asobi .bottom .bottomBanner > ul > li a {
          display: block;
          border: calc(100vw * (3 / 1700)) solid #FFF;
          }

        .asobi .bottom .bottomBanner > ul > li img { width: 100%; }


/**
 * Floating
 * -------------------------------
 */

.asobi .floating {
  width: calc(100vw * (203 / 1700));
  height: calc(100vw * (203 / 1700));
  position: fixed;
  bottom: calc(100vw * (-300 / 1700));
  right: 50px;
  z-index: 100;
  transition: 0.4s ease-in;
  }
.asobi .floating.active { bottom: 50px; }

  .asobi .floating > a { display: block; }

    .asobi .floating img { width: 100%; }






/**
 * ================================================================================
 * Animation Settings
 * ================================================================================
 */
  
.animate {
  transition-property: all;
  transition-timing-function: ease-out;
  }

/* -- .animate_fade01 -- */
.asobi .animate_fade01 {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.5s;
  }
.asobi .animate_fade01.animated {
  opacity: 1;
  visibility: visible;
  }

/* -- .animate_moveX01 -- */
.asobi .animate_moveX01 {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.5s;
  -webkit-transform: translate(30px, 0);
  transform: translate(30px, 0);
  }
.asobi .animate_moveX01.animated {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  }

/* -- .animate_moveX02 -- */
.asobi .animate_moveX02 {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.5s;
  -webkit-transform: translate(-30px, 0);
  transform: translate(-30px, 0);
  }
.asobi .animate_moveX02.animated {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  }

/* -- .animate_moveY01 -- */
.asobi .animate_moveY01 {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.5s;
  -webkit-transform: translate(0, 30px);
  transform: translate(0, 30px);
  }
.asobi .animate_moveY01.animated {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  }

/* -- .animate_moveY02 -- */
.asobi .animate_moveY02 {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.5s;
  -webkit-transform: translate(0, -30px);
  transform: translate(0, -30px);
  }
.asobi .animate_moveY02.animated {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  }

/* -- ..animate_scaleX01 -- */
.asobi .animate_scaleX01 {
  visibility: hidden;
  transition-duration: 0.3s;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  }
.asobi .animate_scaleX01.animated {
  visibility: visible;
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  }

/* -- ..animate_scaleX02 -- */
.asobi .animate_scaleX02 {
  visibility: hidden;
  transition-duration: 0.3s;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: 100% 0%;
  transform-origin: 100% 0%;
  }
.asobi .animate_scaleX02.animated {
  visibility: visible;
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  }

/* -- .animate_blur01 -- */
.asobi .animate_blur01 {
  background: transparent;
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.5s;
  -webkit-filter: blur(10px);
  filter: blur(10px);
  }
.asobi .animate_blur01.animated {
  opacity: 1;
  visibility: visible;
  -webkit-filter: blur(0);
  filter: blur(0);
  }

/* -- .animate_arrow -- */
.asobi .animate_arrow01 {
  -webkit-animation: arrow01 1.4s infinite;
  animation: arrow01 1.4s infinite;
  }

@-webkit-keyframes arrow01 {
  0% {
    -webkit-transform: translate(0, 0);
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      -webkit-transform: translate(0, 20px);
      opacity: 0;
    }
  }
  @keyframes arrow01 {
    0% {
      transform: translate(0, 0);
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      transform: translate(0, 20px);
      opacity: 0;
    }
  }






/**
 * ================================================================================
 * ColorBox Settings
 * ================================================================================
 */

#cboxContent { padding: 0 !important; }

#cboxClose {
  top: 0 !important;
  right: 0 !important;
}





/**
 * ================================================================================
 * Other Settings
 * ================================================================================
 */

/* -- Clearfix -- */
.asobi .clearfix:after{
  content: " ";
  display: block;
  clear: both;
  height: 0;
  }
.asobi .clearfix { display: inline-block; }
.asobi .clearfix { display: block; }

/* -- Background Color -- */
.asobi .bgcBK { background-color: #1A1A1A !important; }
.asobi .bgcWT { background-color: #FFF !important; }
.asobi .bgcYL { background-color: #FFC800 !important; }
.asobi .bgcBL { background-color: #24A5C3 !important; }
.asobi .bgcPK { background-color: #FF7795 !important; }
.asobi .bgcGN { background-color: #80CD4E !important; }
.asobi .bgcBN { background-color: #392400 !important; }
.asobi .bgcDBN { background-color: #2C1300 !important; }
.asobi .bgcPL { background-color: #8348C0 !important; }
.asobi .bgcGL { background-color: #C6AA71 !important; }

/* -- Text Color -- */
.asobi .txcBK { color: #1A1A1A !important; }
.asobi .txcWT { color: #FFF !important; }
.asobi .txcYL { color: #FFC800 !important; }
.asobi .txcBL { color: #24A5C3 !important; }
.asobi .txcPK { color: #FF7795 !important; }
.asobi .txcGN { color: #80CD4E !important; }
.asobi .txcBN { color: #392400 !important; }
.asobi .txcDBN { color: #2C1300 !important; }
.asobi .txcPL { color: #8348C0 !important; }

/* -- Letter Spacing -- */
.asobi .lsNormal { letter-spacing: normal !important; }
.asobi .lsN001 { letter-spacing: -0.01em !important; }
.asobi .lsN002 { letter-spacing: -0.02em !important; }
.asobi .lsN003 { letter-spacing: -0.03em !important; }
.asobi .lsN004 { letter-spacing: -0.04em !important; }
.asobi .lsN005 { letter-spacing: -0.05em !important; }
.asobi .lsN006 { letter-spacing: -0.06em !important; }
.asobi .lsN007 { letter-spacing: -0.07em !important; }
.asobi .lsN008 { letter-spacing: -0.08em !important; }
.asobi .lsN009 { letter-spacing: -0.09em !important; }
.asobi .lsN010 { letter-spacing: -0.10em !important; }








@media only screen and (min-width: 768px) and (max-width: 1279px) {
  
  
/**
 * ================================================================================
 * Common Settings
 * ================================================================================
 */

.asobi .asobiInner { padding-top: calc(1280px * (50 / 1700)); }

/* -- Link -- */

/* -- Element -- */
  
/* -- .wrapper -- */
.asobi .wrapper { width: calc(1280px * (1050 / 1700)); }

/* -- .secTtl -- */
.asobi .secTtl {}

/* -- .lists -- */
.asobi .lists {}

/* -- .comments -- */
.asobi .comments {}

  .asobi .comments > li { font-size: calc(1280px * (12.5 / 1700)); }
  
.asobi .comments02 { margin-top: calc(1280px * (15 / 1700)) !important; }

    .asobi .comments02 > li { font-size: calc(1280px * (12 / 1700)); }

/* -- .btns -- */
.asobi .btns {}

  .asobi .btns > li > a { padding: calc(1280px * (10 / 1700)) calc(1280px * (40 / 1700)) calc(1280px * (10 / 1700)) calc(1280px * (15 / 1700)); }

    .asobi .btns > li > a:after {
      margin-top: calc(1280px * (-8 / 1700));
      border-width: calc(1280px * (8 / 1700)) 0 calc(1280px * (8 / 1700)) calc(1280px * (13 / 1700));
      right: calc(1280px * (12 / 1700));
      }

    .asobi .btns > li > a > span { font-size: calc(1280px * (17 / 1700)); }

/* -- .icons -- */
.asobi .icons { margin-left: calc(1280px * (-30 / 1700)); }

  .asobi .icons > li { margin-left: calc(1280px * (30 / 1700)); }

    .asobi .icons > li img { height: calc(1280px * (78 / 1700)); }

/* -- .apps -- */
.asobi .apps {}

  .asobi .apps > dt {
    margin-bottom: calc(1280px * (15 / 1700));
    font-size: calc(1280px * (18 / 1700));
    }

  .asobi .apps > dd { margin-right: calc(1280px * (40 / 1700)); }

  .asobi .apps > dd:nth-of-type(1) {}

    .asobi .apps > dd:nth-of-type(1) > ul { margin-left: calc(1280px * (-20 / 1700)); }

      .asobi .apps > dd:nth-of-type(1) > ul > li {
        width: calc(1280px * (205 / 1700));
        margin-left: calc(1280px * (20 / 1700));
        }

  .asobi .apps > dd:nth-of-type(2) {}

    .asobi .apps > dd:nth-of-type(2) > p { font-size: calc(1280px * (12 / 1700)); }

/* -- .models -- */
.asobi .models {}

  .asobi .models > dt {
    width: calc(1280px * (170 / 1700));
    font-size: calc(1280px * (16 / 1700));
    }

  .asobi .models > dd { font-size: calc(1280px * (16 / 1700)); }

    .asobi .models > dd > ul { margin: calc(1280px * (-20 / 1700)) 0 0 calc(1280px * (-20 / 1700)); }

      .asobi .models > dd > ul > li { margin: calc(1280px * (20 / 1700)) 0 0 calc(1280px * (20 / 1700)); }


/**
 * Loader
 * -------------------------------
 */
  
.asobi .loader {}
  
  
/**
 * Opening
 * -------------------------------
 */
  
.asobi .op {}

  /* -- .opTtl -- */
  .asobi .op .opTtl {
    width: calc(1280px * (570 / 1700));
    margin-top: calc(1280px * (260 / 1700) / -2);
    margin-left: calc(1280px * (570 / 1700) / -2);
    }

    .asobi .op .opTtl > span:nth-of-type(1) { margin-bottom: calc(1280px * (25 / 1700)); }
    .asobi .op .opTtl > span:nth-of-type(2) { margin-bottom: calc(1280px * (35 / 1700)); }

  /* -- .opBg -- */
  .asobi .op .opBg {
    width: calc(1280px * (715 / 1700));
    height: calc(1280px * (420 / 1700));
    margin-top: calc(1280px * (450 / 1700) / -2);
    margin-left: calc(1280px * (715 / 1700) / -2);
    }


/**
 * Main Visual
 * -------------------------------
 */

.asobi .mv { margin-bottom: calc(1280px * (85 / 1700)); }

  /* -- .mvTtl -- */
  .asobi .mv .mvTtl {}

  /* -- .mvBg -- */
  .asobi .mv .mvBg {}


/**
 * Lead
 * -------------------------------
 */

.asobi .lead { margin-bottom: calc(1280px * (190 / 1700)); }

  /* -- .leadInner -- */
  .asobi .lead .leadInner {}

    .asobi .lead .leadInner > dt {}

      .asobi .lead .leadInner > dt > span {
        width: calc(1280px * (1492 / 1700));
        height: calc(1280px * (600 / 1700));
        margin-left: calc(1280px * (208 / 1700));
        margin-top: calc(1280px * (90 / 1700));
        }
  
    .asobi .lead .leadInner > dd {}

      .asobi .lead .leadInner > dd > h2 {}

      .asobi .lead .leadInner > dd > p {
        padding-left: calc(1280px * (30 / 1700));
        font-size: calc(1280px * (23 / 1700));
        }


/**
 * Feature
 * -------------------------------
 */

.asobi .feature { padding-bottom: calc(1280px * (100 / 1700)); }

  /* -- .featureLists -- */
  .asobi .feature .featureLists {}

    .asobi .feature .featureLists > li {
      padding-bottom: calc(1280px * (130 / 1700));
      margin-bottom: calc(1280px * (130 / 1700));
      }

      .asobi .feature .featureLists > li:after { height: calc(1280px * (10 / 1700)); }

        .asobi .feature .featureLists > li > dl {}

          .asobi .feature .featureLists > li > dl > dt { width: calc(1280px * (680 / 1700)); }

            .asobi .feature .featureLists > li > dl > dt .featureListsImg {}

            .asobi .feature .featureLists > li > dl > dt .btns,
            .asobi .feature .featureLists > li > dl > dt .comments { margin-top: calc(1280px * (55 / 1700)); }
            .asobi .feature .featureLists > li > dl > dt .comments02 { text-align: left; }

              .asobi .feature .featureLists > li > dl > dt .comments {
                margin-left: calc(1280px * (15 / 1700));
                padding-top: calc(1280px * (15 / 1700));
                }

          .asobi .feature .featureLists > li > dl > dd {}

            .asobi .feature .featureLists > li > dl > dd .featureListsTtl { margin-bottom: calc(1280px * (35 / 1700)); }

              .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span {
                margin-bottom: calc(1280px * (7 / 1700));
                font-size: calc(1280px * (35 / 1700));
                }

                .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span > span { padding: calc(1280px * (8 / 1700)); }

              .asobi .feature .featureLists > li > dl > dd .featureListsTxt { font-size: calc(1280px * (18 / 1700)); }

              .asobi .feature .featureLists > li > dl > dd .featureListsImg {}

              .asobi .feature .featureLists > li > dl > dd .featureListsIllust {}

  /* -- .featureKv -- */
  .asobi .feature .featureKv {
    padding: calc(1280px * (60 / 1700)) 0;
    margin: calc(1280px * (160 / 1700)) 0;
    }


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

.asobi .bottom {}

  /* -- .bottomPagetop -- */
  .asobi .bottom .bottomPagetop { padding: calc(1280px * (90 / 1700)) 0 calc(1280px * (100 / 1700)) 0; }

    .asobi .bottom .bottomPagetop > dl {}

      .asobi .bottom .bottomPagetop > dl > dt { padding-right: calc(1280px * (100 / 1700)); }

      .asobi .bottom .bottomPagetop > dl > dd { padding-left: calc(1280px * (170 / 1700)); }

        .asobi .bottom .bottomPagetop > dl > dd:before {
          width: calc(1280px * (7 / 1700));
          height: calc(1280px * (124 / 1700));
          margin-top: calc(1280px * (-62 / 1700));
          left: calc(1280px * (-3.5 / 1700));
          }

        .asobi .bottom .bottomPagetop > dl > dd img { width: calc(1280px * (110 / 1700)); }

  /* -- .bottomKv -- */
  .asobi .bottom .bottomKv { padding-top: calc(1280px * (80 / 1700)); }

    .asobi .bottom .bottomKv:after {
      height: calc(1280px * (12 / 1700));
      top: calc(1280px * (-12 / 1700));
      }

  /* -- .bottomBanner -- */
  .asobi .bottom .bottomBanner { padding: calc(1280px * (130 / 1700)) 0 calc(1280px * (150 / 1700)) 0; }

    .asobi .bottom .bottomBanner > ul { margin-top: calc(1280px * (-65 / 1700)); }

      .asobi .bottom .bottomBanner > ul > li { margin-top: calc(1280px * (65 / 1700)); }

        .asobi .bottom .bottomBanner > ul > li a { border: calc(1280px * (3 / 1700)) solid #FFF; }
  
  
/**
 * Floating
 * -------------------------------
 */

.asobi .floating {
  width: calc(1280px * (203 / 1700));
  height: calc(1280px * (203 / 1700));
  bottom: calc(1280px * (-300 / 1700));
  }
  
  
}








@media only screen and (min-width: 0px) and (max-width: 767px) {
  
  
/**
 * ================================================================================
 * Common Settings
 * ================================================================================
 */ 
    
#headerNavArea {
  position: absolute;
  z-index: 500;
  }

.asobi { font-size: calc(100vw * (24 / 640)); }
  
  .asobi .asobiInner { padding-top: calc(100vw * (40 / 640)); }

 /* -- Link -- */
.asobi a:hover,
.asobi a:hover img { opacity: 1; } 

/* -- Image -- */
.asobi img { width: 100%; }
  
/* -- Element -- */
.asobi .isPC,
.asobi br.isPC,
.asobi img.isPC { display: none; }
.asobi .isSP { display: block; }
.asobi br.isSP,
.asobi img.isSP { display: inline-block; }

/* -- .wrapper -- */
.asobi .wrapper {
  width: 100%;
  padding: 0 15px;
  }

/* -- .secTtl -- */
.asobi .secTtl {}

/* -- .lists -- */
.asobi .lists {}

/* -- .comments -- */
.asobi .comments {}

  .asobi .comments > li { font-size: calc(100vw * (20 / 640)); }
  
.asobi .comments02 { margin-top: calc(100vw * (20 / 640)) !important; }

    .asobi .comments02 > li { font-size: calc(100vw * (16 / 640)); }
  
/* -- .btns -- */
.asobi .btns {}

  .asobi .btns > li {}

    .asobi .btns > li > a { padding: calc(100vw * (10 / 640)) calc(100vw * (40 / 640)) calc(100vw * (10 / 640)) calc(100vw * (20 / 640)); }

      .asobi .btns > li > a:after {
        margin-top: calc(100vw * (-10 / 640));
        border-width: calc(100vw * (10 / 640)) 0 calc(100vw * (10 / 640)) calc(100vw * (16 / 640));
        right: calc(100vw * (12 / 640));
        }

      .asobi .btns > li > a > span { font-size: calc(100vw * (22 / 640)); }
  
/* -- .icons -- */
.asobi .icons { margin-left: calc(100vw * (-20 / 640)); }

  .asobi .icons > li { margin-left: calc(100vw * (20 / 640)); }

    .asobi .icons > li img {
      width: auto;
      height: calc(100vw * (78 / 640));
      }

/* -- .apps -- */
.asobi .apps { padding: 0 calc(100vw * (20 / 640)); }

  .asobi .apps > dt {
    margin-bottom: calc(100vw * (20 / 640));
    font-size: calc(100vw * (22 / 640));
    text-align: center;
    }

  .asobi .apps > dd {
    display: block;
    margin-right: 0;
    }

    .asobi .apps > dd:nth-of-type(1) > ul {
      margin-left: -10px;
      text-align: center;
      }

      .asobi .apps > dd:nth-of-type(1) > ul > li {
        width: 45%;
        margin-left: calc(100vw * (20 / 640));
        }

  .asobi .apps > dd:nth-of-type(2) { margin-top: calc(100vw * (30 / 640)); }

    .asobi .apps > dd:nth-of-type(2) > p {
      font-size: calc(100vw * (20 / 640));
      line-height: 1.4;
      }

/* -- .models -- */
.asobi .models { padding: 0 calc(100vw * (20 / 640)); }

  .asobi .models > dt,
  .asobi .models > dd { display: block; }

  .asobi .models > dt {
    width: 100%;
    margin-bottom: calc(100vw * (20 / 640));
    font-size: calc(100vw * (22 / 640));
    }

  .asobi .models > dd { font-size: calc(100vw * (22 / 640)); }

    .asobi .models > dd > ul { margin: calc(100vw * (-4 / 640)) 0 0 0; }

      .asobi .models > dd > ul > li {
        width: 100%;
        margin: calc(100vw * (4 / 640)) 0 0 0;
        }


/**
 * Loader
 * -------------------------------
 */
  
.asobi .loader {
  background-size: 30px auto;
  /* height: calc(100% - 50px);
  top: 50px; */
  height: calc(100% + 50px);
  top: 0;
  }
  
  
/**
 * Opening
 * -------------------------------
 */
  
.asobi .op {
  /* height: calc(100% - 50px);
  top: 50px; */
  height: calc(100% + 50px);
  top: 0;
  }

  /* -- .opTtl -- */
  .asobi .op .opTtl {
    width: calc(100vw * (570 / 640) * 0.8);
    margin-top: calc(100vw * (260 / 640) / -2 * 0.8);
    margin-left: calc(100vw * (570 / 640) / -2 * 0.8);
    }

    .asobi .op .opTtl > span:nth-of-type(1) { margin-bottom: calc(100vw * (25 / 640) * 0.8); }
    .asobi .op .opTtl > span:nth-of-type(2) { margin-bottom: calc(100vw * (35 / 640) * 0.8); }

  /* -- .opBg -- */
  .asobi .op .opBg {
    width: calc(100vw * (715 / 640) * 0.8);
    height: calc(100vw * (420 / 640) * 0.8);
    margin-top: calc(100vw * (450 / 640) / -2 * 0.8);
    margin-left: calc(100vw * (715 / 640) / -2 * 0.8);
    }


/**
 * Main Visual
 * -------------------------------
 */

.asobi .mv { margin-bottom: calc(100vw * (70 / 640)); }

  /* -- .mvTtl -- */
  .asobi .mv .mvTtl {}

  /* -- .mvBg -- */
  .asobi .mv .mvBg {}


/**
 * Lead
 * -------------------------------
 */

.asobi .lead { margin-bottom: calc(100vw * (100 / 640)); }

  /* -- .leadInner -- */
  .asobi .lead .leadInner {}

    .asobi .lead .leadInner > dt {}

      .asobi .lead .leadInner > dt > span {
        width: 100%;
        height: calc(100vw * (300 / 640));
        margin-left: calc(100vw * (30 / 640));
        margin-top: calc(100vw * (50 / 640));
        }

      .asobi .lead .leadInner > dt img { width: 100%; }

    .asobi .lead .leadInner > dd { display: block; }

      .asobi .lead .leadInner > dd > h2 { margin: 0 auto calc(100vw * (40 / 640)) auto; }

      .asobi .lead .leadInner > dd > p {
        padding-left: 0;
        font-size: calc(100vw * (24 / 640));
        line-height: 2;
        text-align: center;
        }


/**
 * Feature
 * -------------------------------
 */

.asobi .feature { padding-bottom: calc(100vw * (100 / 640)); }

  /* -- .featureLists -- */
  .asobi .feature .featureLists { padding: 0 calc(100vw * (20 / 640)); }

    .asobi .feature .featureLists > li {
      padding-bottom: calc(100vw * (80 / 640));
      margin-bottom: calc(100vw * (60 / 640));
      }

      .asobi .feature .featureLists > li:after {
        background-size: 100% 70%;
        height: calc(100vw * (10 / 640));
        }

        .asobi .feature .featureLists > li > dl {}

          .asobi .feature .featureLists > li.featureListsLeft > dl > dt,
          .asobi .feature .featureLists > li.featureListsLeft > dl > dd,
          .asobi .feature .featureLists > li.featureListsRight > dl > dt,
          .asobi .feature .featureLists > li.featureListsRight > dl > dd { float: none; }

          .asobi .feature .featureLists > li > dl > dt {
            width: 100% !important;
            margin-top: calc(100vw * (40 / 640));
            }

            .asobi .feature .featureLists > li > dl > dt .btns,
            .asobi .feature .featureLists > li > dl > dt .comments {
              display: block;
              margin-top: calc(100vw * (40 / 640));
              }

            .asobi .feature .featureLists > li > dl > dt .comments {
              margin-left: 0;
              margin-top: calc(100vw * (20 / 640));
              padding-top: 0;
              }
  
            .asobi .feature .featureLists > li.featureListsLeft > dl > dt .comments02,
            .asobi .feature .featureLists > li.featureListsRight > dl > dt .comments02 { text-align: left; }

          .asobi .feature .featureLists > li > dl > dd {}

            .asobi .feature .featureLists > li > dl > dd .featureListsTtl { margin-bottom: calc(100vw * (40 / 640)); }
            .asobi .feature .featureLists > li.featureListsLeft > dl > dd { text-align: left; }
            .asobi .feature .featureLists > li.featureListsRight > dl > dd { text-align: left; }
  
              .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span {
                margin-bottom: calc(100vw * (6 / 640));
                font-size: calc(100vw * (36 / 640));
                }

                .asobi .feature .featureLists > li > dl > dd .featureListsTtl > span > span { padding: calc(100vw * (8 / 640)); }

              .asobi .feature .featureLists > li > dl > dd .featureListsTxt {
                padding-left: 0 !important;
                padding-right: 0 !important;
                font-size: calc(100vw * (24 / 640));
                line-height: 1.6;
                }
  
              .asobi .feature .featureLists > li > dl > dd .featureListsIllust {
                width: 100%;
                position: absolute;
                top: 0;
                left: 0;
                }
  
                .asobi .feature .featureLists > li > dl > dd .featureListsIllust > span {
                  margin: 0 !important;
                  position: absolute;
                  }

  /* -- .featureKv -- */
  .asobi .feature .featureKv {
    padding: calc(100vw * (50 / 640)) 0;
    margin: calc(100vw * (120 / 640)) 0;
    }

    .asobi .feature .featureKv:before,
    .asobi .feature .featureKv:after { height: calc(100vw * (10 / 640)); }
  
    .asobi .feature .featureKv:before { top: 0; }
    .asobi .feature .featureKv:after { bottom: 0; }
  
      .asobi .feature .featureKv > span:after { background-size: 160% auto; }


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

.asobi .bottom {}

  /* -- .bottomPagetop -- */
  .asobi .bottom .bottomPagetop { padding: calc(100vw * (70 / 640)) 0 calc(100vw * (90 / 640)) 0; }

    .asobi .bottom .bottomPagetop > dl { justify-content: center; }
  
      .asobi .bottom .bottomPagetop > dl > dt,
      .asobi .bottom .bottomPagetop > dl > dd { width: auto; }

      .asobi .bottom .bottomPagetop > dl > dt { padding-right: calc(100vw * (50 / 640)); }

      .asobi .bottom .bottomPagetop > dl > dd { padding-left: calc(100vw * (50 / 640)); }

        .asobi .bottom .bottomPagetop > dl > dd:before {
          width: calc(100vw * (7 / 640));
          height: calc(100vw * (124 / 640));
          margin-top: calc(100vw * (-62 / 640));
          left: calc(100vw * (-3.5 / 640));
          }

        .asobi .bottom .bottomPagetop > dl > dd img { width: calc(100vw * (220 / 640) * 0.35); }

  /* -- .bottomKv -- */
  .asobi .bottom .bottomKv { padding-top: 40px; }

    .asobi .bottom .bottomKv:after {
      height: calc(100vw * (10 / 640));
      top: calc(100vw * (-10 / 640));
      }
  
      .asobi .bottom .bottomKv > span:after {
        background-position: 50% calc(100vw * (-35 / 640));
        background-size: 160% auto;
        }

  /* -- .bottomBanner -- */
  .asobi .bottom .bottomBanner { padding: calc(100vw * (80 / 640)) 0 calc(100vw * (100 / 640)) 0; }

    .asobi .bottom .bottomBanner > ul { margin-top: calc(100vw * (-30 / 640)); }

      .asobi .bottom .bottomBanner > ul > li { margin-top: calc(100vw * (30 / 640)); }

        .asobi .bottom .bottomBanner > ul > li a { border: 1px solid #FFF; }
  
  
  
/**
 * Floating
 * -------------------------------
 */

.asobi .floating {
  width: calc(100vw * (203 / 640));
  height: calc(100vw * (203 / 640));
  bottom: calc(100vw * (-300 / 640));
  right: 10px;
  }
  .asobi .floating.active { bottom: 55px; }

  
  
  

  
/**
 * ================================================================================
 * Animation Settings
 * ================================================================================
 */
  
/* -- .animate_moveX01 -- */
.asobi .animate_moveX01 {
  -webkit-transform: translate(15px, 0);
  transform: translate(15px, 0);
  }

/* -- .animate_moveX02 -- */
.asobi .animate_moveX02 {
  -webkit-transform: translate(-15px, 0);
  transform: translate(-15px, 0);
  }

/* -- .animate_moveY01 -- */
.asobi .animate_moveY01 {
  -webkit-transform: translate(0, 15px);
  transform: translate(0, 15px);
  }

/* -- .animate_moveY02 -- */
.asobi .animate_moveY02 {
  -webkit-transform: translate(0, -15px);
  transform: translate(0, -15px);
  }
  
/* -- ..animate_scaleX02 -- */
.asobi .animate_scaleX02 {
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  }

/* -- .animate_arrow -- */
@-webkit-keyframes arrow01 {
  0% {
    -webkit-transform: translate(0, 0);
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      -webkit-transform: translate(0, 10px);
      opacity: 0;
    }
  }
  @keyframes arrow01 {
    0% {
      transform: translate(0, 0);
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
    100% {
      transform: translate(0, 10px);
      opacity: 0;
    }
  }
  
  
  
  
  
  
/**
 * ================================================================================
 * Colorbox Settings
 * ================================================================================
 */


  

  
  
/**
 * ================================================================================
 * Other Settings
 * ================================================================================
 */

/* -- Letter Spacing -- */
.asobi .lsNormalSP { letter-spacing: normal !important; }
.asobi .lsN001SP { letter-spacing: -0.01em !important; }
.asobi .lsN002SP { letter-spacing: -0.02em !important; }
.asobi .lsN003SP { letter-spacing: -0.03em !important; }
.asobi .lsN004SP { letter-spacing: -0.04em !important; }
.asobi .lsN005SP { letter-spacing: -0.05em !important; }
.asobi .lsN006SP { letter-spacing: -0.06em !important; }
.asobi .lsN007SP { letter-spacing: -0.07em !important; }
.asobi .lsN008SP { letter-spacing: -0.08em !important; }
.asobi .lsN009SP { letter-spacing: -0.09em !important; }
.asobi .lsN010SP { letter-spacing: -0.10em !important; }

  
}