@charset "utf-8";
/*----------------------------------------------

    コメットルシファー　アニメ公式サイト
    http://comet-lucifer.jp/

----------------------------------------------*/
@font-face {
font-family: Roboto-Thin;
src: url(../font/Roboto-Thin.ttf) format(”truetype”);
}
@media only screen and (min-width:641px) {
/*
    basic
----------------------------------------------*/
body{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    word-wrap : break-word;
    overflow-wrap : break-word;
}

*{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    zoom:1;
}
a{
    outline: none;
}
a:link,
a:visited { color: #08b5e0; text-decoration: none; }
a:hover,
a:focus,
a:active  { color: #9bbdc6; text-decoration: none;}

.none {
display: none;
}
.pc{
    display: block;
}
.pc2{
    display: inline;
}
.pc-inline{
    display: inline;
}
.sp{
    display: none;
}
.sp2{
    display: none !important;
}
.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
----------------------------------------------*/
#main-menu ul:after,
#main-section:after,
.twitter-ticker:after,
.tab-list:after,
.felia-list:after,
.news-list:after,
.news-list li:after,
.scene-list:after,
.products-list:after,
.products-list li:after,
.social-list-single:after,
.bonus-list:after,
.story-nav:after,
.product-list:after,
.single-bottom:after,
.controls-list:after,
#character-navi:after,
#mechanic-navi:after,
.character-list:after,
.mechanic-list:after,
.onair-list:after,
.other-list:after,
.clearfix:after {
    display    : block;
    clear      : both;
    content    : "";
}

#products .products-list li a:hover,
.products-top a:hover img,
.onair-image a:hover img,
#main-section .banner-area .banner-list li a:hover img{
    filter  : alpha(opacity=60);
    opacity : 0.6;
}

/************************************************
***   background
************************************************/
html,
body,
#index {
    height: 100%; /* min-heightに対応していないブラウザ用 */
}
body > #index {
  height: auto; /* 要素を超えた分の背景が伸びないブラウザ用 */
}

#index {
    min-height: 100%;
    background:url(../images/pc/bg_index.png) 50% 0 no-repeat,
    url(../images/pc/bg_index_bottom.png) 50% 0 repeat-y #FFF;
}
#news{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
#staff-cast{
    background:url(../images/pc/bg_staff.png) 50% 0 no-repeat #FFF;
}
#introduction{
    background:url(../images/pc/bg_introduction.png) 50% 0 no-repeat #FFF;
}
#story{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
#onair{
    height: 2190px;
    background:url(../images/pc/bg_onair.png) 50% -10px no-repeat #FFF;
    position: relative;
}
#movie{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
#view-of-gift{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.character-top{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.sogo{
    min-height: 100%;
    background:url(../images/pc/img_chara01_sogo.png) 50% 115px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.felia{
    min-height: 100%;
    background:
    url(../images/pc/img_chara02_felia.png) 50% 131px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.felia2{
    min-height: 100%;
    background:
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.felia-list{
    /*width: 980px;
    margin: 0 auto;*/
    position: absolute;
    top: 592px;
    left: 100px;
    z-index: 10000;
}
    .felia-list li{
        margin: 0 2px 0 0;
        line-height: 0;
        float: left;
    }
    .felia-list li a{
        width: 138px;
        height: 35px;
        padding: 5px;
        display: block;
    }
    .felia-list li:nth-child(1){
        background: url("../images/pc/tab_felia-childhood_on.png");
    }
    .felia-list li:nth-child(1) a{
        background: url("../images/pc/tab_felia-childhood_off.png");
    }
    .felia-list li:nth-child(1) a:hover{
        background: none;
    }
    .felia-list li:nth-child(1) a.current{
        background: url("../images/pc/tab_felia-childhood_on.png");
    }
    .felia-list li:nth-child(2){
        background: url("../images/pc/tab_felia-girlhood_on.png");
    }
    .felia-list li:nth-child(2) a{
        background: url("../images/pc/tab_felia-girlhood_off.png");
    }
    .felia-list li:nth-child(2) a:hover{
        background: none;
    }
    .felia-list li:nth-child(2) a.current{
        background: url("../images/pc/tab_felia-girlhood_on.png");
    }
    .felia-image{
        display: none;
    }
    #childhood{
        margin: -133px 0px 0px -240px;
        position: relative;
        z-index: 100;
    }
    #girlhood{
        margin: -133px 0px 0px -240px;
        position: relative;
        z-index: 100;
    }
    .felia .controls-list{
        position: absolute;
        top: 133px;
        z-index: 1000;
    }
    .felia2 .controls-list{
        position: absolute;
        top: 133px;
        z-index: 1000;
    }
