@charset "UTF-8"; /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
#top .container main .nav-btn a:hover, .top-contents .nav-box a:hover {
    opacity: .8
}

#top .container main .news-box li a, .fancybox-nav {
    text-decoration: none
}

.fancybox-image, .fancybox-inner, .fancybox-nav, .fancybox-nav span, .fancybox-outer, .fancybox-skin, .fancybox-tmp, .fancybox-wrap, .fancybox-wrap iframe, .fancybox-wrap object {
    padding: 0;
    margin: 0;
    border: 0;
    outline: 0;
    vertical-align: top
}

.fancybox-wrap {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8020
}

.fancybox-inner, .fancybox-outer, .fancybox-skin {
    position: relative
}

.fancybox-skin {
    background: #f9f9f9;
    color: #444;
    text-shadow: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.fancybox-opened {
    z-index: 8030
}

.fancybox-opened .fancybox-skin {
    -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, .5);
    -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, .5);
    box-shadow: 0 10px 25px rgba(0, 0, 0, .5)
}

.fancybox-inner {
    overflow: hidden
}

.fancybox-type-iframe .fancybox-inner {
    -webkit-overflow-scrolling: touch
}

.fancybox-error {
    color: #444;
    font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 15px;
    white-space: nowrap
}

.fancybox-iframe, .fancybox-image {
    display: block;
    width: 100%;
    height: 100%
}

.fancybox-image {
    max-width: 100%;
    max-height: 100%
}

#fancybox-loading, .fancybox-close, .fancybox-next span, .fancybox-prev span {
    background-image: url(fancybox_sprite.png)
}

#fancybox-loading {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -22px;
    margin-left: -22px;
    background-position: 0 -108px;
    opacity: .8;
    cursor: pointer;
    z-index: 8060
}

.fancybox-close, .fancybox-nav, .fancybox-nav span {
    z-index: 8040;
    position: absolute;
    cursor: pointer
}

#fancybox-loading div {
    width: 44px;
    height: 44px;
    background: url(fancybox_loading.gif) center center no-repeat
}

.fancybox-close {
    top: -18px;
    right: -18px;
    width: 36px;
    height: 36px
}

.fancybox-nav {
    top: 0;
    width: 40%;
    height: 100%;
    background: url(blank.gif);
    -webkit-tap-highlight-color: transparent
}

.fancybox-prev {
    left: 0
}

.fancybox-next {
    right: 0
}

.fancybox-nav span {
    top: 50%;
    width: 36px;
    height: 34px;
    margin-top: -18px;
    visibility: hidden
}

* html #TB_HideSelect, * html #TB_overlay {
    height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px')
}

.fancybox-prev span {
    left: 10px;
    background-position: 0 -36px
}

.fancybox-next span {
    right: 10px;
    background-position: 0 -72px
}

.fancybox-nav:hover span {
    visibility: visible
}

.fancybox-tmp {
    position: absolute;
    top: -99999px;
    left: -99999px;
    visibility: hidden;
    max-width: 99999px;
    max-height: 99999px;
    overflow: visible !important
}

.fancybox-lock, .fancybox-lock body {
    overflow: hidden !important
}

.fancybox-lock {
    width: auto
}

.fancybox-lock-test {
    overflow-y: hidden !important
}

.fancybox-overlay {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    display: none;
    z-index: 8010;
    background: url(fancybox_overlay.png)
}

.fancybox-overlay-fixed {
    position: fixed;
    bottom: 0;
    right: 0
}

.fancybox-lock .fancybox-overlay {
    overflow: auto;
    overflow-y: scroll
}

.fancybox-title {
    visibility: hidden;
    font: 400 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
    position: relative;
    text-shadow: none;
    z-index: 8050
}

.fancybox-opened .fancybox-title {
    visibility: visible
}

.fancybox-title-float-wrap {
    position: absolute;
    bottom: 0;
    right: 50%;
    margin-bottom: -35px;
    z-index: 8050;
    text-align: center
}

#TB_overlay, header {
    top: 0;
    left: 0;
    z-index: 100
}

.fancybox-title-float-wrap .child {
    display: inline-block;
    margin-right: -100%;
    padding: 2px 20px;
    background: 0 0;
    background: rgba(0, 0, 0, .8);
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    text-shadow: 0 1px 2px #222;
    color: #FFF;
    font-weight: 700;
    line-height: 24px;
    white-space: nowrap
}

.fancybox-title-outside-wrap {
    position: relative;
    margin-top: 10px;
    color: #fff
}

.fancybox-title-inside-wrap {
    padding-top: 10px
}

.fancybox-title-over-wrap {
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    padding: 10px;
    background: #000;
    background: rgba(0, 0, 0, .8)
}

#TB_load, #TB_window {
    display: none;
    left: 50%;
    position: fixed
}

#TB_window, #TB_window a:hover {
    color: #000
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
    #fancybox-loading, .fancybox-close, .fancybox-next span, .fancybox-prev span {
        background-image: url(fancybox_sprite@2x.png);
        background-size: 44px 152px
    }

    #fancybox-loading div {
        background-image: url(fancybox_loading@2x.gif);
        background-size: 24px 24px
    }
}

* {
    padding: 0;
    margin: 0
}

#TB_window {
    font: 12px Arial, Helvetica, sans-serif
}

#TB_secondLine {
    font: 10px Arial, Helvetica, sans-serif;
    color: #666
}

#TB_window a:active, #TB_window a:focus, #TB_window a:link, #TB_window a:visited {
    color: #666
}

#TB_overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    min-width: 100%;
    min-height: 100%
}

.TB_overlayMacFFBGHack {
    background: url(images/macFFBgHack.png)
}

.TB_overlayBG {
    background-color: #000;
    filter: alpha(opacity=75);
    -moz-opacity: .75;
    opacity: .75
}

* html #TB_overlay {
    position: absolute
}

#TB_window {
    background: #fff;
    z-index: 102;
    border: 4px solid #525252;
    text-align: left
}

* html #TB_window {
    position: absolute;
    margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px')
}

#TB_window img#TB_Image {
    display: block;
    margin: 15px 0 0 15px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #666;
    border-left: 1px solid #666
}

#TB_caption {
    height: 25px;
    padding: 7px 30px 10px 25px;
    float: left
}

#TB_closeWindow {
    height: 25px;
    padding: 11px 25px 10px 0;
    float: right
}

#TB_closeAjaxWindow {
    padding: 7px 10px 5px 0;
    margin-bottom: 1px;
    text-align: right;
    float: right
}

#TB_ajaxWindowTitle {
    float: left;
    padding: 7px 0 5px 10px;
    margin-bottom: 1px
}

#TB_title {
    background-color: #ccc;
    height: 27px
}

#TB_ajaxContent {
    clear: both;
    padding: 2px 15px 15px;
    overflow: auto;
    text-align: left;
    line-height: 1.4em
}

#TB_ajaxContent.TB_modal {
    padding: 15px
}

#TB_ajaxContent p {
    padding: 5px 0
}

#TB_load {
    height: 13px;
    width: 208px;
    z-index: 103;
    top: 50%;
    margin: -6px 0 0 -104px
}

* html #TB_load {
    position: absolute;
    margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px')
}

#TB_HideSelect {
    z-index: 99;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #fff;
    border: none;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    opacity: 0;
    height: 100%;
    width: 100%
}

* html #TB_HideSelect {
    position: absolute
}

#TB_iframeContent {
    clear: both;
    border: none
}

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline
}

html {
    line-height: 1
}

ol, ul {
    list-style: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption, td, th {
    text-align: left;
    font-weight: 400;
    vertical-align: middle
}

blockquote, q {
    quotes: none
}

blockquote:after, blockquote:before, q:after, q:before {
    content: "";
    content: none
}

a img {
    border: none
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block
}

body {
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    background: #000;
    font-family: "Helvetica Neue", Helvetica, Arial, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif
}

img {
    color: #fff
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden
}

.center {
    text-align: center
}

.hover {
    position: relative;
    overflow: hidden;
    cursor: pointer
}

.hover img {
    position: absolute;
    bottom: 0
}

.hover img:hover {
    top: 0
}

body, html {
    height: 100%
}

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

.disp-none {
    display: none
}

.v-pc, a {
    display: inline-block
}

.wrapper {
    width: 1024px;
    margin: auto;
    position: relative
}

.v-sp {
    display: none
}

@media screen and (max-width: 640px) {
    body {
        background: url(../img/common/bg.jpg?1469440327)
    }

    .wrapper {
        width: 640px
    }

    .v-pc {
        display: none
    }

    .v-sp {
        display: inline-block
    }

    .bg-overlay {
        display: none
    }
}

#TB_window {
    height: 500px;
    top: 0;
    bottom: 0;
    margin: auto
}

.bg-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: url(../img/top/overlay.png?1469440327)
}

.bottom-shop-btn {
    background: url(../img/common/sp/shop_guide_btn.png?1481766005) no-repeat;
    width: 620px;
    height: 230px;
    display: block;
    margin: auto
}

header {
    position: fixed;
    width: 100%;
    height: 40px
}

header .inner {
    zoom: 1;
    height: 38px;
    background: #fff
}

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

header .inner .logo {
    float: left;
    margin: 5px 0 0 43px
}

header .inner .logo a {
    background: url(../img/common/header_logo.png?1469440327) no-repeat;
    width: 25px;
    height: 27px
}

header .inner .nav-box {
    float: right;
    margin: 11px 37px 0 0
}

header .inner .nav-box li {
    float: left
}

header .inner .nav-box li:first-child {
    margin-right: 28px
}

header .inner .nav-box .opinion a {
    background: url(../img/common/opinion.png?1469440327) no-repeat;
    width: 44px;
    height: 10px
}

header .inner .nav-box .support a {
    background: url(../img/common/support.png?1469440327) no-repeat;
    width: 53px;
    height: 10px
}

@media screen and (max-width: 640px) {
    header {
        height: 40px
    }

    header .inner .logo {
        margin: 9px 0 0 15px
    }

    header .inner .logo a {
        background: url(../img/common/sp/header_logo.png?1469440327) no-repeat;
        width: 130px;
        height: 22px
    }

    header .inner .nav-box {
        margin: 9px 14px 0 0
    }

    header .inner .nav-box li:first-child {
        margin-right: 20px
    }

    header .inner .nav-box .opinion a {
        background: url(../img/common/sp/opinion.png?1469440327) no-repeat;
        width: 79px;
        height: 18px
    }

    header .inner .nav-box .support a {
        background: url(../img/common/sp/support.png?1469440327) no-repeat;
        width: 96px;
        height: 18px
    }
}

footer {
    background: url(../img/common/footer_bg.png?1475203987) center top no-repeat;
    padding: 107px 0 40px;
    text-align: center;
    position: relative;
    z-index: 50
}

footer .f-nav {
    display: none
}

footer .footer-logo {
    margin-top: 19px
}

footer .spec {
    margin-top: 43px
}

footer .spec p {
    color: #fff;
    font-size: 15px;
    line-height: 1.7
}

footer .acquire-logo {
    background: url(../img/common/acquire_logo.png?1469440327) no-repeat;
    width: 61px;
    height: 64px;
    margin-top: 53px
}

footer .copyright {
    margin-top: 15px
}

footer .cero {
    margin-top: 20px
}

