/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
@import "custom.css";
html {
  color: #222;
  font-size: 1em;
  line-height: 1.4; }

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none; }

::selection {
  background: #b3d4fc;
  text-shadow: none; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle; }

fieldset {
  border: 0;
  margin: 0;
  padding: 0; }

textarea {
  resize: vertical; }

.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0; }

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
html, body {
  width: 100%;
  height: 100%; }

body {
  background-color: #000;
  min-width: 1000px;
  overflow-x: auto;
  position: relative; }

#loading {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #000;
  top: 0;
  left: 0;
  z-index: 111111; }
  #loading .loadingimg {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -10px;
    margin-left: -10px; }
    #loading .loadingimg img {
      width: 100%; }

.main_bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 103%;
  z-index: 1; }
  .main_bg .cover_top {
    background-image: url(../img/cover_top.png);
    background-size: 100% 100%;
    width: 100%;
    height: 126px;
    position: absolute;
    bottom: -15px;
    z-index: 11; }
  .main_bg .top_bg {
    background: url(../img/top_bg.jpg) repeat-x bottom center;
    background-size: 1366px 300px;
    position: absolute;
    top: -15px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2; }

#wrapper {
  overflow: hidden;
  position: relative;
  width: auto;
  max-width: 1500px;
  margin: 0 auto;
  background-color: #000; }
  #wrapper #cover_left {
    background-image: url(../img/cover_left.png);
    background-size: 100% 100%;
    top: 0;
    left: 0;
    width: 100px;
    height: 100%;
    z-index: 1111;
    position: absolute; }
  #wrapper #cover_right {
    background-image: url(../img/cover_right.png);
    background-size: 100% 100%;
    top: 0;
    right: 0;
    width: 100px;
    height: 100%;
    z-index: 1111;
    position: absolute; }

#top {
  position: relative;
  min-height: 700px; }
  #top .mk_logo {
    position: absolute;
    top: 26px;
    left: 15%;
    z-index: 3; }
    #top .mk_logo ul li {
      float: left; }
      #top .mk_logo ul li:nth-child(1) {
        margin-top: 15px;
        margin-right: 15px; }
  #top .catch {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -302px;
    margin-top: -280px;
    z-index: 3; }
  #top .zugara {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -558px;
    margin-top: -335px;
    z-index: 3; }
  #top .logo {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -260px;
    margin-top: 28px;
    z-index: 3; }
  #top .btn_area {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -292px;
    margin-top: 220px;
    z-index: 3;
    overflow: hidden; }
    #top .btn_area li {
      float: left;
      width: 50%; }
      #top .btn_area li:nth-child(2) {
        margin-left: -10px; }
  #top .menu {
    width: 70px;
    height: 70px;
    position: fixed;
    overflow: hidden;
    top: 15px;
    right: 15px;
    z-index: 10000; }
    #top .menu .open, #top .menu .close {
      position: absolute;
      top: 0;
      right: 0; }

.kasou {
  width: 100%;
  margin: 0 auto;
  background-position: top center;
  background-size: 1500px auto;
  position: relative;
  text-align: center;
  background-repeat: no-repeat; }
  .kasou .title {
    width: 100%;
    height: 124px;
    background-size: 1500px auto;
    background-position: top center;
    background-repeat: no-repeat;
    position: relative;
    z-index: 2; }

#tokucho1, #tokucho2, #gameflow {
  z-index: 1;
  margin-bottom: -32px; }

#tokucho1 {
  background-image: url(../img/tokucho1_bg.png);
  height: 860px; }
  #tokucho1 .title {
    background-image: url(../img/tokucho1_title.png); }
  #tokucho1 .img1 {
    margin-top: 38px;
    margin-bottom: -44px; }

#tokucho2 {
  background-image: url(../img/tokucho2_bg.png);
  height: 970px; }
  #tokucho2 .title {
    background-image: url(../img/tokucho2_title.png); }
  #tokucho2 .img3 {
    margin-top: 80px;
    margin-bottom: -40px; }

