@charset "UTF-8";
/* ==============================================================
*  base
* ============================================================ */
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

h1 {
  font-size: inherit;
  margin: 0;
}

hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button, input {
  overflow: visible;
}

button, select {
  text-transform: none;
}

[type=button], [type=reset], [type=submit], button {
  -webkit-appearance: button;
}

[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type=checkbox], [type=radio] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}


body {
  word-wrap: break-word;
}

section, main {
  display: block;
}

*, *::before, *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
  outline: none;
}

i, em {
  font-style: normal;
}

table {
  border-collapse: collapse;
}

li {
  list-style: none;
}

img {
  max-width: 100%;
  line-height: 0;
}

* {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

/*   ==============================================================
*  contents
* ============================================================ */
/* common.scss
============================== */
html, body {
  height: 100%;
}

body {
  background: linear-gradient(-45deg, #5626c3, #0e1b61);
  color: #fff;
  font-family: YakuHanJP, -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.8;
  word-wrap: break-word;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  line-height: 0;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

.btn {
  text-align: center;
}

.btn-base-style, .btn--sub, .btn--main {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: inline-block;
  border-radius: 3em;
  font-size: 1.1em;
  border: none;
  cursor: pointer;
}

.btn--main {
  background: #063691;
  margin: 1em 0;
  padding: 1.4em 2em;
  color: #fff;
  font-style: normal;
}
@media screen and (min-width: 756px) and (max-width: 961px) {
  .btn--main {
    min-width: 50%;
  }
}

.btn--sub {
  font-family: din-2014, sans-serif;
  margin: 2em 0 1em;
  padding: 1em 2em;
  color: #fff;
  font-style: normal;
  border: 1px solid;
}
@media screen and (min-width: 756px) and (max-width: 961px) {
  .btn--sub {
    min-width: 50%;
  }
}

.txt--link a {
  text-decoration: underline;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.txt--link a:hover {
  text-decoration: none;
}

.txt--basic {
  margin: 0 0 1em;
}

.txt--sub {
  font-size: 0.85em;
  line-height: 1.8em;
}

.date {
  display: inline-block;
  font-family: "din-2014", sans-serif;
}

.center {
  text-align: center;
}

.bold {
  font-weight: bold;
}

.flex--horizontal {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
  align-items: stretch;
}

.ph, .thumb {
  position: relative;
  line-height: 0;
}
.ph img, .thumb img {
  width: 100%;
}
.ph .dummy, .thumb .dummy {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.list--info {
  opacity: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform: translateY(60px);
          transform: translateY(60px);
}
.list--info.started {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.list--info li {
  position: relative;
  padding: 15px 0;
}
.list--info li:last-of-type .block--txt {
  border-bottom: 0;
}
.list--info li a {
  display: block;
}
.list--info li a:hover {
  opacity: 0.5;
}
.list--info li.new .date {
  position: relative;
}
.list--info li.new .date::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  background: #c00;
  border-radius: 6px;
  position: absolute;
  top: 0;
  left: 6.2em;
}
.list--info .block--tit {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
  align-items: stretch;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  cursor: pointer;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.list--info .date {
  width: 20%;
  font-size: 13px;
  letter-spacing: 0.15em;
}
.list--info .tit {
  width: 80%;
}
.list--info .block--txt {
  display: none;
  line-height: 2;
  border-bottom: 1px solid #313b54;
  padding: 40px 0;
  margin-bottom: 50px;
}
.list--info .block--txt img {
  display: block;
  width: 80%;
  margin: 30px auto;
}

.list--bnr {
  width: 100%;
}
.list--bnr li.slick-slide {
  width: 22vw;
  margin: 0 8px;
}
.list--bnr li.slick-slide img {
  border-radius: 7px;
}
.list--bnr.single li {
  width: 22vw;
}
.list--bnr .slick-dots li {
  width: 15px;
  height: 15px;
  margin: 0 2px;
}
.list--bnr .slick-dots li button:before {
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  content: "";
  color: transparent;
  opacity: 0.27;
  background-color: #DCDFE5;
  border-radius: 50%;
}
.list--bnr .slick-dots li.slick-active button:before {
  opacity: 1;
}
.list--bnr .slick-prev:before,
.list--bnr .slick-next:before {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  opacity: 1;
}
.list--bnr .slick-prev:before {
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.list--bnr .slick-next:before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
footer {
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
}
footer .copyright {
  opacity: 0.5;
  position: relative;
  /*
  bottom: 30px;
  */
}

.wrap {
  background: linear-gradient(-45deg, #5626c3, #0e1b61);
  padding: 100px 0 150px;
  overflow: hidden;
  min-height: 100%;
  position: relative;
}

.section-tit {
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 40px;
}

@-webkit-keyframes lineBg {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  50% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  50.0001% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  70% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  100% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
}

@keyframes lineBg {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  50% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  50.0001% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  70% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
  100% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
  }
}
@-webkit-keyframes roll {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(720deg);
            transform: rotate(720deg);
  }
}
@keyframes roll {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(720deg);
            transform: rotate(720deg);
  }
}
.page--home {
  background: #030c24;
  color: #dadbe2;
  /*  animation
   ------------------------------ */
}
.page--home .wrap {
  color: #fff;
  background: none;
  padding: 0 0 0vw;
}
.page--home .wrap .bg::before {
  content: "";
  display: block;
  width: 100%;
  height: 100vh;
  background: url(/static/livestreamapp/assets/top/ph_main.jpg) no-repeat center;
  background-size: cover;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}
.page--home .wrap .bg::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #001a3e;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: -1;
}
.page--home section {
  position: relative;
}
.page--home .section--top {
  height: 110vh;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
  align-items: stretch;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  z-index: 3;
}
.page--home .section--top .inner {
  position: relative;
  z-index: 2;
}
.page--home .section--top .block--logo {
  color: #fff;
  margin-bottom: 15px;
}
.page--home .section--top .block--logo .logo {
  width: 80%;
  margin: 0 auto 30px;
}
.page--home .section--top .block--logo__lead {
  font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 900;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  line-height: 1;
  text-align: center;
  letter-spacing: 0;
  margin-bottom: 10px;
}
.page--home .section--top .block--logo__lead.txt--en {
  line-height: 1.5;
}
.page--home .section--top .block--text {
  font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 900;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-size: 15px;
  text-align: center;
}
.page--home .section--top .block--text .lead {
  font-weight: 700;
  font-size: 18px;
  line-height: 1.6;
}
.page--home .section--top .block--text .lead span {
  display: inline-block;
  font-size: 25px;
  line-height: 1;
  padding: 0 4px;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
}
.page--home .section--top .block--text .lead span em {
  display: inline-block;
  font-weight: 900;
  font-size: 35px;
  position: relative;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.page--home .section--top .block--text .lead span.lead__sub {
  line-height: 1.5;
}
.page--home .section--top .block--text .comment-wrap .comment-wrap__sub {
  opacity: 0;
  margin-bottom: 0;
  vertical-align: bottom;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.page--home .section--top .thumb {
  position: relative;
  top: 85vh;
  line-height: 1.8;
}
.page--home .section--program {
  position: relative;
  z-index: 10;
}
.page--home .section--program .box--tit {
  font-family: "din-2014", sans-serif;
  position: relative;
}
.page--home .section--program .box--tit .section-tit {
  font-size: 22px;
  letter-spacing: 0.15em;
  margin-bottom: 30px;
}
.page--home .section--program .box--tit .list__more {
  display: inline-block;
}
.page--home .section--program .box--tit .list__more a {
  display: block;
  letter-spacing: 0.05em;
  font-size: 13px;
  line-height: 1;
  position: relative;
}
.page--home .section--program .box--tit .list__more a:hover::after {
  -webkit-transform-origin: right;
          transform-origin: right;
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}
.page--home .section--program .box--tit .list__more a::after {
  content: "";
  display: block;
  background: #fff;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: -6px;
  left: 0;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
  transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
  -webkit-transform-origin: left;
          transform-origin: left;
}
.page--home .section--program .inner {
  width: 100%;
}
.page--home .section--info {
  background: #030c24;
}
.page--home .section--info::before, .page--home .section--info::after {
  content: "";
  display: block;
  width: 200%;
  height: 50vw;
  background: #030c24;
  position: absolute;
  top: 5vw;
  left: -80%;
  z-index: 1;
  -webkit-transform: rotate(-7deg);
          transform: rotate(-7deg);
}
.page--home .section--info::after {
  height: 20vw;
  top: inherit;
  bottom: -12vw;
}
.page--home .section--info .inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
  align-items: stretch;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background: #030c24;
  padding: 18vw 20% 150px;
  position: relative;
  z-index: 2;
}
.page--home .section--info .box--tit {
  width: 30%;
  font-family: "din-2014", sans-serif;
}
.page--home .section--info .box--tit .section-tit {
  font-size: 22px;
  letter-spacing: 0.15em;
  margin-bottom: 30px;
}
.page--home .section--info .box--tit .list__more {
  display: inline-block;
}
.page--home .section--info .box--tit .list__more a {
  display: block;
  letter-spacing: 0.05em;
  font-size: 13px;
  line-height: 1;
  position: relative;
}
.page--home .section--info .box--tit .list__more a:hover::after {
  -webkit-transform-origin: right;
          transform-origin: right;
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}
.page--home .section--info .box--tit .list__more a::after {
  content: "";
  display: block;
  background: #fff;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: -6px;
  left: 0;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
  transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
  -webkit-transform-origin: left;
          transform-origin: left;
}
.page--home .section--info .box--info {
  width: 70%;
}
.page--home .section--contents {
  position: relative;
  padding: 30vw 10% 0;
  position: relative;
  z-index: 2;
}
.page--home .section--contents [class^=block--contents] {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 20vw;
}
.page--home .section--contents [class^=block--contents].started .box--lead .box-tit {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.page--home .section--contents [class^=block--contents].started .box--lead .txt {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
}
.page--home .section--contents [class^=block--contents].started .bg__circle {
  opacity: 0.5;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.page--home .section--contents [class^=block--contents].started .box--figure {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}
.page--home .section--contents [class^=block--contents] .box--lead {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 50%;
  min-height: 32vw;
  position: relative;
}
.page--home .section--contents [class^=block--contents] .box--figure {
  width: 50%;
  position: relative;
  opacity: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.page--home .section--contents [class^=block--contents] .box--lead .box-tit {
  opacity: 0;
  position: relative;
  z-index: 3;
  font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 900;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-size: 40px;
  line-height: 1.3;
  letter-spacing: 0.05rem;
  margin-bottom: 30px;
  -webkit-transform: translateY(60px);
          transform: translateY(60px);
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.page--home .section--contents [class^=block--contents] .box--lead .txt {
  opacity: 0;
  position: relative;
  z-index: 3;
  letter-spacing: 0.05rem;
  -webkit-transform: translateY(60px);
          transform: translateY(60px);
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.page--home .section--contents .bg__circle {
  width: 30vw;
  height: 30vw;
  position: absolute;
  top: 0;
  left: calc(50% - 15vw);
  z-index: 1;
  opacity: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.page--home .section--contents .bg__circle::before, .page--home .section--contents .bg__circle::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: no-repeat center;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
}
.page--home .section--contents .bg__circle::before {
  background-image: url(/static/livestreamapp/assets/top/ico__mark__play.svg);
}
.page--home .section--contents .bg__circle::after {
  background-image: url(/static/livestreamapp/assets/top/ico__mark__circle.svg);
  -webkit-animation: roll 18s linear 1s infinite;
          animation: roll 18s linear 1s infinite;
}
.page--home .section--contents .block--contents__1st .box--figure,
.page--home .section--contents .block--contents__3rd .box--figure {
  -webkit-transform: translateX(5vw);
          transform: translateX(5vw);
}
.page--home .section--contents .block--contents__2nd .box--figure {
  -webkit-transform: translateX(-5vw);
          transform: translateX(-5vw);
}
.page--home .section--contents .block--contents__2nd .box--figure figure,
.page--home .section--contents .block--contents__3rd .box--figure figure {
  width: 50%;
  margin: 0 auto;
}
.page--home .section--contents .block--contents__3rd {
  margin-bottom: 6vw;
}
.page--home .section--download {
  position: relative;
  z-index: 2;
  margin-top: 20vw;
}
.page--home .section--download.before {
  margin-bottom: 0;
}
.page--home .section--download.before .block--download .txt {
  font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-size: 23px;
  text-align: center;
}
.page--home .section--download.before .block--download + .thumb {
  margin-top: 20px;
}
.page--home .section--download::before {
  content: "";
  display: block;
  width: 200%;
  height: 125%;
  background: linear-gradient(45deg, #2c70cB 0%, #491f8d 100%);
  position: absolute;
  top: -15vw;
  left: -80%;
  z-index: 1;
  -webkit-transition: 1.5s;
  transition: 1.5s;
  -webkit-transform-origin: right;
          transform-origin: right;
  -webkit-transform: rotate(-7deg) scaleX(0);
          transform: rotate(-7deg) scaleX(0);
}
.page--home .section--download.started::before {
  -webkit-transform: rotate(-7deg) scaleX(1);
          transform: rotate(-7deg) scaleX(1);
}
.page--home .section--download.started .inner {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.page--home .section--download .inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-around;
  -ms-flex-align: stretch;
  -webkit-box-align: stretch;
  align-items: stretch;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 80%;
  margin: 0 auto;
  padding: 60px 20% 0;
  position: relative;
  z-index: 2;
  opacity: 0;
  -webkit-transform: translateY(60px);
          transform: translateY(60px);
  -webkit-transition: 0.6s;
  transition: 0.6s;
}
.page--home .section--download .block--logo {
  width: 70%;
  margin-bottom: 30px;
}
.page--home .section--download .block--logo .lead {
  font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-size: 30px;
  text-align: center;
}
.page--home .section--download .thumb {
  width: 70%;
  margin: 0 auto 40px;
}
.page--home .list--device {
  width: 100%;
  font-size: 12px;
  background: #343392;
  font-weight: normal;
  letter-spacing: 0.08em;
  padding: 30px;
  margin-bottom: 15px;
}
.page--home .list--device dt {
  font-family: din-2014, sans-serif;
  font-size: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  padding-bottom: 3px;
  margin-bottom: 5px;
  letter-spacing: 0.08em;
  line-height: 1;
}
.page--home .list--device dd:first-of-type {
  margin-bottom: 25px;
}
.page--home .list--device + .txt--sub {
  font-size: 10px;
}
.page--home .howto__btn {
  width: 70%;
  margin-top: 1em;
}
.page--home .header .drawer__btn {
  opacity: 0;
  -webkit-transform: translateY(-90px);
          transform: translateY(-90px);
}
.page--home .section--top .block--text {
  position: absolute;
  width: 100%;
  top: 43vh;
}
.page--home .section--top .block--text .comment-wrap,
.page--home .section--top .block--text .lead__sub {
  display: block;
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
  -webkit-transition: 0.5s ease-out;
  transition: 0.5s ease-out;
}
.page--home .section--top .block--text .comment-wrap em {
  -webkit-transform: translateY(1em);
          transform: translateY(1em);
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.page--home .section--top .block--logo {
  text-align: center;
  -webkit-transition: 0.4s ease-out;
  transition: 0.4s ease-out;
  -webkit-transform: translateY(20vh);
          transform: translateY(20vh);
  position: absolute;
  width: 100%;
}
.page--home .section--top .block--logo .logo {
  overflow: hidden;
  display: block;
}
.page--home .section--top .block--logo .logo img {
  display: block;
  -webkit-transform: translateY(11vw);
          transform: translateY(11vw);
  -webkit-transition: 0.6s ease-out;
  transition: 0.6s ease-out;
}
.page--home .section--top .block--logo__lead {
  display: inline-block;
  position: relative;
  overflow: hidden;
}
.page--home .section--top .block--logo__lead span {
  display: block;
  -webkit-transform: translateY(1.5em);
          transform: translateY(1.5em);
  -webkit-transition: 0.4s ease-out;
  transition: 0.4s ease-out;
}
.page--home .section--top .block--logo__lead::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: left;
          transform-origin: left;
  position: absolute;
  top: 0;
  left: 0;
}
.page--home .section--top .thumb {
  opacity: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform: translateY(80px);
          transform: translateY(80px);
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
  position: absolute;
  left: 0;
  top: 70vh;
}
.page--home .section--info {
  opacity: 0;
}
.page--home .section--info::before {
  -webkit-transform: rotate(-7deg) scaleX(0);
          transform: rotate(-7deg) scaleX(0);
  -webkit-transform-origin: left;
          transform-origin: left;
  -webkit-transition: 0.5s ease-out;
  transition: 0.5s ease-out;
}
.page--home .bg::before {
  opacity: 0;
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
  -webkit-transition: 1.2s cubic-bezier(0.1, 0.65, 0.58, 1);
  transition: 1.2s cubic-bezier(0.1, 0.65, 0.58, 1);
}
.page--home.loaded .bg::before {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.page--home.loaded .bg::after {
  opacity: 0.7;
  -webkit-transition: 0.5s ease-out 0.3s;
  transition: 0.5s ease-out 0.3s;
  z-index: 1;
}
.page--home.loaded .section--top .block--logo .logo img {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.page--home.loaded .section--top .block--logo__lead::after {
  -webkit-animation: lineBg 0.5s linear 0.7s forwards;
          animation: lineBg 0.5s linear 0.7s forwards;
}
.page--home.loaded .section--top .block--logo__lead span {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}
.page--home.loaded .section--top .block--logo {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}
.page--home.loaded .section--top .block--text .comment-wrap {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}
.page--home.loaded .section--top .block--text .comment-wrap em {
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}
.page--home.loaded .section--top .block--text .comment-wrap .comment-wrap__sub {
  opacity: 1;
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}
.page--home.loaded .section--top .block--text .lead__sub {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}
.page--home.loaded .header .drawer__btn {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: opacity 0.6s ease-out 1.8s, -webkit-transform 0.6s ease-out 1.8s;
  transition: opacity 0.6s ease-out 1.8s, -webkit-transform 0.6s ease-out 1.8s;
  transition: opacity 0.6s ease-out 1.8s, transform 0.6s ease-out 1.8s;
  transition: opacity 0.6s ease-out 1.8s, transform 0.6s ease-out 1.8s, -webkit-transform 0.6s ease-out 1.8s;
}
.page--home.loaded .section--top .thumb {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: 0.6s ease-out 1.8s;
  transition: 0.6s ease-out 1.8s;
}
.page--home.loaded .section--info {
  opacity: 1;
  -webkit-transition: 0s 2s;
  transition: 0s 2s;
}
.page--home.loaded .section--info::before {
  -webkit-transform: rotate(-7deg) scaleX(1);
          transform: rotate(-7deg) scaleX(1);
  -webkit-transition: 0.6s ease-out 2s;
  transition: 0.6s ease-out 2s;
}
.page--home.scrolling.loaded .wrap .bg::after,
.page--home.scrolling.loaded .header .drawer__btn,
.page--home.scrolling.loaded .section--top .block--logo .logo img,
.page--home.scrolling.loaded .section--top .block--logo__lead::after,
.page--home.scrolling.loaded .section--top .block--logo__lead span,
.page--home.scrolling.loaded .section--top .block--logo,
.page--home.scrolling.loaded .section--top .block--text .comment-wrap,
.page--home.scrolling.loaded .section--top .block--text .comment-wrap em,
.page--home.scrolling.loaded .section--top .block--text .comment-wrap .comment-wrap__sub,
.page--home.scrolling.loaded .section--top .block--text .lead__sub,
.page--home.scrolling.loaded .section--top .thumb,
.page--home.scrolling.loaded .section--info,
.page--home.scrolling.loaded .section--info::before {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

/*  common
------------------------------ */
.section--detail {
  width: 80%;
  margin: 0 auto;
  max-width: 800px;
}

.detail__btn {
  display: block;
  text-align: center;
  margin: 5em auto 1em;
}
.detail__btn a {
  display: inline-block;
  font-family: "din-2014", sans-serif;
  font-weight: 800;
  line-height: 1;
  position: relative;
}
.detail__btn a::after {
  content: "";
  display: block;
  width: 100%;
  height: 3px;
  background: #000;
  position: absolute;
  left: 0;
  bottom: -5px;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: left;
          transform-origin: left;
  -webkit-transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
  transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
}
.detail__btn a:hover::after {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transform-origin: right;
          transform-origin: right;
}

/*  support
------------------------------ */
.support .list--support dt {
  color: inherit;
  font-weight: bold;
  line-height: 1.8;
  margin-bottom: 5px;
}
.support .list--support dd {
  margin-bottom: 30px;
}
.support .list--support li {
  margin-bottom: 1em;
}
.support .list--support li:last-of-type {
  margin-bottom: 0;
}
.support .list--support li ul {
  text-indent: 1em;
}

/*  common
------------------------------ */
.section--list {
  position: relative;
}
.section--list .page-tit {
  font-family: "din-2014", sans-serif;
  font-weight: 800;
}
@media screen and (min-width: 961px) {
  .section--list {
    width: 80%;
    max-width: 950px;
    margin: 0 auto;
    padding-left: 16em;
  }
  .section--list .page-tit {
    letter-spacing: 0.15em;
    font-size: 18px;
    position: absolute;
    left: 0;
    top: 0;
  }
}
@media screen and (min-width: 1px) and (max-width: 960px) {
  .section--list {
    padding: 0 5%;
  }
  .section--list .page-tit {
    font-weight: 400;
    font-size: 16px;
    letter-spacing: 0.18em;
    margin-bottom: 2em;
  }
}

.nav--language button {
  border: solid 1px #ffffff;
  border-radius: 100em;
  background: rgba(255, 255, 255, 0);
  color: #ffffff;
  font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
  font-weight: 900;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  font-weight: 600;
  line-height: 1;
}
.nav--language .nav_lang.current {
  display: none;
}

/*  page--info
------------------------------ */
.page--info {
  background: #030c24;
}
.page--info .wrap {
  background: #030c24;
}
.page--info .list--information li {
  margin-bottom: 30px;
}
.page--info .list--information li a {
  display: block;
}
.page--info .list--information li .date {
  font-size: 0.8em;
  letter-spacing: 0.1em;
  position: relative;
}
.page--info .list--information li.new .date::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  background: #c00;
  border-radius: 6px;
  position: absolute;
  top: 0;
  left: 6.2em;
}
@media screen and (min-width: 961px) {
  .page--info .list--information .list--information a:hover {
    opacity: 0.5;
  }
}
.page--info .section--detail {
  background: #fff;
  color: #333;
  padding: 50px;
  border-radius: 22px;
  -webkit-box-shadow: 40px 70px 70px -60px #000;
          box-shadow: 40px 70px 70px -60px #000;
}
.page--info .section--detail .tit {
  font-size: 28px;
  line-height: 1.4;
  margin-bottom: 5px;
}
.page--info .section--detail .date {
  margin-bottom: 2em;
  letter-spacing: 0.1em;
}
.page--info .section--detail .txt--body a {
  text-decoration: underline;
}
.page--info .section--detail .txt--body a:hover {
  text-decoration: none;
}
.page--info .block--share {
  line-height: 1;
  text-align: right;
  padding-top: 60px;
  margin: 0 0 30px;
}
.page--info .block--share .share {
  display: inline-block;
  font-family: "din-2014", sans-serif;
  font-weight: 400;
  font-size: 10px;
  padding-right: 0;
  letter-spacing: 0.1em;
  vertical-align: 0px;
  color: #111;
}
.page--info .block--share a {
  color: #111;
}
.page--info .block--share a:hover {
  color: #38a1db;
}
.page--info .block--share a:hover svg {
  fill: #38a1db;
}
.page--info .block--share li {
  display: inline-block;
  vertical-align: middle;
  font-size: 20px;
  color: #efefef;
  margin: 0 0 0 15px;
}
.page--info .block--share .lineIco svg {
  width: 18px;
  height: 18px;
  fill: #111;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.page--info .block--share .ico {
  font-size: 20px;
}

/*  faq
------------------------------ */
.page--faq .list--faq {
  margin-bottom: 60px;
}
.page--faq .list--faq li:first-child {
  padding-top: 20px;
}
.page--faq .list--category {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 0 3em 0;
}
.page--faq .category + .category {
  margin-left: 2%;
}
.page--faq .category {
  width: 23.5%;
  margin: 0 0 1.5em 0;
}
.page--faq .category a {
  display: inline-block;
  border-radius: 20px;
  border: 1px solid #fff;
  padding: 4px 8px;
  width: 100%;
  text-align: center;
}
.page--faq .category-tit {
  font-size: 20px;
  font-weight: bold;
}

.list--faq li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  padding: 30px 0;
}
.list--faq li .block--q {
  font-size: 18px;
  position: relative;
  padding-left: 50px;
  cursor: pointer;
}
.list--faq li .block--q .ico--q {
  display: inline-block;
  width: 40px;
  height: 40px;
  font-family: din-2014, sans-serif;
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  border-radius: 30px;
  line-height: 37px;
  border: 1px solid;
  position: absolute;
  left: 0;
  top: 0;
}
.list--faq li .block--a {
  display: none;
  font-size: 15px;
  padding-top: 20px;
  padding-left: 47px;
  position: relative;
  padding: 20px 0 20px 60px;
}
.list--faq li .block--a .ico--a {
  display: inline-block;
  width: 40px;
  height: 40px;
  font-family: din-2014, sans-serif;
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  line-height: 40px;
  background: #271bff;
  color: #fff;
  border-radius: 30px;
  position: absolute;
  top: 15px;
  left: 0;
}

@media screen and (min-width: 961px) {
  .sp {
    display: none !important;
  }
  a {
    -webkit-transition: all 0.3s 0s ease;
    transition: all 0.3s 0s ease;
  }
  .btn--main {
    min-width: 300px;
  }
  .btn--main:hover {
    background: #38a1db;
  }
  .btn--sub {
    min-width: 300px;
  }
  .btn--sub:hover {
    background: white;
    color: #030e23;
  }
  .wrap {
    padding: 220px 0 150px;
  }
  header {
    position: fixed;
    width: 100%;
    text-align: right;
    height: 60px;
    top: 50px;
    left: 0;
    z-index: 999;
  }
  header .logo {
    width: 180px;
    position: absolute;
    top: 0;
    left: 3%;
  }
  header .drawer__btn {
    display: none;
  }
  header .g-nav {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: flex-end;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    padding-right: 5%;
    padding-top: 6px;
  }
  header .g-nav .list--nav li {
    display: inline-block;
    font-family: YakuHanJP, "Noto Sans JP", -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
    font-weight: 900;
    font-size: 15px;
    line-height: 1.8;
    letter-spacing: 0.08em;
    margin-left: 20px;
    font-size: 14px;
  }
  header .g-nav .list--nav li a {
    display: block;
    position: relative;
  }
  header .g-nav .list--nav li a::after {
    content: "";
    display: block;
    bottom: -5px;
    left: 0;
    position: absolute;
    width: 100%;
    height: 3px;
    background: #fff;
    -webkit-transform-origin: right;
            transform-origin: right;
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
    transition: 0.3s cubic-bezier(0.73, 0.04, 0.5, 0.92);
  }
  header .g-nav .list--nav li a:hover::after {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  header .g-nav .list--sub {
    display: none;
  }
  .nav--language {
    position: relative;
    margin-left: 3.5rem;
  }
  .nav--language::before {
    content: "";
    display: block;
    width: 1px;
    height: 20px;
    background: #fff;
    position: absolute;
    left: -1.8rem;
    top: 4px;
  }
  .nav--language button {
    display: inline-block;
    padding: 0.45em 1.3em;
    font-size: 0.7rem;
    cursor: pointer;
    -webkit-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
  }
  .nav--language button:hover {
    background: rgb(255, 255, 255);
    color: #030c24;
  }
  /*
  .nav--language {
  	margin-left: 1.5rem;
  	.langSelector {
  		display: inline-block;
  		position: relative;
  		border: solid 1px #ffffff;
  		border-radius: 100em;
  		color: #ffffff;
  		@include var.font-noto;
  	}
  	.easy-select-box {
  		position: relative;
  		width: 100% !important;
  		font-size: 13px;
  		font-weight: 500;
  		outline: 0;
  		-webkit-transition: all .3s ease;
  		transition: all .3s ease;
  	}
  	.easy-select-box .esb-displayer {
  		position: relative;
  		color: #ffffff;
  		min-width: 120px !important;
  		padding: .9em .3em;
  		text-align: center;
  		line-height: 1;
  		cursor: pointer;
  	}
  	.easy-select-box .esb-displayer:hover {
  		filter: alpha(opacity=80);
  		-ms-filter: 'alpha(opacity=80)';
  		opacity: .8;
  	}
  	.easy-select-box:hover .esb-displayer {
  		text-decoration:none;
  	}
  	.easy-select-box.disabled .esb-displayer,
  	.easy-select-box:hover.disabled .esb-displayer {
  		background-position: 0 -36px;
  	}
  	.easy-select-box .esb-dropdown {
  		display: none;
  		overflow: auto;
  		position: absolute;
  		z-index: 999;
  		min-width: 120px !important;
  		max-height: 200px;
  		margin-top: .6rem;
  		padding: 5px 0;
  		border-radius: 5px;
  		background: #ffffff;
  		text-align: center;
  	}
  	.easy-select-box .esb-item {
  		padding: 5px;
  		color: #030c24;
  		font-weight: normal;
  		cursor: pointer;
  		-webkit-transition: all .3s ease;
  		transition: all .3s ease;
  	}
  	.easy-select-box .esb-item:hover {
  		color: #009fdf;
  		text-decoration: none;
  	}
  }
  */
  .list--faq li .block--q {
    -webkit-transition: 0.4s;
    transition: 0.4s;
  }
  .list--faq li .block--q:hover {
    opacity: 0.5;
  }
  .block--bnr {
    width: 65vw;
  }
  .list--bnr .slick-dots {
    display: block;
    left: -24%;
    width: auto;
    bottom: 0;
  }
  .list--bnr .slick-prev {
    left: -23%;
    top: inherit;
    bottom: 0;
  }
  .list--bnr .slick-next {
    left: -18%;
    top: inherit;
    bottom: 0;
  }
  .list--bnr .slick-prev,
  .list--bnr .slick-next {
    -webkit-transition: all 0.3s 0s ease;
    transition: all 0.3s 0s ease;
  }
  .list--bnr .slick-prev:hover,
  .list--bnr .slick-next:hover {
    opacity: 0.5;
  }
  .block--pager {
    text-align: center;
    margin: 120px auto 0 -16em;
    padding: 0;
    letter-spacing: -0.5em;
  }
  .block--pager li {
    display: inline-block;
    font-family: "din-2014", sans-serif;
    font-weight: 400;
    padding: 0.6em 0;
    margin: 0 5px;
    letter-spacing: 0.03em;
    vertical-align: middle;
    position: relative;
  }
  .block--pager li::before {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    background: #fff;
    position: absolute;
    bottom: 3px;
    left: 0;
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
    -webkit-transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
  }
  .block--pager li:hover::before {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: left;
            transform-origin: left;
  }
  .block--pager a {
    display: block;
    position: relative;
    text-decoration: none;
    padding: 0 0.2em;
  }
  .block--pager .pager__item--number {
    text-align: center;
    color: #888;
  }
  .block--pager .pager__item--newer {
    width: 50px;
    padding: 7px 0;
    margin-right: 1em;
    text-indent: -9999em;
  }
  .block--pager .pager__item--newer a, .block--pager .pager__item--newer span {
    display: block;
    width: 100%;
    padding: 12px 0;
    position: relative;
  }
  .block--pager .pager__item--newer a::after, .block--pager .pager__item--newer span::after {
    content: "";
    display: block;
    position: absolute;
  }
  .block--pager .pager__item--newer a::after, .block--pager .pager__item--newer span::after {
    width: 7px;
    height: 7px;
    border-top: 2px solid #dadbe2;
    border-right: 2px solid #dadbe2;
    -webkit-transform: rotate(-135deg);
            transform: rotate(-135deg);
    top: 9px;
    left: 0;
    -webkit-transition: left 0.3s;
    transition: left 0.3s;
  }
  .block--pager .pager__item--newer a:hover::before {
    -webkit-transform: scaleX(1.2);
            transform: scaleX(1.2);
  }
  .block--pager .pager__item--newer a:hover::after {
    left: -5px;
  }
  .block--pager .pager__item--newer span {
    opacity: 0.2;
  }
  .block--pager .pager__item--older {
    width: 50px;
    padding: 7px 0;
    text-indent: -9999em;
    margin-left: 2.5em;
  }
  .block--pager .pager__item--older a, .block--pager .pager__item--older span {
    display: block;
    width: 100%;
    padding: 12px 0;
    position: relative;
  }
  .block--pager .pager__item--older a::after, .block--pager .pager__item--older span::after {
    content: "";
    display: block;
    position: absolute;
  }
  .block--pager .pager__item--older a::after, .block--pager .pager__item--older span::after {
    width: 7px;
    height: 7px;
    border-top: 1px solid #dadbe2;
    border-right: 1px solid #dadbe2;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    top: 9px;
    left: 23px;
    -webkit-transition: left 0.3s;
    transition: left 0.3s;
  }
  .block--pager .pager__item--older a:hover::before {
    -webkit-transform: scaleX(1.2);
            transform: scaleX(1.2);
  }
  .block--pager .pager__item--older a:hover::after {
    left: 28px;
  }
  .block--pager .pager__item--older span {
    opacity: 0.2;
  }
  .block--pager .pager__item--newer,
  .block--pager .pager__item--older {
    z-index: 2;
  }
  .block--pager .pager__item--newer::before,
  .block--pager .pager__item--older::before {
    display: none !important;
  }
  .block--pager .pager__item--current {
    font-family: "din-2014", sans-serif;
    font-weight: 400;
    position: relative;
    padding: 0.6em 0.2em;
  }
  .block--pager .pager__item--current::before {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
  }
  .page--home .wrap {
    /*
    padding-bottom: 50vw;
    */
  }
  .page--home .header h1 {
    display: none;
  }
  .page--home .header {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
    -webkit-transition: -webkit-transform 0.6s;
    transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    transition: transform 0.6s, -webkit-transform 0.6s;
  }
  .page--home.loaded .header {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-transition-delay: 2s;
            transition-delay: 2s;
  }
  .page--home.scrolling.loaded .header {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
  .page--home .section--top .inner {
    width: 60%;
    max-width: 850px;
    padding: 20vh 0 0;
  }
  .page--home .section--top .block--logo .logo {
    width: 80%;
  }
  .page--home .section--top .block--logo__lead {
    font-size: 22px;
  }
  .page--home .section--top .block--text .lead {
    font-size: 18px;
    line-height: 1.6;
  }
  .page--home .section--top .block--text .lead span {
    font-size: 25px;
  }
  .page--home .section--top .block--text .lead span em {
    font-size: 35px;
  }
  .page--home .section--top .block--text.txt--en .comment-wrap {
    line-height: 1.3;
  }
  .page--home .section--top .block--text.txt--en .comment-wrap__sub {
    line-height: 1.5;
  }
  .page--home .section--program {
    margin-top: 30vh;
    padding-left: 20%;
  }
  .page--home .section--program .inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 0 0 0 auto;
  }
  .page--home .section--info .box--tit {
    position: relative;
    top: 7px;
  }
  .page--home .section--info .inner {
    margin-top: -8vw;
  }
  .page--home .list--info .block--tit {
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  .page--home .list--info .block--tit:hover {
    opacity: 0.5;
  }
  .page--home .section--contents .block--contents__2nd {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-flow: row-reverse;
            flex-flow: row-reverse;
  }
  .page--home .block--download {
    width: 70%;
    margin-bottom: 30px;
  }
  .page--home .block--download .flex--horizontal {
    -webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
  }
  .page--home .block--download [class^=ico--] {
    width: 40%;
    line-height: 0;
  }
  .page--home .block--download [class^=ico--] a {
    display: block;
  }
  .page--home .block--download .ico--google {
    position: relative;
    /*top: 2px;*/
    width: 49%;
  }
  .page--home .block--download .ico--google a.en {
    width: 92%;
    margin: 0 0 0 auto;
  }
  .page--home .block--download .txt--sub {
    font-size: 10px;
    text-align: center;
  }
  .page--home footer {
    position: relative;
    width: 100%;
    height: 42vw;
    text-align: left;
    background: #0b0b2d;
    z-index: 1;
  }
  .page--home footer .inner {
    position: absolute;
    right: 5%;
    bottom: 3vw;
    padding-top: 23vw;
    /*
    @include var.flex-display;
    @include var.flex-justify;
    @include var.flex-align;
    height: 100%;
    */
  }
  .page--home footer .logo {
    width: 8.5vw;
    margin: 0 0 3.6vw auto;
    /*
    height: 7vw;
    position: absolute;
    right: 5%;
    bottom: 13vw;
    */
  }
  .page--home footer .list--support {
    margin-bottom: 3vw;
    /*
    position: absolute;
    bottom: 8vw;
    right: 5%;
    width: calc(90% - 160px);
    height: 30px;
    */
    text-align: right;
  }
  .page--home footer .list--support li {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 0.08em;
    margin-right: 30px;
  }
  .page--home footer .list--support li:last-of-type {
    margin-right: 0;
  }
  .page--home footer .list--support li i {
    display: inline-block;
    margin-left: 3px;
  }
  .page--home footer .block--lisence {
    margin-bottom: 1vw;
  }
  .page--home footer .block--lisence li {
    display: inline-block;
    text-align: right;
  }
  .page--home footer .block--lisence li figure {
    display: block;
    width: 3.6em;
    margin: 0 0 0 auto;
  }
  .page--home footer .block--lisence li figure img {
    width: 100%;
  }
  .page--home footer .block--lisence li p {
    font-size: 10px;
    line-height: 1.6;
  }
  .page--home footer .block--lisence li:last-of-type {
    margin-left: 2rem;
  }
  .page--home .block--bottom {
    width: 100%;
    text-align: right;
    font-size: 10px;
    /*
    position: absolute;
    bottom: 50px;
    right: 5%;
    */
  }
  .page--home .block--bottom .txt--sub {
    margin-bottom: 20px;
  }
  .page--home .block--bottom .copyright {
    bottom: 0;
  }
  .page--faq .category:nth-child(4n+1) {
    margin-left: 0;
  }
  .page--faq .category a:hover {
    opacity: 0.5;
  }
}
/*  pc min
------------------------------ */
@media screen and (min-width: 961px) and (max-width: 1200px) {
  .page--home .section--top .inner {
    width: 80%;
    max-width: 850px;
  }
  .page--home footer .list--support {
    bottom: 10vw;
  }
  .page--home .section--download .inner {
    padding: 60px 15% 0;
  }
}
@media screen and (min-width: 1px) and (max-width: 960px) {
  /* common.scss
  ============================== */
  .pc {
    display: none !important;
  }
  .btn--main {
    min-width: 90%;
  }
  /*
  .nav--language {
  	.langSelector {
  		display: block;
  		position: relative;
  		border: solid 1px #ffffff;
  		border-radius: 100em;
  		color: #ffffff;
  		@include var.font-noto;
  		text-align: center;
  	}
  	.easy-select-box {
  		position: relative;
  		width: 100% !important;
  		font-size: 20px;
  		font-weight: 500;
  		outline: 0;
  		-webkit-transition: all .3s ease;
  		transition: all .3s ease;
  	}
  	.easy-select-box .esb-displayer {
  		position: relative;
  		width: 100% !important;
  		padding: .9em .3em;
  		color: #ffffff;
  		text-align: center;
  		line-height: 1;
  		cursor: pointer;
  	}
  	.easy-select-box.disabled .esb-displayer,
  	.easy-select-box .esb-dropdown {
  		display: none;
  		overflow: auto;
  		position: absolute;
  		z-index: 999;
  		width: 100% !important;
  		max-height: 200px;
  		margin-top: .6rem;
  		padding: 5px 0;
  		border-radius: 5px;
  		background: #ffffff;
  		text-align: center;
  	}
  	.easy-select-box .esb-item {
  		padding: 5px;
  		color: #030c24;
  		font-weight: normal;
  		cursor: pointer;
  		-webkit-transition: all .3s ease;
  		transition: all .3s ease;
  	}
  }
  */
}
@media screen and (min-width: 1px) and (max-width: 960px) and (min-width: 756px) and (max-width: 961px) {
  .btn--main {
    min-width: 50%;
  }
}
@media screen and (min-width: 1px) and (max-width: 960px) {
  .btn--sub {
    min-width: 90%;
    margin: 1em 0 1em;
    font-size: 1em;
  }
}
@media screen and (min-width: 1px) and (max-width: 960px) and (min-width: 756px) and (max-width: 961px) {
  .btn--sub {
    min-width: 50%;
  }
}
@media screen and (min-width: 1px) and (max-width: 960px) {
  .header .drawer {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-around;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    z-index: 99;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(2, 35, 97, 0.9);
    -webkit-transition: 0.4s cubic-bezier(0.16, 0.68, 0.65, 1.03);
    transition: 0.4s cubic-bezier(0.16, 0.68, 0.65, 1.03);
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    opacity: 0;
    pointer-events: none;
  }
  .header .drawer .list--nav {
    font-family: "din-2014", sans-serif;
    font-weight: 400;
    letter-spacing: 0.2em;
  }
  .header .drawer .list--nav li {
    font-size: 6.5vw;
    text-align: center;
    margin-bottom: 1em;
  }
  .header .drawer .list--nav li.howto {
    font-weight: bold;
    letter-spacing: 0.1em;
    font-size: 5.5vw;
  }
  .header .drawer .list--nav.txt--en li.howto {
    font-weight: 400;
    font-size: 6.5vw;
  }
  .header .drawer__btn {
    width: 50px;
    height: 40px;
    position: fixed;
    right: 3%;
    top: 18px;
    z-index: 999;
  }
  .header .drawer__btn span {
    display: block;
    width: 35%;
    height: 2px;
    position: absolute;
    left: 33%;
    background: #fff;
    -webkit-transition: all 0.2s 0s ease;
    transition: all 0.2s 0s ease;
  }
  .header .drawer__btn span:first-child {
    top: 35%;
  }
  .header .drawer__btn span:nth-child(2) {
    top: 50%;
  }
  .header .drawer__btn span:last-child {
    top: 65%;
  }
  .drawer-visible header .drawer__btn {
    mix-blend-mode: unset;
  }
  .drawer-visible header .drawer__btn span {
    top: 50%;
  }
  .drawer-visible header .drawer__btn span:first-child {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 65%;
  }
  .drawer-visible header .drawer__btn span:nth-child(2) {
    opacity: 0;
  }
  .drawer-visible header .drawer__btn span:last-child {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  .drawer-visible .drawer {
    opacity: 1;
    pointer-events: auto;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
  }
  header .logo {
    width: 40%;
    position: absolute;
    left: 5%;
    top: 34px;
  }
  header .logo a {
    display: block;
  }
  .nav--language {
    position: relative;
  }
  .nav--language::before {
    content: "";
    display: block;
    position: absolute;
    top: -2em;
    left: 50%;
    width: 15%;
    height: 1px;
    margin-left: -7.5%;
    background: #fff;
  }
  .nav--language button {
    display: block;
    margin: 3.6em auto 0;
    padding: 0.7em 1.5em;
    font-size: 0.8rem;
  }
  footer .copyright {
    opacity: 0.5;
    position: relative;
    margin-bottom: 3vw;
    /*
    bottom: 20px;
    */
  }
  .block--pager {
    text-align: center;
    letter-spacing: -0.5em;
    font-size: 14px;
    margin: 50px auto 0;
    padding: 0;
  }
  .block--pager li {
    display: inline-block;
    font-family: "din-2014", sans-serif;
    font-weight: 400;
    padding: 0.6em 0;
    margin: 0 5px;
    letter-spacing: 0.03em;
    vertical-align: middle;
    position: relative;
  }
  .block--pager li::before {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    background: #fff;
    position: absolute;
    bottom: 4px;
    left: 0;
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: right;
            transform-origin: right;
    -webkit-transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
  }
  .block--pager a {
    display: block;
    position: relative;
    text-decoration: none;
    padding: 0 0.6em;
  }
  .block--pager .pager__item--number {
    text-align: center;
    color: #fff;
  }
  .block--pager .pager__item--newer {
    width: 50px;
    padding: 7px 0;
    margin-right: 1em;
  }
  .block--pager .pager__item--newer a, .block--pager .pager__item--newer span {
    display: block;
    width: 100%;
    text-indent: -9999em;
    padding: 12px 0;
    position: relative;
  }
  .block--pager .pager__item--newer a::after, .block--pager .pager__item--newer span::after {
    content: "";
    display: block;
    position: absolute;
  }
  .block--pager .pager__item--newer a::after, .block--pager .pager__item--newer span::after {
    width: 7px;
    height: 7px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(-135deg);
            transform: rotate(-135deg);
    top: 9px;
    left: 0;
    -webkit-transition: left 0.3s;
    transition: left 0.3s;
  }
  .block--pager .pager__item--newer span {
    opacity: 0.2;
  }
  .block--pager .pager__item--older {
    width: 50px;
    padding: 7px 0;
    margin-left: 2.5em;
  }
  .block--pager .pager__item--older a, .block--pager .pager__item--older span {
    display: block;
    width: 100%;
    text-indent: -9999em;
    padding: 12px 0;
    position: relative;
  }
  .block--pager .pager__item--older a::after, .block--pager .pager__item--older span::after {
    content: "";
    display: block;
    position: absolute;
  }
  .block--pager .pager__item--older a::after, .block--pager .pager__item--older span::after {
    width: 7px;
    height: 7px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    top: 9px;
    left: 23px;
    -webkit-transition: left 0.3s;
    transition: left 0.3s;
  }
  .block--pager .pager__item--older span {
    opacity: 0.2;
  }
  .block--pager .pager__item--newer,
  .block--pager .pager__item--older {
    z-index: 2;
  }
  .block--pager .pager__item--newer::before,
  .block--pager .pager__item--older::before {
    display: none !important;
  }
  .block--pager .pager__item--current {
    font-family: "din-2014", sans-serif;
    font-weight: 800;
    position: relative;
    padding: 0.6em;
  }
  .block--pager .pager__item--current::before {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
  }
  .list--info .block--tit {
    display: block;
  }
  .list--info .date {
    width: 100%;
    font-size: 12px;
  }
  .list--info .tit {
    width: 100%;
    line-height: 1.5;
  }
  .list--info .block--txt {
    padding-top: 20px;
    line-height: 1.5;
    font-size: 14px;
  }
  .list--faq li {
    padding: 20px 0;
  }
  .list--faq li .block--q {
    font-size: 15px;
    line-height: 1.4;
    font-weight: normal;
    padding: 0 0 0 40px;
  }
  .list--faq li .block--q .ico--q,
  .list--faq li .block--a .ico--a {
    width: 30px;
    height: 30px;
    font-size: 18px;
    line-height: 28px;
    border: 1px solid #fff;
  }
  .list--faq li .block--a .ico--a {
    line-height: 30px;
    top: 23px;
    border: none;
    background: #271bff;
  }
  .list--faq li .block--a {
    font-size: 14px;
    line-height: 1.5;
    padding: 20px 0 20px 40px;
  }
  .list--bnr li.slick-slide {
    width: 52vw;
    margin-right: 8px;
    margin-left: 0;
  }
  .list--bnr.single li {
    width: 52vw;
  }
  .list--bnr .slick-dots {
    display: block;
    text-align: left;
    left: -10px;
    bottom: -30px;
  }
  .wrap {
    padding-bottom: 80px;
    position: relative;
  }
  .section--detail {
    padding: 0 5%;
    width: 100%;
    max-width: inherit;
  }
  .section-tit {
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 20px;
  }
  .page--home section {
    z-index: 3;
  }
  .page--home .wrap {
    padding-bottom: 0;
  }
  .page--home .bg::after {
    z-index: 1;
  }
  .page--home .header .logo {
    display: none;
  }
  .page--home .section--top {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-around;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 160vw;
    padding: 0vh 8% 0;
    z-index: 5;
  }
  .page--home .section--top .inner {
    top: -5px;
  }
  .page--home .section--top .block--logo {
    position: relative;
    -webkit-transition: 0.6s ease-out;
    transition: 0.6s ease-out;
  }
  .page--home .section--top .block--logo .logo {
    width: 100%;
    margin-bottom: 0;
    position: relative;
  }
  .page--home .section--top .block--logo .logo img {
    -webkit-transform: translateY(18vw);
            transform: translateY(18vw);
  }
  .page--home .section--top .block--logo__lead {
    font-size: 4.2vw;
    margin-bottom: 1.3vh;
  }
  .page--home .section--top .thumb {
    position: relative;
    top: inherit;
    bottom: 0;
  }
  .page--home .section--top .block--text {
    margin-bottom: 40px;
    position: relative;
    top: 0;
  }
  .page--home .section--top .block--text .lead {
    font-size: 3vw;
    line-height: 1.8;
    letter-spacing: 0;
  }
  .page--home .section--top .block--text .lead span {
    font-size: 4vw;
    padding: 0 0.4vw;
    margin-bottom: 5px;
  }
  .page--home .section--top .block--text .lead span em {
    font-size: 5.5vw;
  }
  .page--home .section--top .block--text.txt--en .lead span {
    overflow: visible;
  }
  .page--home .section--top .block--text.txt--en .comment-wrap {
    line-height: 1.3;
  }
  .page--home .section--top .block--text.txt--en .comment-wrap__sub {
    line-height: 1.3;
  }
  .page--home .section--top .block--text.txt--en .lead span.lead__sub {
    margin-top: 1em;
  }
  .page--home .section--program .box--tit .section-tit {
    font-size: 16px;
    margin-bottom: 24px;
  }
  .page--home .section--program .box--tit .list__more {
    position: absolute;
    right: 8%;
    top: 9px;
  }
  .page--home .section--program .box--tit .list__more a {
    font-size: 12px;
  }
  .page--home .section--program .box--tit .list__more a::after {
    bottom: -4px;
  }
  .page--home .section--program .inner {
    padding: 0 0 30px 8%;
  }
  .page--home .section--info::before, .page--home .section--info::after {
    width: 150%;
    height: 80vw;
    top: -48vw;
    left: -30%;
    -webkit-transform: rotate(-10deg) scaleX(0);
            transform: rotate(-10deg) scaleX(0);
  }
  .page--home .section--info::after {
    top: inherit;
    -webkit-transform: rotate(-10deg) scaleX(1);
            transform: rotate(-10deg) scaleX(1);
  }
  .page--home .section--info .inner {
    display: block;
    padding: 40px 8% 30px;
    top: -4vw;
  }
  .page--home .section--info .box--tit {
    width: 100%;
    position: relative;
  }
  .page--home .section--info .box--tit .section-tit {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .page--home .section--info .box--tit .list__more {
    position: absolute;
    right: 0;
    top: 9px;
  }
  .page--home .section--info .box--tit .list__more a {
    font-size: 12px;
  }
  .page--home .section--info .box--tit .list__more a::after {
    bottom: -4px;
  }
  .page--home .section--info .box--info {
    width: 100%;
  }
  .page--home .section--contents {
    padding: 30vw 8% 0;
    z-index: 3;
  }
  .page--home .section--contents [class^=block--contents] {
    display: block;
    position: relative;
    margin-bottom: 35vw;
  }
  .page--home .section--contents [class^=block--contents] .box--lead {
    display: block;
    width: 100%;
    margin-bottom: 30px;
    position: static;
  }
  .page--home .section--contents [class^=block--contents] .box--lead .box-tit {
    font-size: 9vw;
    letter-spacing: 0;
    margin-bottom: 20px;
  }
  .page--home .section--contents [class^=block--contents] .box--lead .box-tit.txt--en {
    font-size: 7vw;
  }
  .page--home .section--contents [class^=block--contents] .box--lead .txt.txt--en {
    line-height: 1.5;
  }
  .page--home .section--contents [class^=block--contents] .box--figure {
    display: block;
    position: relative;
    z-index: 3;
    width: 100%;
    opacity: 0;
    -webkit-transform: translateY(60px);
            transform: translateY(60px);
    -webkit-transition: 0.6s;
    transition: 0.6s;
  }
  .page--home .section--contents .block--contents__1st .bg__circle {
    bottom: -15vw;
  }
  .page--home .section--contents .block--contents__3rd {
    margin-bottom: 30px;
  }
  .page--home .section--contents .bg__circle {
    width: 80vw;
    height: 80vw;
    position: absolute;
    left: calc(50% - 40vw);
    opacity: 0;
    z-index: 2;
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: scale(0);
            transform: scale(0);
    top: inherit;
    bottom: 0;
  }
  .page--home .section--download::before {
    width: 150%;
    height: 107%;
    top: 0;
    left: -20%;
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
  .page--home .section--download .inner {
    display: block;
    width: 100%;
    margin: 0 auto;
    padding: 30vw 8% 0;
  }
  .page--home .section--download .block--logo {
    width: 100%;
    margin-bottom: 20px;
  }
  .page--home .section--download .block--logo .lead {
    font-size: 6vw;
  }
  .page--home .section--download .block--download {
    width: 100%;
    margin-bottom: 10px;
  }
  .page--home .section--download .block--download [class^=ico--] {
    width: 55%;
    margin: 0 auto;
  }
  .page--home .section--download .txt--sub {
    font-size: 10px;
    line-height: 1.4;
  }
  .page--home .section--download .thumb {
    width: 80%;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .page--home .section--download .list--device {
    font-size: 13px;
    background: rgba(43, 56, 148, 0.3);
    padding: 15px;
  }
  .page--home .section--download .howto__btn {
    width: 100%;
  }
  .page--home footer {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    padding: 15vw 10% 0;
    /*
    padding: 15vw 10% 56vw;
    */
    background: #0b0b2d;
    text-align: left;
  }
  .page--home footer .inner {
    /*
    display: block;
    */
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-around;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 26vw;
    height: auto;
  }
  .page--home footer .logo {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    width: 23vw;
    margin-bottom: 2.5rem;
    /*
    position: absolute;
    right: calc( 50% - 12.5vw );
    height: 16vw;
    bottom: 28vw;
    */
  }
  .page--home footer .block--support {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    width: 100%;
    margin-bottom: 12vw;
    border-bottom: 1px solid;
  }
  .page--home footer .block--bottom {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    width: 96%;
    text-align: center;
    font-size: 10px;
    /*
    position: absolute;
    bottom: 0;
    */
  }
  .page--home footer .block--bottom .txt--sub {
    margin-bottom: 40px;
  }
  .page--home footer .list--support {
    display: none;
    width: 100%;
    height: auto;
    text-align: left;
    position: relative;
    right: 5%;
    bottom: inherit;
    right: inherit;
    padding: 0;
  }
  .page--home footer .list--support li i {
    display: inline-block;
    margin-left: 3px;
  }
  .page--home footer .block-tit.sp {
    font-family: din-2014, sans-serif;
    font-size: 14px;
    line-height: 1;
    margin-bottom: 16px;
    position: relative;
  }
  .page--home footer .block-tit.sp::before {
    content: "";
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    border: 2px solid;
    border-top: none;
    border-right: none;
    margin: -0.25em 0 0;
    position: absolute;
    right: inherit;
    top: 50%;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    border-width: 1px;
    margin-top: -0.14em;
    right: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  .page--home footer .block-tit.sp.open::before {
    -webkit-transform: rotate(-225deg);
            transform: rotate(-225deg);
  }
  .page--home footer .list--support li {
    display: block;
    font-size: 12px;
    letter-spacing: 0;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .page--home footer .block--lisence {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: center;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    align-items: stretch;
    margin-bottom: 5vw;
  }
  .page--home footer .block--lisence li {
    text-align: center;
  }
  .page--home footer .block--lisence li figure {
    display: block;
    width: 3.2em;
    margin: 0 auto;
  }
  .page--home footer .block--lisence li figure img {
    width: 100%;
  }
  .page--home footer .block--lisence li p {
    font-size: 10px;
    line-height: 1.6;
  }
  .page--home footer .block--lisence li:last-of-type {
    margin-left: 2rem;
  }
  .page--home.loaded .section--info::before {
    -webkit-transform: rotate(-10deg) scaleX(1);
            transform: rotate(-10deg) scaleX(1);
  }
  .page--info .list--information li {
    margin-bottom: 20px;
  }
  .page--info .list--information .tit {
    line-height: 1.5;
  }
  .page--info .section--detail {
    width: auto;
    border-radius: 8px;
    -webkit-box-shadow: 40px 70px 70px -60px #000;
            box-shadow: 40px 70px 70px -60px #000;
    padding: 20px 5%;
    margin: 0 5%;
  }
  .page--info .section--detail .tit {
    font-size: 22px;
  }
  .page--info .section--detail .date {
    font-size: 0.8em;
  }
  .page--info .block--share {
    padding-top: 30px;
  }
  .detail__btn {
    margin-top: 3em;
  }
  .page--faq .list--faq {
    margin-bottom: 40px;
  }
  .page--faq .list--faq li:first-child {
    padding-top: 15px;
  }
  .page--faq .list--category {
    margin: 0 0 2em 0;
  }
  .page--faq .category {
    width: 48%;
    margin: 0 0 2.5vw 0;
  }
  .page--faq .category:nth-child(2n+1) {
    margin-left: 0;
  }
  .page--faq .category a {
    font-size: 12px;
  }
  .page--faq .category-tit {
    font-size: 17px;
    font-weight: normal;
  }
}
/*  tablet
------------------------------ */
@media screen and (min-width: 768px) and (max-width: 960px) {
  body {
    font-size: 16px;
  }
  .header .drawer__btn {
    width: 80px;
    height: 50px;
    right: 2%;
  }
  .header .drawer .list--nav li {
    font-size: 5vw;
    margin-bottom: 0.5em;
  }
  .header .drawer .list--nav li.howto {
    font-size: 4vw;
    letter-spacing: 0.1em;
  }
  .header .drawer .list--nav.txt--en li.howto {
    font-size: 5vw;
  }
  .wrap {
    padding-bottom: 90px;
    padding-top: 120px;
  }
  header .logo {
    width: 20%;
  }
  .section-tit {
    font-size: 22px;
  }
  .list--info .date {
    font-size: 14px;
  }
  .list--info .tit {
    font-size: 16px;
  }
  .page--home .section--top {
    padding: 18vh 15% 0;
    height: 130vw;
  }
  .page--home .section--top .block--logo__lead {
    font-size: 3.3vw;
  }
  .page--home .section--top .block--text .lead span em {
    font-size: 4vw;
  }
  .page--home .section--top .block--text .lead span {
    font-size: 3vw;
  }
  .page--home .section--program .box--tit .section-tit {
    font-size: 23px;
  }
  .page--home .section--program .list--bnr.single li,
  .page--home .section--program .list--bnr li.slick-slide {
    width: 42vw;
  }
  .page--home .section--info::before {
    top: -14vw;
  }
  .page--home .section--info::after {
    bottom: -18vw;
  }
  .page--home .section--info .inner {
    top: 50px;
  }
  .page--home .section--info .box--tit .section-tit {
    font-size: 23px;
  }
  .page--home .section--contents {
    padding: 30vw 15% 0;
  }
  .page--home .section--contents [class^=block--contents] .box--lead .box-tit {
    font-size: 7vw;
  }
  .page--home .section--contents [class^=block--contents].started .box--lead .txt {
    font-size: 17px;
  }
  .page--home .section--download .block--logo .lead {
    font-size: 4vw;
  }
  .page--home .section--download .inner {
    padding: 30vw 8% 0;
  }
  .page--home .section--download .thumb {
    width: 70%;
    margin-top: 40px;
    margin-bottom: 50px;
  }
  .page--home .section--download .block--logo {
    width: 80%;
    margin: 0 auto 40px;
  }
  .page--home .section--download .block--download .ico--apple {
    width: 44%;
  }
  .page--home .section--download .block--download .ico--google {
    width: 54%;
  }
  .page--home .section--download .block--device {
    width: 70%;
    margin: 30px auto;
  }
  .page--home footer {
    padding: 15vw 10% 0;
    /*
       padding: 15vw 10% 40vw;
    */
  }
  .page--home footer .logo {
    width: 18vw;
    margin-bottom: 9vw;
    /*
    height: 12vw;
    right: calc( 50% - 9vw);
    bottom: 18vw;
    */
  }
  .page--home footer .block-tit.sp {
    font-size: 22px;
  }
  .page--home footer .list--support {
    padding: 20px 0;
  }
  .page--home footer .list--support li {
    font-size: 16px;
    margin-bottom: 19px;
  }
  .section--detail {
    padding: 0 10%;
  }
}/*# sourceMappingURL=style.css.map */