.kaon{
    min-height: 100%;
    background:url(../images/pc/img_chara03_kaon.png) 50% 123px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.roman{
    min-height: 100%;
    background:url(../images/pc/img_chara04_roman.png) 50% 111px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.otto{
    min-height: 100%;
    background:url(../images/pc/img_chara05_otto.png) 50% 124px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.moura{
    min-height: 100%;
    background:url(../images/pc/img_chara06_moura.png) 50% 110px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.domon{
    min-height: 100%;
    background:url(../images/pc/img_chara07_domon.png) 50% 94px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.malvina{
    min-height: 100%;
    background:url(../images/pc/img_chara08_malvina.png) 50% 111px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.jude{
    min-height: 100%;
    background:url(../images/pc/img_chara09_jude.png) 50% 99px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.gus{
    min-height: 100%;
    background:url(../images/pc/img_chara10_gus.png) 50% 99px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.patrick{
    min-height: 100%;
    background:url(../images/pc/img_chara11_patrick.png) 50% 129px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.alfried{
    min-height: 100%;
    background:url(../images/pc/img_chara12_alfried.png) 50% 103px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.dudley{
    min-height: 100%;
    background:url(../images/pc/img_chara13_dudley.png) 50% 129px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.anatolia{
    min-height: 100%;
    background:url(../images/pc/img_chara14_anatolia.png) 50% 122px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.zoneboyle{
    min-height: 100%;
    background:url(../images/pc/img_chara15_zoneboyle.png) 50% 130px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
.ena{
    min-height: 100%;
    background:url(../images/pc/img_chara16_ena.png) 50% 135px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}

.mechanic-top{
    min-height: 100%;
    background:url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.guardian{
    min-height: 100%;
    background:url(../images/pc/img_mecha01_guardian.png) 50% 129px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.atlach-eques{
    min-height: 100%;
    background:url(../images/pc/img_mecha02_atlach-eques.png) 50% 123px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.atlach{
    min-height: 100%;
    background:url(../images/pc/img_mecha03_atlach.png) 50% 123px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.hanumat{
    min-height: 100%;
    background:url(../images/pc/img_mecha04_hanumat.png) 50% 122px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.atlach-faber{
    min-height: 100%;
    background:url(../images/pc/img_mecha05_atlach-faber.png) 50% 123px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.valovr7{
    min-height: 100%;
    background:url(../images/pc/img_mecha06_valovr7.png) 50% 123px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.efreet{
    min-height: 100%;
    background:url(../images/pc/img_mecha07_efreet.png) 50% 104px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.durga{
    min-height: 100%;
    background:url(../images/pc/img_mecha08_durga.png) 50% 132px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.guardian2{
    min-height: 100%;
    background:url(../images/pc/img_mecha09_guardian-type2.png) 50% 129px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.atlach-al{
    min-height: 100%;
    background:url(../images/pc/img_mecha10_atlach-al.png) 50% 123px no-repeat,
    url(../images/pc/bg_belt.png) 50% 220px no-repeat ,
    url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.black-guardian{
    min-height: 100%;
    background:url(../images/pc/img_mecha11_black-guardian.png) 50% 129px no-repeat,
        url(../images/pc/bg_belt02.png) 50% 220px no-repeat ,
        url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
.guardian3{
    min-height: 100%;
    background:url(../images/pc/img_mecha12_guardian-type3.png) 50% 129px no-repeat,
        url(../images/pc/bg_belt02.png) 50% 220px no-repeat ,
        url(../images/pc/bg_mechanic.png) 50% 0 repeat-y fixed #00c8ff;
}
#products{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}
#products-detail{
    min-height: 100%;
    background:url(../images/pc/bg_news.png) 50% 0 repeat-y fixed #00eabd;
}


/************************************************
***   header
************************************************/
header{
    width: 980px;
    margin: 0 auto;
    background-color: #000;
}
    #main-menu{
        margin: 0 0 20px 0;
        padding: 25px 45px 23px 45px;
    }
        #main-menu ul li{
            margin: 0 18px 0 0;
            float: left;
        }
        #main-menu ul li:nth-child(6),
        #main-menu ul li:nth-child(7){
            margin: 0 17px 0 0;
        }
        #main-menu ul li:last-child{
            margin: 0;
            float: right;
        }

.social-list{
    position: absolute;
    top: 80px;
    right: 0px;
}
    .social-list li{
        margin: 0 0 8px 0;
    }



/************************************************
***   #main-section
************************************************/
#main-section{
    width: 980px;
    margin: 0 auto 25px auto;
    position: relative;
}
    #main-section .logo-area{
        width: 740px;
        padding: 10px 0 0 0;
        float: left;
    }
        #main-section .logo-area h1{
            margin: 0 0 20px 0;
            line-height: 0;
        }
        #main-section .logo-area .onair-image{
            width: 190px;
            margin: 0 0 25px 0;
            line-height: 0;
        }
        #main-section .logo-area .movie-image{
            width: 190px;
            height: 106px;
            margin: 0 0 25px 0;
            line-height: 0;
        }
        #main-section .logo-area .movie-image img{
            width: 100%;
            height: 100%;
        }
        #main-section .logo-area .twitter-ticker{
            padding: 0 0 0 14px;
            background-color: #F1CF00;
        }

        #main-section .logo-area .twitter-ticker .left{
            float:left;
        }

        #main-section .logo-area .twitter-ticker .twitter-title{
            margin:0 20px 0 0;
            padding: 11px 0 0 0;
            float: left;
        }
        #main-section .logo-area .twitter-ticker .twitter-sentence{
            width: 620px;
            /*width: 850px;*/
            float: left;
        }
        #main-section .logo-area .twitter-ticker .timeline{
            font-size: 75%;
            /*float: left;*/
            overflow: hidden;
        }
        #main-section .logo-area .twitter-ticker .timeline a{
            padding: 0 10px 0px 0;
            color: #000;
            line-height: 32px;
            text-decoration: none;
            display: block;
        }
        #main-section .logo-area .twitter-ticker .timeline a:hover{
            opacity: 0.6;
            filter  : alpha(opacity=60);
        }
    #main-section .banner-area{
        width: 220px;
        position: absolute;
        top: 0;
        right: 0;
        /*float: right;*/
    }
    #main-section .banner-area .banner-list li{
        margin: 0 0 16px 0;
        line-height: 0;
        background-color: #FFF;
    }
    #main-section .banner-area .banner-list li:last-child{
        margin: 0;
    }
    #main-section .banner-area .banner-list li a:hover{
        opacity: 0.6;
        filter  : alpha(opacity=60);
    }



/************************************************
***   .tab-list
************************************************/
.tab-list{
    width: 980px;
    margin: 0 auto;
}
    .tab-list li{
        margin: 0 2px 0 0;
        line-height: 0;
        float: left;
    }
    .tab-list li a{
        width: 138px;
        height: 35px;
        padding: 5px;
        display: block;
    }
    .tab-list li:nth-child(4)
    {
        margin: 0 3px 0 0;
    }
    .tab-list li:last-child{
        margin: 0;
    }
    .tab-list li:nth-child(1){
        background: url("../images/pc/tab_all_on.png") no-repeat;
    }
    .tab-list li:nth-child(1) a{
        background: url("../images/pc/tab_all_off.png") no-repeat;
    }
    .tab-list li:nth-child(1) a:hover{
        background: none;
    }
    .tab-list li:nth-child(1) a.current{
        background: url("../images/pc/tab_all_on.png") no-repeat;
    }
    .tab-list li:nth-child(2){
        background: url("../images/pc/tab_news_on.png") no-repeat;
    }
    .tab-list li:nth-child(2) a{
        background: url("../images/pc/tab_news_off.png") no-repeat;
    }
    .tab-list li:nth-child(2) a:hover{
        background: none;
    }
    .tab-list li:nth-child(2) a.current{
        background: url("../images/pc/tab_news_on.png") no-repeat;
    }
    .tab-list li:nth-child(3){
        background: url("../images/pc/tab_bd-cd_on.png") no-repeat;
    }
    .tab-list li:nth-child(3) a{
        background: url("../images/pc/tab_bd-cd_off.png") no-repeat;
    }
    .tab-list li:nth-child(3) a:hover{
        background: none;
    }
    .tab-list li:nth-child(3) a.current{
        background: url("../images/pc/tab_bd-cd_on.png") no-repeat;
    }
    .tab-list li:nth-child(4){
        background: url("../images/pc/tab_figure_on.png") no-repeat;
    }
    .tab-list li:nth-child(4) a{
        background: url("../images/pc/tab_figure_off.png") no-repeat;
    }
    .tab-list li:nth-child(4) a:hover{
        background: none;
    }
    .tab-list li:nth-child(4) a.current{
        background: url("../images/pc/tab_figure_on.png") no-repeat;
    }
    .tab-list li:nth-child(5){
        background: url("../images/pc/tab_goods_on.png") no-repeat;
    }
    .tab-list li:nth-child(5) a{
        background: url("../images/pc/tab_goods_off.png") no-repeat;
    }
    .tab-list li:nth-child(5) a:hover{
        background: none;
    }
    .tab-list li:nth-child(5) a.current{
        background: url("../images/pc/tab_goods_on.png") no-repeat;
    }
    .tab-list li:nth-child(6){
        background: url("../images/pc/tab_mv_on.png") no-repeat;
    }
    .tab-list li:nth-child(6) a{
        background: url("../images/pc/tab_mv_off.png") no-repeat;
    }
    .tab-list li:nth-child(6) a:hover{
        background: none;
    }
    .tab-list li:nth-child(6) a.current{
        background: url("../images/pc/tab_mv_on.png") no-repeat;
    }
    .tab-list li:nth-child(7){
        background: url("../images/pc/tab_event_on.png") no-repeat;
    }
    .tab-list li:nth-child(7) a{
        background: url("../images/pc/tab_event_off.png") no-repeat;
    }
    .tab-list li:nth-child(7) a:hover{
        background: none;
    }
    .tab-list li:nth-child(7) a.current{
        background: url("../images/pc/tab_event_on.png") no-repeat;
    }

.more-btn{
    text-align: center;
}

/************************************************
***   #news-section
************************************************/
#news-section{
    width: 980px;
    margin: 0 auto 40px auto;
    padding: 55px 45px 20px 45px;
    background-color: #FFF;
}
    .news-list{
        display: none;
    }
    .event .news-list{
        display: block;
    }
        .news-list li{
            width: 220px;
            margin: 0 15px 0 0;
            float: left;
            position: relative;
        }
        #tab-all li:last-child{
            width: 100%;
            margin: 0;
            /*float: none;*/
            text-align: center;
        }
        .news-list li{
            width: 200px;
            margin: 0 30px 30px 0;
            float: left;
            position: relative;
        }
        .news-list li:nth-child(4n){
            margin: 0 0 30px 0;
        }
            .news-list li a{
                    display: block;
                    text-decoration: none;
                    color: #000;
                }
                .news-list li .thumbnail{
                    height: 150px;
                    line-height: 0;
/*                    border-top: 1px solid #000;
                    border-left: 1px solid #000;
                    border-right: 1px solid #000;*/
                }
                    .news-list li .thumbnail img{
                        /*width: 100%;*/
                    }
                .news-list li .caption{
                    width: 100%;
                    height: 100px;
                    padding: 12px;
                    background-color: #000;
                }
                    .news-list li .caption .date{
                        margin: 0 0 5px 0;
                        font-size: 68.8%;
                        color: #FFF;
                        font-family: Roboto-Thin;
                    }
                    .news-list li .caption .sentence{
                        margin: 0 0 5px 0;
                        font-size: 87.5%;
                        line-height: 130%;
                        color: #FFF;
                    }
            .news-list .new-icon{
                position: absolute;
                 top: -10px;
                 right: -18px;
            }
            .news-list .category{
                position: absolute;
                top: 0;
                left: 0;
            }




/************************************************
***   news
************************************************/
#news h1{
    display: none;
}
#news h2{
    width: 980px;
    margin: 50px auto 70px auto;
    padding: 0 0 0 45px;
    line-height: 0;
}
        #news .news-list li{
            width: 100%;
            margin: 0 0 50px 0;
            float: none;
            position: relative;
        }
        #news .news-list li:last-child{
            margin: 0 0 30px 0;
        }
            #news .news-list li a{
                    height: 150px;
                    display: block;
                    text-decoration: none;
                    color: #000;
                }
                #news .news-list li .thumbnail{
                    height: 150px;
                    line-height: 0;
                    float: left;
                    position: relative;
                }
            #news .news-list .new-icon{
                position: absolute;
                 top: -10px;
                 right: -10px;
            }
            #news .news-list .category{
                position: absolute;
                top: 0;
                left: 0;
            }
            #news .right-sentence{
                width: 670px;
                height: 150px;
                float: right;
                position: relative;
            }
            #news .right-sentence .title{
                margin: -2px 0 5px 0;
                font-size: 112.5%;
                font-weight: bold;
                line-height: 190%;
            }
            #news .right-sentence .title span{
                background-color: #00EABD;
            }
            #news .right-sentence .sentence{
                font-size: 75%;
                line-height: 200%;
            }
            #news .right-sentence .date-category{
                position: absolute;
                bottom: 0;
                left: 0;
            }
            #news .right-sentence .more-btn{
                position: absolute;
                bottom: 0;
                right: 0;
            }
                .date-category .date{
                    margin: 0 15px 0 0;
                    font-family: Roboto-Thin;
                    font-size: 62.5%;
                    float: left;
                }
                .date-category .category-name{
                    font-family: Roboto-Thin;
                    font-size: 62.5%;
                    float: left;
                }
                .date-category span{
                    font-weight: bold;
                }
                .wp-pagenavi {
                    margin: 20px 0 0 0 !important;
                    text-align:center !important;
                    font-family: Roboto-Thin !important;
                    font-weight: bold;
                }
                .wp-pagenavi span.pages{
                    display: none;
                }