@media screen and (max-width: 640px) {
    footer {
        background: url(../img/common/sp/footer_bg.png?1485234226) center top no-repeat;
        padding: 138px 0 77px
    }

    footer .f-nav {
        display: block;
        font-size: 0;
        text-align: center;
        margin-bottom: 57px
    }

    footer .f-nav li {
        margin-bottom: 20px;
        position: relative;
        display: inline-block
    }

    footer .f-nav li:nth-child(1) a {
        background: url(../img/common/sp/fn_top.png?1469440327) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav li:nth-child(2) a {
        background: url(../img/common/sp/fn_info.png?1469440327) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav li:nth-child(3) a {
        background: url(../img/common/sp/fn_world.png?1469440327) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav li:nth-child(4) a {
        background: url(../img/common/sp/fn_story.png?1477530554) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav li:nth-child(5) a {
        background: url(../img/common/sp/fn_character.png?1469440327) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav li:nth-child(6) a {
        background: url(../img/common/sp/fn_system.png?1476933660) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav li:nth-child(7) {
        margin: 0
    }

    footer .f-nav li:nth-child(7) a {
        background: url(../img/common/sp/fn_special.png?1469440327) no-repeat;
        width: 460px;
        height: 60px
    }

    footer .f-nav .current a {
        background-position: 0 bottom !important
    }

    footer .spec {
        margin-top: 80px
    }

    footer .spec p {
        font-size: 21px;
        line-height: 2
    }

    footer .acquire-logo {
        background: url(../img/common/sp/acquire_logo.png?1469440327) no-repeat;
        width: 121px;
        height: 127px;
        margin-top: 80px
    }

    footer .copyright {
        margin-top: 28px
    }

    footer .cero {
        margin-top: 38px
    }
}

.top-contents {
    background: url(../img/common/bg2.png?1469440327) center top no-repeat;
    height: 396px;
    position: relative;
    z-index: 99
}

@media (min-width: 1400px) {
    .top-contents {
        background-size: 100% 396px
    }
}

.top-contents .wrapper {
    padding-top: 85px
}

.top-contents .platform {
    position: absolute;
    top: 86px;
    left: -27px
}

.top-contents h1 {
    margin-left: 240px
}

.top-contents h1 a {
    background: url(../img/common/logo.png?1469440327) no-repeat;
    width: 540px;
    height: 132px
}

.top-contents .close-btn, .top-contents .menu-box, .top-contents .menu-btn {
    display: none
}

.top-contents .shopguide-btn {
    background: url(../img/common/shop_guide_btn.png?1481765941) no-repeat;
    width: 201px;
    height: 172px;
    position: absolute;
    top: 70px;
    right: 43px
}

.top-contents .nav-box {
    font-size: 0;
    text-align: center;
    margin-top: 26px
}

.top-contents .nav-box li {
    margin-bottom: 10px;
    position: relative;
    display: inline-block;
    margin-right: 50px
}

.top-contents .nav-box li:nth-child(1) a {
    background: url(../img/common/nav_info.png?1469440327) no-repeat;
    width: 114px;
    height: 12px
}

.top-contents .nav-box li:nth-child(1).current:before {
    top: -17px;
    left: 53px
}

.top-contents .nav-box li:nth-child(2) a {
    background: url(../img/common/nav_world.png?1469440327) no-repeat;
    width: 59px;
    height: 12px
}

.top-contents .nav-box li:nth-child(2).current:before {
    top: -17px;
    left: 27px
}

.top-contents .nav-box li:nth-child(3) a {
    background: url(../img/common/nav_story.png?1477530554) no-repeat;
    width: 53px;
    height: 12px
}

.top-contents .nav-box li:nth-child(3).current:before {
    top: -17px;
    left: 23px
}

.top-contents .nav-box li:nth-child(4) a {
    background: url(../img/common/nav_character.png?1469440327) no-repeat;
    width: 100px;
    height: 12px
}

.top-contents .nav-box li:nth-child(4).current:before {
    top: -17px;
    left: 48px
}

.top-contents .nav-box li:nth-child(5) a {
    background: url(../img/common/nav_system.png?1476933660) no-repeat;
    width: 67px;
    height: 12px
}

.top-contents .nav-box li:nth-child(5).current:before {
    top: -17px;
    left: 30px
}

.top-contents .nav-box li:nth-child(6) {
    margin: 0
}

.top-contents .nav-box li:nth-child(6) a {
    background: url(../img/common/nav_special.png?1469440327) no-repeat;
    width: 70px;
    height: 12px
}

.top-contents .nav-box li:nth-child(6).current:before {
    top: -17px;
    left: 33px
}

.top-contents .nav-box .current:before {
    content: " ";
    background: url(../img/common/current_icon.png?1469440327) no-repeat;
    width: 6px;
    height: 14px;
    position: absolute;
    z-index: 10
}

.top-contents .title {
    text-align: center;
    margin-top: 30px
}

@media (max-width: 640px) {
    .top-contents .menu-box .logo, .top-contents .menu-box ul {
        text-align: center
    }

    .top-contents {
        background: url(../img/common/sp/bg2.png?1469440327) center 25px no-repeat;
        height: 303px
    }

    .top-contents .wrapper {
        padding-top: 122px
    }

    .top-contents .sns-box {
        display: none
    }

    .top-contents .platform {
        top: 61px;
        left: 30px
    }

    .top-contents h1 {
        margin-left: 65px
    }

    .top-contents h1 a {
        background: url(../img/common/sp/logo.png?1469440327) no-repeat;
        width: 518px;
        height: 129px
    }

    .top-contents .close-btn, .top-contents .menu-btn {
        width: 80px;
        height: 80px;
        top: 50px;
        right: 10px;
        z-index: 500;
        position: fixed
    }

    .top-contents .menu-btn {
        display: block;
        background: url(../img/common/sp/menu_btn.png?1469440327) no-repeat
    }

    .top-contents .close-btn {
        display: none;
        background: url(../img/common/sp/close_btn.png?1469440327) no-repeat
    }

    .top-contents .menu-box {
        display: none;
        position: fixed;
        z-index: 100;
        background: rgba(0, 174, 220, .8);
        top: 38px;
        margin: 0;
        width: 100%;
        height: 100%;
        padding-top: 135px
    }

    .top-contents .menu-box .logo a {
        background: url(../img/common/sp/m_logo.png?1469440327) no-repeat;
        width: 518px;
        height: 128px
    }

    .top-contents .menu-box li {
        margin: 0 0 20px
    }

    .top-contents .menu-box li:nth-child(1) a {
        background: url(../img/common/sp/m_info.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    .top-contents .menu-box li:nth-child(2) a {
        background: url(../img/common/sp/m_world.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    .top-contents .menu-box li:nth-child(3) a {
        background: url(../img/common/sp/m_story.png?1477530554) no-repeat;
        width: 498px;
        height: 60px
    }

    .top-contents .menu-box li:nth-child(4) a {
        background: url(../img/common/sp/m_character.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    .top-contents .menu-box li:nth-child(5) a {
        background: url(../img/common/sp/m_system.png?1476933660) no-repeat;
        width: 498px;
        height: 60px
    }

    .top-contents .menu-box li:nth-child(6) a {
        background: url(../img/common/sp/m_special.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    .top-contents .menu-box li:nth-child(7) {
        margin: 0
    }

    .top-contents .menu-box li:nth-child(7) a {
        background: url(../img/common/sp/shop_guide_btn.png?1481766005) no-repeat;
        width: 620px;
        height: 230px
    }

    .top-contents .nav-box, .top-contents .shopguide-btn {
        display: none
    }

    .top-contents .title {
        margin-top: -15px
    }
}

#top .container .close-btn, #top .container .menu-box, #top .container .menu-btn {
    display: none
}

#top .container main {
    height: 947px;
    position: relative;
    z-index: 10
}

#top .container main .bg {
    position: absolute;
    background: url(../img/top/key_visual.png?1469440327) center 35px no-repeat;
    width: 100%;
    height: 948px
}

#top .container main > .wrapper {
    width: 1280px
}

#top .container main .platform {
    position: absolute;
    top: 86px;
    left: 100px
}

#top .container main .sns-box {
    font-size: 0;
    position: absolute;
    top: 80px;
    right: 90px;
    background: url(../img/top/share_bg.png?1469440327) no-repeat;
    width: 165px;
    height: 34px;
    padding-top: 10px
}

#top .container main .sns-box a {
    display: inline-block
}

#top .container main .sns-box .twi-btn {
    background: url(../img/top/twi_btn.png?1469440327) no-repeat;
    width: 22px;
    height: 22px;
    margin: 0 10px 0 64px
}

#top .container main .sns-box .fb-btn {
    background: url(../img/top/fb_btn.png?1469440327) no-repeat;
    width: 22px;
    height: 22px;
    margin-right: 10px
}

#top .container main .sns-box .line-btn {
    background: url(../img/top/line_btn.png?1469440327) no-repeat;
    width: 22px;
    height: 22px
}

#top .container main .logo-box {
    text-align: center;
    position: absolute;
    top: 134px;
    right: 135px
}

#top .container main .logo-box h1 {
    margin-top: -26px
}

#top .container main .logo-box .release-date {
    margin-top: -43px
}

#top .container main .nav-btn {
    position: absolute;
    top: 390px;
    right: 90px
}

#top .container main .nav-btn li {
    margin-bottom: 10px;
    position: relative
}

#top .container main .nav-btn li:nth-child(1) a {
    background: url(../img/top/info_btn.png?1469440327) no-repeat;
    width: 200px;
    height: 30px
}

#top .container main .nav-btn li:nth-child(2) a {
    background: url(../img/top/world_btn.png?1469440327) no-repeat;
    width: 200px;
    height: 30px
}

#top .container main .nav-btn li:nth-child(3) a {
    background: url(../img/top/story_btn.png?1477530554) no-repeat;
    width: 200px;
    height: 30px
}

#top .container main .nav-btn li:nth-child(4) a {
    background: url(../img/top/character_btn.png?1469440327) no-repeat;
    width: 200px;
    height: 30px
}

#top .container main .nav-btn li:nth-child(5) a {
    background: url(../img/top/system_btn.png?1476933660) no-repeat;
    width: 200px;
    height: 30px
}

#top .container main .nav-btn li:nth-child(6) a {
    background: url(../img/top/special_btn.png?1469440327) no-repeat;
    width: 200px;
    height: 30px
}

#top .container main .nav-btn .new:before {
    content: " ";
    background: url(../img/top/new_tag.png?1469440327) no-repeat;
    width: 41px;
    height: 14px;
    position: absolute;
    top: 7px;
    left: -20px;
    z-index: 10
}

#top .container main .official-twi-btn {
    background: url(../img/top/official_twi_btn.png?1469440327) no-repeat;
    width: 201px;
    height: 50px;
    position: absolute;
    top: 640px;
    right: 90px
}

#top .container main .news-box {
    background: url(../img/top/news_bg.png?1469440327) no-repeat;
    width: 380px;
    height: 141px;
    position: absolute;
    top: 760px;
    left: 110px;
    padding: 45px 0 0 20px
}

#top .container main .news-box li {
    font-size: 13px;
    margin-bottom: 18px
}

#top .container main .news-box li .date {
    color: #b60162;
    margin-right: 16px
}

#top .container main .news-box li .title {
    width: 260px;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block
}

#top .container main .manga-btn {
    background: url(../img/top/bnr_manga.png?1475203987) no-repeat;
    width: 200px;
    height: 65px;
    position: absolute;
    top: 835px;
    left: 493px;
    background-size: contain
}

#top .container main .shopguide-btn {
    background: url(../img/top/shopguide_btn.png?1481765968) no-repeat;
    width: 200px;
    height: 210px;
    position: absolute;
    top: 710px;
    right: 380px
}

#top .container main .movie {
    background: url(../img/top/pv2_window_top.png?1475203987) no-repeat;
    width: 275px;
    height: 240px;
    position: absolute;
    top: 700px;
    right: 90px
}

#top .container section .title {
    text-align: center
}

#top .container .world-section {
    margin-top: 206px
}

#top .container .world-section .world1 {
    margin-left: 18px
}

#top .container .world-section .world2 {
    margin: 34px 0 0 23px
}

#top .container .world-section .world3 {
    margin: 60px 0 0 21px
}

#top .container .world-section .to-world {
    background: url(../img/top/to_world_btn.png?1469440327) no-repeat;
    width: 379px;
    height: 102px;
    margin: auto;
    display: block
}

#top .container .character-section {
    margin-top: 250px
}

#top .container .character-section .char-img {
    margin: 68px 0 0 33px
}

#top .container .character-section .to-character {
    background: url(../img/top/to_character_btn.png?1469440327) no-repeat;
    width: 379px;
    height: 102px;
    margin: auto;
    display: block
}

#top .container .system-section {
    margin-top: 248px
}

#top .container .system-section .mousou-title {
    text-align: center;
    margin-top: 57px
}

#top .container .system-section .ss {
    margin: 40px 0 0 60px
}

#top .container .system-section .enemy-img {
    margin: 40px 0 0 4px
}

#top .container .system-section .headphone-img {
    margin: 30px 0 0 73px
}

#top .container .system-section .to-system {
    background: url(../img/top/to_system_btn.png?1476933660) no-repeat;
    width: 379px;
    height: 102px;
    margin: auto;
    display: block
}

#top .container .info-section {
    margin: 248px 0 15px
}

#top .container .info-section .info1 {
    margin: 46px 0 0 82px
}

#top .container .info-section .info2 {
    margin: 6px 0 0 306px
}

#top .container .info-section .info3 {
    margin: 10px 0 0 83px
}

