html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
}
body {
  line-height: 1;
  color: #000;
  background: #fff;
}
ol,
ul {
  list-style: none;
}
table {
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
}
caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
a img {
  border: none;
}
.clearfix {
  zoom: 1;
}
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
html {
  min-height: 100%;
}
html.fixed {
  position: fixed;
  top: 0;
}
body {
  min-height: 100%;
  overflow-x: hidden;
  font-family: 'Helvetica Neue', 'Segoe UI', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;
}
#Loading {
  display: none;
  position: fixed;
  z-index: 700;
  width: 100%;
  height: 100%;
  background-color: #000;
  background-image: url("../../assets/images/loading/loading__bg.gif");
  background-repeat: repeat;
}
#Loading .ttl {
  position: absolute;
  left: 50%;
  top: 40%;
  margin-left: -175px;
  margin-top: 40px;
}
#Loading .anm {
  position: absolute;
  left: 50%;
  top: 40%;
  width: 105px;
  height: 105px;
  margin-left: 75px;
  margin-top: -5px;
}
#Loading .txt {
  position: absolute;
  left: 50%;
  top: 40%;
  margin-left: -170px;
  margin-top: 50px;
  display: none;
}
.firstTime #Loading .ttl {
  margin-top: -30px;
}
.firstTime #Loading .anm {
  margin-top: -75px;
}
.firstTime #Loading .txt {
  display: block;
}
#Content {
  position: relative;
  visibility: hidden;
  width: 100%;
  max-width: 1700px;
  min-height: 100%;
  margin: 0 auto;
  padding-bottom: 210px;
  font-size: 14px;
  letter-spacing: 0.1em;
}
.common-nav,
.character,
.cut,
.modal {
  position: relative;
  z-index: 100;
  width: 100%;
}
.common-nav__cnt,
.character__cnt,
.cut__cnt,
.modal__cnt {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}
main {
  width: 100%;
  margin: 0 auto;
  padding: 0 0;
}
.bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
  max-width: 1700px;
  width: 100%;
  height: 100%;
}
.image-sp {
  display: none !important;
}
.common-header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 500;
  width: 100%;
  height: 46px;
  border-bottom: 1px solid #000;
  background-color: #fff;
}
.common__btn-sound {
  position: absolute;
  display: none;
  width: 114px;
  max-width: 1700px;
  right: 0;
  top: 146px;
  z-index: 300;
  text-align: right;
}
@media screen and (min-width: 1700px) {
  .common__btn-sound {
    right: calc((100% - 1700px) / 2);
  }
}
.common__btn-sound.fixed {
  position: fixed;
  top: 62px;
}
.common__btn-sound a {
  display: inline-block;
  overflow: hidden;
  width: 114px;
  height: 39px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -498.5px -933.5px;
}
.common__btn-sound a:hover {
  display: inline-block;
  overflow: hidden;
  width: 114px;
  height: 39px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -623.5px -933.5px;
}
.common__btn-sound a.muted {
  display: inline-block;
  overflow: hidden;
  width: 114px;
  height: 39px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -248.5px -933.5px;
}
.common__btn-sound a.muted:hover {
  display: inline-block;
  overflow: hidden;
  width: 114px;
  height: 39px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -373.5px -933.5px;
}
body.loaded .common__btn-sound {
  display: block;
}
.header__btn-switch {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 300;
}
.header__btn-switch a {
  display: inline-block;
  overflow: hidden;
  width: 100px;
  height: 100px;
  background-repeat: no-repeat;
  background-image: url("../images/logo_switch.png");
  background-size: 100px 100px;
}
.common-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 40px;
  background-color: #f00;
  color: #fff;
}
.common-footer a {
  color: #fff;
  text-decoration: none;
}
.common-footer a:hover {
  text-decoration: underline;
}
.common-footer__list-links {
  position: absolute;
  left: 30px;
  top: 12px;
  display: -ms-flexbox;
  display: box;
  display: flex;
}
.common-footer__item {
  margin-right: 30px;
}
.common-footer__copy {
  position: absolute;
  right: 30px;
  top: 12px;
}
.common-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 400;
  height: 160px;
  background-image: url("../../assets/images/common/common-nav__bg.png");
  background-position: center bottom;
  background-size: 1700px 160px;
}
.common-nav__list-wrap {
  width: 962px;
  height: 86px;
  margin: 0 auto;
  position: relative;
}
.common-nav a {
  pointer-events: auto;
}
.common-nav__list {
  display: -ms-flexbox;
  display: box;
  display: flex;
  width: 962px;
  margin: 80px auto 0;
  padding-bottom: 24px;
  background-image: url("../../assets/images/common/common-nav__bg-list_plus.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 962px 32px;
}
.common-nav__list li {
  position: relative;
}
.common-nav.show-footer {
  position: absolute;
  bottom: 40px;
}
.common-nav__item-top a {
  display: inline-block;
  overflow: hidden;
  width: 165px;
  height: 60px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-5.png");
  background-size: 745px 120px;
  background-position: 0px 0px;
}
.common-nav__item-top a:hover {
  background-position: 0px -60px;
}
.common-nav__item-character a {
  display: inline-block;
  overflow: hidden;
  width: 165px;
  height: 60px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-5.png");
  background-size: 745px 120px;
  background-position: -578px 0px;
}
.common-nav__item-character a:hover {
  background-position: -578px -60px;
}
.common-nav__item-world a {
  display: inline-block;
  overflow: hidden;
  width: 235px;
  height: 60px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-5.png");
  background-size: 745px 120px;
  background-position: -343px 0px;
}
.common-nav__item-world a:hover {
  background-position: -343px -60px;
}
.common-nav__item-movie a {
  display: inline-block;
  overflow: hidden;
  width: 178px;
  height: 60px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-5.png");
  background-size: 745px 120px;
  background-position: -165px 0px;
}
.common-nav__item-movie a:hover {
  background-position: -165px -60px;
}
.common-nav__frame-selecting--left,
.common-nav__frame-selecting--right {
  position: absolute;
  top: -15px;
  display: block;
  width: 33px;
  height: 96px;
  background-image: url("../../assets/images/common/common-nav__frame-selecting_plus.png");
  background-size: 66px 96px;
}
.common-nav__frame-selecting--left {
  left: 0;
}
.common-nav__frame-selecting--right {
  right: 0;
  background-position: 100% 0;
}
.promo__btn-switch {
  position: absolute;
  z-index: 5;
  right: 0px;
  bottom: 10px;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
  -ms-transform: scale(0.8, 0.8);
  transform: scale(0.8, 0.8);
}
.promo__btn-switch a {
  display: inline-block;
  overflow: hidden;
  width: 260px;
  height: 102px;
  background: url("../images/index/promo__btn-switch.png") no-repeat 0 -102px;
  background-size: 260px 306px;
}
.promo__btn-switch a.odd {
  background-position: 0px -102px;
}
.promo__btn-switch a:hover {
  background-position: 0px -204px;
}
.blind-left,
.blind-right {
  display: none;
}
@media screen and (min-width: 1700px) {
  .blind-left,
  .blind-right {
    display: block;
    position: fixed;
    top: 0;
    z-index: 600;
    width: 50%;
    height: 100%;
    background-color: #fff;
  }
  .blind-left {
    left: -850px;
    background-color: #e6325a;
    background-image: url("../../assets/images/common/common__bg-red.png");
    background-size: 100px 100px;
    background-repeat: repeat;
    box-shadow: 3px 0 5px 1px rgba(182,182,182,0.3);
  }
  .blind-right {
    right: -850px;
    background-color: #f5aa00;
    background-image: url("../../assets/images/common/common__bg-yellow.png");
    background-size: 100px 100px;
    background-repeat: repeat;
    box-shadow: -3px 0 5px 1px rgba(182,182,182,0.3);
  }
}
body {
  background-color: #fff;
}
main {
  width: 100%;
}
#Content {
  background: url("../../assets/images/character/character__bg_left01.png") left top no-repeat, url("../../assets/images/character/character__bg_left02.png") left top 1920px no-repeat, url("../../assets/images/character/character__bg_left03.png") left top 3170px no-repeat, url("../../assets/images/character/character__bg_right01.png") right top no-repeat, url("../../assets/images/character/character__bg_right02.png") right top 1500px no-repeat, url("../../assets/images/character/character__bg_center.png") center top -30px no-repeat, url("../../assets/images/character/cut__bg-mat.png") center top 900px no-repeat, url("../../assets/images/common/common__bg-check.png") repeat;
  padding-bottom: 0;
}
/*--------------------------------------------
CHARACTER SECTION
--------------------------------------------*/
.character {
  margin-bottom: 30px;
  text-align: center;
}
.character__ttl-main {
  padding-top: 146px;
  margin-bottom: 60px;
}
.character__txt-main {
  margin-bottom: 40px;
}
.character__chara {
  margin: auto;
  width: 600px;
  height: 300px;
  background: url("../images/character/character__chara.png") no-repeat 0 0;
  background-size: 600px 300px;
}
/*--------------------------------------------
CUT SECTION
--------------------------------------------*/
.cut,
.modal {
  margin: 9px auto 0;
}
.cut__cnt,
.modal__cnt {
  box-sizing: border-box;
  padding: 120px 0 380px;
  text-align: center;
}
.cut__ttl-main,
.modal__ttl-main {
  margin-bottom: 40px;
}
.cut__wrp-video,
.modal__wrp-video {
  overflow: hidden;
  position: relative;
  height: 427px;
  margin-bottom: 100px;
}
.cut__cnt-video,
.modal__cnt-video {
  position: relative;
  top: 0;
  left: 0;
  z-index: 600;
  width: 100%;
  height: 100%;
}
.cut__cnt-video--fixed,
.modal__cnt-video--fixed {
  position: fixed;
}
.cut__cnt-video--fixed .cut__bg-video,
.modal__cnt-video--fixed .cut__bg-video {
  display: block;
}
.cut__cnt-video--fixed .cut__btn-close,
.modal__cnt-video--fixed .cut__btn-close {
  display: block;
}
.cut__bg-video,
.modal__bg-video {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,0.8);
}
.cut__video,
.modal__video {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  box-sizing: border-box;
  position: relative;
  z-index: 110;
  width: 741px;
  height: 424px;
  padding: 14px 16px 14px 12px;
  background-image: url("../images/common/common__bg-video.png");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 741px 424px;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.cut__btn-left,
.modal__btn-left,
.cut__btn-right,
.modal__btn-right {
  position: absolute;
  top: 0;
  display: block;
  z-index: 110;
  height: 100%;
}
.cut__btn-chara,
.modal__btn-chara {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  overflow: hidden;
  width: 130px;
  height: 130px;
  margin-top: -170px;
  margin-left: -32px;
}
.cut__btn-chara img,
.modal__btn-chara img {
  display: block;
  width: 100%;
  height: auto;
}
.cut__btn-arrow,
.modal__btn-arrow {
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -35px;
}
.cut__btn-left,
.modal__btn-left {
  left: 50%;
  margin-left: -480px;
}
.cut__btn-left .cut__btn-arrow,
.modal__btn-left .cut__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -924.5px -621.5px;
}
.cut__btn-left:hover .cut__btn-arrow,
.modal__btn-left:hover .cut__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -933.5px;
}
.cut__btn-right,
.modal__btn-right {
  left: 50%;
  margin-left: 410px;
}
.cut__btn-right .cut__btn-arrow,
.modal__btn-right .cut__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -86.5px -933.5px;
}
.cut__btn-right:hover .cut__btn-arrow,
.modal__btn-right:hover .cut__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -167.5px -933.5px;
}
.cut__list,
.modal__list {
  position: relative;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -o-box-lines: multiple;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -o-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 960px;
  margin: 0 auto 50px;
}
.cut__list li,
.modal__list li {
  margin: 0 0 50px;
}
.cut__item-1 a,
.modal__item-1 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -5.5px;
}
.cut__item-1 a:hover,
.modal__item-1 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -5.5px;
}
.cut__item-2 a,
.modal__item-2 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -5.5px;
}
.cut__item-2 a:hover,
.modal__item-2 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -5.5px;
}
.cut__item-3 a,
.modal__item-3 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -261.5px;
}
.cut__item-3 a:hover,
.modal__item-3 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -261.5px;
}
.cut__item-4 a,
.modal__item-4 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -261.5px;
}
.cut__item-4 a:hover,
.modal__item-4 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -261.5px;
}
.cut__item-5 a,
.modal__item-5 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -517.5px;
}
.cut__item-5 a:hover,
.modal__item-5 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -517.5px;
}
.cut__item-6 a,
.modal__item-6 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -517.5px;
}
.cut__item-6 a:hover,
.modal__item-6 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -517.5px;
}
.cut__item-7 a,
.modal__item-7 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -773.5px;
}
.cut__item-7 a:hover,
.modal__item-7 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -773.5px;
}
.cut__item-8 a,
.modal__item-8 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -773.5px;
}
.cut__item-8 a:hover,
.modal__item-8 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-1.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -773.5px;
}
.cut__item-9 a,
.modal__item-9 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -5.5px;
}
.cut__item-9 a:hover,
.modal__item-9 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -5.5px;
}
.cut__item-10 a,
.modal__item-10 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -5.5px;
}
.cut__item-10 a:hover,
.modal__item-10 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -5.5px;
}
.cut__item-11 a,
.modal__item-11 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -261.5px;
}
.cut__item-11 a:hover,
.modal__item-11 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -261.5px;
}
.cut__item-12 a,
.modal__item-12 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -261.5px;
}
.cut__item-12 a:hover,
.modal__item-12 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -261.5px;
}
.cut__item-13 a,
.modal__item-13 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -517.5px;
}
.cut__item-13 a:hover,
.modal__item-13 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -517.5px;
}
.cut__item-14 a,
.modal__item-14 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -517.5px;
}
.cut__item-14 a:hover,
.modal__item-14 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -517.5px;
}
.cut__item-15 a,
.modal__item-15 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -773.5px;
}
.cut__item-15 a:hover,
.modal__item-15 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -773.5px;
}
.cut__item-16 a,
.modal__item-16 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -773.5px;
}
.cut__item-16 a:hover,
.modal__item-16 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-2.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -773.5px;
}
.cut__item-17 a,
.modal__item-17 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -5.5px;
}
.cut__item-17 a:hover,
.modal__item-17 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -5.5px;
}
.cut__item-18 a,
.modal__item-18 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -5.5px;
}
.cut__item-18 a:hover,
.modal__item-18 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -5.5px;
}
.cut__item-19 a,
.modal__item-19 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -261.5px;
}
.cut__item-19 a:hover,
.modal__item-19 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -222.5px -261.5px;
}
.cut__item-20 a,
.modal__item-20 a {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -439.5px -261.5px;
}
.cut__item-20 a:hover,
.modal__item-20 a:hover {
  display: inline-block;
  overflow: hidden;
  width: 206px;
  height: 245px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -656.5px -261.5px;
}
.cut__frame-selecting,
.modal__frame-selecting {
  position: absolute;
  top: -30px;
  left: 0;
}
/*--------------------------------------------
MODAL SECTION
--------------------------------------------*/
.modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 600;
}
.modal__bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,0.8);
}
.modal__cnt-wrp {
  position: relative;
  height: 100%;
}
.modal__btn-close {
  position: absolute;
  top: 30px;
  right: 30px;
  z-index: 110;
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -762.5px -621.5px;
}
.modal__btn-close:hover {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -843.5px -621.5px;
}
.modal__btn-left {
  left: 50%;
  margin-left: -480px;
}
.modal__btn-left .modal__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -924.5px -621.5px;
}
.modal__btn-left:hover .modal__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -5.5px -933.5px;
}
.modal__btn-right {
  left: 50%;
  margin-left: 410px;
}
.modal__btn-right .modal__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -86.5px -933.5px;
}
.modal__btn-right:hover .modal__btn-arrow {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -167.5px -933.5px;
}
/*--------------------------------------------
MODAL SECTION
--------------------------------------------*/
.switch {
  display: none;
  position: absolute;
  top: 40px;
  left: 0;
  width: 100%;
  height: 100%;
  margin-bottom: 180px;
  z-index: 600;
}
.switch__bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,0.8);
}
.switch__cnt-wrp {
  box-sizing: border-box;
  position: relative;
  z-index: 100;
  width: 970px;
  height: 1493px;
  margin: 0 auto;
  padding-top: 160px;
  padding-bottom: 120px;
  background-image: url("../images/index/switch__bg-board.png");
  background-repeat: no-repeat;
  text-align: center;
}
.switch__ttl-main {
  margin-bottom: 40px;
}
.switch__chara {
  box-sizing: border-box;
  width: 550px;
  height: 210px;
  margin: 0 auto 30px;
  padding-top: 60px;
  background-image: url("../images/index/switch__bg-device.png");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 550px 420px;
  text-align: center;
  animation: switch__bg-device 1s steps(2) infinite;
}
@keyframes switch__bg-device {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -420px;
  }
}
.switch__txt-main {
  margin-bottom: 40px;
}
.switch__wrp-howto {
  box-sizing: border-box;
  width: 770px;
  height: 370px;
  margin: 0 auto 50px;
  padding-top: 120px;
  background-image: url("../images/index/switch__bg-howto.png");
  background-repeat: no-repeat;
  text-align: center;
  padding-left: 50px;
}
.switch__ttl-howto {
  margin: 0 auto 12px;
}
.switch__cnt-howto {
  display: -ms-flexbox;
  display: box;
  display: flex;
  -o-box-pack: distribute;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  width: 500px;
  margin: 0 auto;
  padding-left: 20px;
}
.switch__item-howto {
  margin: 0 12px;
}
.switch__txt-solo {
  margin-bottom: 30px;
}
.switch__wrp-solo {
  display: -ms-flexbox;
  display: box;
  display: flex;
  -o-box-pack: distribute;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  width: 530px;
  margin: 0 auto;
}
.switch__img-solo02 {
  box-sizing: border-box;
  width: 260px;
  height: 157px;
  padding-top: 20px;
  background-image: url("../images/index/switch__img-solo02.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 260px 157px;
  text-align: center;
}
.switch__btn {
  position: absolute;
  bottom: -10px;
  left: 670px;
  display: inline-block;
  overflow: hidden;
  width: 203px;
  height: 140px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -326.5px -517.5px;
}
.switch__btn:hover {
  display: inline-block;
  overflow: hidden;
  width: 203px;
  height: 140px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-3.png");
  background-size: 1024px 1024px;
  background-position: -540.5px -517.5px;
}
.switch__btn a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
.switch__btn-close {
  position: absolute;
  right: 90px;
  top: 130px;
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -762.5px -621.5px;
}
.switch__btn-close:hover {
  display: inline-block;
  overflow: hidden;
  width: 70px;
  height: 70px;
  background-repeat: no-repeat;
  background-image: url("../images/btns-0.png");
  background-size: 1024px 1024px;
  background-position: -843.5px -621.5px;
}