@charset "UTF-8";
.wrapper {
  background: none;
  width: 100%;
  overflow: hidden;
  position: relative; }

.wrapper:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  background: none;
  padding-top: 0; }

.mainBg {
  background-size: cover; }

#modalMovie.modalMovie iframe {
  width: 890px;
  height: 500px; }

.modalMovie-o {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vw;
  z-index: 8010;
  background: url("../../public/img/top/overlay.png"); }

iframe[name="google_conversion_frame"] {
  position: absolute;
  height: 0; }

.modalMovie {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 8010; }
  .modalMovie iframe {
    width: 1000px;
    height: 500px; }
  .modalMovie .cookie {
    padding: 20px 0;
    width: 280px;
    margin: 0 auto; }
    .modalMovie .cookie .close {
      position: relative;
      top: 0;
      left: 0;
      display: block;
      width: 28px;
      height: 28px;
      margin-right: 20px;
      background-color: #e0e0e0; }
    .modalMovie .cookie .close.check:before {
      content: "";
      position: absolute;
      top: 4px;
      left: 5px;
      width: 17px;
      height: 9px;
      border: 0px;
      border-top: solid 2px #000000;
      border-right: solid 2px #000000;
      -ms-transform: rotate(138deg);
      -webkit-transform: rotate(138deg);
      transform: rotate(138deg);
      z-index: 1; }
    .modalMovie .cookie p {
      color: #000000;
      font-size: 17px; }
    .modalMovie .cookie p, .modalMovie .cookie .close {
      display: inline-block;
      vertical-align: middle; }
  .modalMovie p {
    text-align: center; }

.keyContents .youtubeArea .youtube iframe {
  width: 1024px;
  height: 564px;
  position: relative;
  z-index: 50; }
.keyContents .youtubeArea .youtube .movie-text {
  position: relative;
  z-index: 50;
  text-align: center;
  padding-top: 20px; }
.keyContents .youtubeArea .snsBox {
  float: left;
  position: relative;
  z-index: 50; }
  .keyContents .youtubeArea .snsBox .btn {
    float: left; }
  .keyContents .youtubeArea .snsBox .btn-tw {
    margin-right: 10px; }
.keyContents .youtubeArea .youtubeCount {
  float: right;
  position: relative;
  z-index: 50; }
  .keyContents .youtubeArea .youtubeCount .count, .keyContents .youtubeArea .youtubeCount .conutNum {
    display: inline-block;
    vertical-align: middle; }
  .keyContents .youtubeArea .youtubeCount .conutNum li {
    float: left;
    width: 46px;
    height: 63px;
    background-color: #000000;
    margin-right: 10px; }
    .keyContents .youtubeArea .youtubeCount .conutNum li p img {
      font-size: 0; }
  .keyContents .youtubeArea .youtubeCount .conutNum li:last-of-type {
    margin-right: 0px; }
.keyContents .keyPlace {
  position: relative;
  padding-bottom: 88px; }
  .keyContents .keyPlace .mainv-text {
    float: right;
    position: relative;
    z-index: 50; }
  .keyContents .keyPlace .mainv-part {
    float: left;
    position: relative;
    z-index: 50;
    text-align: center; }
    .keyContents .keyPlace .mainv-part .day {
      margin-top: 20px;
      margin-left: 30px; }
    .keyContents .keyPlace .mainv-part .day01 {
      margin-left: 0; }
    .keyContents .keyPlace .mainv-part .day02 {
      margin-top: 40px; }
  .keyContents .keyPlace .mainv-part:before {
    content: "";
    position: absolute;
    bottom: -76px;
    left: -10px;
    width: 95px;
    height: 82px;
    background: url("../../public/img/top/10th-logo.png") no-repeat; }
.keyContents .keyPlace:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 795px;
  height: 784px;
  transform: translateY(-100px) translateX(87px);
  background: url("../../public/img/top/main-v.png") no-repeat center; }