@media screen and (max-width: 640px) {
    #top .container .close-btn, #top .container .menu-btn {
        width: 80px;
        height: 80px;
        top: 50px;
        right: 10px;
        z-index: 500;
        position: fixed
    }

    #top .container .menu-box .logo, #top .container .menu-box ul {
        text-align: center
    }

    #top .container .menu-btn {
        display: block;
        background: url(../img/common/sp/menu_btn.png?1469440327) no-repeat
    }

    #top .container .close-btn {
        display: none;
        background: url(../img/common/sp/close_btn.png?1469440327) no-repeat
    }

    #top .container .menu-box {
        display: none;
        position: fixed;
        z-index: 100;
        background: rgba(0, 174, 220, .8);
        top: 38px;
        margin: 0;
        width: 100%;
        height: 100%;
        padding-top: 135px
    }

    #top .container .menu-box .logo a {
        background: url(../img/common/sp/logo.png?1469440327) no-repeat;
        width: 518px;
        height: 129px
    }

    #top .container .menu-box li {
        margin: 0 0 20px
    }

    #top .container .menu-box li:nth-child(1) a {
        background: url(../img/common/sp/m_info.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    #top .container .menu-box li:nth-child(2) a {
        background: url(../img/common/sp/m_world.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    #top .container .menu-box li:nth-child(3) a {
        background: url(../img/common/sp/m_story.png?1477530554) no-repeat;
        width: 498px;
        height: 60px
    }

    #top .container .menu-box li:nth-child(4) a {
        background: url(../img/common/sp/m_character.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    #top .container .menu-box li:nth-child(5) a {
        background: url(../img/common/sp/m_system.png?1476933660) no-repeat;
        width: 498px;
        height: 60px
    }

    #top .container .menu-box li:nth-child(6) a {
        background: url(../img/common/sp/m_special.png?1469440327) no-repeat;
        width: 498px;
        height: 60px
    }

    #top .container .menu-box li:nth-child(7) {
        margin: 0
    }

    #top .container .menu-box li:nth-child(7) a {
        background: url(../img/common/sp/shop_guide_btn.png?1481766005) no-repeat;
        width: 620px;
        height: 230px
    }

    #top .container main {
        height: 2400px
    }

    #top .container main .bg {
        background: url(../img/top/sp/key_visual.png?1469440327) center top no-repeat;
        width: 640px;
        height: 615px
    }

    #top .container main > .wrapper {
        width: 640px
    }

    #top .container main .platform {
        top: 60px;
        left: 30px
    }

    #top .container main .logo-box {
        top: 542px;
        right: 2px
    }

    #top .container main .logo-box .release-date {
        margin-top: -18px
    }

    #top .container main .movie {
        background: url(../img/top/sp/pv2_window.png?1474015281) no-repeat;
        width: 540px;
        height: 450px;
        top: 832px;
        margin: auto;
        right: 0;
        left: 0
    }

    #top .container main .nav-btn {
        display: none
    }

    #top .container main .sns-box {
        top: 1295px;
        right: 148px;
        background: url(../img/top/sp/share_bg.png?1469440327) no-repeat;
        width: 340px;
        height: 66px;
        padding-top: 22px
    }

    #top .container main .sns-box a {
        display: inline-block
    }

    #top .container main .sns-box .twi-btn {
        background: url(../img/top/sp/twi_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin: 0 22px 0 135px
    }

    #top .container main .sns-box .fb-btn {
        background: url(../img/top/sp/fb_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin-right: 22px
    }

    #top .container main .sns-box .line-btn {
        background: url(../img/top/sp/line_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px
    }

    #top .container main .official-twi-btn {
        top: 1405px;
        right: 148px;
        background: url(../img/top/sp/official_twi_btn.png?1469440327) no-repeat;
        width: 340px;
        height: 85px
    }

    #top .container main .news-box {
        background: url(../img/top/sp/news_bg.png?1469440327) no-repeat;
        width: 510px;
        height: 248px;
        top: 1580px;
        left: 50px;
        padding: 72px 0 0 30px
    }

    #top .container main .news-box li {
        font-size: 24px
    }

    #top .container main .news-box li .date {
        display: block;
        margin: 0 0 13px
    }

    #top .container main .news-box li .title {
        width: 480px;
        color: #00b8ee;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: inline-block
    }

    #top .container main .manga-btn {
        background: url(../img/top/bnr_manga.png?1475203987) no-repeat;
        width: 620px;
        height: 200px;
        top: 1930px;
        left: 10px
    }

    #top .container main .shopguide-btn {
        background: url(../img/top/sp/shopguide_btn.png?1481765988) no-repeat;
        width: 620px;
        height: 230px;
        position: absolute;
        top: 2150px;
        left: 10px
    }

    #top .container .world-section {
        margin-top: 26px
    }

    #top .container .world-section .world1 {
        margin: 0
    }

    #top .container .world-section .world2 {
        margin: 3px 0 0
    }

    #top .container .world-section .world3 {
        margin: -18px 0 0
    }

    #top .container .world-section .to-world {
        background: url(../img/top/sp/to_world_btn.png?1469440327) no-repeat;
        width: 414px;
        height: 108px;
        margin: -24px auto 0;
        display: block
    }

    #top .container .character-section {
        margin-top: 96px
    }

    #top .container .character-section .char-img {
        margin: 65px 0 0 18px
    }

    #top .container .character-section .to-character {
        background: url(../img/top/sp/to_character_btn.png?1469440327) no-repeat;
        width: 414px;
        height: 108px;
        margin: 36px auto 0;
        display: block
    }

    #top .container .system-section {
        margin-top: 113px
    }

    #top .container .system-section .mousou-title {
        display: none
    }

    #top .container .system-section .ss {
        margin: 73px 0 0
    }

    #top .container .system-section .enemy-img {
        margin: 20px 0 0
    }

    #top .container .system-section .headphone-img {
        margin: 3px 0 0
    }

    #top .container .system-section .to-system {
        background: url(../img/top/sp/to_system_btn.png?1476933660) no-repeat;
        width: 414px;
        height: 108px;
        margin: 8px auto 0;
        display: block
    }

    #top .container .info-section {
        margin: 115px 0 15px
    }

    #top .container .info-section .info1 {
        margin: 77px 0 0 31px
    }

    #top .container .info-section .info2 {
        margin: 10px 0 0 31px
    }

    #top .container .info-section .info3 {
        margin: 15px 0 0 31px
    }
}

#world main {
    margin: 63px 0 30px
}

#world .movie {
    background: url(../img/world/pv_window.png?1469440327) no-repeat;
    width: 641px;
    height: 502px;
    display: block;
    margin: auto
}

#world .world1 {
    margin: 110px 0 0 38px
}

#world .world2 {
    margin: 60px 0 0 45px
}

#world .world3 {
    margin: 80px 0 0 48px
}

#world .world4 {
    margin: 28px 0 0 35px
}

#world .world5 {
    margin: 50px 0 0 102px
}

@media (max-width: 640px) {
    #world {
        background: url(../img/common/bg.jpg?1469440327)
    }

    #world main {
        margin: 140px 0 30px
    }

    #world .movie {
        background: url(../img/world/sp/pv_window.png?1469440327) no-repeat;
        width: 541px;
        height: 433px;
        display: block;
        margin: auto
    }

    #world .world1 {
        margin: 35px 0 0
    }

    #world .world2 {
        margin: 16px 0 0
    }

    #world .world3 {
        margin: 5px 0 0
    }

    #world .world4 {
        margin: 0
    }

    #world .world5 {
        margin: 80px 0 0;
        text-align: center
    }
}

#character {
    background: url(../img/common/bg.jpg?1469440327)
}

#character main {
    margin: 45px 0 30px
}

#character .anothercharacter, #character .char1, #character .char2, #character .char3, #character .char4, #character .char5, #character .char6, #character .char7, #character .jikeidan, #character .kanrikyoku, #character .pink-mantle {
    position: relative
}

#character .anothercharacter a, #character .char1 a, #character .char2 a, #character .char3 a, #character .char4 a, #character .char5 a, #character .char6 a, #character .char7 a, #character .jikeidan a, #character .kanrikyoku a, #character .pink-mantle a {
    position: absolute;
    z-index: 10
}

#character .char1 {
    margin-left: 248px
}

#character .char1 a {
    background: url(../img/character/to_asahi_btn.png?1469440327) no-repeat;
    width: 210px;
    height: 84px;
    top: 348px;
    left: 605px
}

#character .char2 {
    margin: -5px 0 0 32px
}

#character .char2 a {
    background: url(../img/character/to_saki_btn.png?1469440327) no-repeat;
    width: 205px;
    height: 80px;
    top: 364px;
    left: -70px
}

#character .char3 {
    margin: -30px 0 0 248px
}

#character .char3 a {
    background: url(../img/character/to_riyu_btn.png?1469440327) no-repeat;
    width: 210px;
    height: 84px;
    top: 391px;
    left: 605px
}

#character .char4 {
    margin: -12px 0 0 16px
}

#character .char4 a {
    background: url(../img/character/to_yamato_btn.png?1469440327) no-repeat;
    width: 210px;
    height: 84px;
    top: 364px;
    left: -54px
}

#character .char5 {
    margin: -30px 0 0 249px
}

#character .char5 a {
    background: url(../img/character/to_kotomi_btn.png?1474015281) no-repeat;
    width: 210px;
    height: 85px;
    top: 391px;
    left: 605px
}

#character .char6 {
    margin: -107px 0 0 32px
}

#character .char6 a {
    background: url(../img/character/to_reiji_btn.png?1474015281) no-repeat;
    width: 210px;
    height: 84px;
    top: 460px;
    left: -70px
}

#character .char7 {
    margin: -30px 0 0 248px
}

#character .char7 a {
    background: url(../img/character/to_mizuki_btn.png?1474015281) no-repeat;
    width: 210px;
    height: 85px;
    top: 389px;
    left: 605px
}

#character .anothercharacter a, #character .jikeidan a, #character .kanrikyoku a, #character .pink-mantle a {
    background: url(../img/character/to_anothercharacter_btn.png?1469440327) no-repeat;
    width: 210px;
    height: 85px
}

#character .sub-char {
    margin-top: 186px;
    text-align: center
}

#character .anothercharacter {
    margin: 83px 0 0 153px
}

#character .anothercharacter .anotherchar-btn1 {
    top: 20px;
    right: 35px
}

#character .anothercharacter .anotherchar-btn2 {
    bottom: 157px;
    left: -176px
}

#character .pink-mantle {
    margin: 105px 0 0 320px
}

#character .pink-mantle a {
    top: 675px;
    left: 402px
}

#character .jikeidan {
    margin: 110px 0 0 203px
}

#character .jikeidan a {
    top: 702px;
    left: -238px
}

#character .kanrikyoku {
    margin: 123px 0 0 -130px
}

#character .kanrikyoku a {
    top: 612px;
    left: 995px
}

@media (max-width: 640px) {
    #character main {
        margin: 113px 0 30px
    }

    #character .char1 {
        margin-left: 11px
    }

    #character .char1 a {
        background: url(../img/character/sp/to_asahi_btn.png?1469440327) no-repeat;
        width: 201px;
        height: 83px;
        top: 452px;
        left: 415px
    }

    #character .char2 {
        margin: 82px 0 0
    }

    #character .char2 a {
        background: url(../img/character/sp/to_saki_btn.png?1469440327) no-repeat;
        width: 196px;
        height: 78px;
        top: 459px;
        left: 290px
    }

    #character .char3 {
        margin: 77px 0 0 9px
    }

    #character .char3 a {
        background: url(../img/character/sp/to_riyu_btn.png?1469440327) no-repeat;
        width: 201px;
        height: 82px;
        top: 479px;
        left: 415px
    }

    #character .char4 {
        margin: 78px 0 0
    }

    #character .char4 a {
        background: url(../img/character/sp/to_yamato_btn.png?1469440327) no-repeat;
        width: 201px;
        height: 82px;
        top: 457px;
        left: 290px
    }

    #character .char5 {
        margin: 77px 0 0 11px
    }

    #character .char5 a {
        background: url(../img/character/sp/to_kotomi_btn.png?1474015281) no-repeat;
        width: 201px;
        height: 82px;
        top: 465px;
        left: 415px
    }

    #character .char6 {
        margin: 40px 0 0
    }

    #character .char6 a {
        background: url(../img/character/sp/to_reiji_btn.png?1474015281) no-repeat;
        width: 201px;
        height: 82px;
        top: 509px;
        left: 290px
    }

    #character .char7 {
        margin: 77px 0 0
    }

    #character .char7 a {
        background: url(../img/character/sp/to_mizuki_btn.png?1474015281) no-repeat;
        width: 201px;
        height: 82px;
        top: 457px;
        left: 417px
    }

    #character .anothercharacter a, #character .jikeidan a, #character .kanrikyoku a, #character .pink-mantle a {
        background: url(../img/character/sp/to_anothercharacter_btn.png?1474015281) no-repeat;
        width: 210px;
        height: 84px
    }

    #character .sub-char {
        margin-top: 140px
    }

    #character .anothercharacter {
        margin: 80px 0 0 12px
    }

    #character .anothercharacter .anotherchar-btn1 {
        top: -26px;
        left: 420px
    }

    #character .anothercharacter .anotherchar-btn2 {
        bottom: 80px;
        left: 0
    }

    #character .pink-mantle {
        margin: 72px 0 0 140px
    }

    #character .pink-mantle a {
        top: 445px;
        left: 284px
    }

    #character .jikeidan {
        margin: 48px 0 0 118px
    }

    #character .jikeidan a {
        top: 494px;
        left: -64px
    }

    #character .kanrikyoku {
        margin: 83px 0 0 43px
    }

    #character .kanrikyoku a {
        top: 482px;
        left: 344px
    }
}

.char-details {
    background: url(../img/common/bg.jpg?1469440327)
}

.char-details .to-top {
    background: url(../img/character/to_top_btn.png?1469440327) no-repeat;
    width: 311px;
    height: 90px
}

.char-details .bottom-shop-btn {
    top: 1090px;
    left: 0;
    right: 0
}

.char-details .asahi {
    margin: 80px 0 365px !important
}

.char-details .asahi a {
    position: absolute
}

.char-details .asahi .char {
    position: relative;
    margin-left: 80px
}

.char-details .asahi .movie {
    background: url(../img/character/asahi/movie.jpg?1469440327) no-repeat;
    width: 456px;
    height: 264px;
    top: 664px;
    left: 2px
}

.char-details .asahi .to-top {
    top: 1002px;
    left: 357px
}

.char-details .saki {
    margin: 72px 0 365px !important
}

.char-details .saki a {
    position: absolute
}

.char-details .saki .char {
    position: relative;
    margin-left: 80px
}

.char-details .saki .movie {
    background: url(../img/character/saki/movie.png?1474015281) no-repeat;
    width: 456px;
    height: 264px;
    position: absolute;
    top: 670px;
    left: 409px
}

.char-details .saki .to-top {
    top: 1002px;
    left: 357px
}

.char-details .saki .bottom-shop-btn {
    top: 1090px
}

.char-details .riyu {
    margin: 86px 0 375px !important
}

.char-details .riyu a {
    position: absolute
}

.char-details .riyu .char {
    position: relative;
    margin-left: 80px
}

.char-details .riyu .movie {
    background: url(../img/character/riyu/movie.png?1469440327) no-repeat;
    width: 456px;
    height: 264px;
    position: absolute;
    top: 665px;
    left: 0
}

.char-details .riyu .to-top {
    top: 1002px;
    left: 357px
}

.char-details .yamato {
    margin: 90px 0 395px !important
}

.char-details .yamato a {
    position: absolute
}

.char-details .yamato .char {
    position: relative;
    margin-left: 80px
}

.char-details .yamato .movie {
    background: url(../img/character/yamato/movie.png?1469440327) no-repeat;
    width: 456px;
    height: 264px;
    position: absolute;
    top: 652px;
    left: 410px
}

.char-details .yamato .to-top {
    top: 990px;
    left: 357px
}

.char-details .kotomi {
    margin: 90px 0 345px !important
}

.char-details .kotomi a {
    position: absolute
}

.char-details .kotomi .char {
    position: relative;
    margin-left: 38px
}

.char-details .kotomi .movie {
    background: url(../img/character/kotomi/movie.png?1474015281) no-repeat;
    width: 456px;
    height: 264px;
    position: absolute;
    top: 681px;
    left: 452px
}

.char-details .kotomi .to-top {
    top: 990px;
    left: 357px
}

.char-details .reiji {
    margin: 90px 0 345px !important
}

.char-details .reiji a {
    position: absolute
}

.char-details .reiji .char {
    position: relative;
    margin-left: 80px
}