/************************************************
***   news(detail)
************************************************/
#news-detail-section{
    width: 980px;
    margin: 0 auto 40px auto;
    padding: 55px 45px 45px 45px;
    background-color: #FFF;
}
    #news-detail-section h3{
        margin: 0 0 30px 0;
        font-size: 150%;
        font-weight: bold;
        line-height: 190%;
    }
        #news-detail-section h3 span{
            background-color: #00EABD;
        }
    #news-detail-section .thumbnail{
        margin: 0 0 25px 0;
        text-align: center;
    }
    #news-detail-section .sentence{
        font-size: 81.3%;
        line-height: 150%;
    }
    #news-detail-section .sentence iframe{
        margin: 0 0 15px 0;
    }
    #news-detail-section .sentence p{
        margin: 0 0 15px 0;
    }
    .date-category{
        margin: 40px 0 0 0;
        float: left;
    }
    .social-list-single{
        float: right;
    }
        .social-list-single li{
            margin: 0 0 0 15px;
            float: left;
            vertical-align: text-bottom;
        }
        .social-list-single li a:hover{
            opacity: 0.6;
            filter  : alpha(opacity=60);
        }
    .move-list{
        margin: 0 0 40px 0;
        text-align: center;
    }
    .move-list li{
        display: inline-block;
    }
    .move-list li +li{
        margin: 0 0 0 5px
    }
    .move-list li:hover{
        opacity: 0.6;
        filter  : alpha(opacity=60);
    }
    .no-rink{
        display: none;
    }



