.page-title {
  margin: 0 0 0vw;
}

.world-area {
  background: url(/_materials/img/about/bg-world_sp.jpg) no-repeat center 0/cover #000;
  position: relative;
}

@media (min-width: 769px) {
  .world-area {
    background: url(/_materials/img/about/bg-world_pc.jpg) no-repeat center 0/cover #000;
	overflow: hidden;
  }
}

.world-area .chara01 {
  position: absolute;
  top: 36.97917vw;
  left: 0;
  width: 63.41146vw;
}

@media (min-width: 769px) {
  .world-area .chara01 {
    top: 13.9375vw;
    left: -1.21875vw;
    width: 34.09375vw;
  }
}

.world-area .chara02 {
  position: absolute;
  top: 30.85938vw;
  right: 0;
  width: 72.52604vw;
}

@media (min-width: 769px) {
  .world-area .chara02 {
    top: 11vw;
    right: auto;
    left: 15.59375vw;
    width: 40.84375vw;
  }
}

.world-area .chara03 {
  position: absolute;
  top: 10.9375vw;
  right: 0;
  width: 95.70312vw;
}

@media (min-width: 769px) {
  .world-area .chara03 {
    top: 1.4375vw;
    right: auto;
    left: 4.46875vw;
    width: 46.34375vw;
  }
}

.world-area .bg-grd {
  position: absolute;
  top: 121.09375vw;
  left: 0;
  width: 100%;
}

@media (min-width: 769px) {
  .world-area .bg-grd {
    top: 0;
    right: 0;
    left: auto;
    width: 50.125vw;
  }
  .world-area .bg-grd img {
    height: 100%;
  }
}

.world-area .world-inner {
  padding: 110.28646vw 4.55729vw 11.71875vw;
  position: relative;
}

.world-area .world-inner .logo-wna {
  margin: auto;
  padding: 0 0 3.90625vw;
  width: 46.875vw;
  -webkit-filter: drop-shadow(0 0 5px #000);
          filter: drop-shadow(0 0 5px #000);
}

.world-area .world-inner _:-ms-lang(x)::-ms-backdrop, .world-area .world-inner .logo-wna img {
  width: 100%;
}

@media (min-width: 769px) {
  .world-area .world-inner {
    margin: 0 0 0 50vw;
    padding: 7.1875vw 0;
    width: 46.875vw;
  }
  .world-area .world-inner .logo-wna {
    padding: 0 0 0.9375vw;
    width: 18.4375vw;
  }
}

.character-area .slick-arrow {
  font-size: 0;
  position: absolute;
  top: 45%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  padding: 0;
  height: 13.80208vw;
  width: 11.06771vw;
  z-index: 99;
}

@media (min-width: 769px) {
  .character-area .slick-arrow {
    height: 6.625vw;
    width: 5.3125vw;
  }
}

.character-area .slick-prev {
  background: url(/_materials/img/about/btn-arrow-left.svg) no-repeat 0 0/100%;
  left: 5.20833vw;
}

@media (min-width: 769px) {
  .character-area .slick-prev {
    left: 3vw;
  }
}

.character-area .slick-next {
  background: url(/_materials/img/about/btn-arrow-right.svg) no-repeat 0 0/100%;
  right: 5.20833vw;
}

@media (min-width: 769px) {
  .character-area .slick-next {
    right: 3vw;
  }
}

.character-area .slide-chara {
  height: 178.38542vw;
  position: relative;
  overflow: hidden;
}

@media (min-width: 769px) {
  .character-area .slide-chara {
    height: 56.25vw;
  }
}

.character-area .slide-chara .chara-img {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

@media (min-width: 769px) {
  .character-area .slide-chara .chara-img {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}

.character-area .slide-chara .chara-info-block {
  position: absolute;
  left: 4.55729vw;
  bottom: 13.02083vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara .chara-info-block {
    top: 50%;
    bottom: auto;
    left: 43.125vw;
    -webkit-transform: translate(0, -50%);
            transform: translate(0, -50%);
  }
}

.character-area .slide-chara h2 {
  color: #fff;
  font-size: 14.0625vw;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

@media (min-width: 769px) {
  .character-area .slide-chara h2 {
    font-size: 6.25vw;
    text-shadow: 0 0 0.625vw rgba(0, 0, 0, 0.5);
  }
}

.character-area .slide-chara .chara-info {
  color: #fff;
  font-size: 3.64583vw;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  padding: 0 5.20833vw 0 0;
}

@media (min-width: 769px) {
  .character-area .slide-chara .chara-info {
    font-size: 1.75vw;
    text-shadow: 0 0 0.625vw rgba(0, 0, 0, 0.5);
    padding: 0 14.0625vw 0 0;
  }
}

.character-area .slide-chara01 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#33e7e4), to(#03d8d7));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#33e7e4, #03d8d7);
}

.character-area .slide-chara01 .chara-img {
  top: 17.96875vw;
  width: 72.39583vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara01 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/cover, -webkit-gradient(linear, left top, left bottom, from(#33e7e4), to(#03d8d7));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/cover, linear-gradient(#33e7e4, #03d8d7);
  }
  .character-area .slide-chara01 .chara-img {
    top: 6.09375vw;
    left: 15.21875vw;
    width: 25.3125vw;
  }
}

.character-area .slide-chara02 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#ffa800), to(#ffc048));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#ffa800, #ffc048);
}

.character-area .slide-chara02 .chara-img {
  top: 13.54167vw;
  left: calc(50% + 5.85938vw);
  width: 78.77604vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara02 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#ffa800), to(#ffc048));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#ffa800, #ffc048);
  }
  .character-area .slide-chara02 .chara-img {
    top: 4.53125vw;
    left: 16.28125vw;
    width: 27.4375vw;
  }
}

.character-area .slide-chara03 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#0bbcf9), to(#4bcffa));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#0bbcf9, #4bcffa);
}

.character-area .slide-chara03 .chara-img {
  top: 8.20312vw;
  left: calc(50% + 18.48958vw);
  width: 99.34896vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara03 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#0bbcf9), to(#4bcffa));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#0bbcf9, #4bcffa);
  }
  .character-area .slide-chara03 .chara-img {
    top: 2.65625vw;
    left: 15.625vw;
    width: 34.65625vw;
  }
}

.character-area .slide-chara04 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#ffd329), to(#ffdd58));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#ffd329, #ffdd58);
}