.char-details .reiji .movie {
    background: url(../img/character/reiji/movie.png?1474015281) no-repeat;
    width: 456px;
    height: 264px;
    position: absolute;
    top: 665px;
    left: 0
}

.char-details .reiji .to-top {
    top: 990px;
    left: 357px
}

.char-details .mizuki {
    margin: 90px 0 375px !important
}

.char-details .mizuki a {
    position: absolute
}

.char-details .mizuki .char {
    position: relative;
    margin-left: 80px
}

.char-details .mizuki .movie {
    background: url(../img/character/mizuki/movie.png?1475203987) no-repeat;
    width: 456px;
    height: 264px;
    position: absolute;
    top: 652px;
    left: 412px
}

.char-details .mizuki .to-top {
    top: 990px;
    left: 357px
}

.char-details .another {
    margin: 60px 0 30px !important
}

.char-details .another h3 {
    text-align: center
}

.char-details .another #pinkun {
    position: relative;
    margin: 70px 0 0 308px
}

.char-details .another #maid .moe {
    position: relative;
    margin: 40px 0 0 16px
}

.char-details .another #maid .kanata {
    position: relative;
    margin: -215px 0 0 311px
}

.char-details .another #maid .yoshino {
    position: relative;
    margin: -250px 0 0 -43px
}

.char-details .another #pink-mantle {
    margin-top: 50px
}

.char-details .another .kanon {
    margin: 60px 0 0 180px
}

.char-details .another #jikeidan {
    margin-top: 97px
}

.char-details .another .dancho {
    margin: -17px 0 0 323px
}

.char-details .another .akari {
    margin: -260px 0 0 15px
}

.char-details .another .aoi {
    margin: -270px 0 0 318px
}

.char-details .another #kanrikyoku {
    margin-top: 15px
}

.char-details .another .mikado {
    margin: 10px 0 0 320px
}

.char-details .another .kasuga {
    margin: -215px 0 0 -15px
}

.char-details .another .mari {
    margin: -185px 0 0 320px
}

.char-details .another .to-top {
    margin: auto;
    display: block
}

@media (max-width: 640px) {
    .char-details .to-top {
        background: url(../img/character/sp/to_top_btn.png?1469440327) no-repeat;
        width: 418px;
        height: 112px
    }

    .char-details .asahi {
        margin: 65px 0 725px !important
    }

    .char-details .asahi .char {
        margin-left: 28px
    }

    .char-details .asahi .movie {
        background: url(../img/character/sp/asahi/movie.jpg?1469440327) no-repeat;
        width: 540px;
        height: 315px;
        top: 1548px;
        left: 20px
    }

    .char-details .asahi .to-top {
        top: 1884px;
        left: 112px
    }

    .char-details .asahi .bottom-shop-btn {
        top: 1995px
    }

    .char-details .saki {
        margin: 65px 0 725px !important
    }

    .char-details .saki .char {
        margin-left: 28px
    }

    .char-details .saki .movie {
        background: url(../img/character/sp/saki/movie.png?1474015281) no-repeat;
        width: 540px;
        height: 315px;
        top: 1548px;
        left: 20px
    }

    .char-details .saki .to-top {
        top: 1884px;
        left: 112px
    }

    .char-details .saki .bottom-shop-btn {
        top: 1995px
    }

    .char-details .riyu {
        margin: 63px 0 705px !important
    }

    .char-details .riyu .char {
        margin-left: 28px
    }

    .char-details .riyu .movie {
        background: url(../img/character/sp/riyu/movie.png?1469440327) no-repeat;
        width: 540px;
        height: 315px;
        top: 1608px;
        left: 20px
    }

    .char-details .riyu .to-top {
        top: 1946px;
        left: 112px
    }

    .char-details .riyu .bottom-shop-btn {
        top: 2060px
    }

    .char-details .yamato {
        margin: 63px 0 705px !important
    }

    .char-details .yamato .char {
        margin-left: 28px
    }

    .char-details .yamato .movie {
        background: url(../img/character/sp/yamato/movie.png?1469440327) no-repeat;
        width: 540px;
        height: 315px;
        top: 1530px;
        left: 20px
    }

    .char-details .yamato .to-top {
        top: 1864px;
        left: 112px
    }

    .char-details .yamato .bottom-shop-btn {
        top: 1980px
    }

    .char-details .kotomi {
        margin: 63px 0 765px !important
    }

    .char-details .kotomi .char {
        margin-left: 23px
    }

    .char-details .kotomi .movie {
        background: url(../img/character/sp/kotomi/movie.png?1474015281) no-repeat;
        width: 540px;
        height: 315px;
        top: 1620px;
        left: 28px
    }

    .char-details .kotomi .to-top {
        top: 1960px;
        left: 112px
    }

    .char-details .kotomi .bottom-shop-btn {
        top: 2075px
    }

    .char-details .reiji {
        margin: 63px 0 765px !important
    }

    .char-details .reiji .char {
        margin-left: 30px
    }

    .char-details .reiji .movie {
        background: url(../img/character/sp/reiji/movie.png?1474015281) no-repeat;
        width: 540px;
        height: 315px;
        top: 1620px;
        left: 20px
    }

    .char-details .reiji .to-top {
        top: 1960px;
        left: 112px
    }

    .char-details .reiji .bottom-shop-btn {
        top: 2075px
    }

    .char-details .mizuki {
        margin: 63px 0 765px !important
    }

    .char-details .mizuki .char {
        margin-left: 28px
    }

    .char-details .mizuki .movie {
        background: url(../img/character/sp/mizuki/movie.png?1475203987) no-repeat;
        width: 540px;
        height: 315px;
        top: 1620px;
        left: 20px
    }

    .char-details .mizuki .to-top {
        top: 1960px;
        left: 112px
    }

    .char-details .mizuki .bottom-shop-btn {
        top: 2075px
    }

    .char-details .another {
        margin: 40px 0 30px !important
    }

    .char-details .another #pinkun {
        position: relative;
        margin-left: 46px;
        margin-top: 80px
    }

    .char-details .another #maid .moe {
        position: relative;
        margin-top: 5px;
        margin-left: 0
    }

    .char-details .another #maid .kanata {
        position: relative;
        margin-top: -30px;
        margin-left: 30px
    }

    .char-details .another #maid .yoshino {
        position: relative;
        margin-top: -120px;
        margin-left: 0
    }

    .char-details .another #pink-mantle {
        margin-top: 128px
    }

    .char-details .another .kanon {
        margin: 65px 0 0 42px
    }

    .char-details .another #jikeidan {
        margin-top: 102px
    }

    .char-details .another .dancho {
        margin: -14px 0 0 42px
    }

    .char-details .another .akari {
        margin: -130px 0 0
    }

    .char-details .another .aoi {
        margin: -60px 0 0 43px
    }

    .char-details .another #kanrikyoku {
        margin-top: 100px
    }

    .char-details .another .mikado {
        margin: 82px 0 0 40px
    }

    .char-details .another .kasuga {
        margin: 15px 0 0
    }

    .char-details .another .mari {
        margin: -84px 0 0 42px
    }

    .char-details .another .to-top {
        margin: 10px auto 0
    }
}

#special {
    background: url(../img/common/bg.jpg?1469440327)
}

#special .wrapper {
    width: 1030px
}

#special main {
    margin: 85px 0 30px
}

#special .special-btn-box {
    font-size: 0;
    text-align: center
}

#special .special-btn-box .all-btn {
    background: url(../img/special/all_btn.png?1469440327) no-repeat;
    width: 140px;
    height: 20px;
    margin-right: 20px
}

#special .special-btn-box .movie-btn {
    background: url(../img/special/movie_btn.png?1469440327) no-repeat;
    width: 140px;
    height: 20px;
    margin-right: 20px
}

#special .special-btn-box .others-btn {
    background: url(../img/special/others_btn.png?1469440327) no-repeat;
    width: 140px;
    height: 20px
}

#special .special-contents {
    font-size: 0;
    width: 1020px;
    margin: 40px auto 0
}

#special .special-contents a {
    display: none;
    margin-bottom: 45px;
    position: relative
}

#special .special-contents a:nth-child(odd) {
    margin-right: 20px
}

#special .special-contents a.new:before {
    content: '';
    background: url(../img/common/new_tag.png?1469440327) no-repeat;
    width: 82px;
    height: 24px;
    position: absolute;
    top: 0;
    left: 0
}

#special .special-contents .conceptpv01 {
    background: url(../img/special/thumbnail/conceptpv01.png?1469440327) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv01 {
    background: url(../img/special/thumbnail/charapv01.png?1469440327) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv02 {
    background: url(../img/special/thumbnail/charapv02.png?1474015281) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv03 {
    background: url(../img/special/thumbnail/charapv03.png?1469440327) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv04 {
    background: url(../img/special/thumbnail/charapv04.png?1469440327) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv05 {
    background: url(../img/special/thumbnail/charapv05.png?1474015281) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv06 {
    background: url(../img/special/thumbnail/charapv06.png?1474015281) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .charapv07 {
    background: url(../img/special/thumbnail/charapv07.png?1475203987) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .pv02 {
    background: url(../img/special/thumbnail/pv02.png?1475203987) no-repeat;
    width: 500px;
    height: 330px
}

#special .special-contents .op {
    background: url(../img/special/thumbnail/op.png?1478480267) no-repeat;
    width: 500px;
    height: 330px
}

@media (max-width: 640px) {
    #special .wrapper {
        width: 640px
    }

    #special main {
        margin: 140px 0 30px
    }

    #special .special-btn-box .all-btn {
        background: url(../img/special/sp/all_btn.png?1469440327) no-repeat;
        width: 160px;
        height: 30px;
        margin-right: 20px
    }

    #special .special-btn-box .movie-btn {
        background: url(../img/special/sp/movie_btn.png?1469440327) no-repeat;
        width: 160px;
        height: 30px;
        margin-right: 20px
    }

    #special .special-btn-box .others-btn {
        background: url(../img/special/sp/others_btn.png?1469440327) no-repeat;
        width: 160px;
        height: 30px
    }

    #special .special-contents {
        width: 640px;
        margin-top: 40px;
        text-align: center
    }

    #special .special-contents a {
        margin: 0 0 55px
    }

    #special .special-contents a:nth-child(odd) {
        margin-right: 0
    }

    #special .special-contents a:last-child {
        margin: 0
    }

    #special .special-contents .conceptpv01 {
        background: url(../img/special/sp/thumbnail/conceptpv01.png?1469440327) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv01 {
        background: url(../img/special/sp/thumbnail/charapv01.png?1469440327) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv02 {
        background: url(../img/special/sp/thumbnail/charapv02.png?1474015281) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv03 {
        background: url(../img/special/sp/thumbnail/charapv03.png?1469440327) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv04 {
        background: url(../img/special/sp/thumbnail/charapv04.png?1469440327) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv05 {
        background: url(../img/special/sp/thumbnail/charapv05.png?1474015281) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv06 {
        background: url(../img/special/sp/thumbnail/charapv06.png?1474015281) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .charapv07 {
        background: url(../img/special/sp/thumbnail/charapv07.png?1475203987) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .pv02 {
        background: url(../img/special/sp/thumbnail/pv02.png?1475203987) no-repeat;
        width: 540px;
        height: 370px
    }

    #special .special-contents .op {
        background: url(../img/special/sp/thumbnail/op.png?1478480288) no-repeat;
        width: 540px;
        height: 370px
    }
}

#gad .container main {
    height: 745px;
    position: relative;
    z-index: 10
}

#gad .container main .bg {
    position: absolute;
    background: url(../img/gad/key_visual.png?1475203987) center top no-repeat;
    width: 100%;
    height: 745px
}

#gad .container main > .wrapper {
    width: 1280px
}

#gad .container main .platform {
    position: absolute;
    top: 58px;
    left: 102px
}

#gad .container main .logo-box {
    text-align: center;
    position: absolute;
    top: 47px;
    right: 108px
}

#gad .container main .logo-box h1 {
    margin-top: -26px
}

#gad .container main .logo-box .release-date {
    margin-top: -40px
}

#gad .container main .l-edition-check {
    position: absolute;
    top: 280px;
    right: 137px
}

#gad .container main .shopguide-btn {
    background: url(../img/gad/shopguide_btn.png?1481768164) no-repeat;
    width: 382px;
    height: 180px;
    position: absolute;
    top: 524px;
    right: 117px
}

#gad .container main .movie {
    background: url(../img/gad/pv2_window.png?1475203987) no-repeat;
    width: 254px;
    height: 213px;
    position: absolute;
    top: 585px;
    left: 130px
}

#gad .container section .title {
    text-align: center
}

#gad .container .world-section {
    margin-top: 58px
}

#gad .container .world-section .world1 {
    margin-left: 18px
}

#gad .container .world-section .world2 {
    margin: 34px 0 0 23px
}

#gad .container .world-section .world3 {
    margin: 60px 0 0 21px
}

#gad .container .character-section {
    margin-top: 90px
}

#gad .container .character-section .char-img {
    margin: 68px 0 0 33px
}

#gad .container .system-section {
    margin-top: 135px
}

#gad .container .system-section .mousou-title {
    text-align: center;
    margin-top: 57px
}

#gad .container .system-section .ss {
    margin: 40px 0 0 60px
}

#gad .container .system-section .enemy-img {
    margin: 40px 0 0 4px
}

#gad .container .system-section .headphone-img {
    margin: 30px 0 0 73px
}

#gad .container .info-section {
    margin-top: 83px
}

#gad .container .info-section .info1 {
    margin: 46px 0 0 82px
}

#gad .container .info-section .info2 {
    margin: 6px 0 0 306px
}

#gad .container .info-section .info3 {
    margin: 10px 0 0 83px
}

#gad .container .l-edition-section {
    margin: 115px 0 50px
}

#gad .container .l-edition-section .image {
    margin-top: 2px
}