/************************************************
***   character
************************************************/
#character h1{
    display: none;
}
#character h2{
    width: 980px;
    margin: 50px auto 70px auto;
    padding: 0 0 0 45px;
    line-height: 0;
}
.character-list{
    width: 980px;
    margin: 0 auto 50px auto;
}
.character-list li{
    width: 215px;
    margin: 0 40px 40px 0;
    float: left;
}
.character-list li:nth-child(4n){
    margin: 0 0 40px 0;
}
.sogo .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .controls-list{
        width: 1080px;
        height: 460px;
        position: absolute;
    }
    .sogo .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        /*width: 47px;
        height: 173px;*/
        width: 48px;
        height: 57px;
    }
    .sogo .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 80px;
    }
.felia .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .felia .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 74px;
    }
    .felia .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 80px;
    }
.felia2 .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .felia2 .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 74px;
    }
    .felia2 .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 80px;
    }
.kaon .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .kaon .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 79px;
    }
    .kaon .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 100px;
    }
.roman .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .roman .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 78px;
    }
    .roman .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 70px;
    }
.otto .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .otto .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 100px;
    }
    .otto .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 98px;
    }
.moura .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .moura .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 70px;
    }
    .moura .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 108px;
    }
.domon .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .domon .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 98px;
    }
    .domon .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 120px;
    }
