@charset "utf-8";

/*----------------------------------------------

    アクエリオンロゴス　アニメ公式サイト
    https://aqlogos.com/

----------------------------------------------*/

@media only screen and (max-width:350px) {
    .sp3 {
        display: block !important;
    }
}

@media only screen and (max-width:480px) {
    #contents .product-table th {
        width: 80px;
    }
}

@media only screen and (max-width:640px) {
    /*
    basic
----------------------------------------------*/
    body {
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    * {
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        /*    -ms-word-break: break-all;
        word-break: break-all;*/
    }
    a:link,
    a:visited {
        color: #08b5e0;
        text-decoration: none;
    }
    a:hover,
    a:focus,
    a:active {
        color: #9bbdc6;
        text-decoration: none;
    }
    img {
        max-width: 100%;
        width: auto;
        height: auto;
    }
    .none {
        display: none;
    }
    .pc {
        display: none;
    }
    .pc2 {
        display: none;
    }
    .pc-inline {
        display: none;
    }
    .sp {
        display: block;
    }
    .sp2 {
        display: inline;
    }
    .sp3 {
        display: none;
    }
    .m0 {
        margin: 0 !important;
    }
    .m10 {
        margin: 0 0 10px 0 !important;
    }
    .m20 {
        margin: 0 0 20px 0 !important;
    }
    .m30 {
        margin: 0 0 30px 0 !important;
    }
    /*
    clearfix
----------------------------------------------*/
    .sp-header:after,
    .header-contents:after,
    .character-navi-sp ul:after,
    .hayashi:after,
    .product-navi-sp ul:after,
    .special-navi-sp ul:after,
    .news-list:after,
    .delivery-list:after,
    .world-list:after,
    .list-top:after,
    .movie-list:after,
    .twitter-list:after,
    .special-navi ul:after,
    .product-list:after,
    .episode-list:after,
    .detail-contents:after,
    .combine-list li:after,
    .detail-mecha:after,
    #rental .inner:after,
    .download-list li:after,
    .clearfix:after {
        display: block;
        clear: both;
        content: "";
    }
    /************************************************
***   #container
************************************************/
    #container {
        /*background:url(../images/pc/bg_main.png) repeat-y;*/
        background-color: #000;
    }
    #contents {
        background: url(../images/pc/bg_contents.png) repeat-x;
    }
    /************************************************
***   #index-header
************************************************/
    #index-header {
        width: 100%;
        margin: 0 auto 30px auto;
    }
    #index-header .sp-header {
        width: 100%;
        padding: 7% 0;
        background-color: rgba(0, 0, 0, 0.7);
        position: relative;
        z-index: 10000;
    }
    /*        #index-header .sp-header h1{
            width: 30%;
            margin: 0 0 0 7%;
            float: left;
        }
        #index-header .sp-header .menu-btn{
            width: 15%;
            margin: 0 5% 0 0;
            padding: 8% 0 0 0;
            float: right;
        }*/
    #index-header .sp-header h1 {
        width: 50%;
        margin: 0 0 0 7%;
        float: left;
    }
    #index-header .sp-header .menu-btn {
        width: 15%;
        margin: 0 5% 0 0;
        padding: 2% 0 0 0;
        float: right;
    }
    #index-header .main-visual {
        margin: 0 0 0 0;
    }
    #index-header .over-image {
        display: none;
    }
    /************************************************
***   #contents-header
************************************************/
    #contents-header {
        width: 100%;
        margin: 0 0 10% 0;
        border-bottom: 1px solid #999999;
    }
    #contents-header .header-contents .sp-header {
        width: 100%;
        padding: 7% 0;
        background-color: #484848;
        position: relative;
        z-index: 10000;
    }
    #contents-header .header-contents .sp-header h1 {
        width: 50%;
        margin: 0 0 0 7%;
        float: left;
    }
    /*        #index-header .header-contents .sp-header .menu-btn{
            width: 15%;
            margin: 0 5% 0 0;
            padding: 8% 0 0 0;
            float: right;
        }*/
    #contents-header .header-contents .sp-header .menu-btn {
        width: 15%;
        margin: 0 5% 0 0;
        padding: 2% 0 0 0;
        float: right;
    }
    #contents-header .header-contents h2 {
        margin: 4% 0 3% 7%;
        float: left;
    }
    #contents-header .header-contents h2.ttl-news {
        width: 23%;
    }
    #contents-header .header-contents h2.ttl-news-detail {
        width: 23%;
        float: left;
    }
    #contents-header .header-contents h2.ttl-world {
        width: 30%;
    }
    #contents-header .header-contents h2.ttl-onair {
        width: 26%;
    }
    #contents-header .header-contents h2.ttl-introduction {
        width: 60%;
    }
    #contents-header .header-contents h2.ttl-staff-cast {
        width: 55%;
    }
    #contents-header .header-contents h2.ttl-special {
        width: 35%;
    }
    #contents-header .header-contents .back-btn {
        margin: 4% 4% 0 0;
        width: 22%;
        float: right;
    }
    /************************************************
***   main-navi
************************************************/
    #main-navi {}
    #main-navi .close-menu {
        display: none;
    }
    #main-navi .open-menu {
        width: 100%;
        padding: 30% 0 10px 0;
        background-color: rgba(0, 0, 0, 0.9);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 9998;
        display: none;
    }
    #main-navi .open-menu li {
        margin: 0 0 25px 25%;
    }
    #main-navi .open-menu li:nth-child(1) {
        width: 15%;
    }
    #main-navi .open-menu li:nth-child(2) {
        width: 20%;
    }
    #main-navi .open-menu li:nth-child(3) {
        width: 24%;
    }
    #main-navi .open-menu li:nth-child(4) {
        width: 53%;
    }
    #main-navi .open-menu li:nth-child(5) {
        width: 25%;
    }
    #main-navi .open-menu li:nth-child(6) {
        width: 25%;
    }
    #main-navi .open-menu li:nth-child(7) {
        width: 44%;
    }
    #main-navi .open-menu li:nth-child(8) {
        margin: 0 0 25px 0;
    }
    #main-navi .open-menu li:nth-child(8) div {
        margin: 0 0 15px 25%;
        width: 37%;
    }
    #main-navi .sub-navi li:nth-child(1) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 31%;
    }
    #main-navi .sub-navi li:nth-child(2) {
        margin: 0 0 0 25%;
        padding: 0 0 0 3%;
        width: 24%;
    }
    #main-navi .open-menu li:nth-child(9) {
        width: 44%;
    }
    #main-navi .open-menu li:nth-child(10) {
        margin: 0 0 25px 0;
    }
    #main-navi .open-menu li:nth-child(10) div {
        margin: 0 0 15px 25%;
        width: 39%;
    }
    #main-navi .sub-navi2 li:nth-child(1) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 35%;
    }
    #main-navi .sub-navi2 li:nth-child(2) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 12%;
    }
    #main-navi .sub-navi2 li:nth-child(3) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 20%;
        opacity: 1 !important;
    }
    #main-navi .sub-navi2 li:nth-child(4) {
        margin: 0 0 0 25%;
        padding: 0 0 0 3%;
        width: 28%;
    }
    #main-navi .open-menu li:nth-child(11) {
        width: 30%;
    }
    /************************************************
***   main-navi2（テスト用）
************************************************/
    #main-navi2 {}
    #main-navi2 .close-menu {
        display: none;
    }
    #main-navi2 .open-menu {
        width: 100%;
        padding: 30% 0 10px 0;
        background-color: rgba(0, 0, 0, 0.9);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 9998;
        display: none;
    }
    #main-navi2 .open-menu li {
        margin: 0 0 25px 25%;
    }
    #main-navi2 .open-menu li:nth-child(1) {
        width: 15%;
    }
    #main-navi2 .open-menu li:nth-child(2) {
        width: 20%;
    }
    #main-navi2 .open-menu li:nth-child(3) {
        width: 24%;
    }
    #main-navi2 .open-menu li:nth-child(4) {
        width: 53%;
    }
    #main-navi2 .open-menu li:nth-child(5) {
        width: 25%;
    }
    #main-navi2 .open-menu li:nth-child(6) {
        width: 25%;
    }
    #main-navi2 .open-menu li:nth-child(7) {
        width: 44%;
    }
    #main-navi2 .open-menu li:nth-child(8) {
        margin: 0 0 25px 0;
    }
    #main-navi2 .open-menu li:nth-child(8) div {
        margin: 0 0 15px 25%;
        width: 37%;
    }
    #main-navi2 .sub-navi li:nth-child(1) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 31%;
    }
    #main-navi2 .sub-navi li:nth-child(2) {
        margin: 0 0 0 25%;
        padding: 0 0 0 3%;
        width: 24%;
    }
    #main-navi2 .open-menu li:nth-child(9) {
        width: 44%;
    }
    #main-navi2 .open-menu li:nth-child(10) {
        margin: 0 0 25px 0;
    }
    #main-navi2 .open-menu li:nth-child(10) div {
        margin: 0 0 15px 25%;
        width: 39%;
    }
    #main-navi2 .sub-navi2 li:nth-child(1) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 35%;
    }
    #main-navi2 .sub-navi2 li:nth-child(2) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 12%;
    }
    #main-navi2 .sub-navi2 li:nth-child(3) {
        margin: 0 0 15px 25%;
        padding: 0 0 0 3%;
        width: 20%;
        opacity: 1 !important;
    }
    #main-navi2 .sub-navi2 li:nth-child(4) {
        margin: 0 0 0 25%;
        padding: 0 0 0 3%;
        width: 28%;
    }
    #main-navi2 .open-menu li:nth-child(11) {
        width: 30%;
    }
    /************************************************
***   twitter-area
************************************************/
    #twitter-area {
        width: 100%;
        margin: -15% auto 0 auto;
        padding: 20px 0;
        background: url(../images/pc/bg_twitter-area.png);
        position: relative;
        z-index: 10;
    }
    #twitter-area .twitter-contents {
        width: 92%;
        max-width: 640px;
        margin: 0 auto;
    }
    #twitter-area .twitter-contents h2 {
        /*width: 25%;*/
        margin: 0 0 5px 0;
    }
    #twitter-area .twitter-contents .timeline {
        width: 100%;
    }
    #twitter-area .twitter-contents .timeline iframe {
        width: 100%;
        height: 130px;
    }
    /************************************************
***   news-area
************************************************/
    #news-area {
        width: 100%;
        padding: 20px 0 25px 0;
        background: url(../images/pc/bg_news-area_02.png);
        position: relative;
        z-index: 10;
    }
    #news-area .news-contents {
        width: 92%;
        max-width: 640px;
        margin: 0 auto;
    }
    #news-area .news-contents h2 {
        width: 20%;
        margin: 0 0 15px 0;
    }
    #news-area .news-contents .news-list {
        margin: 0 !important;
    }
    .news-list {
        margin: 0 7% 20px 7%;
    }
    .news-list li {
        width: 48%;
        margin: 0 4% 4% 0;
        float: left;
        position: relative;
    }
    .news-list li:nth-child(2n) {
        margin: 0 0 4% 0;
    }
    .news-list li a {
        display: block;
        text-decoration: none;
        color: #000;
    }
    .news-list li .thumbnail {
        line-height: 0;
    }
    .news-list li .thumbnail img {
        width: 100%
    }
    .news-list li .caption {
        width: 100%;
        height: 55%;
        padding: 3%;
        position: absolute;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        filter: progid: DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#AA000000, EndColorStr=#AA000000);
    }
    .news-list li .caption .date {
        margin: 0 0 5px 0;
        font-size: 62.5%;
        color: #FFF;
    }
    .news-list li .caption .title {
        margin: 0 0 5px 0;
        font-size: 75%;
        line-height: 130%;
        color: #FFF;
    }
    .news-list li .caption .category {
        position: absolute;
        bottom: 10px;
        right: 0;
        font-size: 75%;
        color: #000;
    }
    .news-list li .caption .category span {
        padding: 2px 6px;
        background-color: #FFF;
    }
    .news-list .new-icon {
        position: absolute;
        top: -5px;
        left: -4px;
    }
    /*                .news-list li  .point-ribbon {
                 position: absolute;
                 background: #FF0000;
                 font-size: 75%;
                 color: #fff;
                }
                .news-list li  .point-ribbon:before {
                 position: absolute;
                 content: " ";
                 height: 0;
                 width: 0;
                }
                .news-list li  .point-ribbon:after {
                 position: absolute;
                 content: " ";
                 height: 0;
                 width: 0;
                }
                .news-list li  .point-ribbon-l {
                 top: 0;
                 left: -6px;
                 height: 1.5em;
                 line-height: 1.5;
                 padding-left: .5em;
                }
                .news-list li  .point-ribbon-l:before {
                 left: 0;
                 top: 100%;
                 border-top:6px solid #C83539;
                 border-left:6px solid transparent;
                }
                .news-list li  .point-ribbon-l:after {
                 left: 100%;
                 bottom: 0;
                 border:.8em solid #FF0000;
                 border:8px solid #FF0000;
                 border-right:.7em solid transparent;
                }*/
    /************************************************
***   news-detail
************************************************/
    .news-detail {
        width: 94%;
        margin: 0 3% 30px 3%;
    }
    .news-detail .header {
        width: 100%;
        padding: 10px 0;
        background-color: #333;
        position: relative;
    }
    .news-detail .new-icon {
        position: absolute;
        top: 25%;
        left: -4px;
    }
    /*        .news-detail .point-ribbon {
         position: absolute;
         background: #FF0000;
         font-size: 12px;
         color: #fff;
        }
        .news-detail .point-ribbon:before {
         position: absolute;
         content: " ";
         height: 0;
         width: 0;
        }
        .news-detail .point-ribbon:after {
         position: absolute;
         content: " ";
         height: 0;
         width: 0;
        }
        .news-detail .point-ribbon-l {
         top: 25%;
         left: -6px;
         height: 1.5em;
         line-height: 1.5;
         padding-left: .5em;
        }
        .news-detail .point-ribbon-l:before {
         left: 0;
         top: 100%;
         border-top:6px solid #C83539;
         border-left:6px solid transparent;
        }
        .news-detail .point-ribbon-l:after {
         left: 100%;
         bottom: 0;
         border:8px solid #FF0000;
         border:.8em solid #FF0000;
         border-right:.7em solid transparent;
        }*/
    .news-detail .date {
        margin: 0 0 0 60px;
        color: #FFF;
    }
    .news-detail .date .year {
        margin: 0 5px 0 0;
        font-size: 75%;
    }
    .news-detail .date .md {
        font-size: 130%;
    }
    .news-detail .category {
        position: absolute;
        top: 35%;
        right: 10px;
        font-size: 81.3%;
        color: #000;
    }
    .news-detail .category span {
        padding: 2px 8px;
        font-size: 87.5%;
        background-color: #FFF;
    }
    .news-detail .content {
        width: 100%;
        padding: 20px 3%;
        background-color: #FFF;
    }
    .news-detail .content .title {
        margin: 0 0 20px 0;
        font-size: 130%;
        line-height: 130%;
    }
    .news-detail .content .thumbnail {
        width: 100%;
        margin: 0 0 30px 0;
        text-align: center;
    }
    .news-detail .content .sentence {
        font-size: 87.5%;
        line-height: 130%;
    }
    .news-detail .content .sentence p {
        margin: 0 0 20px 0;
    }
    .news-detail iframe {
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }
    .to-top {
        width: 15%;
        margin: 0 auto;
        padding: 0 0 50px 0;
        text-align: center;
    }
    /************************************************
***   onair
************************************************/
    .onair-detail {
        width: 94%;
        margin: 0 3%;
        padding: 0 0 30px 0;
    }
    .onair-detail .onair-image {
        margin: 0 0 30px 0;
    }
    .onair-detail .content {
        width: 100%;
        padding: 3%;
        background-color: #FFF;
    }
    .onair-detail .onair-table {
        width: 96%;
        margin: 0 0 5% 2%;
        text-align: left;
    }
    .onair-detail .onair-table tr {
        padding: 3% 0;
        display: block;
    }
    .onair-detail .onair-table tr + tr {
        border-top: 1px solid #F0F0F0;
    }
    .onair-detail .onair-table th {
        width: 100%;
        font-size: 100%;
        line-height: 130%;
        font-weight: bold;
        display: block;
        text-align: left;
    }
    .onair-detail .onair-table td {
        width: 100%;
        display: block;
        font-size: 87.5%;
        line-height: 140%;
    }
    .onair-detail .onair-table td .small {
        font-size: 87.5%;
    }
    .onair-detail .onair-table td .repeat {
        margin: 3% 0 0 0;
        text-indent: -0.5em;
    }
    .onair-detail .onair-asterisk {
        width: 100%;
        padding: 3% 4%;
        background-color: #F0F0F0;
    }
    .onair-detail .onair-asterisk li {
        margin: 0 0 5px 0;
        padding: 0 0 0 1em;
        text-indent: -1em;
        font-size: 75%;
        line-height: 130%;
    }
    .onair-detail h3 {
        width: 20%;
        margin: 10% 0 2% 3%;
    }
    .onair-detail h4 {
        width: 100%;
        padding: 2% 3%;
        font-size: 87.5%;
        font-weight: bold;
        color: #FFF;
        background-color: #333;
    }
    .onair-detail h5 {
        width: 100%;
        padding: 2% 3%;
        font-size: 87.5%;
        background-color: #f0f0f0;
    }
    .onair-detail .delivery {
        width: 100%;
        margin: 0 0 10% 0;
        padding: 0 !important;
        background-color: #FFF;
        position: relative;
    }
    .onair-detail .delivery-list {}
    .onair-detail .delivery-list li .site-detail {
        width: 85%;
        padding: 3% 0 3% 3%;
        float: left;
    }
    .onair-detail .delivery-list li .site-detail dt {
        width: 33%;
        margin: 0 0 3%0;
    }
    .onair-detail .delivery-list li .site-detail .sentence {
        font-size: 87.5%;
    }
    .onair-detail .delivery-list li .link-btn {
        width: 13%;
        float: right;
    }
    .onair-detail .general {
        width: 100%;
        padding: 5%;
        background-color: #FFF;
    }
    .onair-detail .general-delivery-list li:nth-child(2) {
        margin: 30px 0 0 0;
    }
    .onair-detail .general-delivery-list li .site-detail dt {
        margin: 0 0 10px 0;
        font-size: 87.5%;
        font-weight: bold;
    }
    .onair-detail .general-delivery-list li .site-detail dd {
        margin: 0 0 10px 0;
        font-size: 87.5%;
    }
    /************************************************
***   introduction
************************************************/
    .introduction-image {
        width: 100%;
    }
    /************************************************
***   world
************************************************/
    .world-list {
        margin: 0 7%;
        padding: 0 0 50px 0;
    }
    .world-list li {
        width: 100%;
        margin: 0 0 15px 0;
        padding: 5%;
        background-color: #333;
    }
    .world-list li .list-top {
        margin: 0 0 15px 0;
        display: table;
        table-layout: fixed;
    }
    .world-list li .list-top .thumbnail {
        width: 55%;
        max-width: 266px;
        padding: 0 15px 0 0;
        /*float: left;*/
        display: table-cell;
    }
    .world-list li .list-top .thumbnail img {
        width: 100%
    }
    .world-list li .list-top .word {
        width: 45%;
        margin: 0 0 20px 0;
        /*height: 145px;*/
        font-size: 87.5%;
        line-height: 110%;
        color: #FFF;
        display: table-cell;
        vertical-align: middle;
        /*display: table;*/
        /*position: relative;*/
    }
    .world-list li .list-top .word span {
        font-size: 75%;
        line-height: 100%;
    }
    .world-list li .list-top .word p {
        /*                    height: 100%;
                    display: table-cell;
                    vertical-align: middle;*/
    }
    .world-list li .sentence {
        font-size: 81.3%;
        line-height: 130%;
        color: #FFF;
    }
    /*    .world-list li{
        width: 48%;
        margin: 0 4% 4% 0;
        float: left;
        position: relative;
    }
    .world-list li:nth-child(2n){
        margin: 0 0 4% 0;
    }
        .world-list li a{
                display: block;
                text-decoration: none;
                color: #000;
            }
            .world-list li .thumbnail{
                line-height: 0;
            }
                .world-list li .thumbnail img{
                    width: 100%
                }
            .world-list li .caption{
                width: 100%;
                padding: 3% 2% 3% 3%;
                background-color:#333;
            }
                .world-list li .caption .word{
                    margin: 0 0 15px 0;
                    font-size: 87.5%;
                    line-height: 130%;
                    color:#FFF;
                }
                .world-list li .caption .sentence{
                    font-size: 87.5%;
                    line-height: 130%;
                    color:#FFF;
                }*/
    /************************************************
***   story
************************************************/
    .story-header {
        /*margin: 0 !important;*/
    }
    #contents-header .header-contents .episode-btn {
        margin: 4% 4% 0 0;
        width: 30%;
        float: right;
    }
    .story-contents {
        width: 100%;
        max-width: 640px;
        /*margin: 0 0 15% 0;*/
    }
    .story-visual-sp {
        margin: -10% 0 0 0;
        padding: 0 0 10% 0;
    }
    .story-visual-pc {
        display: none;
    }
    .episode-area {
        width: 75%;
        /*max-width: 480px;*/
        margin: 0 auto;
        padding: 0 0 15% 0;
    }
    .episode-area h3 {
        width: 32%;
        margin: 0 auto 5% auto;
    }
    .episode-area .episode-list {}
    .episode-area .episode-list li {
        width: 47%;
        margin: 0 6% 6% 0;
        float: left;
        position: relative;
    }
    .episode-area .episode-list li:nth-child(2n) {
        margin: 0 0 6% 0;
    }
    .episode-area .episode-list li:last-child {
        margin: 0;
    }
    .episode-area .episode-list li a {
        display: block;
        text-decoration: none;
        color: #000;
    }
    .episode-area .episode-list li .caption {
        width: 100%;
        position: absolute;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        filter: progid: DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#AA000000, EndColorStr=#AA000000);
    }
    .story-heading {
        width: 86%;
        margin: 0 7% 7% 7%
    }
    .story-heading h3 {
        width: 62%;
    }
    .story-heading h3.story-ttl-05,
    .story-heading h3.story-ttl-11,
    .story-heading h3.story-ttl-13 {
        width: 74%;
    }
    .story-heading h3.story-ttl-06,
    .story-heading h3.story-ttl-08,
    .story-heading h3.story-ttl-15 {
        width: 56%;
    }
    .story-heading h3.story-ttl-10 {
        width: 54%;
    }
    .story-heading h3.story-ttl-12 {
        width: 54%;
    }
    .story-heading h3.story-ttl-14 {
        width: 57%;
    }
    .story-heading h3.story-ttl-19 {
        width: 60%;
    }
    .story-heading h3.story-ttl-20 {
        width: 68%;
    }
    .story-heading h3.story-ttl-22,
    .story-heading h3.story-ttl-25 {
        width: 67%;
    }
    .story-heading h3.story-ttl-24 {
        width: 74%;
    }
    .story-heading h3.story-ttl-26 {
        width: 65%;
    }
    .sentence-area {
        width: 86%;
        margin: 0 7% 10% 7%;
        background: url(../images/pc/bg_episode-belt.png);
    }
    .sentence-area .inner {
        width: 100%;
        padding: 7%;
    }
    .sentence-area .inner .left-sentence {
        margin: 0 0 6% 0;
    }
    .sentence-area .inner .left-sentence .sentence01 {
        margin: 0 0 6% 0;
        font-size: 87.5%;
        line-height: 150%;
    }
    .sentence-area .inner .left-sentence .sentence02 {
        font-size: 75%;
        line-height: 150%;
    }
    .sentence-area .right-view {
        width: 100%;
        margin: 0 0 6% 0;
    }
    /* .viewer
------------------------- */
    .viewer {
        margin: 0 auto;
        width: 100%;
        position: relative;
        overflow: hidden;
    }
    .viewer ul {
        width: 100%;
        overflow: hidden;
        position: relative;
    }
    .viewer ul li {
        top: 0;
        left: 0;
        width: 100%;
        position: absolute;
    }
    .viewer ul li img {
        width: 100%;
    }
    /* =======================================
    ClearFixElements
======================================= */
    .viewer ul:after {
        content: ".";
        height: 0;
        clear: both;
        display: block;
        visibility: hidden;
    }
    .viewer ul {
        display: inline-block;
        overflow: hidden;
    }
    /************************************************
***   character
************************************************/
    .header-left {}
    .header-left .ttl-character {
        width: 49%;
    }
    .header-left .navi-btn-sp {
        width: 12%;
        float: right;
        text-align: right;
        line-height: 0;
        display: block;
        background: url(../images/sp/btn_navi-sp.png) no-repeat;
        background-size: contain;
    }
    .header-left .navi-btn-sp.active {
        background: url(../images/sp/btn_navi-sp_on.png) no-repeat;
        background-size: contain;
    }
    .character-navi-sp {
        width: 100%;
        padding: 5%;
        position: absolute;
        background: #b7b9bd;
        z-index: 100;
        display: none;
    }
    .character-navi-sp.active {
        margin: -10% 0 0 0;
        display: block;
    }
    .character-navi-sp ul {
        margin: 0 0 0 4%;
    }
    .character-navi-sp ul li {
        width: 16%;
        border-left: 1px solid #999999;
        border-top: 1px solid #999999;
        line-height: 0;
        float: left;
    }
    .character-navi-sp ul li:nth-child(6) {
        border-right: 1px solid #999999;
    }
    .character-navi-sp ul li:nth-child(7) {
        clear: left;
        border-bottom: 1px solid #999999;
    }
    .character-navi-sp ul li:nth-child(8),
    .character-navi-sp ul li:nth-child(9),
    .character-navi-sp ul li:nth-child(10),
    .character-navi-sp ul li:nth-child(11) {
        border-bottom: 1px solid #999999;
    }
    .character-navi-sp ul li:nth-child(12) {
        border-right: 1px solid #999999;
        border-bottom: 1px solid #999999;
    }
    .detail-contents {
        width: 100%;
        max-width: 640px;
        margin: 0 auto;
        position: relative;
    }
    .detail-left {
        /*margin: 0 2% 10% 1%;*/
        margin: 0 0 10% 0;
        position: relative;
    }
    .detail-left .name-text {
        width: 51%;
        margin: 0 0 0 8%;
    }
    .kaibuki {
        margin: 0 7% 10% 0 !important;
    }
    .kaibuki .name-text {
        width: 58%;
    }
    .kaibuki .chara-image {
        position: absolute;
        top: -4%;
        left: 55%;
        display: none;
    }
    .tsukigane {
        margin: 0 2% 10% 0 !important;
    }
    .tsukigane .chara-image {
        position: absolute;
        top: -4%;
        left: 48%;
        display: none;
    }
    .kikogami {
        margin: 0 5% 10% 0 !important;
    }
    .kikogami .name-text {
        width: 58%;
    }
    .kikogami .chara-image {
        position: absolute;
        top: -4%;
        left: 57%;
        display: none;
    }
    .kujyo {
        margin: 0 2% 0 0 !important;
    }
    .kujyo .chara-image {
        position: absolute;
        top: -4%;
        left: 50%;
        display: none;
    }
    .domon .chara-image {
        position: absolute;
        top: -4%;
        left: 38%;
        display: none;
    }
    .uminagi {
        margin: 0 1% 0 0 !important;
    }
    .uminagi .chara-image {
        position: absolute;
        top: 10%;
        left: 40%;
        display: none;
    }
    .kenzaki {
        margin: 0 7% 0 0 !important;
    }
    .kenzaki .name-text {
        width: 58%;
    }
    .kenzaki .chara-image {
        position: absolute;
        top: -4%;
        left: 55%;
        display: none;
    }
    .soda {
        margin: 0 2% 70% 0 !important;
    }
    .soda .chara-image {
        position: absolute;
        top: -4%;
        left: 48%;
        display: none;
    }
    .iwagami {
        margin: 0 5% 70% 0 !important;
    }
    .iwagami .name-text {
        width: 54%;
    }
    .iwagami .chara-image {
        position: absolute;
        top: -4%;
        left: 48%;
        display: none;
    }
    .sougon {
        margin: 0 4% 70% 0 !important;
    }
    .sougon .chara-image {
        position: absolute;
        top: -4%;
        left: 44%;
        display: none;
    }
    .yoshida {
        margin: 0 2% 50% 0 !important;
    }
    .yoshida .name-text {
        width: 50%;
    }
    .yoshida .chara-image {
        position: absolute;
        top: 0%;
        left: 46%;
        display: none;
    }
    .hayashi {
        margin: 0 0 70% 8% !important;
    }
    .hayashi .name-text {
        width: 53%;
        margin: 0 8% 0 0;
        float: right;
    }
    .hayashi .chara-image {
        position: absolute;
        top: 0%;
        right: 43%;
        display: none;
    }
    .character-navi,
    .character-navi2 {
        display: none;
    }
    .vector-area {
        width: 100%;
        max-width: 640px;
        margin: 0 0 15% 0;
        background: url(../images/pc/bg_vector.png);
    }
    .vector-area .vector-contents {
        width: 86%;
        max-width: 640px;
        margin: 0 auto;
        padding: 6% 0 8%;
    }
    .vector-area .vector-contents h3 {
        width: 40%;
        margin: 0 0 4% 0;
    }
    .vector-area .vector01 .vector-image {
        width: 45%;
        margin: 0 0 2% 5%;
    }
    .vector-area .vector01 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .vector-area .vector02 .vector-image {
        width: 45%;
        margin: 0 0 2% 5%;
    }
    .vector-area .vector02 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .vector-area .vector03 .vector-image {
        width: 45%;
        margin: 0 0 2% 5%;
    }
    .vector-area .vector03 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .vector-area .vector04 .vector-image {
        width: 45%;
        margin: 0 0 2% -2%;
    }
    .vector-area .vector04 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .vector-area .vector05 .vector-image {
        width: 45%;
        margin: 0 0 2% 5%;
    }
    .vector-area .vector05 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .vector-area .vector06 .vector-image {
        width: 45%;
        margin: 0 0 2% 5%;
    }
    .vector-area .vector06 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .vector-area .vector00 .vector-image {
        width: 45%;
        margin: 0 0 2% 5%;
    }
    .vector-area .vector00 .vector-btn {
        margin: 0 0 0 -3%;
        width: 53%;
    }
    .detail-bottom-contents {
        width: 86%;
        max-width: 640px;
        margin: 0 auto 10% auto;
        padding: 0 0 10% 0;
        position: relative;
        border-bottom: 1px solid #7A7979;
    }
    .detail-bottom-contents .caption {
        margin: 0 0 25px 0;
    }
    .detail-bottom-contents .sentence {
        width: 100%;
        margin: 0 auto;
        font-size: 87.5%;
        line-height: 150%;
        color: #333;
    }
    .character-bottom-navi {
        width: 86%;
        max-width: 640px;
        margin: 0 auto;
        padding: 0 0 10% 0;
    }
    .character-bottom-navi ul {}
    .character-bottom-navi ul li {
        width: 50%;
        max-width: 640px;
        margin: 0 auto 15px auto;
        text-align: center;
    }
    /************************************************
***   mechanic aquarion
************************************************/
    .mechanic-aquarion-navi {
        display: none;
    }
    .mechanic-aquarion-navi-sp {
        width: 100%;
        padding: 5%;
        position: absolute;
        background: #b7b9bd;
        z-index: 100;
        display: none;
    }
    .mechanic-aquarion-navi-sp.active {
        margin: -10% 0 0 0;
        display: block;
    }
    .mechanic-aquarion-navi-sp ul {
        margin: 0 0 0 0;
        /*border-right: 1px solid #999999;*/
    }
    .mechanic-aquarion-navi-sp ul li {
        width: 16.55%;
        /*width: 16.6%;*/
        border-left: 1px solid #999999;
        border-top: 1px solid #999999;
        line-height: 0;
        float: left;
    }
    .mechanic-aquarion-navi-sp ul li:nth-child(6),
    .mechanic-aquarion-navi-sp ul li:nth-child(12) {
        width: 16.9%;
        border-right: 1px solid #999999;
        border-bottom: 1px solid #999999;
    }
    .mechanic-aquarion-navi-sp ul li:nth-child(13) {
        clear: left;
        /*border-top: none;*/
        border-bottom: 1px solid #999999;
    }
    .mechanic-aquarion-navi-sp ul li:nth-child(14),
    .mechanic-aquarion-navi-sp ul li:nth-child(15),
    .mechanic-aquarion-navi-sp ul li:nth-child(16),
    .mechanic-aquarion-navi-sp ul li:nth-child(17) {
        /*border-top: none;*/
        border-bottom: 1px solid #999999;
    }
    .mechanic-aquarion-navi-sp ul li:nth-child(18) {
        width: 16.9%;
        border-top: none;
        border-right: 1px solid #999999;
        border-bottom: 1px solid #999999;
    }
    .header-left .ttl-aquarion {
        width: 67%;
    }
    .kou {
        margin: 0 0 10% 0;
    }
    .batsu {
        margin: 0 0 10% 0;
    }
    .rin {
        margin: 0 0 10% 0;
    }
    .angel {
        margin: 0 0 10% 0;
    }
    .phoenix {
        margin: 0 0 10% 0;
    }
    .zai {
        margin: 0 0 10% 0;
    }
    .jin {
        margin: 0 0 10% 0;
    }
    .ryu {
        margin: 0 0 10% 0;
    }
    .sei {
        margin: 0 0 10% 0;
    }
    .gai {
        margin: 0 0 10% 0;
    }
    .syo {
        margin: 0 0 10% 0;
    }
    .san {
        margin: 0 0 10% 0;
    }
    .ressho {
        margin: 0 0 10% 0;
    }
    .deava {
        margin: 0 0 10% 0;
    }
    .logos01 {
        margin: 0 0 10% 0;
    }
    .logos02 {
        margin: 0 0 10% 0;
    }
    .detail-mecha {
        width: 94%;
        max-width: 640px;
        margin: 0 auto 20% auto;
        position: relative;
    }
    .kou .fudemoji {
        width: 48%;
        padding: 12% 0 25% 0;
    }
    .kou .mecha-image {
        position: absolute;
        top: 0px;
        left: 37%;
        display: none;
    }
    .batsu .fudemoji {
        width: 50%;
        padding: 5% 0 20% 4%;
    }
    .batsu .mecha-image {
        position: absolute;
        top: 0px;
        left: 15%;
        display: none;
    }
    .rin .fudemoji {
        width: 56%;
        padding: 20% 0 8% 0;
        float: right;
    }
    .rin .mecha-image {
        position: absolute;
        top: 0px;
        right: 4%;
        display: none;
    }
    .angel .fudemoji {
        width: 55%;
        padding: 6% 0 5% 0;
    }
    .angel .mecha-image {
        position: absolute;
        top: 0px;
        left: 25%;
        display: none;
    }
    .angel .detail-mecha {
        margin: 0 auto 8% auto;
    }
    .phoenix .fudemoji {
        width: 60%;
        margin: -10% 0 0 -5%;
    }
    .phoenix .mecha-image {
        position: absolute;
        top: 22%;
        /*left: 5%;*/
        display: none;
    }
    .phoenix .detail-mecha {
        margin: 0 auto 15% auto;
    }
    .zai .fudemoji {
        width: 46%;
        padding: 12% 0 5% 8%;
    }
    .zai .mecha-image {
        position: absolute;
        top: 0px;
        left: 11%;
        display: none;
    }
    .jin .fudemoji {
        width: 73%;
        padding: 10% 0 23% 0;
    }
    .jin .mecha-image {
        position: absolute;
        top: 0px;
        left: 38%;
        display: none;
    }
    .ryu .fudemoji {
        width: 78%;
        padding: 0 0 18% 5%
    }
    .ryu .mecha-image {
        position: absolute;
        top: 0px;
        left: 0;
        display: none;
    }
    .sei .fudemoji {
        width: 56%;
        padding: 0 3% 25% 0;
        float: right;
    }
    .sei .mecha-image {
        position: absolute;
        top: -5%;
        left: 8%;
        right: 32%;
        display: none;
    }
    .sei .detail-mecha {
        margin: 0 auto 15% auto;
    }
    .gai .fudemoji {
        width: 63%;
        margin: -10% 0 0 0;
        padding: 0 3% 25% 0;
        float: right;
    }
    .gai .mecha-image {
        position: absolute;
        top: 18%;
        left: 3%;
        right: 15%;
        display: none;
    }
    .gai .detail-mecha {
        margin: 0 auto 15% auto;
    }
    .syo .fudemoji {
        width: 44%;
        margin: 30% 12% 0 0;
        float: right;
    }
    .syo .mecha-image {
        position: absolute;
        top: -2%;
        left: -10%;
        display: none;
    }
    .syo .detail-mecha {
        margin: 0 auto 2% auto;
    }
    .san .fudemoji {
        width: 55%;
        padding: 0 0 45% 0;
        margin: -5% 0 0 -3%;
    }
    .san .mecha-image {
        position: absolute;
        top: 15%;
        left: 20%;
        display: none;
    }
    .ressho .detail-mecha {
        margin: 0 auto;
    }
    .ressho .fudemoji {
        width: 49%;
        padding: 0 0 10% 4%;
    }
    .ressho .mecha-image {
        position: absolute;
        top: 2%;
        left: 32%;
        display: none;
    }
    .deava .fudemoji {
        width: 67%;
        margin: 46% 0 0 2%;
        padding: 0;
        float: left;
    }
    .deava .mecha-image {
        position: absolute;
        /*top: 18%;
            left: 3%;
            right: 15%;*/
        display: none;
    }
    .deava .detail-mecha {
        margin: 0 auto 10% auto;
    }
    .logos01 .detail-mecha {
        margin: 0 auto 3% auto;
    }
    .logos01 .fudemoji {
        width: 56%;
        /*padding: 20% 0 8% 0;*/
        margin: -5% 0 0 0;
        float: right;
    }
    .logos01 .mecha-image {
        position: absolute;
        top: 2%;
        right: 4%;
        display: none;
    }
    .logos02 .detail-mecha {
        margin: 0 auto 8% auto;
    }
    .logos02 .fudemoji {
        width: 56%;
        margin: -5% 0 0 0;
        float: right;
    }
    .logos02 .mecha-image {
        position: absolute;
        top: 2%;
        right: 20%;
        display: none;
    }
    .detail-aquarion {
        width: 86%;
        max-width: 640px;
        margin: 0 auto 10% auto;
        padding: 0 0 0 1%;
        position: relative;
    }
    .detail-aquarion .name {
        width: 57%;
        margin: 0 0 5% 0;
    }
    .angel .detail-aquarion .name {
        width: 65%;
        margin: 0 0 5% 0;
    }
    .phoenix .detail-aquarion .name {
        width: 66%;
        margin: 0 0 5% 0;
    }
    .ressho .detail-aquarion .name {
        width: 63%;
        margin: 0 0 5% 0;
    }
    .logos01 .detail-aquarion .name {
        width: 64%;
        margin: 0 0 5% 0;
        float: left
    }
    .logos01 .detail-aquarion .logos-btn {
        width: 36%;
        padding: 12% 12% 0 0;
        float: right;
        /*        display: none;*/
    }
    .logos02 .detail-aquarion .name {
        width: 64%;
        margin: 0 0 5% 0;
        /*float: left*/
    }
    .logos02 .detail-aquarion .logos-btn {
        width: 56%;
        margin: -17% 0 15% 29%;
        /*padding: 12% 12% 0 0;*/
        /*float: right;*/
    }
    .detail-aquarion .view360 {
        clear: both;
        margin: 0 0 5% 0;
    }
    .detail-aquarion .sentence {
        font-size: 87.5%;
        line-height: 150%;
        color: #333;
    }
    .deava .detail-aquarion {
        margin: -5% auto 10% auto;
    }
    .vector-combine {
        width: 100%;
        background: url(../images/pc/bg_vector.png);
    }
    .vector-combine .vector-contents {
        width: 94%;
        max-width: 640px;
        margin: 0 auto;
        padding: 5% 0;
    }
    .vector-combine .vector-contents h3 {
        width: 35%;
        max-width: 640px;
        margin: 0 auto;
        margin: 0 0 5% 5%;
    }
    .vector-combine .combine-list li {}
    .vector-combine .combine-list li .vector-btn {
        margin: 0 0 2% 0
    }
    .vector-combine .combine-kou .combine-list {}
    .vector-combine .combine-kou .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-kou .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-kou .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-kou .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-kou .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-kou .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-kou .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-batsu .combine-list {}
    .vector-combine .combine-batsu .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-batsu .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-batsu .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-batsu .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-batsu .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-batsu .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-batsu .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-rin .combine-list {}
    .vector-combine .combine-rin .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-rin .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-rin .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-rin .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-rin .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-rin .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-rin .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-angel .combine-list {}
    .vector-combine .combine-angel .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-angel .combine-list li:nth-child(3) .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:nth-child(3) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:nth-child(3) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:nth-child(4) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-angel .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-angel .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list {}
    .vector-combine .combine-phoenix .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-phoenix .combine-list li:nth-child(3) .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:nth-child(3) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:nth-child(3) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:nth-child(4) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-phoenix .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-phoenix .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-zai .combine-list {}
    .vector-combine .combine-zai .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-zai .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-zai .combine-list li:first-child .character-btn {
        width: 36%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-zai .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-zai .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-zai .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-zai .combine-list li:last-child .character-btn {
        width: 32%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-jin .combine-list {}
    .vector-combine .combine-jin .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-jin .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-jin .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-jin .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-jin .combine-list li:last-child {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-jin .combine-list li:last-child .vector-image {
        width: 41%;
        padding: 4% 0 0 0;
        float: left;
    }
    .vector-combine .combine-jin .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-jin .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-ryu .combine-list {}
    .vector-combine .combine-ryu .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-ryu .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-ryu .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-ryu .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-ryu .combine-list li:last-child {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-ryu .combine-list li:last-child .vector-image {
        width: 41%;
        padding: 0 0 0 0;
        float: left;
    }
    .vector-combine .combine-ryu .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-ryu .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-sei .combine-list {}
    .vector-combine .combine-sei .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-sei .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-sei .combine-list li:first-child .character-btn {
        width: 43%;
        margin: 0 0 0 8%;
        float: left;
    }
    .vector-combine .combine-sei .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-sei .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-sei .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-sei .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-gai .combine-list {}
    .vector-combine .combine-gai .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-gai .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-gai .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-gai .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-gai .combine-list li:last-child {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-gai .combine-list li:last-child .vector-image {
        width: 41%;
        padding: 4% 0 0 0;
        float: left;
    }
    .vector-combine .combine-gai .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-gai .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-syo .combine-list {}
    .vector-combine .combine-syo .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-syo .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-syo .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-syo .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-syo .combine-list li:last-child {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-syo .combine-list li:last-child .vector-image {
        width: 62%;
        padding: 5% 0 0 0;
        margin: 0 auto;
    }
    .vector-combine .combine-san .combine-list {}
    .vector-combine .combine-san .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-san .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-san .combine-list li:first-child .character-btn {
        width: 32%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-san .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-san .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-san .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-san .combine-list li:last-child .character-btn {
        width: 36%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list {}
    .vector-combine .combine-ressho .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list li:nth-child(2) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-ressho .combine-list li:nth-child(3) .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list li:nth-child(3) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list li:nth-child(3) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-ressho .combine-list li:nth-child(4) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-ressho .combine-list li:last-child {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-ressho .combine-list li:last-child .vector-image {
        width: 62%;
        padding: 5% 0 0 0;
        margin: 0 auto;
    }
    .vector-combine .combine-deava .combine-list {}
    .vector-combine .combine-deava .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:first-child .character-btn {
        width: 32%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(2),
    .vector-combine .combine-deava .combine-list li:nth-child(4),
    .vector-combine .combine-deava .combine-list li:nth-child(6),
    .vector-combine .combine-deava .combine-list li:nth-child(8) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(3) {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(3) .vector-image {
        width: 41%;
        padding: 4% 0 0 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(3) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(3) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(5) .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(5) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(5) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(7) {
        margin: 2% 0 0 0;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(7) .vector-image {
        width: 41%;
        padding: 0 0 0 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(7) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:nth-child(7) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:last-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:last-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-deava .combine-list li:last-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list {}
    .vector-combine .combine-logos01 .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(2),
    .vector-combine .combine-logos01 .combine-list li:nth-child(4) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(3) .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(3) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(3) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(5) {
        /*margin: 2% 0 0 0;*/
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(5) .x {
        width: 25%;
        margin: 5% auto 0 auto;
    }
    .vector-combine .combine-logos01 .combine-list li:nth-child(5) .vector-image01,
    .vector-combine .combine-logos01 .combine-list li:nth-child(5) .vector-image02 {
        width: 62%;
        padding: 5% 0 0 0;
        margin: 0 auto;
    }
    .vector-combine .combine-logos02 .combine-list {}
    .vector-combine .combine-logos02 .combine-list li:first-child .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-logos02 .combine-list li:first-child .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-logos02 .combine-list li:first-child .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(2),
    .vector-combine .combine-logos02 .combine-list li:nth-child(4) {
        width: 25%;
        margin: 0 auto;
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(3) .vector-image {
        width: 41%;
        float: left;
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(3) .vector-btn {
        width: 47%;
        margin: 5% 0 5% 0;
        float: left;
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(3) .character-btn {
        width: 35%;
        margin: 0 0 0 16%;
        float: left;
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(5) {
        /*margin: 2% 0 0 0;*/
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(5) .x {
        width: 25%;
        margin: 5% auto 0 auto;
    }
    .vector-combine .combine-logos02 .combine-list li:nth-child(5) .vector-image01,
    .vector-combine .combine-logos02 .combine-list li:nth-child(5) .vector-image02 {
        width: 62%;
        padding: 5% 0 0 0;
        margin: 0 auto;
    }
    /************************************************
#overlay
************************************************/
    #overlay {
        display: none;
        width: 100%;
        height: 130%;
        text-align: center;
        position: absolute;
        top: 0;
        z-index: 99999;
    }
    #overlay .contents {
        display: table;
        width: 100%;
        height: 100%;
        text-align: center;
        position: fixed;
        top: 0;
        z-index: 99999;
        background: rgba(0, 0, 0, 0.7);
        filter: progid: DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#AA000000, EndColorStr=#AA000000);
    }
    #overlay .contents .inner {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        overflow: hidden;
    }
    .view-area {
        width: 90%;
        max-width: 300px;
        margin: 0 auto;
        background-color: #000;
        position: relative;
    }
    .view-area .close {
        width: 40px;
        height: 40px;
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 100;
        background: url(../images/pc/btn_close.png) no-repeat;
        background-size: contain;
    }
    .view-area .close:hover {
        filter: alpha(opacity=60);
        opacity: 0.6;
    }
    .view-area .icon {
        position: absolute;
        bottom: 10px;
        right: 10px;
    }
    .threesixty .nav_bar a.nav_bar_play {
        width: 53px;
        height: 28px;
        position: absolute;
        bottom: 10px;
        right: 10px;
        z-index: 10;
        background: url(../images/pc/icon_360view.png) no-repeat;
        background-size: contain;
    }
    .threesixty .nav_bar a.nav_bar_stop {
        width: 53px;
        height: 28px;
        position: absolute;
        bottom: 10px;
        right: 10px;
        z-index: 10;
        background: url(../images/pc/icon_360view.png) no-repeat;
        background-size: contain;
    }
    /************************************************
***   mechanic vector
************************************************/
    .ttl-vector {
        width: 61%;
    }
    .vector-contents {
        width: 86%;
        margin: 0 auto;
        padding: 0 0 10% 0;
    }
    .vector-contents .vector-top {
        margin: 0 0 7% 0;
    }
    .vector-contents .vector-top02 {
        margin: 7% 0 7% 0;
        padding: 7% 0 0 0;
        border-top: 1px solid #999;
    }
    .vector-contents .vector-top h3 {
        width: 30%;
        margin: 0 0 5% 0;
    }
    .vector-contents .vector-top p {
        font-size: 87.5%;
        line-height: 150%;
        color: #333;
    }
    .vector-contents .vector-top02 p {
        font-size: 87.5%;
        line-height: 150%;
        color: #333;
    }
    .vector-contents .vector-list {}
    .vector-contents .vector-list li {
        width: 100%;
        margin: 0 0 5% 0;
        position: relative;
    }
    .vector-contents .vector-list li:last-child {
        margin: 0;
    }
    .vector-contents .vector-list li:nth-child(1) {
        background: url(../images/sp/bg_vector01.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(1) a {
        width: 32%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(1) a {
        margin: 20% 0 0 4%;
    }
    /*            .webkit .vector-contents .vector-list li:nth-child(1) a{
                margin: 13% 0 0 4% !important;
            }*/
    .vector-contents .vector-list li:nth-child(2) {
        background: url(../images/sp/bg_vector02.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(2) a {
        width: 35%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(2) a {
        margin: 20% 0 0 4%;
    }
    .vector-contents .vector-list li:nth-child(3) {
        background: url(../images/sp/bg_vector03.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(3) a {
        width: 40%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(3) a {
        margin: 20% 0 0 4%;
    }
    .vector-contents .vector-list li:nth-child(4) {
        background: url(../images/sp/bg_vector04.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(4) a {
        width: 35%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(4) a {
        margin: 20% 0 0 4%;
    }
    .vector-contents .vector-list li:nth-child(5) {
        background: url(../images/sp/bg_vector05.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(5) a {
        width: 36%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(5) a {
        margin: 20% 0 0 4%;
    }
    .vector-contents .vector-list li:nth-child(6) {
        background: url(../images/sp/bg_vector06.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(6) a {
        width: 35%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(6) a {
        margin: 20% 0 0 4%;
    }
    .vector-contents .vector-list li:nth-child(7) {
        background: url(../images/sp/bg_vector00.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list li:nth-child(7) a {
        width: 32%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list li:nth-child(7) a {
        margin: 20% 0 0 4%;
    }
    .vector-contents .vector-list02 {}
    .vector-contents .vector-list02 li {
        width: 100%;
        margin: 0 0 5% 0;
        position: relative;
    }
    .vector-contents .vector-list02 li:last-child {
        margin: 0;
    }
    .vector-contents .vector-list02 li:nth-child(1) {
        background: url(../images/sp/bg_vector07.png) no-repeat;
        background-size: contain;
    }
    .vector-contents .vector-list02 li:nth-child(1) a {
        width: 32%;
        margin: 13% 0 0 4%;
        position: absolute;
    }
    .android .vector-contents .vector-list02 li:nth-child(1) a {
        margin: 20% 0 0 4%;
    }
    /************************************************
***   staff/cast
************************************************/
    .staff-cast-image {
        width: 86%;
        margin: 0 7%;
        padding: 0 0 10% 0;
    }
    /************************************************
***   PRODUCT
************************************************/
    /************************************************
***   blu-ray/DVD
************************************************/
    #contents-header .header-contents h2.ttl-product {
        width: 45%;
    }
    .product-navi {
        display: none;
    }
    /*    .product-navi-sp ul{
    }
        .product-navi-sp ul li{
            float: left;
            line-height: 0;
        }
        .product-navi-sp ul li.current{
            background: url(../images/pc/bg_hover.png);
        }
        .product-navi-sp ul li a{
            display: block;
        }*/
    .product-navi-sp {
        width: 100%;
        /*margin: -100% 0 0 0;*/
        padding: 5%;
        position: absolute;
        background: #b7b9bd;
        z-index: 100;
        display: none;
    }
    .product-navi-sp.active {
        margin: -10% 0 0 0;
        /*transition: 0.2s linear;
  -webkit-transition: 0.2s linear;*/
        display: block;
    }
    .product-navi-sp ul {
        margin: 0 0 0 2%;
    }
    .product-navi-sp ul li {
        width: 49%;
        line-height: 0;
        float: left;
    }
    .product-navi-sp ul li:nth-child(1) {
        border-right: 1px solid #dbd8dc;
        border-bottom: 1px solid #dbd8dc;
    }
    .product-navi-sp ul li:nth-child(2) {
        /*border-left: 1px solid #dbd8dc;*/
        border-bottom: 1px solid #dbd8dc;
    }
    .product-navi-sp ul li:nth-child(3) {
        border-right: 1px solid #dbd8dc;
        /*border-top: 1px solid #dbd8dc;*/
    }
    .product-navi-sp ul li:nth-child(4) {
        /*border-left: 1px solid #dbd8dc;*/
        /*border-top: 1px solid #dbd8dc;*/
    }
    h3.bluray-dvd {
        width: 32%;
        margin: 0 0 7% 7%;
    }
    h3.bluray-dvd-detail {
        width: 32%;
        margin: 0 0 7% 7%;
        float: left;
    }
    h3.bluray-dvd-campaign {
        width: 76%;
        margin: 0 0 7% 7%;
    }
    .btn-campaign {
        width: 36%;
        margin: -3% 7% 7% 0;
        float: right;
    }
    h3.cd {
        width: 9%;
        margin: 0 0 7% 7%;
    }
    h3.others {
        width: 26%;
        margin: 0 0 7% 7%;
    }
    .product-list {
        padding: 0 7% 20px 7%;
    }
    .product-list li {
        width: 48%;
        margin: 0 4% 4% 0;
        float: left;
        position: relative;
    }
    .product-list li:nth-child(2n) {
        margin: 0 0 4% 0;
    }
    .product-list li:last-child {
        margin: 0;
    }
    .product-list li a {
        padding: 8%;
        display: block;
        text-decoration: none;
        color: #FFF;
        background-color: #333;
    }
    .product-list li a:hover {
        display: block;
        text-decoration: none;
        background-color: #13aed6;
    }
    .product-list li a .thumbnail {
        margin: 0 0 7% 0;
        text-align: center;
    }
    .product-list li a .sentence {
        font-size: 75%;
        line-height: 130%;
    }
    .campaign-list li {
        margin: 0 0 30px 0;
    }
    .campaign-list li:last-child {
        margin: 0;
    }
    /************************************************
***   detail
************************************************/
    .product-detail {
        width: 94%;
        margin: 0 3%;
        padding: 0 0 30px 0;
    }
    .product-detail h5 {
        margin: 0 0 10px 0;
    }
    .product-detail .header {
        width: 100%;
        padding: 2% 4%;
        font-size: 130%;
        line-height: 130%;
        color: #FFF;
        background-color: #333;
    }
    .product-detail .content {
        width: 100%;
        padding: 20px 3%;
        background-color: #FFF;
    }
    .product-detail .content .top-sentence {
        margin: 0 0 20px 0;
        font-size: 81.3%;
        line-height: 130%;
        text-align: center;
    }
    .product-detail .content .thumbnail {
        width: 100%;
        margin: 0 0 30px 0;
        text-align: center;
    }
    .product-detail .content .sentence {
        margin: 0 0 20px 0;
        font-size: 81.3%;
        line-height: 130%;
    }
    .product-detail iframe {
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }
    .product-detail .content .line {
        padding: 25px 0 0 0;
        border-top: 1px solid #333;
    }
    .product-detail .other {
        font-size: 81.3%;
        margin: -10px 0 25px 0;
        text-align: right;
    }
    .bonus-list li {
        margin: 0 0 20px 0;
    }
    .bonus-list li .sentence {
        margin: 0 0 10px 0 !important;
    }
    .asterisk {
        padding: 0 0 0 1em;
        text-indent: -1em;
        font-size: 75%;
        line-height: 130%;
    }
    .indent-list li {
        padding: 0 0 0 1em;
        text-indent: -1em;
    }
    .indent-list .privilege img {
        margin: 10px 0 10px -1em;
    }
    .product-table {
        margin: 0 0 20px 0;
        border-collapse: collapse;
        word-break: break-all;
    }
    .product-table th {
        width: 100px;
        padding: 9px 9px 9px 0;
        font-size: 81.3%;
        line-height: 130%;
        text-align: left;
        vertical-align: top;
    }
    .product-table td {
        padding: 9px 0;
        font-size: 81.3%;
        line-height: 150%;
    }
    .product-table td.indent {
        padding: 9px 0 9px 1em;
        text-indent: -1em;
    }
    .product-table td.indent2-5 {
        padding: 9px 0 9px 2.5em;
        text-indent: -2.5em;
    }
    .product-table td .small {
        font-size: 87.5%;
    }
    .product-table td ol li {
        padding: 0 1.5em;
        text-indent: -1.5em;
    }
    .product-table .title {
        margin: 0 0 2px 0;
        float: none;
    }
    .product-table .singer {
        margin: 0 0 0 10px;
        float: none;
    }
    .product-table .asterisk {
        padding: 0 0 0 1em;
        text-indent: -1em;
        font-size: 75%;
        display: block;
        line-height: 130%;
    }
    .product-table02 {
        width: 100%;
        margin: 0 0 20px 0;
        border-collapse: collapse;
    }
    .product-table02 th {
        width: 35%;
        max-width: 180px;
        padding: 10px 10px 10px 0;
        font-size: 81.3%;
        line-height: 130%;
        text-align: left;
        vertical-align: top;
    }
    .product-table02 td {
        padding: 10px 0;
        font-size: 81.3%;
        line-height: 130%;
    }
    .product-table03 {
        margin: 0 0 20px 0;
        border-collapse: collapse;
    }
    .product-table03 th {
        width: 135px;
        padding: 9px 9px 9px 0;
        font-size: 81.3%;
        line-height: 130%;
        text-align: left;
        vertical-align: top;
    }
    .product-table03 td {
        padding: 9px 0;
        font-size: 81.3%;
        line-height: 150%;
    }
    .agency tr {
        display: block;
    }
    .agency th {
        width: auto !important;
        padding: 0;
        line-height: 100%;
        display: block;
    }
    .agency td {
        padding: 0;
    }
    .campaign-list {
        padding: 0 0 40px 0;
    }
    /************************************************
***   movie
************************************************/
    .special-navi {
        display: none;
    }
    .special-navi-sp {
        width: 100%;
        /*margin: -100% 0 0 0;*/
        /*padding: 5%;*/
        padding: 5% 0;
        position: absolute;
        background: #b7b9bd;
        z-index: 100;
        display: none;
    }
    .special-navi-sp.active {
        margin: -10% 0 0 0;
        display: block;
    }
    /*.android .special-navi-sp.active{
    margin: -100px 0 0 0;
}*/
    .special-navi-sp ul {
        margin: 0 0 0 2%;
    }
    .special-navi-sp ul li {
        width: 49%;
        line-height: 0;
        float: left;
    }
    .special-navi-sp ul li:nth-child(1) {
        border-right: 1px solid #dbd8dc;
        /*border-bottom: 1px solid #dbd8dc;*/
    }
    /*        .special-navi-sp ul li:nth-child(2){
            border-bottom: 1px solid #dbd8dc;
        }
        .special-navi-sp ul li:nth-child(3){
            border-right: 1px solid #dbd8dc;
        }*/
    .special-title-pv-cm {
        width: 18%;
        margin: 0 7% 20px 7%;
    }
    .special-title-twitter {
        width: 21%;
        margin: 0 7% 10% 7%;
    }
    .movie-list {
        margin: 0 7%;
        padding: 0 0 50px 0;
    }
    .movie-list li {
        width: 48%;
        margin: 0 4% 4% 0;
        float: left;
        position: relative;
    }
    .movie-list li:nth-child(2n) {
        margin: 0 0 4% 0;
    }
    .movie-list li a {
        display: block;
        text-decoration: none;
        color: #000;
    }
    .movie-list li .thumbnail {
        line-height: 0;
    }
    .movie-list li .thumbnail img {
        width: 100%
    }
    .movie-list li .caption {
        width: 100%;
        height: 80px;
        padding: 3%;
        background-color: #333;
    }
    .movie-list li .caption .sentence {
        font-size: 81.3%;
        line-height: 130%;
        color: #FFF;
    }
    /************************************************
***   rental
************************************************/
    #rental {
        width: 100%;
        max-width: 640px;
        margin: 0 auto;
        background: url(../images/pc/bg_space.png) no-repeat 50% 0;
        background-size: cover;
        background-attachment: fixed;
        /*overflow-x: hidden;*/
    }
    .rental-header {
        /*margin: 0 0 30px 0;*/
        padding: 10px 0 0 0;
        /*background: url(../images/sp/img_line.png) no-repeat 50% 100%;*/
    }
    .rental-header .inner {
        width: 87.5%;
        margin: 0 auto 4% auto;
    }
    .rental-header .inner h1 {
        width: 41%;
        float: left;
    }
    .rental-header .inner .title {
        width: 56%;
        padding: 3% 0 0 0;
        float: right;
    }
    #rental .line {
        margin: 0 0 7% 0;
        text-align: center;
    }
    #rental .contents-area {
        width: 87.5%;
        margin: 0 auto 3% auto;
    }
    #rental .contents-area .left {
        /*width: 20%;
        padding: 3% 0 0 0;*/
    }
    #rental .contents-area .left .text {
        margin: 0 0 7% 0;
    }
    #rental .contents-area .left .download-list li {
        margin: 0 0 7% 0;
    }
    #rental .contents-area .left .download-list li .model {
        padding: 5% 0 0 0;
        width: 23%;
        float: left;
    }
    #rental .contents-area .left .download-list li .btn {
        width: 67%;
        float: right;
    }
    #rental #index-footer {
        width: 100%;
        padding: 0 0 5% 0;
    }
    /************************************************
***   twitter
************************************************/
    .twitter-title {
        margin: 0 0 5px 0;
        padding: 0 7% 8px 7%;
        font-size: 135%;
        font-weight: bold;
        line-height: 120%;
        text-indent: -0.5em;
    }
    .twitter-text {
        padding: 0 7% 10% 7%;
        font-size: 100%;
        line-height: 130%;
    }
    .twitter-text a:hover {
        color: #5FC4FF;
    }
    .twitter-list {
        padding: 0 7%;
    }
    .twitter-list li {
        width: 24%;
        max-width: 128px;
        margin: 0 14% 10% 0;
        float: left;
    }
    .twitter-list li:nth-child(3n) {
        margin: 0 0 14% 0;
    }
    .twitter-asterisk {
        margin: 0 7%;
        padding: 0 0 10% 1em;
        font-size: 81.3%;
        line-height: 130%;
        text-indent: -1em;
    }
    /************************************************
***   next-pagenavi
************************************************/
    .next-pagenavi {
        padding: 0 0 30px 0;
        text-align: center;
        font-size: 87.5%;
    }
    .wp-pagenavi a,
    .wp-pagenavi span {
        padding: 2px 6px;
        border: none !important;
    }
    .wp-pagenavi a {
        color: #3F3F3F;
    }
    .wp-pagenavi span.current {
        /*    font-weight: lighter;*/
        color: #FFF;
        background-color: #000;
    }

    
    
    /************************************************
***   modal
************************************************/
.modal{
    width: 100%;
    height: 100%;
    max-width: 640px;
    background-color: rgba(0,0,0,0.95);
    position: fixed;
    z-index: 99999;
    top: 0;
    -webkit-animation-fill-mode:both;
        animation-fill-mode:both;
    -webkit-animation-duration:1s;
        animation-duration:1s;
    -webkit-animation-delay: 6.5s;
        animation-delay: 6.5s;
    -webkit-animation-name: fadeOut;
        animation-name: fadeOut;
}
@-webkit-keyframes fadeOut {
    0% { opacity: 1; }
    100% { opacity: 0; display: none;}
}
@keyframes fadeOut {
    0% { opacity: 1; }
    100% { opacity: 0; display: none;}
}
.modal .close{
    width: 80%;
    margin: 0 auto;
    text-align: center;
    position: absolute;
    top: 4%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: 0;
    right: 0;
    -webkit-animation-fill-mode:both;
        animation-fill-mode:both;
    -webkit-animation-duration:6s;
        animation-duration:6s;
    -webkit-animation-delay: 0.5s;
        animation-delay: 0.5s;
    -webkit-animation-name: fadeInOut;
        animation-name: fadeInOut;
    text-align: right;
}
@-webkit-keyframes fadeInOut {
    0% { opacity: 0; }
    20% { opacity: 1; }
    50% { opacity: 1; }
    70% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes fadeInOut {
    0% { opacity: 0; }
    20% { opacity: 1; }
    50% { opacity: 1; }
    70% { opacity: 1; }
    100% { opacity: 0; }
    }
    .modal .close img{
        width: 26px;
    }
.modal .image{
    width: 80%;
    margin: 0 auto;
    text-align: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: 0;
    right: 0;
    -webkit-animation-fill-mode:both;
        animation-fill-mode:both;
    -webkit-animation-duration:6s;
        animation-duration:6s;
    -webkit-animation-delay: 0.5s;
        animation-delay: 0.5s;
    -webkit-animation-name: fadeInOut;
        animation-name: fadeInOut;
}
@-webkit-keyframes fadeInOut {
    0% { opacity: 0; }
    20% { opacity: 1; }
    50% { opacity: 1; }
    70% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes fadeInOut {
    0% { opacity: 0; }
    20% { opacity: 1; }
    50% { opacity: 1; }
    70% { opacity: 1; }
    100% { opacity: 0; }
    }
    /************************************************
***   footer
************************************************/
    #index-footer {
        width: 100%;
        padding: 30px 0;
    }
    #contents-footer {
        width: 100%;
        padding: 4% 0;
        background-color: #b7b9bd;
    }
    footer .footer-contents {
        max-width: 640px;
        margin: 0 auto;
    }
    #index-footer .footer-contents .banner-list {
        margin: 0 0 30px 0;
        text-align: center;
    }
    #index-footer .footer-contents .banner-list li {
        width: 70%;
        margin: 0 auto 20px auto;
        text-align: center;
    }
    #index-footer .footer-contents .banner-list li:last-child {
        margin: 0 auto;
    }
    #index-footer .footer-contents .banner-list li img {
        /*width: 100%;*/
    }
    #index-footer .footer-contents .footer-bottom {}
    footer .footer-contents .company-logo {
        width: 30%;
        margin: 0 auto 15px auto;
    }
    #index-footer .footer-contents p {
        width: 75%;
        margin: 0 auto 15px auto;
        font-size: 68.8%;
        line-height: 130%;
        color: #CCC;
        text-align: center;
    }
    #contents-footer .footer-contents p {
        width: 75%;
        margin: 0 auto 15px auto;
        font-size: 68.8%;
        line-height: 130%;
        color: #000;
        text-align: center;
    }
    footer .footer-contents .twitter-icon {
        width: 6%;
        margin: 0 auto;
    }
}