#gad .container .l-edition-section .shopguide-btn {
    background: url(../img/gad/b_shopguide_btn.png?1481768129) no-repeat;
    width: 915px;
    height: 323px;
    margin: -18px auto 0;
    display: block;
    position: relative;
    left: -32px
}

#gad .container .l-edition-section .official-site-btn {
    background: url(../img/gad/official_site_btn.png?1475203987) no-repeat;
    width: 925px;
    height: 260px;
    margin: -12px auto 0;
    display: block
}

#gad .container .l-edition-section .sns-box {
    font-size: 0;
    background: url(../img/gad/share_bg.png?1475203987) no-repeat;
    width: 463px;
    height: 86px;
    padding-top: 27px;
    margin: 62px auto 0
}

#gad .container .l-edition-section .sns-box a {
    display: inline-block
}

#gad .container .l-edition-section .sns-box .twi-btn {
    background: url(../img/gad/twi_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin: 0 30px 0 180px
}

#gad .container .l-edition-section .sns-box .fb-btn {
    background: url(../img/gad/fb_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin-right: 30px
}

#gad .container .l-edition-section .sns-box .line-btn {
    background: url(../img/gad/line_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px
}

@media screen and (max-width: 640px) {
    #gad .container main {
        height: 1840px
    }

    #gad .container main .bg {
        background: url(../img/gad/sp/key_visual.png?1475203987) center 40px no-repeat;
        width: 640px;
        height: 723px
    }

    #gad .container main > .wrapper {
        width: 640px
    }

    #gad .container main .logo-box {
        top: 653px;
        right: 2px
    }

    #gad .container main .shopguide-btn {
        background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
        width: 550px;
        height: 194px;
        position: absolute;
        top: 968px;
        left: 40px
    }

    #gad .container main .l-edition-check {
        top: 1148px;
        right: 103px
    }

    #gad .container main .movie {
        background: url(../img/top/sp/pv2_window.png?1474015281) no-repeat;
        width: 540px;
        height: 450px;
        top: 1400px;
        margin: auto;
        right: 0;
        left: 0
    }

    #gad .container main .sns-box {
        top: 1295px;
        right: 148px;
        background: url(../img/top/sp/share_bg.png?1469440327) no-repeat;
        width: 340px;
        height: 66px;
        padding-top: 22px
    }

    #gad .container main .sns-box a {
        display: inline-block
    }

    #gad .container main .sns-box .twi-btn {
        background: url(../img/top/sp/twi_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin: 0 22px 0 135px
    }

    #gad .container main .sns-box .fb-btn {
        background: url(../img/top/sp/fb_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin-right: 22px
    }

    #gad .container main .sns-box .line-btn {
        background: url(../img/top/sp/line_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px
    }

    #gad .container .world-section {
        margin-top: 26px
    }

    #gad .container .world-section .world1 {
        margin: 0
    }

    #gad .container .world-section .world2 {
        margin: 3px 0 0
    }

    #gad .container .world-section .world3 {
        margin: -18px 0 0
    }

    #gad .container .character-section {
        margin-top: 96px
    }

    #gad .container .character-section .char-img {
        margin: 65px 0 0 18px
    }

    #gad .container .system-section {
        margin-top: 113px
    }

    #gad .container .system-section .mousou-title {
        display: none
    }

    #gad .container .system-section .ss {
        margin: 73px 0 0
    }

    #gad .container .system-section .enemy-img {
        margin: 20px 0 0
    }

    #gad .container .system-section .headphone-img {
        margin: 3px 0 0
    }

    #gad .container .info-section {
        margin: 115px 0 83px
    }

    #gad .container .info-section .info1 {
        margin: 77px 0 0 31px
    }

    #gad .container .info-section .info2 {
        margin: 10px 0 0 31px
    }

    #gad .container .info-section .info3 {
        margin: 15px 0 0 31px
    }

    #gad .container .l-edition-section .image {
        margin: -8px 0 0 48px
    }

    #gad .container .l-edition-section .shopguide-btn {
        background: url(../img/gad/sp/b_shopguide_btn.png?1481768414) no-repeat;
        width: 550px;
        height: 194px;
        left: -18px
    }

    #gad .container .l-edition-section .official-site-btn {
        background: url(../img/gad/sp/official_site_btn.png?1475203987) no-repeat;
        width: 490px;
        height: 138px;
        margin: 12px auto 0
    }
}

#gad2 .container main {
    height: 745px;
    position: relative;
    z-index: 10
}

#gad2 .container main .bg {
    position: absolute;
    background: url(../img/gad/key_visual.png?1475203987) center top no-repeat;
    width: 100%;
    height: 745px
}

#gad2 .container main > .wrapper {
    width: 1280px
}

#gad2 .container main .platform {
    position: absolute;
    top: 58px;
    left: 102px
}

#gad2 .container main .logo-box {
    text-align: center;
    position: absolute;
    top: 47px;
    right: 108px
}

#gad2 .container main .logo-box h1 {
    margin-top: -26px
}

#gad2 .container main .logo-box .release-date {
    margin-top: -40px
}

#gad2 .container main .l-edition-check {
    position: absolute;
    top: 280px;
    right: 137px
}

#gad2 .container main .shopguide-btn {
    background: url(../img/gad/shopguide_btn.png?1481768164) no-repeat;
    width: 382px;
    height: 180px;
    position: absolute;
    top: 524px;
    right: 117px
}

#gad2 .container main .movie {
    background: url(../img/gad/pv2_window.png?1475203987) no-repeat;
    width: 254px;
    height: 213px;
    position: absolute;
    top: 585px;
    left: 130px
}

#gad2 .container section .title {
    text-align: center
}

#gad2 .container section .shopguide-btn {
    background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
    width: 550px;
    height: 194px;
    display: block;
    position: relative;
    left: -32px;
    margin: auto
}

#gad2 .container .world-section {
    margin-top: 58px
}

#gad2 .container .world-section .world1 {
    margin-left: 18px
}

#gad2 .container .world-section .world2 {
    margin: 34px 0 0 23px
}

#gad2 .container .world-section .world3 {
    margin: 60px 0 0 21px
}

#gad2 .container .character-section {
    margin-top: 90px
}

#gad2 .container .character-section .char-img {
    margin: 68px 0 0 33px
}

#gad2 .container .system-section {
    margin-top: 135px
}

#gad2 .container .system-section .mousou-title {
    text-align: center;
    margin-top: 57px
}

#gad2 .container .system-section .ss {
    margin: 40px 0 0 60px
}

#gad2 .container .system-section .enemy-img {
    margin: 40px 0 0 4px
}

#gad2 .container .system-section .headphone-img {
    margin: 30px 0 0 73px
}

#gad2 .container .info-section {
    margin-top: 83px
}

#gad2 .container .info-section .info1 {
    margin: 46px 0 0 82px
}

#gad2 .container .info-section .info2 {
    margin: 6px 0 0 306px
}

#gad2 .container .info-section .info3 {
    margin: 10px 0 0 83px
}

#gad2 .container .l-edition-section {
    margin: 115px 0 50px
}

#gad2 .container .l-edition-section .image {
    margin-top: 2px
}

#gad2 .container .l-edition-section .shopguide-btn {
    background: url(../img/gad/b_shopguide_btn.png?1481768129) no-repeat;
    width: 915px;
    height: 323px;
    margin: -18px auto 0
}

#gad2 .container .l-edition-section .official-site-btn {
    background: url(../img/gad/official_site_btn.png?1475203987) no-repeat;
    width: 925px;
    height: 260px;
    margin: -12px auto 0;
    display: block
}

#gad2 .container .l-edition-section .sns-box {
    font-size: 0;
    background: url(../img/gad/share_bg.png?1475203987) no-repeat;
    width: 463px;
    height: 86px;
    padding-top: 27px;
    margin: 62px auto 0
}

#gad2 .container .l-edition-section .sns-box a {
    display: inline-block
}

#gad2 .container .l-edition-section .sns-box .twi-btn {
    background: url(../img/gad/twi_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin: 0 30px 0 180px
}

#gad2 .container .l-edition-section .sns-box .fb-btn {
    background: url(../img/gad/fb_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin-right: 30px
}

#gad2 .container .l-edition-section .sns-box .line-btn {
    background: url(../img/gad/line_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px
}

@media screen and (max-width: 640px) {
    #gad2 .container main {
        height: 1840px
    }

    #gad2 .container main .bg {
        background: url(../img/gad/sp/key_visual.png?1475203987) center 40px no-repeat;
        width: 640px;
        height: 723px
    }

    #gad2 .container main > .wrapper {
        width: 640px
    }

    #gad2 .container main .logo-box {
        top: 653px;
        right: 2px
    }

    #gad2 .container main .shopguide-btn {
        background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
        width: 550px;
        height: 194px;
        position: absolute;
        top: 968px;
        left: 40px
    }

    #gad2 .container main .l-edition-check {
        top: 1148px;
        right: 103px
    }

    #gad2 .container main .movie {
        background: url(../img/top/sp/pv2_window.png?1474015281) no-repeat;
        width: 540px;
        height: 450px;
        top: 1400px;
        margin: auto;
        right: 0;
        left: 0
    }

    #gad2 .container main .sns-box {
        top: 1295px;
        right: 148px;
        background: url(../img/top/sp/share_bg.png?1469440327) no-repeat;
        width: 340px;
        height: 66px;
        padding-top: 22px
    }

    #gad2 .container main .sns-box a {
        display: inline-block
    }

    #gad2 .container main .sns-box .twi-btn {
        background: url(../img/top/sp/twi_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin: 0 22px 0 135px
    }

    #gad2 .container main .sns-box .fb-btn {
        background: url(../img/top/sp/fb_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin-right: 22px
    }

    #gad2 .container main .sns-box .line-btn {
        background: url(../img/top/sp/line_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px
    }

    #gad2 .container section .shopguide-btn {
        left: -18px
    }

    #gad2 .container .world-section {
        margin-top: 26px
    }

    #gad2 .container .world-section .world1 {
        margin: 0
    }

    #gad2 .container .world-section .world2 {
        margin: 3px 0 0
    }

    #gad2 .container .world-section .world3 {
        margin: -18px 0 0
    }

    #gad2 .container .character-section {
        margin-top: 96px
    }

    #gad2 .container .character-section .char-img {
        margin: 65px 0 0 18px
    }

    #gad2 .container .system-section {
        margin-top: 113px
    }

    #gad2 .container .system-section .mousou-title {
        display: none
    }

    #gad2 .container .system-section .ss {
        margin: 73px 0 0
    }

    #gad2 .container .system-section .enemy-img {
        margin: 20px 0 0
    }

    #gad2 .container .system-section .headphone-img {
        margin: 3px 0 0
    }

    #gad2 .container .info-section {
        margin: 115px 0 83px
    }

    #gad2 .container .info-section .info1 {
        margin: 77px 0 0 31px
    }

    #gad2 .container .info-section .info2 {
        margin: 10px 0 0 31px
    }

    #gad2 .container .info-section .info3 {
        margin: 15px 0 0 31px
    }

    #gad2 .container .l-edition-section .image {
        margin: -8px 0 0 48px
    }

    #gad2 .container .l-edition-section .shopguide-btn {
        background: url(../img/gad/sp/b_shopguide_btn.png?1481768414) no-repeat;
        width: 550px;
        height: 194px;
        left: -18px
    }

    #gad2 .container .l-edition-section .official-site-btn {
        background: url(../img/gad/sp/official_site_btn.png?1475203987) no-repeat;
        width: 490px;
        height: 138px;
        margin: 12px auto 0
    }
}

#gad3 .container main {
    height: 745px;
    position: relative;
    z-index: 10
}

#gad3 .container main .bg {
    position: absolute;
    background: url(../img/gad/key_visual.png?1475203987) center top no-repeat;
    width: 100%;
    height: 745px
}

#gad3 .container main > .wrapper {
    width: 1280px
}

#gad3 .container main .platform {
    position: absolute;
    top: 58px;
    left: 102px
}

#gad3 .container main .logo-box {
    text-align: center;
    position: absolute;
    top: 47px;
    right: 108px
}

#gad3 .container main .logo-box h1 {
    margin-top: -26px
}

#gad3 .container main .logo-box .release-date {
    margin-top: -40px
}

#gad3 .container main .l-edition-check {
    position: absolute;
    top: 280px;
    right: 137px
}

#gad3 .container main .shopguide-btn {
    background: url(../img/gad/shopguide_btn.png?1481768164) no-repeat;
    width: 382px;
    height: 180px;
    position: absolute;
    top: 524px;
    right: 117px
}

#gad3 .container section .title {
    text-align: center
}

#gad3 .container section .shopguide-btn {
    background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
    width: 550px;
    height: 194px;
    display: block;
    position: relative;
    left: -32px;
    margin: auto
}

#gad3 .container .world-section {
    margin-top: 58px
}

#gad3 .container .world-section .world1 {
    margin-left: 18px
}

#gad3 .container .world-section .world2 {
    margin: 34px 0 0 23px
}

#gad3 .container .world-section .world3 {
    margin: 60px 0 0 21px
}

#gad3 .container .character-section {
    margin-top: 90px
}

#gad3 .container .character-section .char-img {
    margin: 68px 0 0 33px
}

#gad3 .container .system-section {
    margin-top: 135px
}

#gad3 .container .system-section .mousou-title {
    text-align: center;
    margin-top: 57px
}

#gad3 .container .system-section .ss {
    margin: 40px 0 0 60px
}

#gad3 .container .system-section .enemy-img {
    margin: 40px 0 0 4px
}

#gad3 .container .system-section .headphone-img {
    margin: 30px 0 0 73px
}

#gad3 .container .info-section {
    margin-top: 83px
}

#gad3 .container .info-section .info1 {
    margin: 46px 0 0 82px
}

#gad3 .container .info-section .info2 {
    margin: 6px 0 0 306px
}

#gad3 .container .info-section .info3 {
    margin: 10px 0 0 83px
}