.character-area .slide-chara04 .chara-img {
  top: 20.44271vw;
  left: calc(50% + 11.84896vw);
  width: 81.64062vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara04 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#ffd329), to(#ffdd58));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#ffd329, #ffdd58);
  }
  .character-area .slide-chara04 .chara-img {
    top: 6.90625vw;
    left: 17.375vw;
    width: 28.53125vw;
  }
}

.character-area .slide-chara05 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#3c40c6), to(#575fcf));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#3c40c6, #575fcf);
}

.character-area .slide-chara05 .chara-img {
  top: 17.96875vw;
  left: calc(50% + 13.15104vw);
  width: 172.52604vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara05 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#3c40c6), to(#575fcf));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#3c40c6, #575fcf);
  }
  .character-area .slide-chara05 .chara-img {
    top: 6.09375vw;
    left: 1.5vw;
    width: 60.1875vw;
  }
}

.character-area .slide-chara06 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#0ac46b), to(#0ee881));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#0ac46b, #0ee881);
}

.character-area .slide-chara06 .chara-img {
  top: 9.89583vw;
  left: calc(50% + 7.29167vw);
  width: 88.28125vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara06 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#0ac46b), to(#0ee881));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#0ac46b, #0ee881);
  }
  .character-area .slide-chara06 .chara-img {
    top: 3.46875vw;
    left: 14.3125vw;
    width: 30.8125vw;
  }
}

.character-area .slide-chara07 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#f53b57), to(#ef5777));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#f53b57, #ef5777);
}

.character-area .slide-chara07 .chara-img {
  top: 17.05729vw;
  left: calc(50% + 7.94271vw);
  width: 84.63542vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara07 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#f53b57), to(#ef5777));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#f53b57, #ef5777);
  }
  .character-area .slide-chara07 .chara-img {
    top: 4.90625vw;
    left: 16.6875vw;
    width: 29.5vw;
  }
}

.character-area .slide-chara08 {
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#ff3f33), to(#ff5e57));
  background: url(/_materials/img/about/bg-kasumi_sp.png) no-repeat 0 0/contain, linear-gradient(#ff3f33, #ff5e57);
}

.character-area .slide-chara08 .chara-img {
  top: 17.44792vw;
  left: calc(50% + 3.25521vw);
  width: 95.18229vw;
}

@media (min-width: 769px) {
  .character-area .slide-chara08 {
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, -webkit-gradient(linear, left top, left bottom, from(#ff3f33), to(#ff5e57));
    background: url(/_materials/img/about/bg-kasumi_pc.png) no-repeat 0 0/contain, linear-gradient(#ff3f33, #ff5e57);
  }
  .character-area .slide-chara08 .chara-img {
    top: 3.75vw;
    left: 14.5625vw;
    width: 33.34375vw;
  }
}

.gum-area {
  background: url(/_materials/img/about/bg-wood_sp.jpg) no-repeat 0 0/cover;
  height: 166.66667vw;
  position: relative;
}

@media (min-width: 769px) {
  .gum-area {
    background: url(/_materials/img/about/bg-wood_pc.jpg) no-repeat 0 0/cover;
    height: 64.375vw;
  }
}

.gum-area .bg-gum {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.gum-area .bg-grd {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
}

.gum-area .gum-text {
  position: absolute;
  left: 0;
  bottom: 19.53125vw;
  text-shadow: 0 0 10px black;
}

@media (min-width: 769px) {
  .gum-area .gum-text {
    bottom: 3.125vw;
  }
}

.gum-area .gum-text .title-h2 {
  padding: 104.16667vw 5.20833vw 2.60417vw;
}

@media (min-width: 769px) {
  .gum-area .gum-text .title-h2 {
    padding: 46.875vw 3.125vw 0.625vw;
  }
}

.gum-area .gum-text .text {
  padding: 0 5.20833vw;
}

@media (min-width: 769px) {
  .gum-area .gum-text .text {
    padding: 0 3.125vw 3.125vw;
  }
}

/* 20210518 kk add button area */
.morebtn-area{
  padding: 2em 1em 4em;
  background: url("/_materials/img/ninja-gum/_detail/movie-area-bg.jpg");
}
.more-btn li{
  margin: 1.8vw 0;
  position: relative;
  width: 100%;
  border: 5px solid #000;
  border-radius: 12px;
  overflow: hidden;
  font-size: 3vw;
}
.more-btn li:hover{border: 5px solid #bc65ff;}
.more-btn li img{
  width: 100%;
  object-fit: cover
}
.btn-name{
  position: absolute;
  bottom: 0;
  background: rgba(0, 0, 0, 0.8);
  padding: .5em 0;
  width: 100%;
  color:#fff;
  text-align: center;
}
@media (max-width: 768px) {
  .more-btn li img{height: 24vw;}
}
@media (min-width: 769px) {
  .more-btn{
  display: flex;
  justify-content:space-between;
  }
  .more-btn li{
      width: 32%;
      font-size: 1.3em;
  }
  .more-btn li img{max-height: 280px;}
}