#gameflow {
  background-image: url(../img/gameflow_bg.png);
  height: 1560px; }
  #gameflow .title {
    background-image: url(../img/gameflow_title.png); }

#spec {
  background-image: url(../img/spec_bg.png);
  height: 1060px; }
  #spec .title {
    background-image: url(../img/spec_title.png); }
  #spec .btn_top {
    position: fixed;
    overflow: hidden;
    bottom: 15px;
    right: 15px;
    z-index: 1111; }

#footer {
  text-align: center;
  position: absolute;
  bottom: 20px;
  z-index: 11;
  left: 50%;
  margin-left: -155px; }
  #footer ul {
    width: 320px;
    margin: 0 auto;
    overflow: hidden; }
    #footer ul li {
      float: left; }
      #footer ul li:nth-child(1) {
        margin-top: 15px;
        margin-right: 25px; }
  #footer p {
    clear: both;
    margin-top: 10px; }

#nav {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  display: none;
  z-index: 9999; }
  #nav .nav_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    min-width: 752px;
    min-height: 509px;
    left: 0;
    top: 0;
    background-color: #000;
    opacity: 0.6;
    text-align: center;
    cursor: pointer; }
  #nav .menu {
    width: 752px;
    height: 509px;
    background-image: url(../img/menu.png);
    background-size: 100% 100%;
    background-position: top center;
    background-repeat: no-repeat;
    text-align: center;
    overflow: hidden;
    position: absolute;
    margin-left: -376px;
    margin-top: -254px;
    left: 50%;
    top: 50%; }
    #nav .menu .menu_inner {
      margin: 90px 0; }
      #nav .menu .menu_inner li {
        margin: 52px 0; }

.no-scroll {
  overflow: hidden; }

#sp {
  width: 100%;
  display: none; }
  #sp img {
    width: 100%;
    height: auto; }
  #sp #nav_sp {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
    display: none;
    z-index: 9999; }
    #sp #nav_sp .nav_bg_sp {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      background-color: #000;
      opacity: 0.6;
      text-align: center;
      cursor: pointer; }
    #sp #nav_sp .menu_sp {
      width: 100%;
      height: 100%;
      background-image: url(../img/sp/menu_sp.png);
      background-size: 100% auto;
      background-position: top center;
      background-repeat: no-repeat;
      text-align: center;
      overflow: hidden;
      position: relative;
      margin: 16% auto 0; }
      #sp #nav_sp .menu_sp ul {
        margin: 11% auto; }
        #sp #nav_sp .menu_sp ul li {
          width: 50%;
          margin: 6% auto; }

@media only screen and (max-width: 750px) {
  body {
    width: 100%;
    height: 100%;
    background-color: #000;
    min-width: auto;
    position: relative;
    overflow-x: auto; }
    body #pc {
      display: none; }
    body #sp {
      display: block; } }