#gad3 .container .l-edition-section {
    margin: 115px 0 50px
}

#gad3 .container .l-edition-section .image {
    margin-top: 2px
}

#gad3 .container .l-edition-section .shopguide-btn {
    background: url(../img/gad/b_shopguide_btn.png?1481768129) no-repeat;
    width: 915px;
    height: 323px;
    margin: -18px auto 0
}

#gad3 .container .l-edition-section .official-site-btn {
    background: url(../img/gad/official_site_btn.png?1475203987) no-repeat;
    width: 925px;
    height: 260px;
    margin: -12px auto 0;
    display: block
}

#gad3 .container .l-edition-section .sns-box {
    font-size: 0;
    background: url(../img/gad/share_bg.png?1475203987) no-repeat;
    width: 463px;
    height: 86px;
    padding-top: 27px;
    margin: 62px auto 0
}

#gad3 .container .l-edition-section .sns-box a {
    display: inline-block
}

#gad3 .container .l-edition-section .sns-box .twi-btn {
    background: url(../img/gad/twi_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin: 0 30px 0 180px
}

#gad3 .container .l-edition-section .sns-box .fb-btn {
    background: url(../img/gad/fb_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin-right: 30px
}

#gad3 .container .l-edition-section .sns-box .line-btn {
    background: url(../img/gad/line_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px
}

@media screen and (max-width: 640px) {
    #gad3 .container main {
        height: 1400px
    }

    #gad3 .container main .bg {
        background: url(../img/gad/sp/key_visual.png?1475203987) center 40px no-repeat;
        width: 640px;
        height: 723px
    }

    #gad3 .container main > .wrapper {
        width: 640px
    }

    #gad3 .container main .logo-box {
        top: 653px;
        right: 2px
    }

    #gad3 .container main .shopguide-btn {
        background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
        width: 550px;
        height: 194px;
        position: absolute;
        top: 968px;
        left: 40px
    }

    #gad3 .container main .l-edition-check {
        top: 1148px;
        right: 103px
    }

    #gad3 .container main .sns-box {
        top: 1295px;
        right: 148px;
        background: url(../img/top/sp/share_bg.png?1469440327) no-repeat;
        width: 340px;
        height: 66px;
        padding-top: 22px
    }

    #gad3 .container main .sns-box a {
        display: inline-block
    }

    #gad3 .container main .sns-box .twi-btn {
        background: url(../img/top/sp/twi_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin: 0 22px 0 135px
    }

    #gad3 .container main .sns-box .fb-btn {
        background: url(../img/top/sp/fb_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px;
        margin-right: 22px
    }

    #gad3 .container main .sns-box .line-btn {
        background: url(../img/top/sp/line_btn.png?1469440327) no-repeat;
        width: 45px;
        height: 45px
    }

    #gad3 .container section .shopguide-btn {
        left: -18px
    }

    #gad3 .container .world-section {
        margin-top: 26px
    }

    #gad3 .container .world-section .world1 {
        margin: 0
    }

    #gad3 .container .world-section .world2 {
        margin: 3px 0 0
    }

    #gad3 .container .world-section .world3 {
        margin: -18px 0 0
    }

    #gad3 .container .character-section {
        margin-top: 96px
    }

    #gad3 .container .character-section .char-img {
        margin: 65px 0 0 18px
    }

    #gad3 .container .system-section {
        margin-top: 113px
    }

    #gad3 .container .system-section .mousou-title {
        display: none
    }

    #gad3 .container .system-section .ss {
        margin: 73px 0 0
    }

    #gad3 .container .system-section .enemy-img {
        margin: 20px 0 0
    }

    #gad3 .container .system-section .headphone-img {
        margin: 3px 0 0
    }

    #gad3 .container .info-section {
        margin: 115px 0 83px
    }

    #gad3 .container .info-section .info1 {
        margin: 77px 0 0 31px
    }

    #gad3 .container .info-section .info2 {
        margin: 10px 0 0 31px
    }

    #gad3 .container .info-section .info3 {
        margin: 15px 0 0 31px
    }

    #gad3 .container .l-edition-section .image {
        margin: -8px 0 0 48px
    }

    #gad3 .container .l-edition-section .shopguide-btn {
        background: url(../img/gad/sp/b_shopguide_btn.png?1481768414) no-repeat;
        width: 550px;
        height: 194px;
        left: -18px
    }

    #gad3 .container .l-edition-section .official-site-btn {
        background: url(../img/gad/sp/official_site_btn.png?1475203987) no-repeat;
        width: 490px;
        height: 138px;
        margin: 12px auto 0
    }
}

#gad4 .container main {
    height: 745px;
    position: relative;
    z-index: 10
}

#gad4 .container main .bg {
    position: absolute;
    background: url(../img/gad/key_visual.png?1475203987) center 35px no-repeat;
    width: 100%;
    height: 780px
}

#gad4 .container main > .wrapper {
    width: 1280px
}

#gad4 .container main .platform {
    position: absolute;
    top: 58px;
    left: 102px
}

#gad4 .container main .logo-box {
    text-align: center;
    position: absolute;
    top: 47px;
    right: 108px
}

#gad4 .container main .logo-box h1 {
    margin-top: -26px
}

#gad4 .container main .logo-box .release-date {
    margin-top: -40px
}

#gad4 .container main .l-edition-check {
    position: absolute;
    top: 315px;
    right: 137px
}

#gad4 .container main .shopguide-btn {
    background: url(../img/gad/shopguide_btn.png?1481768164) no-repeat;
    width: 382px;
    height: 180px;
    position: absolute;
    top: 557px;
    right: 117px
}

#gad4 .container section .title {
    text-align: center
}

#gad4 .container section .shopguide-btn {
    background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
    width: 550px;
    height: 194px;
    display: block;
    position: relative;
    left: -32px;
    margin: auto
}

#gad4 .container .world-section {
    margin-top: 58px
}

#gad4 .container .world-section .world1 {
    margin-left: 18px
}

#gad4 .container .world-section .world2 {
    margin: 34px 0 0 23px
}

#gad4 .container .world-section .world3 {
    margin: 60px 0 0 21px
}

#gad4 .container .character-section {
    margin-top: 90px
}

#gad4 .container .character-section .char-img {
    margin: 68px 0 0 33px
}

#gad4 .container .system-section {
    margin-top: 135px
}

#gad4 .container .system-section .mousou-title {
    text-align: center;
    margin-top: 57px
}

#gad4 .container .system-section .ss {
    margin: 40px 0 0 60px
}

#gad4 .container .system-section .enemy-img {
    margin: 40px 0 0 4px
}

#gad4 .container .system-section .headphone-img {
    margin: 30px 0 0 73px
}

#gad4 .container .info-section {
    margin-top: 83px
}

#gad4 .container .info-section .info1 {
    margin: 46px 0 0 82px
}

#gad4 .container .info-section .info2 {
    margin: 6px 0 0 306px
}

#gad4 .container .info-section .info3 {
    margin: 10px 0 0 83px
}

#gad4 .container .l-edition-section {
    margin: 115px 0 50px
}

#gad4 .container .l-edition-section .image {
    margin-top: 2px
}

#gad4 .container .l-edition-section .shopguide-btn {
    background: url(../img/gad/b_shopguide_btn.png?1481768129) no-repeat;
    width: 915px;
    height: 323px;
    margin: -18px auto 0
}

#gad4 .container .l-edition-section .official-site-btn {
    background: url(../img/gad/official_site_btn.png?1475203987) no-repeat;
    width: 925px;
    height: 260px;
    margin: -12px auto 0;
    display: block
}

#gad4 .container .l-edition-section .sns-box {
    font-size: 0;
    background: url(../img/gad/share_bg.png?1475203987) no-repeat;
    width: 463px;
    height: 86px;
    padding-top: 27px;
    margin: 62px auto 0
}

#gad4 .container .l-edition-section .sns-box a {
    display: inline-block
}

#gad4 .container .l-edition-section .sns-box .twi-btn {
    background: url(../img/gad/twi_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin: 0 30px 0 180px
}

#gad4 .container .l-edition-section .sns-box .fb-btn {
    background: url(../img/gad/fb_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px;
    margin-right: 30px
}

#gad4 .container .l-edition-section .sns-box .line-btn {
    background: url(../img/gad/line_btn.png?1475203987) no-repeat;
    width: 56px;
    height: 56px
}

@media screen and (max-width: 640px) {
    #gad4 .container main {
        height: 1360px
    }

    #gad4 .container main .bg {
        background: url(../img/gad/sp/key_visual.png?1475203987) center 40px no-repeat;
        width: 640px;
        height: 723px
    }

    #gad4 .container main > .wrapper {
        width: 640px
    }

    #gad4 .container main .logo-box {
        top: 640px;
        right: 2px
    }

    #gad4 .container main .shopguide-btn {
        background: url(../img/gad/sp/shopguide_btn.png?1481768458) no-repeat;
        width: 550px;
        height: 194px;
        position: absolute;
        top: 950px;
        left: 40px
    }

    #gad4 .container main .l-edition-check {
        top: 1130px;
        right: 103px
    }

    #gad4 .container section .shopguide-btn {
        left: -18px
    }

    #gad4 .container .world-section {
        margin-top: 26px
    }

    #gad4 .container .world-section .world1 {
        margin: 0
    }

    #gad4 .container .world-section .world2 {
        margin: 3px 0 0
    }

    #gad4 .container .world-section .world3 {
        margin: -18px 0 0
    }

    #gad4 .container .character-section {
        margin-top: 96px
    }

    #gad4 .container .character-section .char-img {
        margin: 65px 0 0 18px
    }

    #gad4 .container .system-section {
        margin-top: 113px
    }

    #gad4 .container .system-section .mousou-title {
        display: none
    }

    #gad4 .container .system-section .ss {
        margin: 73px 0 0
    }

    #gad4 .container .system-section .enemy-img {
        margin: 20px 0 0
    }

    #gad4 .container .system-section .headphone-img {
        margin: 3px 0 0
    }

    #gad4 .container .info-section {
        margin: 115px 0 83px
    }

    #gad4 .container .info-section .info1 {
        margin: 77px 0 0 31px
    }

    #gad4 .container .info-section .info2 {
        margin: 10px 0 0 31px
    }

    #gad4 .container .info-section .info3 {
        margin: 15px 0 0 31px
    }

    #gad4 .container .l-edition-section .image {
        margin: -8px 0 0 48px
    }

    #gad4 .container .l-edition-section .shopguide-btn {
        background: url(../img/gad/sp/b_shopguide_btn.png?1481768414) no-repeat;
        width: 550px;
        height: 194px;
        left: -18px
    }

    #gad4 .container .l-edition-section .official-site-btn {
        background: url(../img/gad/sp/official_site_btn.png?1475203987) no-repeat;
        width: 490px;
        height: 138px;
        margin: 12px auto 0
    }
}

#shopguide {
    background: url(../img/common/bg.jpg?1469440327)
}

#shopguide .top-contents .nav-box, #shopguide .top-contents .shopguide-btn {
    display: none
}

#shopguide .top-contents .title {
    margin-top: -13px
}

#shopguide main {
    margin-bottom: 265px
}

#shopguide main .l-edition {
    text-align: center;
    margin-top: -100px;
    position: relative;
    z-index: 99
}

#shopguide main .l-edition .to-details {
    position: absolute;
    background: url(../img/shopguide/to_details_btn.png?1485232594) no-repeat;
    width: 192px;
    height: 13px;
    top: 170px;
    left: 428px
}

#shopguide main .l-banner {
    text-align: center;
    padding-top: 50px;
}

#shopguide main .l-banner a {
    display: inline-block;
}

#shopguide main .shop-contents {
    width: 960px;
    margin: 108px auto 0
}

#shopguide main .shop-contents .box {
    display: inline-block;
    position: relative
}

#shopguide main .shop-contents .box:last-child {
    margin-bottom: 0
}

#shopguide main .shop-contents .box .shop-bnr {
    position: absolute
}

#shopguide main .shop-contents .box .shop-bnr p {
    width: 260px;
    word-break: break-all;
    line-height: 1.2;
    margin-top: 13px;
    text-align: center;
    font-size: 17px
}

#shopguide main .shop-contents .box .btn-box {
    width: 960px;
    position: absolute;
    z-index: 20;
    text-align: center
}

#shopguide main .shop-contents .box .memo {
    position: absolute;
    font-size: 12px;
    text-align: center;
    width: 960px
}

#shopguide main .shop-contents .box-m {
    background: url(../img/shopguide/box_m.png?1475203987) no-repeat;
    width: 960px;
    height: 250px;
    margin-bottom: 190px
}

#shopguide main .shop-contents .box-m .shop-bnr {
    top: 50px;
    left: 30px
}

#shopguide main .shop-contents .box-m .t-name {
    width: 325px;
    position: absolute;
    top: 47px;
    left: 310px
}

#shopguide main .shop-contents .box-m .t-name p {
    word-break: break-all;
    line-height: 1.5;
    margin-top: 25px;
    font-size: 17px
}

#shopguide main .shop-contents .box-m .t-img {
    position: absolute;
    top: -30px;
    right: 20px
}

#shopguide main .shop-contents .box-m .btn-box {
    top: 218px
}