.malvina .character-image{
    width: 1080px;
    height: 1102px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .malvina .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 108px;
    }
    .malvina .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 76px;
    }
.jude .character-image{
    width: 1080px;
    height: 1214px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .jude .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 120px;
    }
    .jude .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 57px;
    }
.gus .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .gus .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 76px;
    }
    .gus .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 119px;
    }
.patrick .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .patrick .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 57px;
    }
    .patrick .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 46px;
        height: 121px;
    }
.alfried .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .alfried .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 119px;
    }
    .alfried .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        /*height: 74px;*/
        height: 117px;
    }
.dudley .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .dudley .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 120px;
    }
    .dudley .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 149px;
    }
.anatolia .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .anatolia .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 117px;
    }
    .anatolia .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 173px;
    }
.zoneboyle .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .zoneboyle .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 149px;
    }
    .zoneboyle .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 57px;
    }
.ena .character-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
    .ena .character-image .controls-list li:first-child{
        position: absolute;
        top: -100%;
        left: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 173px;
    }
    .ena .character-image .controls-list li:last-child{
        position: absolute;
        top: -100%;
        right: 0px;
        bottom: -100%;
        margin: auto;
        width: 47px;
        height: 74px;
    }

    #character-navi{
        margin: 0 0 0 100px;
        position: fixed;
        left: auto;
        bottom: -5px;
        z-index: 99999;
    }
        #character-navi li{
            margin: 0 10px 0 0;
            float: left;
        }
    #character footer{
        padding: 0 0 70px 0;
    }



/************************************************
***   mechanic
************************************************/
#mechanic h1{
    display: none;
}
#mechanic h2{
    width: 980px;
    margin: 50px auto 70px auto;
    padding: 0 0 0 45px;
    line-height: 0;
}
#mechanic .mechanic-list{
    width: 980px;
    margin: 0 auto 50px auto;
}
#mechanic .mechanic-list li{
    width: 215px;
    margin: 0 40px 40px 0;
    float: left;
}
#mechanic .mechanic-list li:nth-child(4n){
    margin: 0 0 40px 0;
}
.guardian .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.guardian .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 275px;
}
.guardian .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 218px;
}
.atlach-eques .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.atlach-eques .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 147px;
}
.atlach-eques .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 113px;
}
.atlach .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.atlach .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 218px;
}
.atlach .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 260px;
}
.hanumat .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.hanumat .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 113px;
}
.hanumat .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 211px;
}
.atlach-faber .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.atlach-faber .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 260px;
}
.atlach-faber .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 120px;
}
.valovr7 .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.valovr7 .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 211px;
}
.valovr7 .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 53px;
    height: 109px;
}
.efreet .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.efreet .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 121px;
}
.efreet .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 54px;
    height: 92px;
}
.durga .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.durga .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 109px;
}
.durga .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    /*height: 147px;*/
    height: 260px;
}
.guardian2 .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.guardian2 .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 93px;
}
.guardian2 .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 113px;
}
.atlach-al .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.atlach-al .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 260px;
}
.atlach-al .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 261px;
}
.black-guardian .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.black-guardian .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 113px;
}
.black-guardian .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;s
    width: 47px;
    height: 276px;
}
.guardian3 .mechanic-image{
    width: 1080px;
    height: 1160px;
    margin: 0 auto;
    line-height: 0;
    position: relative;
}
.guardian3 .mechanic-image .controls-list li:first-child{
    position: absolute;
    top: -100%;
    left: 0px;
    bottom: -100%;
    margin: auto;
    width: 46px;
    height: 262px;
}
.guardian3 .mechanic-image .controls-list li:last-child{
    position: absolute;
    top: -100%;
    right: 0px;
    bottom: -100%;
    margin: auto;
    width: 47px;
    height: 147px;
}

#mechanic-navi{
    margin: 0 0 0 100px;
    position: fixed;
    left: auto;
    bottom: -5px;
}
    #mechanic-navi li{
        margin: 0 10px 0 0;
        float: left;
    }
    #mechanic footer{
        padding: 0 0 70px 0;
    }



/************************************************
***   staff-cast
************************************************/
#staff-cast{
    padding: 0 0 35px 0;
}
    #staff-cast h1{
        display: none;
    }
    #staff-cast h2{
        width: 980px;
        margin: 50px auto 70px auto;
        padding: 0 0 0 45px;
        line-height: 0;
    }
    #staff-cast .staff-image{
        width: 980px;
        margin: 0 auto 450px auto;
        line-height: 0;
        text-align: center;
    }
#staff-cast footer{
    padding: 0;
    color: #FFF;
}



/************************************************
***   story(introduction)
************************************************/
#introduction{
    padding: 0 0 35px 0;
}
    #introduction h1{
        display: none;
    }
    #introduction h2{
        width: 980px;
        margin: 50px auto 70px auto;
        padding: 0 0 0 45px;
        line-height: 0;
    }
    #introduction .introduction-image{
        width: 980px;
        margin: 0 auto 40px auto;
        line-height: 0;
        text-align: center;
    }
    #introduction .return-btn{
        width: 128px;
        height: 25px;
        margin: 0 auto 580px auto;
        text-align: center;
        line-height: 0;
        background: #FFF;
    }
    #introduction .return-btn a:hover img{
        filter  : alpha(opacity=60);
        opacity : 0.6;
    }