#wrapper_sp {
  overflow: hidden; }
  #wrapper_sp #top_sp {
    width: 100%;
    height: auto;
    position: relative;
    background-image: url(../img/sp/bg_top.jpg);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center bottom;
    padding-bottom: 5%; }
    #wrapper_sp #top_sp .mk_logo_sp {
      width: 50%;
      position: absolute;
      top: 2%;
      left: 4%;
      z-index: 3; }
      #wrapper_sp #top_sp .mk_logo_sp ul li {
        float: left;
        width: 44%; }
    #wrapper_sp #top_sp .logo_sp {
      width: 100%;
      margin-top: -37%; }
    #wrapper_sp #top_sp .catch_sp {
      width: 80%;
      margin: 0 auto -14%; }
    #wrapper_sp #top_sp .menu_sp {
      width: 10%;
      height: auto;
      position: fixed;
      top: 2%;
      right: 3%;
      z-index: 10000; }
      #wrapper_sp #top_sp .menu_sp .open_sp, #wrapper_sp #top_sp .menu_sp .close_sp {
        position: absolute;
        top: 0;
        right: 0; }
    #wrapper_sp #top_sp .center_sp {
      position: absolute;
      top: 50%; }
    #wrapper_sp #top_sp .btn_area_sp {
      position: relative;
      width: 100%;
      overflow: hidden;
      margin: -4% auto -5%;
      z-index: 11; }
      #wrapper_sp #top_sp .btn_area_sp li {
        float: left;
        width: 50%; }
        #wrapper_sp #top_sp .btn_area_sp li:nth-child(1) {
          margin-left: 2%; }
        #wrapper_sp #top_sp .btn_area_sp li:nth-child(2) {
          margin-left: -4%; }
  #wrapper_sp .top_sp_height {
    height: 1100px !important; }
  #wrapper_sp #bg_box {
    width: 100%;
    height: 100%;
    background-image: url(../img/sp/bg_middle.jpg), url(../img/sp/bg_bottom.jpg);
    background-repeat: no-repeat, repeat;
    background-position: center top, center top;
    background-size: 100% auto, 100% auto; }

	#wrapper_sp #bg_box.newtype{
	width: 100%;
    background-image: url(../img/newtype/gameflow_bg.png);
    /* background-repeat: repeat-y; */
    background-position: center 50px;
    /* background-repeat: repeat; */
    background-size: auto 100%;
    /* padding-top: 50px; */
    position: relative;
    overflow: hidden;
	}

  #wrapper_sp .kasou_sp {
    position: relative;
    z-index: 2; }
    #wrapper_sp .kasou_sp .title_sp {
      margin: 0 auto; }
    #wrapper_sp .kasou_sp .kasou_img_02 {
      margin: -6% auto -8%; }
    #wrapper_sp .kasou_sp .kasou_img_04 {
      margin-top: -4%; }
    #wrapper_sp .kasou_sp .kasou_img_05 {
      margin: -3% auto 8%; }
    #wrapper_sp .kasou_sp .kasou_img_07 {
      margin-bottom: -4%; }
    #wrapper_sp .kasou_sp .kasou_img_09 {
      margin-bottom: 10%; }
  #wrapper_sp #footer_sp {
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    background-image: url(../img/sp/cover_footer.png);
    background-size: auto 100%;
    background-repeat: repeat-x;
    background-position: center bottom; }
    #wrapper_sp #footer_sp .btn_top {
      width: 15%;
      position: fixed;
      overflow: hidden;
      bottom: 2%;
      right: 3%;
      z-index: 1111; }
    #wrapper_sp #footer_sp ul {
      width: 50%;
      margin: 8% auto 0;
      overflow: hidden;
      padding-left: 3%;
      clear: both; }
      #wrapper_sp #footer_sp ul li {
        width: 50%;
        float: left; }
    #wrapper_sp #footer_sp p {
      width: 26%;
      margin: 2% auto 20%; }

/* ==========================================================================
   Media Queries
   ========================================================================== */
/* ==========================================================================
   Helper classes
   ========================================================================== */
.hidden {
  display: none !important;
  visibility: hidden; }

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }

.invisible {
  visibility: hidden; }

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table; }

.clearfix:after {
  clear: both; }

.clearfix {
  *zoom: 1; }

/* ==========================================================================
   Print styles
   ========================================================================== */
@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important; }

  a,
  a:visited {
    text-decoration: underline; }

  a[href]:after {
    content: " (" attr(href) ")"; }

  abbr[title]:after {
    content: " (" attr(title) ")"; }

  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: ""; }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }

  thead {
    display: table-header-group; }

  tr,
  img {
    page-break-inside: avoid; }

  img {
    max-width: 100% !important; }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3; }

  h2,
  h3 {
    page-break-after: avoid; } }

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