#shopguide main .shop-contents .box-m .btn-box .ps4-btn {
    background: url(../img/shopguide/ps4_m_btn.png?1475203987) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .btn-box .ps4-psv-btn {
    background: url(../img/shopguide/ps4_psv_btn.png?1484284545) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .btn-box .ps4-ani-btn {
    background: url(../img/shopguide/ps4_m_ani_btn.png?1475203987) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .btn-box .ps4-ama-btn {
    background: url(../img/shopguide/ps4_m_ama_btn.png?1475203987) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .btn-box .psv-ama-btn {
    background: url(../img/shopguide/psv_ama_btn.png?1484284590) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .btn-box .ps4-gam-btn {
    background: url(../img/shopguide/ps4_m_gam_btn.png?1475203987) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .btn-box .psv-btn {
    background: url(../img/shopguide/psv_m_btn.png?1484283685) no-repeat;
    width: 365px;
    height: 102px
}

#shopguide main .shop-contents .box-m .memo {
    top: 324px
}

#shopguide main .shop-contents .box-s {
    background: url(../img/shopguide/box_s.png?1475203987) no-repeat;
    width: 960px;
    height: 200px;
    margin-bottom: 100px
}

#shopguide main .shop-contents .box-s .shop-bnr {
    top: 50px;
    left: 30px
}

#shopguide main .shop-contents .box-s .btn-box {
    top: 46px;
    left: 335px
}

#shopguide main .shop-contents .box-s .btn-box .ps4-btn {
    background: url(../img/shopguide/ps4_s_btn.png?1475203987) no-repeat;
    width: 300px;
    height: 90px
}

#shopguide main .shop-contents .box-s .btn-box .psv-btn {
    background: url(../img/shopguide/psv_s_btn.png?1475203987) no-repeat;
    width: 300px;
    height: 90px
}

#shopguide main .shop-contents .box-s .memo {
    top: 213px
}

#shopguide main .spec {
    margin-top: 87px;
    text-align: center
}

#shopguide main .spec .contents .ps4 {
    display: inline-block
}

#shopguide .lb, #shopguide .privilege-modal {
    display: none;
    z-index: 1000;
    overflow: auto;
    outline: 0
}

#shopguide .lb {
    position: fixed;
    background: rgba(0, 174, 220, .8);
    width: 100%;
    height: 100%
}

#shopguide .lb > .wrapper {
    width: 740px
}

#shopguide .lb .top-close {
    background: url(../img/shopguide/l_modal/t_close_btn.png?1475203987) no-repeat;
    width: 80px;
    height: 80px;
    position: absolute;
    top: 117px;
    right: 0
}

#shopguide .lb .modal-dialog {
    width: 740px;
    height: auto;
    margin: auto;
    background: #fff;
    position: absolute;
    top: 210px;
    text-align: center
}

#shopguide .lb .sub-title {
    margin-top: 34px
}

#shopguide .lb .check2 {
    margin-top: 12px
}

#shopguide .lb .check3, #shopguide .lb .check4 {
    margin-top: 5px
}

#shopguide .lb .bottom-close {
    background: url(../img/shopguide/l_modal/b_close_btn.png?1475203987) no-repeat;
    width: 54px;
    height: 55px;
    margin: 40px 0 44px
}

#shopguide .privilege-modal {
    position: fixed;
    background: rgba(0, 174, 220, .8);
    width: 100%;
    height: 100%
}

#shopguide .privilege-modal > .wrapper {
    width: 740px
}

#shopguide .privilege-modal .top-close {
    background: url(../img/shopguide/s_modal/t_close_btn.png?1475203987) no-repeat;
    width: 80px;
    height: 80px;
    position: absolute;
    top: 117px;
    right: 0
}

#shopguide .privilege-modal .modal-dialog {
    width: 740px;
    height: auto;
    margin: auto;
    background: #fff;
    position: absolute;
    top: 217px;
    text-align: center
}

#shopguide .privilege-modal .orig-tag {
    background: url(../img/shopguide/s_modal/orig_title.png?1475203987) center center no-repeat #e2007e;
    width: 100%;
    height: 80px
}

#shopguide .privilege-modal .shop-name {
    color: #e2007e;
    margin-top: 30px;
    padding: 0 50px 10px;
    font-size: 24px;
    border-bottom: 2px solid #e2007e;
    display: inline-block
}

#shopguide .privilege-modal .privilege-name {
    font-size: 30px;
    margin-top: 40px;
    color: #00aedc
}

#shopguide .privilege-modal .privilege-img {
    margin-top: 30px
}

#shopguide .privilege-modal .notice {
    width: 660px;
    margin: 40px auto
}

#shopguide .privilege-modal .bottom-close {
    background: url(../img/shopguide/s_modal/b_close_btn.png?1475203987) no-repeat;
    width: 54px;
    height: 55px;
    margin: 52px 0 50px
}

@media (max-width: 640px) {
    #shopguide main {
        margin-bottom: 87px
    }

    #shopguide main .l-edition {
        margin-top: 27px;
        z-index: 0
    }

    #shopguide main .l-edition .to-details {
        top: 187px;
        left: 225px
    }

    #shopguide main .shop-contents {
        width: 580px;
        margin: 50px auto 0
    }

    #shopguide main .shop-contents .box .shop-bnr p {
        position: absolute;
        top: 22px;
        left: 268px;
        margin: 0
    }

    #shopguide main .shop-contents .box .memo {
        font-size: 13px;
        width: 500px
    }

    #shopguide main .shop-contents .box .btn-box {
        width: 580px
    }

    #shopguide main .shop-contents .box-m {
        background: url(../img/shopguide/sp/box_m.png?1475203987) no-repeat;
        width: 581px;
        height: 435px;
        margin-bottom: 100px
    }

    #shopguide main .shop-contents .box-m .shop-bnr {
        top: 40px;
        left: 40px
    }

    #shopguide main .shop-contents .box-m .t-name {
        width: 255px;
        top: 135px;
        left: 43px;
        text-align: center
    }

    #shopguide main .shop-contents .box-m .t-name p {
        line-height: 1.3;
        margin-top: 30px;
        font-size: 18px;
        text-align: left
    }

    #shopguide main .shop-contents .box-m .t-img {
        top: 163px;
        right: 20px
    }

    #shopguide main .shop-contents .box-m .btn-box {
        top: 400px
    }

    #shopguide main .shop-contents .box-m .btn-box .ps4-btn {
        background: url(../img/shopguide/sp/ps4_btn.png?1475203987) no-repeat;
        width: 247px;
        height: 90px;
        margin-right: -33px
    }

    #shopguide main .shop-contents .box-m .btn-box .ps4-psv-btn {
        background: url(../img/shopguide/sp/ps4_btn.png?1475203987) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-m .btn-box .ps4-ani-btn {
        background: url(../img/shopguide/sp/ps4_ani_btn.png?1475203987) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-m .btn-box .ps4-ama-btn {
        background: url(../img/shopguide/sp/ps4_ama_btn.png?1475203987) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-m .btn-box .psv-ama-btn {
        background: url(../img/shopguide/sp/psv_ama_btn.png?1484284661) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-m .btn-box .ps4-gam-btn {
        background: url(../img/shopguide/sp/ps4_gam_btn.png?1475203987) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-m .btn-box .psv-btn {
        background: url(../img/shopguide/sp/psv_btn.png?1484283715) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-m .memo {
        top: 488px;
        left: 32px
    }

    #shopguide main .shop-contents .box-s {
        background: url(../img/shopguide/sp/box_s.png?1475203987) no-repeat;
        width: 581px;
        height: 175px;
        margin-bottom: 100px
    }

    #shopguide main .shop-contents .box-s .shop-bnr {
        top: 50px;
        left: 30px
    }

    #shopguide main .shop-contents .box-s .btn-box {
        top: 136px;
        left: 64px
    }

    #shopguide main .shop-contents .box-s .btn-box .ps4-btn {
        background: url(../img/shopguide/sp/ps4_btn.png?1475203987) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide main .shop-contents .box-s .btn-box .psv-btn {
        background: url(../img/shopguide/sp/psv_btn.png?1484283715) no-repeat;
        width: 247px;
        height: 90px
    }

    #shopguide .lb > .wrapper, #shopguide .privilege-modal .modal-dialog, #shopguide .privilege-modal > .wrapper {
        width: 640px
    }

    #shopguide main .shop-contents .box-s .memo {
        left: 32px;
        top: 213px
    }

    #shopguide main .spec {
        margin-top: 370px;
        text-align: center
    }

    #shopguide main .spec .contents .ps4 {
        margin: 58px 0 0
    }

    #shopguide .lb .top-close {
        top: 225px;
        right: 5px
    }

    #shopguide .lb .modal-dialog {
        width: 640px;
        top: 317px
    }

    #shopguide .privilege-modal .privilege-img img {
        width: 100%
    }
}

#manga {
    background: url(../img/manga/bg.jpg?1475203987) center top repeat-y
}

#manga .container {
    overflow-x: hidden
}

#manga .line {
    position: absolute;
    background: url(../img/manga/line.png?1475203987) center top repeat-y;
    width: 1197px;
    height: 7080px;
    z-index: 5;
    left: -277px;
    top: -4px
}

#manga .wrapper {
    width: 640px
}

#manga .main-title {
    position: relative;
    padding-top: 85px
}

#manga .main-title .key {
    margin-left: -170px
}

#manga .main-title .logo {
    position: absolute;
    top: 50px;
    left: 15px
}

#manga .main-title .sns-box {
    position: absolute;
    z-index: 10;
    top: 65px;
    left: 397px;
    font-size: 0
}

#manga .main-title .sns-box a {
    display: inline-block;
    position: relative
}

#manga .main-title .sns-box .twi-btn {
    background: url(../img/manga/h_twi_btn.png?1475203987) no-repeat;
    width: 75px;
    height: 62px;
    top: -40px
}

#manga .main-title .sns-box .fb-btn {
    background: url(../img/manga/h_fb_btn.png?1475203987) no-repeat;
    width: 78px;
    height: 65px;
    top: -20px
}

#manga .main-title .sns-box .line-btn {
    background: url(../img/manga/h_line_btn.png?1475203987) no-repeat;
    width: 72px;
    height: 84px
}

#manga .manga-latest {
    text-align: center;
    margin-top: -20px
}

#manga .middle-sns-box {
    text-align: center;
    position: relative;
    z-index: 10;
    margin-top: 25px
}

#manga .middle-sns-box .twi-btn {
    background: url(../img/manga/twi_btn.png?1475203987) no-repeat;
    width: 142px;
    height: 116px;
    margin-right: 40px
}

#manga .middle-sns-box .fb-btn {
    background: url(../img/manga/fb_btn.png?1475203987) no-repeat;
    width: 141px;
    height: 116px;
    margin-right: 25px
}

#manga .middle-sns-box .line-btn {
    background: url(../img/manga/line_btn.png?1475203987) no-repeat;
    width: 129px;
    height: 126px
}

#manga .manga-list {
    position: relative;
    z-index: 10;
    width: 622px;
    margin: 40px auto 0
}

#manga .manga-list li {
    float: left;
    margin-top: -20px
}

#manga .manga-list li:nth-child(1), #manga .manga-list li:nth-child(2) {
    margin-top: 0
}

#manga .manga-list li:nth-child(odd) {
    margin-right: 27px
}

#manga .manga-list li:nth-child(1) a {
    background: url(../img/manga/manga01_btn.png?1475203987) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(2) a {
    background: url(../img/manga/manga02_btn.png?1475203987) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(3) a {
    background: url(../img/manga/manga03_btn.png?1475203987) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(4) a {
    background: url(../img/manga/manga04_btn.png?1475477358) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(5) a {
    background: url(../img/manga/manga05_btn.png?1476065630) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(6) a {
    background: url(../img/manga/manga06_btn.png?1476926483) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(7) a {
    background: url(../img/manga/manga07_btn.png?1477028339) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(8) a {
    background: url(../img/manga/manga08_btn.png?1477545065) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(9) a {
    background: url(../img/manga/manga09_btn.png?1478483899) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(10) a {
    background: url(../img/manga/manga10_btn.png?1478838552) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(11) a {
    background: url(../img/manga/manga11_btn.png?1479696255) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(12) a {
    background: url(../img/manga/manga12_btn.png?1480064066) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(13) a {
    background: url(../img/manga/manga13_btn.png?1480924293) no-repeat;
    width: 295px;
    height: 284px
}

#manga .manga-list li:nth-child(14) a {
    background: url(../img/manga/manga14_btn.png?1481588170) no-repeat;
    width: 295px;
    height: 284px
}

#manga .author {
    margin-top: 47px
}

#manga .author img {
    margin-left: -176px
}

#manga .about-akibas {
    background: url(../img/manga/about_bg_pc.png?1475203987) center no-repeat #000;
    height: 1200px;
    margin-top: 50px;
    position: relative;
    z-index: 10
}

@media (max-width: 640px) {
    #manga .about-akibas {
        background-image: url(../img/manga/about_bg_sp.png?1475203987);
        height: 1171px
    }
}

#manga .about-akibas .title {
    text-align: center;
    position: absolute;
    width: 640px;
    top: -22px
}

#manga .about-akibas .catch1 {
    position: absolute;
    top: 125px;
    left: 103px
}

#manga .about-akibas .catch2 {
    position: absolute;
    top: 765px
}

#manga .about-akibas .official-site-btn {
    background: url(../img/manga/official_site_btn.png?1475203987) no-repeat;
    width: 640px;
    height: 185px;
    position: absolute;
    top: 995px
}

#manga .shopguid-box {
    text-align: center;
    margin-top: 20px
}

#manga .shopguide-btn {
    background: url(../img/manga/shopguide_btn.png?1475203987) no-repeat;
    width: 608px;
    height: 519px;
    position: relative;
    z-index: 10
}

#manga footer {
    background: url(../img/manga/footer_bg.png?1475203987) top center no-repeat;
    padding: 50px 0 35px;
    margin-top: 30px
}

#manga footer .acquire-logo {
    background: url(../img/manga/acquire_logo.png?1475203987) no-repeat;
    width: 65px;
    height: 69px;
    margin: 0 35px 0 0
}

#manga footer .platform {
    position: relative;
    top: -10px
}

#manga footer .copyright {
    text-align: center;
    color: #fff
}

#manga footer .sp {
    margin-top: 12px
}

#manga .modal {
    display: none;
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    overflow: auto;
    outline: 0
}

#manga .modal .modal-dialog {
    width: 640px;
    margin: auto;
    position: relative;
    background: #fff;
    padding-top: 60px
}