#introduction footer{
    padding: 0;
}

#story h1{
    display: none;
}
#story h2{
    margin: 0 0 40px 0;
    line-height: 0;
}
#story h3{
    margin: 0 0 30px 0;
    font-size: 150%;
    font-weight: bold;
    line-height: 130%;
}
#story .products-contents {
    width: 980px;
    margin: -20px auto 40px auto;
    padding: 50px 45px 30px 45px;
    background: #FFF;
    position: relative;
}
#story .products-contents .introduction-btn{
    position: absolute;
    top: 40px;
    right: 50px;
}
.scene-list{
    margin: 0 0 15px 0;
}
.scene-list li{
    margin: 0 10px 0 0;
    float: left;
    line-height: 0;
}
.scene-list li:last-child{
    margin: 0;
    width: 285px;
}
.scene-list li:last-child img{
    margin: 0 0 11px 0;
}
#story .story-sentence{
    margin: 0 0 20px 0;
    font-size: 100%;
    font-weight: bold;
    line-height: 150%;
}
#story .staff-sentence{
    margin: 0 0 40px 0;
    font-size: 81.3%;
    line-height: 150%;
}
#story .story-nav li{
    margin: 0 22px 22px 0;
    float: left;
}
#story .story-nav li:nth-child(4n){
    margin: 0 0 22px 0;
}
#story footer{
    padding: 0;
}


/************************************************
***   onair
************************************************/
    #onair h1{
        display: none;
    }
    #onair h2{
        width: 980px;
        margin: 50px auto 70px auto;
        padding: 0 0 0 45px;
        line-height: 0;
    }
    .list-area{
        width: 820px;
        margin: 0 auto;
        text-align: center;
    }
    #onair .onair-list{
        /*width: 820px;
        margin: 0 auto;*/
        margin: 0 0 0 10px;
        display: table;
        table-layout: fixed;
        border-spacing: 10px 5px;
    }
    #onair .other-list{
        width: 780px;
        margin: 0 auto;
        /*margin: 0 0 0 10px;*/
        /*display: table;
        table-layout: fixed;
        border-spacing: 10px 5px;*/
    }
    #onair .other-list{
        width: 780px;
        margin: 0 auto;
        /*margin: 0 0 0 10px;*/
        /*display: table;
        table-layout: fixed;
        border-spacing: 10px 5px;*/
    }
    #onair .other-list li{
        width: 385px;
        margin: 0 10px 10px 0;
        float: left;
        padding: 0 5px;
        font-family: '游ゴシック', 'Yu Gothic';
        font-size: 112.5%;
        font-weight: bold;
        line-height: 130%;
        text-align: center;
        background: #01eabd;
    }
    #onair .other-list li:nth-child(2n){
        margin: 0 0 10px 0;
    }
        #onair .onair-list a,
        #onair .onair-other a,
        #onair .other-list a{
            display: block;
            color: #000;
            text-decoration: underline;
        }
        #onair .onair-list a:hover,
        #onair .onair-other a:hover,
        #onair .other-list a:hover{
            color: #FFF;
        }
        #onair .onair-list dt,
        #onair .other-list dt{
            width: 290px;
            margin: 0 10px 10px 0;
            padding: 0 5px;
            font-family: '游ゴシック', 'Yu Gothic';
            font-size: 112.5%;
            font-weight: bold;
            line-height: 130%;
            text-align: center;
            background: #01eabd;
            display: table-cell;
            vertical-align: middle;
            /*clear: both;
            float: left;*/
        }
        #onair .onair-list dd,
        #onair .other-list dd{
            width: 520px;
            padding: 0 5px;
            text-align: center;
            font-family: '游ゴシック', 'Yu Gothic';
            font-size: 112.5%;
            font-weight: bold;
            line-height: 130%;
            background: #01eabd;
            display: table-cell;
            vertical-align: middle;
            /*float: left;*/
        }
        .onair-other{
            width: 780px;
            margin: 5px auto 0 auto;
            padding: 0 5px;
            text-align: center;
            font-family: '游ゴシック', 'Yu Gothic';
            font-size: 112.5%;
            font-weight: bold;
            line-height: 130%;
            background: #01eabd;
            display: table;
            table-layout: fixed;
            border-spacing: 15px 5px;
        }
        .caution{
            margin: 10px 0 20px 0;
            font-size: 75%;
            text-align: center;
        }