.section-what {
  width: 100%;
  background: rgba(0, 0, 0, 0.8);
  position: relative;
  z-index: 20; }
  .section-what .section-inner {
    width: 1280px;
    position: relative;
    top: 0;
    left: 140px; }
    .section-what .section-inner .leftBox, .section-what .section-inner .rightBox {
      float: left; }
    .section-what .section-inner .leftBox {
      width: 500px; }
      .section-what .section-inner .leftBox .whatnews {
        padding: 20px 0; }
    .section-what .section-inner .rightBox {
      width: 642px;
      border-left: 1px solid #ffffff; }
      .section-what .section-inner .rightBox .icon {
        display: block;
        position: relative;
        top: 0;
        left: 0; }
      .section-what .section-inner .rightBox .icon:before {
        content: "";
        width: 170px;
        height: 170px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -85px;
        margin-left: -85px;
        background: url("../../public/img/top/playback.png") no-repeat; }
      .section-what .section-inner .rightBox .icon:after {
        content: "스토리 트레일러";
        position: absolute;
        top: 30px;
        left: 0;
        padding: 5px;
        font-size: 16px;
        color: #fedf76;
        background-color: #000000; }
    .section-what .section-inner li {
      display: flex;
      padding-bottom: 10px;
      font-size: 0; }
      .section-what .section-inner li p {
        display: inline-block;
        vertical-align: middle;
        font-size: 14px;
        line-height: 20px; }
        .section-what .section-inner li p a {
          display: inline-block; }
      .section-what .section-inner li p:first-of-type {
        color: #ffdf6f; }
      .section-what .section-inner li p a:last-of-type {
        color: #ffffff;
        padding-left: 10px; }

.section-news .title {
  text-align: center;
  padding: 30px 0; }
.section-news ul {
  display: flex;
  flex-wrap: wrap; }
.section-news li {
  float: none;
  width: 251px;
  min-height: 270px;
  background-color: #ffffff;
  margin-right: 5px;
  margin-bottom: 5px; }
  .section-news li p a, .section-news li p span {
    display: block; }
    .section-news li p a img, .section-news li p span img {
      width: 252px;
      height: 160px; }
  .section-news li p .day {
    font-size: 11px;
    line-height: 19px;
    padding: 10px 10px 0 10px; }
  .section-news li p .text {
    font-size: 14px;
    line-height: 21px;
    padding: 10px; }
.section-news li:nth-of-type(4n + 4) {
  margin-right: 0; }
.section-news .btn {
  text-align: center;
  padding-top: 20px; }

.bg {
  background: url("../../public/img/common/allBgmin.png") repeat;
  position: relative;
  z-index: 50; }

.section-pict {
  padding-bottom: 40px; }
  .section-pict .title {
    text-align: center;
    padding: 60px 0 30px 0px; }
  .section-pict .leftBox, .section-pict .rightBox {
    float: left;
    position: relative; }
  .section-pict .rightBox {
    margin-left: 34px; }
    .section-pict .rightBox p {
      margin-bottom: 15px; }
    .section-pict .rightBox p:last-of-type {
      margin-bottom: 0; }
  .section-pict .leftBox p {
    margin-bottom: 10px; }
  .section-pict .leftBox p:last-of-type {
    margin-bottom: 0; }
  .section-pict .leftBox .btn-10th {
    position: absolute;
    bottom: 370px;
    left: 80px; }
  .section-pict .leftBox .top_movie {
    display: block; }
    .section-pict .leftBox .top_movie .icon:before {
      content: "";
      width: 170px;
      height: 170px;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -85px;
      margin-left: -85px;
      background: url(../../public/img/top/playback.png) no-repeat; }
  .section-pict .banner-dlc {
    text-align: center; }
    .section-pict .banner-dlc img {
      max-width: 100%; }

.spec {
  position: relative;
  z-index: 30;
  background-color: #ffffff; }
  .spec .specV .banner {
    text-align: center;
    position: relative;
    z-index: 60; }
  .spec .specV .artistArea {
    padding-bottom: 60px; }
    .spec .specV .artistArea .title {
      text-align: center;
      padding: 50px 0; }
  .spec .specV .left {
    float: left;
    margin-left: 19px;
    margin-top: 20px; }
  .spec .specV .right {
    float: right;
    margin-right: 140px; }
    .spec .specV .right li p {
      font-size: 16px;
      line-height: 33px; }
      .spec .specV .right li p span.oo01 {
        padding-left: 3.7em; }
      .spec .specV .right li p span.oo02 {
        padding-left: 2.7em; }
      .spec .specV .right li p span {
        padding-left: 79px; }

.themaSong .artistArea {
  width: 1076px;
  height: 1212px;
  background: url("../../public/img/top/artist-bg.png") no-repeat;
  position: relative; }
  .themaSong .artistArea .movie {
    position: absolute;
    bottom: 67px;
    left: 50%;
    margin-left: -243px; }
    .themaSong .artistArea .movie .icon {
      display: block;
      position: relative;
      top: 0;
      left: 0; }
    .themaSong .artistArea .movie .icon:before {
      content: "";
      width: 170px;
      height: 170px;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -121px;
      margin-left: -85px;
      background: url("../../public/img/top/playback.png") no-repeat; }
  .themaSong .artistArea .song {
    position: absolute;
    bottom: 80px;
    right: 57px; }

@media screen and (max-width: 1280px) {
  .section-inner {
    width: 80%; }

  .keyContents .youtubeArea .youtube iframe {
    width: 1024px;
    height: 564px;
    position: relative;
    z-index: 50; }
  .keyContents .youtubeArea .youtube .movie-text {
    position: relative;
    z-index: 50;
    text-align: center;
    padding-top: 2%; }
  .keyContents .youtubeArea .snsBox {
    float: left;
    position: relative;
    z-index: 50; }
    .keyContents .youtubeArea .snsBox .btn {
      float: left; }
    .keyContents .youtubeArea .snsBox .btn-tw {
      margin-right: 1%; }
  .keyContents .youtubeArea .youtubeCount {
    float: right;
    position: relative;
    z-index: 50; }
  .keyContents .keyPlace {
    position: relative;
    padding-bottom: 11%; }
    .keyContents .keyPlace .mainv-text {
      float: right;
      position: relative;
      z-index: 50;
      margin-right: -3%; }
    .keyContents .keyPlace .mainv-part {
      float: left;
      position: relative;
      z-index: 50;
      text-align: center;
      width: 55%; }
      .keyContents .keyPlace .mainv-part .logo {
        margin-left: 2%;
        width: 90%; }
        .keyContents .keyPlace .mainv-part .logo img {
          width: 100%; }
      .keyContents .keyPlace .mainv-part .day {
        margin-top: 2%;
        margin-left: 5%;
        width: 70%; }
        .keyContents .keyPlace .mainv-part .day img {
          width: 100%; }
      .keyContents .keyPlace .mainv-part .day02 {
        margin-top: 7%;
        width: 66%; }
        .keyContents .keyPlace .mainv-part .day02 img {
          width: 100%; }
    .keyContents .keyPlace .mainv-part:before {
      content: "";
      position: absolute;
      bottom: -24%;
      right: -1%;
      width: 18%;
      height: 0;
      background: url("../../public/img/top/10th-logo.png") no-repeat;
      background-size: 100%;
      padding-top: 15%; }
  .keyContents .keyPlace:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 80%;
    height: 0;
    transform: translateY(-20%) translateX(17%);
    background: url("../../public/img/top/main-v.png") no-repeat center;
    background-size: 100%;
    padding-top: 100%; }

  .section-what {
    width: 100%;
    background: rgba(0, 0, 0, 0.8);
    position: relative;
    z-index: 20; }
    .section-what .section-inner {
      width: 100%;
      position: relative;
      top: 0;
      left: 0;
      transform: translateX(11%); }
      .section-what .section-inner .leftBox, .section-what .section-inner .rightBox {
        float: left; }
      .section-what .section-inner .leftBox {
        width: 43%; }
        .section-what .section-inner .leftBox .whatnews {
          padding: 4% 0;
          width: 50%; }
          .section-what .section-inner .leftBox .whatnews img {
            width: 100%; }
      .section-what .section-inner .rightBox {
        width: 50%;
        border-left: 1px solid #ffffff; }
        .section-what .section-inner .rightBox img {
          width: 100%; }
        .section-what .section-inner .rightBox .icon {
          display: block;
          position: relative;
          top: 0;
          left: 0; }
        .section-what .section-inner .rightBox .icon:before {
          content: "";
          width: 30%;
          height: 0;
          position: absolute;
          top: 50%;
          left: 50%;
          margin-top: -14%;
          margin-left: -14%;
          background: url("../../public/img/top/playback.png") no-repeat;
          background-size: 100%;
          padding-top: 28%; }
        .section-what .section-inner .rightBox .icon:after {
          content: "스토리 트레일러";
          position: absolute;
          top: 30px;
          left: 0;
          padding: 5px;
          font-size: 16px;
          color: #fedf76;
          background-color: #000000; }
      .section-what .section-inner li {
        padding-bottom: 3%; }
        .section-what .section-inner li p {
          display: inline-block;
          vertical-align: middle;
          font-size: 1.1vw;
          line-height: 1.3vw; }
        .section-what .section-inner li p:first-of-type {
          color: #ffdf6f; }
        .section-what .section-inner li p a:last-of-type {
          color: #ffffff;
          padding-left: 1vw; }

  .section-news {
    width: 100%; }
    .section-news .section-inner {
      width: 84%;
      margin: 0 auto; }
    .section-news .title {
      text-align: center;
      padding: 3% 0;
      width: 50%;
      margin: 0 auto; }
      .section-news .title img {
        width: 100%; }
    .section-news li {
      float: none;
      width: 24%;
      height: 24vw;
      background-color: #ffffff;
      margin-right: 1%;
      margin-bottom: 1%; }
      .section-news li p {
        width: 100%; }
        .section-news li p a, .section-news li p span {
          display: block; }
          .section-news li p a img, .section-news li p span img {
            width: 100%;
            height: auto; }
        .section-news li p .day {
          font-size: 1vw;
          line-height: 1.2vw;
          padding: 1vw 1vw 0 1vw; }
        .section-news li p .text {
          font-size: 1vw;
          line-height: 1.4vw;
          padding: 1vw; }
    .section-news li:nth-of-type(4n + 4) {
      margin-right: 0; }
    .section-news .btn {
      text-align: center;
      padding-top: 2%;
      width: 40%;
      margin: 0 auto; }
      .section-news .btn img {
        width: 100%; }

  .section-pict {
    padding-bottom: 4%; }
    .section-pict .title {
      text-align: center;
      padding: 4% 0 3% 0px;
      width: 50%;
      margin: 0 auto; }
      .section-pict .title img {
        width: 100%; }
    .section-pict .rightBox {
      margin-left: 1%;
      width: 44%; }
      .section-pict .rightBox p {
        margin-bottom: 3%;
        width: 100%; }
        .section-pict .rightBox p img {
          width: 100%; }
      .section-pict .rightBox p:last-of-type {
        margin-bottom: 0; }
    .section-pict .leftBox {
      width: 55%; }
      .section-pict .leftBox p {
        margin-bottom: 1%;
        width: 100%; }
        .section-pict .leftBox p img {
          width: 100%; }
      .section-pict .leftBox p:last-of-type {
        margin-bottom: 0; }
      .section-pict .leftBox .btn-10th {
        bottom: 30vw;
        left: 6.5vw; }
        .section-pict .leftBox .btn-10th img {
          width: 30vw; }
      .section-pict .leftBox .top_movie img {
        width: 44vw; }

  .spec {
    position: relative;
    z-index: 30;
    background-color: #ffffff; }
    .spec .specV .section-inner {
      width: 90%;
      margin: 0 auto; }
    .spec .specV .banner {
      text-align: center;
      position: relative;
      z-index: 60; }
    .spec .specV .artistArea {
      padding-bottom: 6%; }
      .spec .specV .artistArea .title {
        text-align: center;
        padding: 5% 0;
        width: 50%;
        margin: 0 auto; }
        .spec .specV .artistArea .title img {
          width: 100%; }
    .spec .specV .left {
      float: none;
      margin-left: 0;
      margin-top: 4%;
      width: 56%;
      margin: 0 auto; }
      .spec .specV .left img {
        width: 100%; }
    .spec .specV .right {
      float: none;
      width: 74%;
      margin: 0 auto; }
      .spec .specV .right li p {
        font-size: 1.8vw;
        line-height: 4vw; }
        .spec .specV .right li p span.oo01 {
          padding-left: 9.8%; }
        .spec .specV .right li p span {
          padding-left: 5%; }

  .themaSong .section-inner {
    width: 86%; }
  .themaSong .artistArea {
    width: 100%;
    height: 0;
    background: url("../../public/img/top/artist-bg.png") no-repeat;
    background-size: 100%;
    padding-top: 120%; }
    .themaSong .artistArea .movie {
      position: absolute;
      bottom: 8.5vw;
      left: 24vw;
      width: 43%;
      margin: 0; }
      .themaSong .artistArea .movie .icon {
        display: block;
        position: relative;
        top: 0;
        left: 0; }
        .themaSong .artistArea .movie .icon img {
          width: 100%; }
      .themaSong .artistArea .movie .icon:before {
        content: "";
        width: 38%;
        height: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -9vw;
        margin-left: -6.5vw;
        background: url("../../public/img/top/playback.png") no-repeat;
        background-size: 100%;
        padding-top: 35%; }
    .themaSong .artistArea .song {
      position: absolute;
      bottom: 6vw;
      right: 4.5vw;
      width: 34%; }
      .themaSong .artistArea .song img {
        width: 100%; } }
@media screen and (max-width: 1028px) {
  .fancybox-overlay.fancybox-overlay-fixed
  iframe, .fancybox-wrap.fancybox-desktop.fancybox-type-iframe.fancybox-opened iframe {
    width: 89vw;
    height: 50vw; }

  .section-inner {
    width: 100%; }

  #modalMovie.modalMovie iframe {
    width: 89vw;
    height: 50vw; }

  .modalMovie-o {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 300vw;
    z-index: 8010;
    background: url("../../public/img/top/overlay.png"); }

  iframe[name="google_conversion_frame"] {
    position: absolute;
    height: 0; }

  .modalMovie {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 8010;
    width: 100%; }
    .modalMovie iframe {
      width: 89vw;
      height: 50vw; }
    .modalMovie .cookie {
      padding: 3% 0;
      width: 40%;
      font-size: 0; }
      .modalMovie .cookie .close {
        position: relative;
        top: 0;
        left: 0;
        display: block;
        width: 2.8vw;
        height: 2.8vw;
        margin-right: 4%;
        background-color: #e0e0e0; }
      .modalMovie .cookie .close.check:before {
        content: "";
        position: absolute;
        top: 0.4vw;
        left: 0.5vw;
        width: 1.7vw;
        height: 0.9vw;
        border: 0px;
        border-top: solid 2px #000000;
        border-right: solid 2px #000000;
        -ms-transform: rotate(138deg);
        -webkit-transform: rotate(138deg);
        transform: rotate(138deg);
        z-index: 1; }
      .modalMovie .cookie p {
        color: #000000;
        font-size: 1.7vw; }
      .modalMovie .cookie p, .modalMovie .cookie .close {
        display: inline-block;
        vertical-align: middle; }
    .modalMovie p#movieClose {
      text-align: center;
      width: 30%;
      margin: 0 auto; }

  .mainBg {
    background: none;
    background-size: cover; }

  .header-bg {
    background: none;
    position: relative;
    z-index: 10;
    padding-top: 2%;
    padding-bottom: 10%;
    z-index: 100; }

  .keyContents .youtubeArea .youtube iframe {
    width: 1024px;
    height: 564px;
    position: relative;
    z-index: 50; }
  .keyContents .youtubeArea .youtube .movie-text {
    position: relative;
    z-index: 50;
    text-align: center;
    padding-top: 2%; }
  .keyContents .youtubeArea .snsBox {
    float: left;
    position: relative;
    z-index: 50; }
    .keyContents .youtubeArea .snsBox .btn {
      float: left; }
    .keyContents .youtubeArea .snsBox .btn-tw {
      margin-right: 1%; }
  .keyContents .youtubeArea .youtubeCount {
    float: right;
    position: relative;
    z-index: 50; }
  .keyContents .keyPlace {
    position: relative;
    padding-bottom: 0; }
    .keyContents .keyPlace .mainv-text {
      float: right;
      position: relative;
      z-index: 50;
      width: 17%;
      margin-top: 23%;
      margin-right: 3%; }
    .keyContents .keyPlace .mainv-part {
      float: none;
      position: relative;
      z-index: 50;
      text-align: center;
      width: 85%;
      margin: 0 auto;
      padding-top: 0;
      margin-top: -30%;
      transform: translateY(-7%); }
      .keyContents .keyPlace .mainv-part .logo {
        margin-top: 0;
        margin-left: 0;
        margin: 0 auto;
        position: relative;
        left: 5%;
        width: 79%; }
      .keyContents .keyPlace .mainv-part .day {
        width: 93%;
        margin-top: 5%;
        margin-left: 0;
        margin: 5% auto 0 auto; }
    .keyContents .keyPlace .mainv-part:before {
      content: "";
      position: absolute;
      top: 21%;
      left: -5%;
      width: 18%;
      height: 0;
      background: url("../../public/img/top/10th-logo_sp.png") no-repeat;
      background-size: 100%;
      padding-top: 16%; }
  .keyContents .keyPlace:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    transform: translateY(7%) translateX(0);
    background: url("../../public/img/top/main-v_sp.png") no-repeat center;
    background-size: 100%;
    padding-top: 158%; }

  .section-what .section-inner {
    transform: translateX(0); }
    .section-what .section-inner .leftBox, .section-what .section-inner .rightBox {
      float: none; }
    .section-what .section-inner .leftBox {
      width: 100%;
      margin-left: 5%;
      padding-bottom: 4%; }
      .section-what .section-inner .leftBox .whatnews {
        padding: 4% 0;
        width: 40%; }
    .section-what .section-inner ul li a {
      box-sizing: border-box; }
    .section-what .section-inner .rightBox {
      width: 100%;
      border-left: none; }
      .section-what .section-inner .rightBox img {
        width: 100%; }
      .section-what .section-inner .rightBox .icon {
        display: block;
        position: relative;
        top: 0;
        left: 0; }
      .section-what .section-inner .rightBox .icon:before {
        content: "";
        width: 30%;
        height: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -14%;
        margin-left: -14%;
        background: url("../../public/img/top/playback.png") no-repeat;
        background-size: 100%;
        padding-top: 28%; }
      .section-what .section-inner .rightBox .icon:after {
        content: "스토리 트레일러";
        position: absolute;
        top: 3%;
        left: 0;
        padding: 2%;
        font-size: 3vw;
        color: #fedf76;
        background-color: #000000; }
    .section-what .section-inner li {
      padding-bottom: 3%; }
      .section-what .section-inner li p {
        display: inline-block;
        vertical-align: middle;
        font-size: 2.5vw;
        line-height: 3vw; }
        .section-what .section-inner li p a {
          width: 100%;
          display: block; }
      .section-what .section-inner li p:first-of-type {
        color: #ffdf6f; }
      .section-what .section-inner li p a:last-of-type {
        color: #ffffff; }
  .section-what .pc-none {
    display: none; }
  .section-what .sp-none {
    display: block; }

  .section-news {
    width: 100%; }
    .section-news .section-inner {
      width: 84%;
      margin: 0 auto; }
    .section-news .title {
      text-align: center;
      padding: 7% 0;
      width: 80%;
      margin: 0 auto; }
      .section-news .title img {
        width: 100%; }
    .section-news li {
      width: 48%;
      min-height: auto;
      height: 50vw;
      background-color: #ffffff;
      margin-right: 4%;
      margin-bottom: 4%; }
      .section-news li p {
        width: 100%; }
        .section-news li p a, .section-news li p span {
          display: block; }
          .section-news li p a img, .section-news li p span img {
            width: 100%; }
        .section-news li p .day {
          font-size: 2vw;
          line-height: 3vw;
          padding: 1vw 1vw 0 1vw; }
        .section-news li p .text {
          font-size: 2vw;
          line-height: 3vw;
          padding: 2vw; }
    .section-news li:nth-of-type(2n + 2) {
      margin-right: 0; }
    .section-news li:nth-of-type(4n + 4) {
      margin-right: 0; }
    .section-news .btn {
      text-align: center;
      padding-top: 2%;
      width: 80%;
      margin: 0 auto; }
      .section-news .btn img {
        width: 100%; }

  .section-pict {
    padding-bottom: 4%; }
    .section-pict .title {
      text-align: center;
      padding: 10% 0 6% 0px;
      width: 80%;
      margin: 0 auto; }
      .section-pict .title img {
        width: 100%; }
    .section-pict .leftBox, .section-pict .rightBox {
      float: none; }
    .section-pict .rightBox {
      margin-left: 0;
      width: 95%;
      margin: 0 auto; }
      .section-pict .rightBox p {
        margin-bottom: 3%;
        width: 100%; }
        .section-pict .rightBox p img {
          width: 100%; }
      .section-pict .rightBox p:last-of-type {
        margin-bottom: 0; }
    .section-pict .leftBox {
      width: 95%;
      margin: 0 auto;
      padding-top: 10%; }
      .section-pict .leftBox p {
        margin-bottom: 1%;
        width: 100%; }
        .section-pict .leftBox p img {
          width: 100%; }
      .section-pict .leftBox p:last-of-type {
        margin-bottom: 0; }
      .section-pict .leftBox .btn-10th {
        bottom: 64.3vw;
        left: 13vw; }
        .section-pict .leftBox .btn-10th img {
          width: 71vw; }
      .section-pict .leftBox .top_movie img {
        width: 95vw; }
      .section-pict .leftBox .top_movie .icon:before {
        content: "";
        width: 30%;
        height: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -14%;
        margin-left: -14%;
        background: url(../../public/img/top/playback.png) no-repeat;
        background-size: 100%;
        padding-top: 29%; }
      .section-pict .leftBox .top_movie a.isHover:hover {
        transform: none; }
    .section-pict .banner-dlc {
      padding-top: 10%; }
      .section-pict .banner-dlc .sp-img {
        display: inline-block;
        width: 100%;
        height: 0;
        padding-bottom: 59.7%;
        background: url(../../public/img/about/dlc_sp.png) no-repeat 0 0;
        background-size: cover; }
        .section-pict .banner-dlc .sp-img img {
          display: none; }

  .spec {
    position: relative;
    z-index: 30;
    background-color: #ffffff; }
    .spec .specV .section-inner {
      width: 90%;
      margin: 0 auto; }
    .spec .specV .banner {
      text-align: center;
      position: relative;
      z-index: 60; }
    .spec .specV .artistArea {
      padding-bottom: 6%; }
      .spec .specV .artistArea .title {
        text-align: center;
        padding: 10% 0;
        width: 90%;
        margin: 0 auto; }
        .spec .specV .artistArea .title img {
          width: 100%; }
    .spec .specV .left {
      float: none;
      margin-left: 0;
      margin-top: 4%;
      width: 60%;
      margin: 0 auto; }
      .spec .specV .left img {
        width: 100%; }
    .spec .specV .right {
      float: none;
      width: 66%;
      margin: 0 auto;
      padding-top: 5%; }
      .spec .specV .right li p {
        font-size: 2.3vw;
        line-height: 4vw; }
        .spec .specV .right li p span.oo01 {
          padding-left: 14%; }
        .spec .specV .right li p span {
          padding-left: 5%; }

  .themaSong .section-inner {
    width: 86%; }
  .themaSong .artistArea {
    width: 100%;
    height: 0;
    background: url("../../public/img/top/artist-bg_sp.png") no-repeat;
    background-size: 100%;
    padding-top: 260%; }
    .themaSong .artistArea .movie {
      bottom: 19.7vw;
      left: 14vw;
      width: 68%; }
      .themaSong .artistArea .movie .icon:before {
        content: "";
        width: 30%;
        height: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -22%;
        margin-left: -14%;
        background: url("../../public/img/top/playback.png") no-repeat;
        background-size: 100%;
        padding-top: 29%; }
    .themaSong .artistArea .song {
      position: absolute;
      bottom: 10vw;
      right: 14vw;
      width: 68%; } }

/*# sourceMappingURL=style.css.map */