#manga .modal .top-close {
    position: absolute;
    top: 0;
    right: 20px;
    z-index: 10
}

#manga .modal .bottom-close {
    position: absolute;
    z-index: 10;
    bottom: 18px;
    left: 225px
}

#manga .modal.manga01 {
    background: rgba(237, 28, 36, .8)
}

#manga .modal.manga01 .top-close {
    background: url(../img/manga/modal/t_close01_btn.png?1475203987) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga01 .bottom-close {
    background: url(../img/manga/modal/b_close01_btn.png?1475203987) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga02 {
    background: rgba(255, 139, 0, .8)
}

#manga .modal.manga02 .top-close {
    background: url(../img/manga/modal/t_close02_btn.png?1475203987) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga02 .bottom-close {
    background: url(../img/manga/modal/b_close02_btn.png?1475203987) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga03 {
    background: rgba(255, 57, 255, .8)
}

#manga .modal.manga03 .top-close {
    background: url(../img/manga/modal/t_close03_btn.png?1475203987) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga03 .bottom-close {
    background: url(../img/manga/modal/b_close03_btn.png?1475203987) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga04 {
    background: rgba(255, 135, 0, .8)
}

#manga .modal.manga04 .top-close {
    background: url(../img/manga/modal/t_close04_btn.png?1475477524) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga04 .bottom-close {
    background: url(../img/manga/modal/b_close04_btn.png?1475477545) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga05 {
    background: rgba(181, 0, 255, .8)
}

#manga .modal.manga05 .top-close {
    background: url(../img/manga/modal/t_close05_btn.png?1476065682) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga05 .bottom-close {
    background: url(../img/manga/modal/b_close05_btn.png?1476065703) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga06 {
    background: rgba(0, 255, 0, .8)
}

#manga .modal.manga06 .top-close {
    background: url(../img/manga/modal/t_close06_btn.png?1476926483) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga06 .bottom-close {
    background: url(../img/manga/modal/b_close06_btn.png?1476926483) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga07 {
    background: rgba(0, 222, 255, .8)
}

#manga .modal.manga07 .top-close {
    background: url(../img/manga/modal/t_close07_btn.png?1477028363) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga07 .bottom-close {
    background: url(../img/manga/modal/b_close07_btn.png?1477028383) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga08 {
    background: rgba(255, 0, 0, .8)
}

#manga .modal.manga08 .top-close {
    background: url(../img/manga/modal/t_close08_btn.png?1477545089) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga08 .bottom-close {
    background: url(../img/manga/modal/b_close08_btn.png?1477545166) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga09 {
    background: rgba(255, 139, 0, .8)
}

#manga .modal.manga09 .top-close {
    background: url(../img/manga/modal/t_close09_btn.png?1478483970) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga09 .bottom-close {
    background: url(../img/manga/modal/b_close09_btn.png?1478483992) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga10 {
    background: rgba(255, 57, 255, .8)
}

#manga .modal.manga10 .top-close {
    background: url(../img/manga/modal/t_close10_btn.png?1478838586) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga10 .bottom-close {
    background: url(../img/manga/modal/b_close10_btn.png?1478838610) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga11 {
    background: rgba(255, 135, 0, .8)
}

#manga .modal.manga11 .top-close {
    background: url(../img/manga/modal/t_close11_btn.png?1479696284) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga11 .bottom-close {
    background: url(../img/manga/modal/b_close11_btn.png?1479696305) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga12 {
    background: rgba(181, 0, 255, .8)
}

#manga .modal.manga12 .top-close {
    background: url(../img/manga/modal/t_close12_btn.png?1480064092) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga12 .bottom-close {
    background: url(../img/manga/modal/b_close12_btn.png?1480064116) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga13 {
    background: rgba(0, 255, 0, .8)
}

#manga .modal.manga13 .top-close {
    background: url(../img/manga/modal/t_close13_btn.png?1480924293) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga13 .bottom-close {
    background: url(../img/manga/modal/b_close13_btn.png?1480924293) no-repeat;
    width: 189px;
    height: 85px
}

#manga .modal.manga14 {
    background: rgba(0, 222, 255, .8)
}

#manga .modal.manga14 .top-close {
    background: url(../img/manga/modal/t_close14_btn.png?1481518966) no-repeat;
    width: 60px;
    height: 60px
}

#manga .modal.manga14 .bottom-close {
    background: url(../img/manga/modal/b_close14_btn.png?1481518986) no-repeat;
    width: 189px;
    height: 85px
}

#system {
    background: url(../img/common/bg.jpg?1469440327)
}

#system main {
    margin: 63px 0 30px
}

#system main section {
    margin-bottom: 96px
}

#system main section h3 {
    text-align: center;
    margin-bottom: 36px
}

#system main section .section-box {
    width: 968px;
    margin: 0 auto
}

#system main section .section-box .top {
    background: url(../img/system/s_top.png?1476933660) no-repeat;
    width: 968px;
    height: 30px
}

#system main section .section-box .body {
    background: url(../img/system/s_body.png?1476933660) repeat-y;
    width: 968px
}

#system main section .section-box .bottom {
    background: url(../img/system/s_bottom.png?1476933660) no-repeat;
    width: 968px;
    height: 30px
}

#system main section .section-box h4 {
    margin-bottom: 10px;
    text-align: center;
    box-sizing: border-box
}

#system main section .section-box .p2 {
    padding-top: 10px
}

#system main section .section-box .hr {
    background: url(../img/system/s_hr.png?1476933660) no-repeat;
    width: 960px;
    height: 25px;
    margin: auto
}

#system main section .section-box .article {
    width: 370px;
    font-size: 13px;
    line-height: 2.15
}

#system main section .section-box .img {
    width: 500px;
    overflow: hidden
}

#system main section .section-box .p1-box {
    box-sizing: border-box;
    padding: 10px 34px
}

#system main section .section-box .p1-box .article {
    float: right
}

#system main section .section-box .p1-box .img, #system main section .section-box .p2-box .article {
    float: left
}

#system main section .section-box .p2-box {
    box-sizing: border-box;
    padding: 10px 34px 0
}

#system main section .section-box .p2-box .img {
    float: right
}

#system main .s4 .section-box .p1-box, #system main .s5 .section-box .p1-box {
    padding: 10px 34px 0
}

@media (max-width: 640px) {
    #system main section .section-box .p1-box .article, #system main section .section-box .p1-box .img, #system main section .section-box .p2-box .article, #system main section .section-box .p2-box .img {
        float: none
    }

    #system main {
        margin: 140px 0 30px
    }

    #system main section {
        margin-bottom: 115px
    }

    #system main section .section-box {
        width: 588px
    }

    #system main section .section-box .top {
        background: url(../img/system/sp/s_top.png?1476933660) no-repeat;
        width: 588px;
        height: 25px
    }

    #system main section .section-box .body {
        background: url(../img/system/sp/s_body.png?1476933660) repeat-y;
        width: 588px
    }

    #system main section .section-box .bottom {
        background: url(../img/system/sp/s_bottom.png?1476933660) no-repeat;
        width: 588px;
        height: 30px
    }

    #system main section .section-box .hr {
        background: url(../img/system/sp/s_hr.png?1476933660) no-repeat;
        width: 583px;
        height: 25px
    }

    #system main section .section-box .article {
        width: 505px;
        font-size: 20px;
        line-height: 1.6;
        margin-top: 20px
    }

    #system main section .section-box .p1-box {
        padding: 30px 43px
    }

    #system main .s4 .section-box .p1-box, #system main .s5 .section-box .p1-box, #system main section .section-box .p2-box {
        padding: 30px 43px 0
    }
}

@sectionset "UTF-8"; #story {
                         background: url(../img/common/bg.jpg?1469440327)
                     }

#story main {
    margin: 84px 0 30px
}

#story .btn-box {
    text-align: center;
    font-size: 0
}

#story .btn-box li {
    display: inline-block;
    margin-right: 20px
}

#story .btn-box li:nth-child(1) a {
    background: url(../img/story/case1_btn.png?1480924293) no-repeat;
    width: 220px;
    height: 60px
}

#story .btn-box li:nth-child(1) a:hover {
    background-position: 0 bottom
}

#story .btn-box li:nth-child(2) a {
    background: url(../img/story/case2_btn.png?1478656970) no-repeat;
    width: 220px;
    height: 60px
}

#story .btn-box li:nth-child(2) a:hover {
    background-position: 0 bottom
}

#story .btn-box li:nth-child(3) a {
    background: url(../img/story/case3_btn.png?1480297756) no-repeat;
    width: 220px;
    height: 60px
}

#story .btn-box li:nth-child(3) a:hover {
    background-position: 0 bottom
}

#story .btn-box li:nth-child(4) {
    margin-right: 0
}

#story .btn-box li:nth-child(4) a {
    background: url(../img/story/case4_btn.png?1481506038) no-repeat;
    width: 220px;
    height: 60px
}

#story .btn-box li.active a, #story .btn-box li:nth-child(4) a:hover {
    background-position: 0 bottom
}

#story.case1 .section1 {
    margin: 50px 0 0 40px
}

#story.case1 .section2 {
    margin-top: 80px
}

#story.case1 .section3 {
    margin: 80px 0 0 57px
}

#story.case1 .section4 {
    margin: 50px 0 0 55px
}

#story.case1 .to-case2-btn {
    background: url(../img/story/to_case2_btn.png?1478654276) no-repeat;
    width: 541px;
    height: 92px;
    display: block;
    margin: 30px auto 0
}

#story.case2 .section1 {
    margin: 122px 0 0 43px
}

#story.case2 .section2 {
    margin: 90px 0 0 46px
}

#story.case2 .section3 {
    margin: 95px 0 0 50px
}

#story.case2 .section4 {
    margin: 135px 0 0 65px
}

#story.case2 .to-case3-btn {
    background: url(../img/story/to_case3_btn.png?1480297324) no-repeat;
    width: 541px;
    height: 92px;
    display: block;
    margin: 30px auto 0
}

#story.case3 .section1 {
    margin: 120px 0 0 50px
}

#story.case3 .section2 {
    margin: 67px 0 0 50px
}

#story.case3 .section3 {
    margin: 93px 0 0 36px
}

#story.case3 .section4 {
    margin: 75px 0 0 125px
}

#story.case3 .to-case4-btn {
    background: url(../img/story/to_case4_btn.png?1481505260) no-repeat;
    width: 541px;
    height: 92px;
    display: block;
    margin: 30px auto 0
}

#story.case4 .section1 {
    margin: 125px 0 0 53px
}

#story.case4 .section2 {
    margin: 122px 0 0 62px
}

#story.case4 .section3 {
    margin: 97px 0 0 40px
}

#story.case4 .section4 {
    margin: 107px 0 0 73px
}

@media (max-width: 640px) {
    #story main {
        margin: 77px 0 30px
    }

    #story .btn-box li {
        margin: 0 0 20px
    }

    #story .btn-box li:nth-child(1) a {
        background: url(../img/story/sp/case1_btn.png?1480924293) no-repeat;
        width: 500px;
        height: 60px
    }

    #story .btn-box li:nth-child(1) a:hover {
        background-position: 0 bottom
    }

    #story .btn-box li:nth-child(2) a {
        background: url(../img/story/sp/case2_btn.png?1478656551) no-repeat;
        width: 500px;
        height: 60px
    }

    #story .btn-box li:nth-child(2) a:hover {
        background-position: 0 bottom
    }

    #story .btn-box li:nth-child(3) a {
        background: url(../img/story/sp/case3_btn.png?1480297870) no-repeat;
        width: 500px;
        height: 60px
    }

    #story .btn-box li:nth-child(3) a:hover {
        background-position: 0 bottom
    }

    #story .btn-box li:nth-child(4) {
        margin: 0
    }

    #story .btn-box li:nth-child(4) a {
        background: url(../img/story/sp/case4_btn.png?1481507430) no-repeat;
        width: 500px;
        height: 60px
    }

    #story .btn-box li.active a, #story .btn-box li:nth-child(4) a:hover {
        background-position: 0 bottom
    }

    #story.case1 .section1 {
        margin: 50px 0 0 50px
    }

    #story.case1 .section2 {
        margin: 80px 0 0 70px
    }

    #story.case1 .section3 {
        margin: 80px 0 0 45px
    }

    #story.case1 .section4 {
        margin: 50px 0 0 55px
    }

    #story.case1 .to-case2-btn {
        background: url(../img/story/sp/to_case2_btn.png?1478654355) no-repeat;
        width: 524px;
        height: 142px;
        margin: 90px auto 0
    }

    #story.case2 .section1 {
        margin: 100px 0 0 50px
    }

    #story.case2 .section2 {
        margin: 95px 0 0 65px
    }

    #story.case2 .section3 {
        margin: 90px 0 0 42px
    }

    #story.case2 .section4 {
        margin: 105px 0 0 45px
    }

    #story.case2 .to-case3-btn {
        background: url(../img/story/sp/to_case3_btn.png?1480297370) no-repeat;
        width: 525px;
        height: 142px;
        margin: 90px auto 0
    }

    #story.case3 .section1 {
        margin: 100px 0 0 60px
    }

    #story.case3 .section2 {
        margin: 103px 0 0 28px
    }

    #story.case3 .section3 {
        margin: 100px 0 0 65px
    }

    #story.case3 .section4 {
        margin: 80px 0 0 62px
    }

    #story.case3 .to-case4-btn {
        background: url(../img/story/sp/to_case4_btn.png?1481507159) no-repeat;
        width: 525px;
        height: 142px;
        margin: 90px auto 0
    }

    #story.case4 .section1 {
        margin: 118px 0 0 57px
    }

    #story.case4 .section2 {
        margin: 120px 0 0 70px
    }

    #story.case4 .section3 {
        margin: 102px 0 0 58px
    }

    #story.case4 .section4 {
        margin: 92px 0 0 25px
    }
}