@charset "UTF-8";
/*------------------------------------------------------------*/
/*SP設定*/
/*------------------------------------------------------------*/
@media screen and (max-width: 667px) {
    .movieOP {
    position: relative;
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
  }
      /*閉じるボタン*/
.mfp-close-btn-in .mfp-close {
    position: absolute;
    width: 50px;
    height: 50px;
    background: url("../../_img/popup_close@2x.png")no-repeat center top/100% auto;
    top: -28px;
    right: -21px;
    ;
    text-indent: -999999px;
    z-index: 4;
  }
  wrapper_mazica {
    position: relative;
  }
  /*フォントサイズ基本*/
  wrapper_mazica p {
    font-size: 12px;
  }
  /*------------------------------------------------------------*/
  /*スマホメニュー */
  /*------------------------------------------------------------*/
  /*リンク設定*/
  #mazicaMenu a, .overlay a {
    color: #FFF;
    font-family: source-han-sans-japanese, sans-serif;
    font-weight: normal;
    font-style: 600;
    text-decoration: none;
    text-shadow: #002333 1px 1px 10px, #00535a 1px 1px 12px;
  }
  /*スマホ版ヘッダーの高さ*/
  #wrapper_mazica nav#mazicaMenu {
    width: 100%;
    height: 90px;
    background: url(none);
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    z-index: 100;
  }
  /*スマホ版ヘッダーの高さ：トップページ用*/
  #wrapper_mazica.topPage nav#mazicaMenu {
    box-sizing: border-box;
    width: 100%;
    height: 90px;
    margin: 0 auto;
    padding: 0;
    background: url(none);
    z-index: 100;
  }
  #wrapper_mazica nav#mazicaMenu ul {
    display: none;
  }
  #wrapper_mazica nav#mazicaMenu h1 {
    width: 33%;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 10px;
  }
  /*------------------------------------------------------------*/
  /*SEOテキスト*/
  /*------------------------------------------------------------*/
  .topTxt {
    height: 1.4em;
    text-align: center;
    letter-spacing: 0.1em;
  }
  .topTxt h1.title01 {
    position: relative;
    display: inline;
    width: auto;
    height: auto;
    font-size: 11px;
    line-height: 1.4em;
  }
  .topTxt p.text01 {
    display: inline;
    width: auto;
    font-size: 11px;
  }
  /*------------------------------------------------------------*/
  /*マジカパーティとは*/
  /*------------------------------------------------------------*/
  /*高解像度を下部で設定*/
  /* about */
  section#about {
    width: 100%;
    height: auto;
    background: url("../../_img/about_sp.png") no-repeat center top /100% auto;
    margin: 0 auto;
    padding-top: calc(100%*1887/1500);
  }
  /*------------------------------------------------------------*/
  /*ムービー*/
  /*------------------------------------------------------------*/
  .movie {
    width: 90%;
    margin: 0 auto;
  }
  #play3 .movie {
    width: 90%;
    margin: 0 auto 36px;
  }
  /*------------------------------------------------------------*/
  /*最新情報*/
  /*------------------------------------------------------------*/
  /*スクロール設定*/
  #sample {
    position: relative;
    padding: 0 8px;
    height: 200px;
    z-index: 5;
  }
  /*ニュースリスト*/
  .news ul.newsList {
    height: 200px;
    margin: 0 auto;
  }
  /*下線*/
  .news ul.newsList li {
    padding: 0 8px 8px;
    text-align: left;
    border-bottom: 1px solid #999;
  }
  /*リストの最後は下線なし*/
  .news ul.newsList li:last-child {
    border-bottom: 0px;
  }
  /*clearFix*/
  .news ul.newsList li::after {
    content: "";
    display: block;
    clear: both;
  }
  /*日付*/
  .news ul.newsList li span {
    display: block;
    width: 100%;
    font-size: 13px;
    float: none;
  }
  /*最新情報テキスト*/
  .news ul.newsList li a {
    display: block;
    width: 100%;
    padding-right: 0;
    font-size: 13px;
    float: none;
  }
  /*------------------------------------------------------------*/
  /*初めての方はこちら*/
  /*------------------------------------------------------------*/
  .playList {
    width: 96%;
    margin: -24px auto 0;
    padding: 0;
    font-size: 0;
  }
  .playList li {
    display: inline-block;
    width: 50%;
    margin: 18px 0 0;
    font-size: 0;
  }
  .playList li:last-child {
    width: 100%;
  }
  /*------------------------------------------------------------*/
  /*アニメ情報*/
  /*------------------------------------------------------------*/
  img.animeImg {
    display: block;
    width: 90%;
    margin: 0 auto 4px;
  }
  /*アニメリンクボタン*/
  a.animeLink {
    display: block;
    width: 80%;
    margin: 0 auto -5%;
  }
  /*------------------------------------------------------------*/
  /*下層ページ*/
  /*------------------------------------------------------------*/
  /*キービジュアル*/
  div #mainImg {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: -40px auto -50px;
    z-index: 10;
  }
  div #mainImg img {
    display: none;
  }
  /*ラインナップ*/
  div #mainImg.lineupImg {
        width: 100%;
    background: url("../../_img/main_lineup@2x.png") no-repeat center top/130% auto;
    padding-top: calc(100%*480/1000);
        margin: -40px auto -3%;
  }
  /*カードリスト*/
  div #mainImg.cardlistImg {
          width: 100%;
    background: url("../../_img/main_cardlist@2x.png") no-repeat center top/130% auto;
    padding-top: calc(100%*580/1000);
  }
  /*遊び方*/
  div #mainImg.playtImg {
          width: 100%;
    background: url("../../_img/main_play@2x.png") no-repeat center top/130% auto;
    padding-top: calc(100%*480/1000);
  }
  /*QA*/
  div #mainImg.qaImg {
          width: 100%;
    background: url("../../_img/main_qa@2x.png") no-repeat center top/130% auto;
    padding-top: calc(100%*480/1000);
  }
  /*キャンーペーン*/
  div #mainImg.campaignImg {
          width: 100%;
    background: url("../../_img/main_campaign@2x.png") no-repeat center top/130% auto;
    padding-top: calc(100%*480/1000);
    margin: -40px auto -50px;
  }
  /*ムービー*/
  div #mainImg.movieImg {
          width: 100%;
    background: url("../../_img/main_movie.png") no-repeat center top/130% auto;
    padding-top: calc(100%*480/1000);
  }
  /*ブログ*/
  div #mainImg.blogImg {
          width: 100%;
    background: url("../../_img/main_majikatari.png") no-repeat center top/140% auto;
    padding-top: calc(100%*480/1000);
  }
  /*------------------------------------------------------------*/
  /*トップページのアニメビジュアル*/
  div #mainImg.anime_visual {
    width: 100%;
    height: auto;
    margin: 0 auto -74px;
    z-index: 1;
  }
  /*トップページのアニメビジュアル*/
  div #mainImg.anime_visual img {
    display: block;
  }
  div #mainImg.campaign_visual {
    width: 98%;
    height: auto;
    margin: 0 auto -74px;
    z-index: 60;
  }
  /*トップページのアニメビジュアル*/
  div #mainImg.campaign_visual img {
    display: block;
  }
  /*------------------------------------------------------------*/
  /*下層ページ 一覧ページレイアウト*/
  /*------------------------------------------------------------*/
  /*通常リスト menu1が基準レイアウト*/
  section ul.menu1 {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 auto;
  }
  section ul.menu1 li {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 12px 0;
  }
  /*------------------------------------------------------------*/
  /*商品情報専用*/
  section ul.menu1.lineupList {
    flex-wrap: wrap !important;
    margin: 0 auto -24px;
  }
  /*商品情報リスト*/
  section ul.menu1.lineupList li {
    position: relative;
    width: 100%;
    margin: 0 0 24px;
    padding: 12px 0;
  }
}