#onair .onair-table{
    width: 800px;
    margin: 0 auto;
    border-spacing: 10px;
    border-collapse: separate;
}
#onair .onair-table th{
    width: 32%;
    margin: 0 3% 0 0;
    padding: 1px 5px;
    font-family: '游ゴシック', 'Yu Gothic';
    font-size: 112.5%;
    font-weight: bold;
    line-height: 130%;
    text-align: center;
    background: #01eabd;
    vertical-align: middle;
}
#onair .onair-table td{
    width: 65%;
    margin: 0 0 3% 0;
    padding: 1px 5px;
    text-align: center;
    font-family: '游ゴシック', 'Yu Gothic';
    font-size: 112.5%;
    font-weight: bold;
    line-height: 130%;
    background: #01eabd;
    vertical-align: middle;
}
#onair .onair-table a{
    display: block;
    color: #000;
    text-decoration: underline;
}
#onair .onair-table a:hover{
    color: #FFF;
    text-decoration: underline;
}
#onair .other-table{
    width: 800px;
    margin: 0 auto 20px auto;
    border-spacing: 10px;
    border-collapse: separate;
}
#onair .other-table td{
    width: 50%;
    margin: 0 0 3% 0;
    padding: 1px 5px;
    text-align: center;
    font-family: '游ゴシック', 'Yu Gothic';
    font-size: 112.5%;
    font-weight: bold;
    line-height: 130%;
    background: #01eabd;
    vertical-align: middle;
}
#onair .other-table a{
    display: block;
    color: #000;
    text-decoration: underline;
}
#onair .other-table a:hover{
    color: #FFF;
    text-decoration: underline;
}

#onair footer{
    width: 100%;
    padding: 0;
    color: #FFF;
    position: absolute;
    bottom: 35px;
}



/************************************************
***   movie
************************************************/
#movie #main-menu{
    margin: 0;
}
    #movie h1{
        display: none;
    }
    #movie h2{
        margin: 0 0 40px 0;
        line-height: 0;
    }
    #movie .movie-contents{
        width: 980px;
        margin: 0 auto 40px auto;
        padding: 50px 45px;
        background: #FFF;
    }
    #movie .movie-list{
        margin: 0 0 30px 0;
    }
    #movie .movie-list:last-child{
        margin: 0;
    }
        #movie .movie-list dt{
            margin: 0 0 20px 0;
            font-family: '游ゴシック', 'Yu Gothic';
            font-size: 112.5%;
            font-weight: bold;
            line-height: 130%;
        }
        #movie .movie-list dt span{
            font-weight: lighter;
            background: #01eabd;
        }
        #movie .movie-list dd iframe{
            width: 100%;
            height: 500px;
        }
    #movie h3{
        margin: 0 0 10px 0;
        font-size: 112.5%;
        font-weight: bold;
        line-height: 130%;
    }
    #movie .sentence {
        margin: 0 0 20px 0;
        font-size: 87.5%;
        line-height: 150%;
    }
    #movie .sentence02 {
        margin: 0 0 40px 0;
        font-size: 87.5%;
        line-height: 200%;
    }



/************************************************
***   products
************************************************/
#products #main-menu{
    margin: 0;
}
    #products h1{
        display: none;
    }
    #products h2{
        margin: 0 0 40px 0;
        line-height: 0;
    }
    #products h3{
        margin: 0 0 30px 0;
        line-height: 0;
    }
    .products{
        margin: 0 0 80px 0;
    }
    .products:last-child{
        margin: 0;
    }
    #products .products-contents{
        width: 980px;
        margin: 0 auto 40px auto;
        padding: 50px 45px 30px 45px;
        background: #FFF;
    }
    #products .products-list li{
        width: 435px;
        height: 145px;
        margin: 0 20px 20px 0;
        float: left;
    }
    #products .products-list li:nth-child(2n){
        margin: 0 0 20px 0;
    }
        #products .products-list li a{
                display: block;
                text-decoration: none;
                color: #000;
            }
            #products .products-list li .thumbnail{
                width: 200px;
                height: 145px;
                line-height: 0;
                float: left;
                overflow: hidden;
            }
        #products .right-sentence{
            width: 235px;
            height: 145px;
            padding: 20px 15px 15px 15px;
            float: right;
            color: #FFF;
            background: #000;
        }
        #products .decoration-sentence {
            margin: 0 0 5px 0;
            font-family: Roboto-Thin;
            font-size: 62.5%;
            color: #00e19b;
        }
        #products .title{
            padding: 0 0 5px 0;
            font-size: 87.5%;
            line-height: 210%;

        }
        #products .title span{
            padding: 0 0 6px 0;
            border-bottom: 1px dashed #FFF;
        }



/************************************************
***   products-detail
************************************************/
#products-detail #main-menu{
    margin: 0;
}
    #products-detail h1{
        display: none;
    }
    #products-detail h2{
        margin: 0 0 40px 0;
        line-height: 0;
    }
    #products-detail h3{
        margin: 0 0 30px 0;
        line-height: 0;
    }
    .products-detail{
        margin: 0 0 45px 0;
    }
    #products-detail .products-contents{
        width: 980px;
        margin: 0 auto 40px auto;
        padding: 50px 45px;
        background: #FFF;
        position: relative;
    }
    #products-detail .products-contents .title {
        /*width: 460px;*/
        margin: 0 0 30px 0;
        font-size: 150%;
        font-weight: bold;
        line-height: 190%;
        /*float: left;*/
    }
    #products-detail .products-contents .title span {
        background-color: #00EABD;
    }
    #products-detail .products-contents .left{
        /*width: 460px;
        float: left;*/
    }
    #products-detail .products-contents .left .sentence{
        margin: 0 0 30px 0;
        font-size: 81.3%;
        line-height: 150%;
        /*float: left;*/
        /*width: 460px;*/
    }
    #products-detail .products-contents .left .sentence a:hover{
        filter  : alpha(opacity=60);
        opacity : 0.6;
    }
    #products-detail .products-contents .left .sentence p{
        margin: 0 0 30px 0;
    }
    #products-detail .products-contents .left .sentence p:last-child{
        /*margin: 0;*/
    }
    #products-detail .products-contents .left .sentence .item-detail{
        font-size: 106.3%;
        line-height: 180%;
    }
    #products-detail .products-contents .left .sentence .item-detail .bg-strong{
        margin: 0 0 0 1em;
        background: #FBFB84;
    }
    #products-detail .products-contents .left h5{
        margin: 0 0 5px 0;
        font-size: 125%;
        font-weight: bold;
    }
    #products-detail .products-contents .left .bonus-list li{
        width: 49%;
        margin: 0 0 30px 0;
        float: left;
        font-size: 106.3%;
        line-height: 180%;
    }
    #products-detail .products-contents .left .bonus-list li p{
        margin: 0 0 10px 0;
    }
    #products-detail .products-contents .left .bonus-list li:nth-child(2n){
        float: right;
    }
    #products-detail .products-contents .left .bonus-list2 li{
        font-size: 106.3%;
        line-height: 180%;
    }
    #products-detail .products-contents .left .product-list li{
        width: 400px;
        margin: 0 0 20px 0;
        float: left;
        font-size: 106.3%;
        line-height: 180%;
    }
    #products-detail .products-contents .left .product-list li p{
        margin: 0 0 10px 0;
    }
    #products-detail .products-contents .left .product-list li:nth-child(2n){
        float: right;
        text-align: right;
    }
    #products-detail .products-contents .left .product-list li:nth-child(2n) p{
        text-align: left;
    }
    #products-detail .products-contents .thumbnail{
        width: 400px;
        margin: 0 0 20px 30px;
        float: right;
    }
        #products-detail .products-contents .thumbnail img{
            width: 100%;
            height: auto;
        }
        #products-detail .products-top{
            position: absolute;
            right: 45px;
            top: 50px;
        }
    #products-detail span.strong{
        font-weight: bold;
        color: #ff0000;
    }
    #products-detail h5.event{
        color: #00C8FF;
    }
    #products-detail h5.ticket{
        color: #E36C0A;
    }




/************************************************
***   view-of-gift
************************************************/
#view-of-gift h1{
    display: none;
}
#view-of-gift h2{
    margin: 0 0 40px 0;
    line-height: 0;
}
#view-of-gift h3{
    margin: 0 0 20px 0;
    font-size: 112.5%;
    font-weight: bold;
    line-height: 130%;
}
#view-of-gift .view-contents {
    width: 980px;
    margin: -20px auto 40px auto;
    padding: 50px 45px 30px 45px;
    background: #FFF;
    position: relative;
}
#view-of-gift .flash-list{
    margin: 0 0 35px 0;
    overflow: hidden;
}
#view-of-gift .flash-list li{
    width: 435px;
    margin: 20px 0 0 20px;
    float: left;
}
#view-of-gift .flash-list li:nth-child(2n-1){
    margin: 20px 0 0 0;
}
#view-of-gift .flash-list li:nth-child(1){
    margin:0;
}
#view-of-gift .flash-list li:nth-child(2){
    margin: 0 0 0 20px;
}
#view-of-gift iframe{
    width: 100%;
}

#view-of-gift .qa-list{
    margin: 0 0 20px 0;
}
#view-of-gift .qa-list:last-child{
    margin: 0 0 35px 0;
}
#view-of-gift .qa-list dt{
    margin: 0 0 10px 0;
    padding: 0 0 0 2.4em;
    text-indent: -2.3em;
    font-size: 87.5%;
    line-height: 150%;
}
#view-of-gift .qa-list dt:before{
    margin: 0 1em 0 0;
    content: "Q.";
    font-size: 112.5%;
    font-weight: bold;
    color:#1458ab;
}
#view-of-gift .qa-list dd{
    margin: 0 0 20px 0;
    padding: 0 0 0 2.4em;
    text-indent: -2.3em;
    font-size: 87.5%;
    line-height: 150%;
}
#view-of-gift .qa-list dd:before{
    margin: 0 1em 0 0;
    content: "A.";
    font-size: 112.5%;
    font-weight: bold;
    color:#ff0000;
}
#view-of-gift dl.last{
    margin: 0 0 35px 0;
}
#view-of-gift .live-list{
    margin: 0 0 20px 0;
    overflow: hidden;
}
#view-of-gift .live-list li{
    width: 205px;
    margin: 20px 0 0 20px;
    float: left;
    position: relative;
}
#view-of-gift .live-list li img{
    vertical-align: text-bottom;
}
#view-of-gift .live-list li a{
    /*width: 205px;
    height:145px;
    position: absolute;*/
    display: block;
}
#view-of-gift .live-list li a:hover img{
    filter  : alpha(opacity=60);
    opacity : 0.6;
}
#view-of-gift .live-list li:nth-child(4n+1){
    margin: 20px 0 0 0;
}
#view-of-gift .live-list li:nth-child(1){
    margin:0;
}
#view-of-gift .live-list li:nth-child(2),
#view-of-gift .live-list li:nth-child(3),
#view-of-gift .live-list li:nth-child(4)
{
    margin: 0 0 0 20px;
}



/************************************************
***   footer
************************************************/
.to-top{
    bottom: 50px;
    right: 0;
    position: fixed;
}
footer{
    width: 980px;
    margin: 0 auto;
    padding: 0 0 35px 0;
    text-align: center;
    font-size: 62.5%;
    line-height: 200%;
}


}