@import url(https://fonts.googleapis.com/css?family=Belleza);
/*--------------------------------------------
トップ
----------------------------------------------*/
.topImg{
    position:relative;
}
.topImg a{
    width:30%;
    position:absolute;
    bottom:1%;
    right:0;
    background-color:#fff;
}
.topImg a img{
    width:100%;
    box-sizing:border-box;
    border:#cfbe8d 3px solid;

}
#news{
    width:94%;
    margin:0 auto 5px;
    border:#cfbe8d 1px solid;
    border-left:#cfbe8d 4px solid;
    box-sizing:border-box;
    background-color:#fff;
}

#news h1{
    line-height:22px;
    font-family: 'Belleza', sans-serif;
    font-weight:100;
    font-size:24px;
    box-sizing:border-box;
    border-bottom:#cfbe8d 1px solid;
}

#news .box{
    
    width:100%;
    height:200px;
    overflow:auto;
    font-size:12px;
    background-color:#fff;
    box-sizing:border-box;
    padding:1%;
}

#news dl{
    border-bottom:#7a5959 1px dashed;
    line-height:1.5;
    margin:0;
    padding:5px 0;
}

#news dt{
    font-weight:bold;

}
#news dd{
    margin-left:1em;
}



#twitter{
    width:94%;
    
    margin:0 auto;
    border:#cfbe8d 1px solid;
    border-left:#cfbe8d 4px solid;
    box-sizing:border-box;
    background-color:#fff;
}
#twitter .box{
    width:100%;
    height:250px;
    box-sizing:border-box;
    padding-left:1%;
}
#twitter h1{
    line-height:22px;
    font-family: 'Belleza', sans-serif;
    font-weight:100;
    font-size:24px;
    box-sizing:border-box;
    border-bottom:#cfbe8d 1px solid;

}
#twitter .widget{
   width: 100%;
   height:250px;
   box-sizing:border-box;
}

#twitter .timelineBox{
    height:250px;
    box-sizing:border-box;
}
#twitter iframe { 
    width:100%; height:250px; 
}

#twitter .twitter-timeline{
   width: 100%;
   height:250px;
    max-height:250px;
}

.mobileBox{
    display:none;
}
#movie{
    width:47%;
    margin:5px 1%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}

#movie_smp{
    display:none;
}
#movie #movie_pc a img{
    display:block;
   
}
#movie #movie_pc a{
    /*background-color:#323d55;*/
    display:block;
}
#movie #movie_pc a:hover{
    /*background-color:#6d1616;*/
}

#pickup{
    width:49%;
    margin:5px 1%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}


#movie h1,#pickup h1{
    line-height:22px;
    font-family: 'Belleza', sans-serif;
    font-weight:100;
    font-size:24px;
    box-sizing:border-box;
}

#movie h1:before,#pickup h1:before{
    content:url(../img/h2_icon.jpg);
}

#movie img,#pickup img{
    width:100%;
    max-width:545px;
    border:#cfbe8d 3px solid;
    box-sizing:border-box;
    margin-bottom:5px;
}

#staff{
    text-align:center;
    font-size:24px;
    color:#cfbe8d;
    font-weight:bold;
    padding:50px 0;
    line-height:2em;
}

/*--------------------------------------------
ストーリー
----------------------------------------------*/
#story{
    padding:50px 0 200px;
    text-align:center;
    font-size:18px;
    line-height:2em;
    text-shadow:0 0 5px #ccc09d;
    background-color:#fff;
    font-family: "ヒラギノ明朝 Pro W6","Hiragino Mincho Pro","HGS明朝E","ＭＳ Ｐ明朝",serif;
}

#story #secondContents{
    background-image:none;
}



#story .main h1{
    line-height:62px;
    background-image:none;
    
    font-weight:100;
    font-size:62px;
    text-align:center;
    border:0;
    box-sizing:border-box;
    margin-bottom:84px;
    color:#cfbe8d;
    text-align:center;
    font-family: 'Belleza', sans-serif;
}
#story .main h1:before{
    content:none;
}
#story p{
    padding-bottom:100px;
}

#story .storyBox img{
    width:90%;
    max-width:870px;
}
.largeTxt{
    font-size:30px;
}
#story strong{
    font-size:24px;
}
/*--------------------------------------------
キャラクター
----------------------------------------------*/
#chara{
    min-height:800px;
    
}
#chara #subNavi .btBox a{
    /*width:100%;*/
    width:80px;
    margin:2px 3px;
   
    /*margin:0px 3px;*/
    box-sizing:border-box;
    position:relative;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    border:#cfbe8d 3px solid;
}

#chara #subNavi .btBox a:hover{
   border:#e9e5d9 3px solid;
}

#chara #subNavi .btBox a.selected{
    /*border:#adc8eb 3px solid;*/
    /*border:#efb9c7 3px solid;*/
    border:#ecbf8a 3px solid;
}

#soukanzu{ 
text-align:center;
padding-bottom:20px;
}
#soukanzu img{
    width:98%;
    max-width:1000px;
}

.charaBox{
    text-align:right;
    background-repeat:no-repeat;
    background-position:left top;
    background-size:100% auto;
    position:relative;
    padding:20px 0;

}

.charaBox .over{
    width:65%;
    position:absolute;
    top:36%;
    text-align:left;
    padding:10px 2%;
}
.charaBox .over .prof{
    border-left:#cfbe8d 4px solid;
    padding:5px;
    box-sizing:border-box;
    text-shadow: 1px 1px 5px #fff,
    -1px 1px 5px #fff,
    1px -1px 5px #fff,
    -1px -1px 5px #fff;


}
.charaBox .over dl.prof dt{
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}
.charaBox .over dl.prof dd{
    margin:0;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}
/*.charaBox .over2{
    width:65%;
    position:absolute;
    top:80%;
    text-align:left;
    padding:10px 2%;
}
*/
.charaBox .over p{
    padding:5px;
    margin:5px 0;
    text-shadow: 1px 1px 5px #fff,
    -1px 1px 5px #fff,
    1px -1px 5px #fff,
    -1px -1px 5px #fff;
}
.charaBox .cdBox{
    width:75%;
    text-align:left;
    box-sizing:border-box;
    border:#cfbe8d 1px solid;
    border-left:#cfbe8d 4px solid;
    padding:5px 1%;
    background-image:url(../img/bg_white.png);
}
.charaBox .cdBox img{
    width:35%;
    border:#cfbe8d 2px solid;
    box-sizing:border-box;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}
.charaBox .cdBox .txt{
    width:65%;
    padding:3px 1%;
    box-sizing:border-box;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    font-family: 'Belleza', sans-serif;
    font-size:16px;
}




.charaBox .cdBox .cast{
    box-sizing:border-box;
    font-weight:100;
    padding:5px 1%;
    font-size:16px;
    color:#fff;
}

.charaBox .cdBox .name{
    font-size:24px;
}
.charaBox .cdBox a{
    width:100%;
    box-sizing:border-box;
    margin-top:3px;
    display:block;
    padding:2px 1%;
    text-align:right;
    font-size:13px;
    border-top:#6D5A4B 1px dashed; 
    font-family: "メイリオ",Meiryo,"ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;

}

img.stand{
    width:60%;
    max-width:698px;
}

.sampleVoice{
    width:50%;
    margin:0 0 10px;
}
.sampleVoice li{
    width:21.7%;
    max-width:52px;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    
    cursor:pointer;
    margin-right:0.3%;
    
    position:relative;
    box-sizing:border-box;
    background-color:#cfbe8d;
}
.sampleVoice li img{
    width:100%;
    display:block;
}
.sampleVoice img.title{
     width:34%;
     max-width:81px;
     vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}
.sampleVoice li.selected{
    background-color:#f6bdbd;
}

.sampleVoice li.playBT .new{
    color:#fff;
    background-color:#b43e57;
    padding:0px 3px 2px;
    font-size:12px;
    font-weight:bold;
    
    position:absolute;
    top:0;
    left:0;
    line-height:1;
    font-weight:100;
    font-family: 'Belleza', sans-serif;
}


#chara #vol_1{
    background-image:url(../chara/img/name_vol_1.png);
}

#chara #vol_2{
    background-image:url(../chara/img/name_vol_2.png);
}

#chara #vol_3{
    background-image:url(../chara/img/name_vol_3.png);
}

#chara #vol_4{
    background-image:url(../chara/img/name_vol_4.png);
}

#chara #vol_5{
    background-image:url(../chara/img/name_vol_5.png);
}

#chara #vol_6{
    background-image:url(../chara/img/name_vol_6.png);
}

/*--------------------------------------------
CDINFO
----------------------------------------------*/
#cdinfo{
    padding-bottom:100px;
    min-height:800px;
}
#cdinfo #subNavi{
    width:96%;
    margin:0 auto;
}
#cdinfo #subNavi .btBox a{
    /*width:100%;*/
    /*width:130px;*/
   /* margin:2px 3px;*/
    margin:2px 0.5%;
    box-sizing:border-box;
    position:relative;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    border:#cfbe8d 3px solid;
    /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    background-color:#cfbe8d;
    color:#46423c;
}
#cdinfo #subNavi .btBox a .txt{
    width:130px;
    height:70px;
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    font-weight:bold;
    
}


#cdinfo #subNavi .btBox a:hover{
    color:#46423c;
     background-color:#f5f2e8;
   /* border:#f5f2e8 3px solid;*/
}

#cdinfo #subNavi .btBox a.selected{
    background-color:#f5f2e8;
    background-image:url(../img/second/navi_bg.jpg);
}
#scheduleBox h1 .box{
    margin:0 auto;
}

#scheduleBox .box{
    width:96%;
    margin:0 auto 30px;
}
#scheduleBox a{
    width:49%;
    max-width:545px;
    margin:5px 0.5%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}
#scheduleBox a img{
    width:100%;
    box-sizing:border-box;
    border:#d2c293 2px solid;

}

#productBox{
    width:96%;
    margin:0 auto 30px;

}
#productBox .floatBox{
    width:49%;
    margin:0 0.5%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}
#productBox .floatBox img{
    width:100%;
    box-sizing:border-box;
}
#productBox .floatBox img.corner{
    /* 角丸 */
	border-radius:20px; 
	-webkit-border-radius: 20px; 
	-moz-border-radius: 20px;
    border:#ffc0d5 3px solid;

}

#productBox img.jacket{
    max-width:500px;
    box-sizing:border-box;
    border:#cfbe8d 4px solid;
}


#productBox h2{
    width:100%;
    margin:0;
    padding:30px 0 0;
    font-size:18px;
    color:#484848;
}

#productBox h2 .volBox{
    width:68px;
    margin:2px 1%;
    margin-left:0;
    padding:0px;
    display:inline-block;
    vertical-align:top;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    position:relative;
    box-sizing:border-box;
    font-size:36px;
    
    text-align:center;
    color:#fff;
    background-color:#cfbe8d;
    font-weight:100;
    font-family: 'Belleza', sans-serif;
}

#productBox h2 .volBox:after{
    padding-top:100%;
    display:block;
    content:"";
}
#productBox h2 .volBox .volNum{
   position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    padding-top:37%;
    font-weight:bold;
}

#productBox h2 .cdTxt{
    width:165px;
    height:70px;
    font-weight:100;
    font-family: 'Belleza', sans-serif;
    position:relative;

    font-size:22px;
    margin-right:10px;
    text-align:right;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}
#productBox h2 .cdTxt .box{
     widows:100%;
    position:absolute;
    bottom:5px;
    
}
#productBox h2 .charaName .box{
     widows:100%;
    position:absolute;
    bottom:14px;
}

#productBox h2 .charaName{
    width:45%;
    min-width:4em;
    height:70px;
    font-size:50px;
    font-weight:100;
    position:relative;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}

#productBox h2 .cast{
    box-sizing:border-box;
    font-weight:100;
    padding:5px 1%;
    font-size:18px;
    color:#fff;
}


#productBox .floatBox .txt{
    width:100%;
    box-sizing:border-box;
    margin-top:5px;
    padding:1% 2%;
    font-size:14px;

}

#productBox .floatBox .txt dl{
    margin:0;
    padding:0;
}
#productBox .floatBox .txt dt{
    width:6em;
    line-height:1.8;
    font-size:13px;
    font-weight:bold;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}
#productBox .floatBox .txt h2{
    font-size:14px;
}


#productBox .floatBox .txt dd{
    line-height:1.8;
    margin:0;
    font-size:13px;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}

#productBox .trackList ul{
    box-sizing:border-box;
    padding:10px 0;
}
#productBox .trackList{
    width:45%;
    margin:10px 0.5% 0;
    padding:5px 1%;
    box-sizing:border-box;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
        /* 角丸 */
	/*border-radius:6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    border:#cfbe8d 1px solid;*/


}
#productBox .story{
    width:53%;
    margin:10px 0.5% 0;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    padding:5px 1%;
    box-sizing:border-box;
    /* 角丸 */
	/*border-radius:6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    border:#cfbe8d 1px solid;*/
}
#productBox .story a{
    padding:10px 2%;
    background-color:#cfbe8d;
    display:inline-block;
	border-radius:6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    border:#cfbe8d 1px solid;
    font-weight:bold;
    color:#fff;
    margin-top:5px;
    position:relative;
    
}
#productBox .story a:hover{
    background-color:#ded4b9;
}

#productBox .story a .new{
    color:#fff;
    background-color:#b43e57;
    padding:0px 3px 2px;
    font-size:12px;
    font-weight:bold;
    
   /* position:absolute;
    top:0;
    left:0;*/
    line-height:12px;
    font-weight:100;
    font-family: 'Belleza', sans-serif;
}


#productBox h3{
    line-height:22px;
    font-family: 'Belleza', sans-serif;
    font-weight:100;
    font-size:24px;
    box-sizing:border-box;
    border-bottom:#cfbe8d 1px solid;
}

#productBox h3:before{
    content:url(../img/h2_icon.jpg);
}

/*特典関係*/
.bonusSet{
    margin-top:30px;
}

.bonusWrap{
    display:table;
    width:98%;
    margin:0 auto;
    border-collapse:separate;
    border-spacing:10px 3px;
}

.bonusBox{
    display:table-cell;
    width:50%;
    padding:1px 1px 5px;
    overflow: hidden;
    background-color:#fff;
    border:#cfbe8d 3px solid;
    box-sizing:border-box;

}
.bonusBox.non{
    border:0;
    background-color:transparent;
}


.bonusBox img{
    width:98%;
    box-sizing:border-box;
    display:block;
    margin:5px auto;
    border:#cfbe8d 1px solid;

}

.bonusBox .cast{
    border-top:#918172 1px dashed;
    font-size:14px;
    box-sizing:border-box;
    padding:0 1% 5px;
    line-height:1.5em;
}

.bonusBox h2{
    width:98%;
    font-size:17px;
    margin:0 auto;
    color:#363530;
    line-height:30px;
    box-sizing:border-box;
    padding:6px 1% 0;
    border-bottom:#cfbe8d 2px solid;
}
.bonusBox h2 .icon{
    color:#d4c59b;
}

.bonusBox h3{
    margin:0 0 10px;
    font-size:16px;
    line-height:1.3em;
}

.bonusBox h4{
    color:#c5b27d;
    margin:15px 0 5px;
}
.bonusBox .txt{
    padding:1% 3%;
    box-sizing:border-box;

    text-align:left;
    font-size:14px;
    font-weight:100;
    line-height:1.1em;
}
.bonusBox .small{
    padding-top:5px;
    border-top:#666 3px double;
    font-size:12px;
}

/*----------------------------------------
キャラ色分け
----------------------------*/
/*文字色*/
#cdinfo #vol_1 dt,#vol_1 .color{color:#2592a9;}

#cdinfo #vol_2 dt,#vol_2 .color{color:#655584;}

#cdinfo #vol_3 dt,#vol_3 .color{color:#ee5196;}

#cdinfo #vol_4 dt,#vol_4 .color{color:#e27f17;}

#cdinfo #vol_5 dt,#vol_5 .color{color:#868690;}

#cdinfo #vol_6 dt,#vol_6 .color{color:#9fbb4c;}


.castName{
    color:#fff;
}
/*背景色*/
#vol_1 .cast{background-color:#2592a9;}

#vol_2 .cast{background-color:#655584;}

#vol_3 .cast{background-color:#ee5196;}

#vol_4 .cast{background-color:#e27f17;}

#vol_5 .cast{background-color:#868690;}

#vol_6 .cast{background-color:#9fbb4c;}


/*--------------------------------------------
スペシャル
----------------------------------------------*/
#special{
    padding:0px 0 200px;
    text-shadow:0 0 5px #ffe6af;
    min-height:800px;
}


#special #subNavi{
    /*width:960px;
    text-align:center;*/
}
#special #subNavi .btBox a{
    /*width:100%;*/
    width:120px;
    margin:2px 3px;
    box-sizing:border-box;
    position:relative;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    border:#cfbe8d 3px solid;
    /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    background-color:#cfbe8d;
    color:#46423c;
}
#special #subNavi .btBox a .txt{
    width:120px;
    height:70px;
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    font-weight:bold;
    
}


#special #subNavi .btBox a:hover{
    color:#46423c;
     background-color:#f5f2e8;
   /* border:#f5f2e8 3px solid;*/
}

#special #subNavi .btBox a.selected{
    background-color:#f5f2e8;
    background-image:url(../img/second/navi_bg.jpg);
}

#banner{
    padding-bottom:50px;
    text-align:center;
    box-sizing:border-box;
    padding-top:10px;
    min-height:1000px;
}

#banner .txt{
    width:96%;
    margin:0 auto 10px;
    box-sizing:border-box;
    padding:2%;
    font-size:14px;
    line-height:1.5;
    background-image:url(../img/bg_white.png);
    border:#cfbe8d 1px solid;
         /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    text-align:left;

}

#banner .bannerTxt{
    padding:1%;
    background-color:#bae6ea;
     /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    font-size:14px;
    line-height:1.3;
    letter-spacing:1px;
    margin-bottom:15px;
    font-size:13px;
}

#banner .bannerBox{
    width:96%;
    margin:0 auto;
    box-sizing:border-box;
    padding:3px 1% 1%;
    margin-bottom:15px;
         /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    

}

#banner .bannerBox h2{
    font-size:14px;
    margin-bottom:5px;
    text-align:left;
}

#banner .bannerBox img{
    width:15.6%;
    max-width:150px;
    margin:2px 0.5%;
}
#banner .bannerBox .bn200,#banner .bannerBox .bn180,#banner .bannerBox .bn160{
    padding:5px 1% 25px;
    box-sizing:border-box;
    border-bottom:#6D5A4B 1px dashed; 
}
#banner .bannerBox .bn160{
    border-bottom:#6D5A4B 0px dashed; 
}

#twitter-icon .twiIconBox{
    width:96%;
    margin:0 auto 10px;
    box-sizing:border-box;
    padding:2% 3%;
    font-size:16px;
    line-height:1.5;
    background-image:url(../img/bg_white.png);
         /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    border:#cfbe8d 1px solid;

}

#twitter-icon .twiIconBox a{
        width:16.6%;
    max-width:160px;
    margin:2px 0;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    box-sizing:border-box;
   border:#fff 4px solid;
}

#twitter-icon .twiIconBox a:hover{
   border:#cfbe8d 4px solid;
}

#twitter-icon .twiIconBox a img{
    width:100%;
}

.twiIconBox p,.wallBox p{
    margin-top:0;
    text-align:left;
    font-size:16px;
}
#song{
    text-align:center;
}
#song .songBox{
    padding:50px 0 80px;
}

#song strong{
    line-height:100px;
    font-family: 'Belleza', sans-serif;
    font-weight:100;
    font-size:66px;
    color:#cfbe8d;
}

#song .artistBox{
    width:96%;
    margin:0 auto;
    text-align:left;
    border:#cfbe8d 1px solid;
    box-sizing:border-box;
    background-color:#fff;
    padding:10px 1%;
             /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    border:#cfbe8d 1px solid;

}
#song .artistBox h2{
    line-height:34px;
    font-family: 'Belleza', sans-serif;
    font-weight:100;
    font-size:34px;
    color:#cfbe8d;
    border-bottom:#cfbe8d 3px double;
    margin-bottom:5px;
}

#song .artistBox .img{
    width:40%;
    max-width:480px;
    border:#cfbe8d 4px solid;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    box-sizing:border-box;

}
#song .artistBox .img img{
    width:100%;
    border:#fff 2px solid;
    box-sizing:border-box;

}

#song .artistBox .txt{
    width:60%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    box-sizing:border-box;
    padding:0 1%;

}

#song .artistBox .txt h3{
                 /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    background-color:#8dc0cf;
    box-sizing:border-box;
    padding:5px 1%;
    margin-top:15px;
}
#song .artistBox .txt .txtBox{
    padding:10px 1%;
}

#song .artistBox .txt h4{
    margin-top:50px;
    border-top:#cfbe8d 1px dotted;
    padding:10px 0 0;
    box-sizing:border-box;
}
#song .artistBox .txt p{
    padding:5px 0;
    margin:0;
}

/*SS*/
#thirdNavi{
    width:16%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    background-color:#fff;
         /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    padding:15px 0%;
    box-sizing:border-box;
    margin-right:0.5%;
    margin-left:2.5%;
    border:#cfbe8d 2px solid;


}

#thirdNavi a{
    width:100%;
    
    display:block;
    padding:5px 1%;
    box-sizing:border-box;
    border-bottom:#d9c6cc 1px dashed;
}

#thirdNavi .day{
    font-size:11px;
}
#thirdNavi .num{
    padding-left:0.5em;
}

#thirdNavi a:hover{
	color:#fe8bb2;
}

#thirdNavi a.selected:hover{
	color:#7a5959;
}


#thirdNavi a.selected{
    background-color:#c4e2e4;
}

#thirdNavi a:before{
    content:"\25C6";
    color:#baa56a;
    text-shadow:0 0 5px #ffe6af;
}

.secondMain{
    width:81%;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    box-sizing:border-box;
    padding:15px 1.5%;
}


.wallBox{
    width:96%;
    max-width:480px;
    margin:0 auto;
    margin-top:7%;
     border:#cfbe8d 1px solid;
     padding:1%;
     box-sizing:border-box;
}

.wallBox img{
    width:100%;
    box-sizing:border-box;
     border:#cfbe8d 1px solid;
}
.wallBox a{
    display:block;
    background-color:#cfbe8d;
    text-align:center;
    font-size:14px;
    line-height:14px;
    padding:10px 0;
    font-weight:bold;
    color:#fff;
    text-shadow:none;
    margin-bottom:1px;
}

.wallBox a:hover{background-color:#ded4b9;}


/*共通---------------------------------------------------------------------------*/
.fukidashi .txt{
    background-color:#fff; 
    box-sizing:border-box;
    width:100%;
    padding:3%;
    /* 角丸 */
	border-radius: 6px; 
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    color:#4e3b33;
    font-size:14px;
    
    }
/*---------------------------------------------------------------------------*/
#ss .talkBox{
    margin-bottom:10px;
    background-repeat:no-repeat;
    background-size:17% auto;
    box-sizing:border-box;
    padding-top:7%;
    padding-bottom:10%;

}
#ss .talkBox:nth-child(odd){/*奇数*/
    background-position:left top;
}
#ss .talkBox:nth-child(even){/*偶数*/
    background-position:right top;
}


#ss .talkBox .fukidashi{
    width:70%;
    background-repeat:no-repeat;
    box-sizing:border-box;

}
#ss .talkBox:nth-child(odd) .fukidashi{/*奇数*/
    background-position:left 27px;
    padding-left:5%;
    margin-right:13%;
    margin-left:17%;
}

#ss .talkBox:nth-child(even) .fukidashi{/*偶数*/
    background-position:right 27px;
    padding-right:5%;
    margin-left:13%;
}

#ss .freeTxt{
	font-size:18px;
	text-align:center;
	line-height:1.3em;
}

/*キャラ毎---------------------------------------------------------------------------*/

#ss .talkBox.fel{background-image:url(../special/img/ss/icon_fel.jpg);}
#ss .talkBox.jurio{background-image:url(../special/img/ss/icon_jurio.jpg);}
#ss .talkBox.nico{background-image:url(../special/img/ss/icon_nico.jpg);}
#ss .talkBox.balt{background-image:url(../special/img/ss/icon_balt.jpg);}
#ss .talkBox.vino{background-image:url(../special/img/ss/icon_vino.jpg);}
#ss .talkBox.rio{background-image:url(../special/img/ss/icon_rio.jpg);}

.talkBox.fel .fukidashi{background-image:url(../special/img/ss/fukidashi_fel.png);}
.talkBox.fel .fukidashi .txt{border:#2592a9 3px solid;}
.talkBox.jurio .fukidashi{background-image:url(../special/img/ss/fukidashi_jurio.png);}
.talkBox.jurio .fukidashi .txt{border:#655584 3px solid;}
.nico .fukidashi{background-image:url(../special/img/ss/fukidashi_nico.png);}
.nico .fukidashi .txt{border:#ee5196 3px solid;}
.balt .fukidashi{background-image:url(../special/img/ss/fukidashi_balt.png);}
.balt .fukidashi .txt{border:#e27f17 3px solid;}
.vino .fukidashi{background-image:url(../special/img/ss/fukidashi_vino.png);}
.vino .fukidashi .txt{border:#868690 3px solid;}
.rio .fukidashi{background-image:url(../special/img/ss/fukidashi_rio.png);}
.rio .fukidashi .txt{border:#9fbb4c 3px solid;}
/*キャストコメント---------------------------------------------------------------------------*/
#comment{color:#484848;}
#comment h2{
    background-color:#fff;
    border:#cfbe8d 1px solid;
    border-left:#cfbe8d 5px solid;
    border-bottom:#cfbe8d 2px solid;
    background-image:url(../special/img/comment/h2_bg.png);
    background-position:left bottom;
    background-repeat:repeat-x;
    text-shadow:0 0 5px #ffe6af;
    color:#484848;


}
#comment h2 img{
    width:20%;
    margin:1%;
    border:#cfbe8d 2px solid;
    box-sizing:border-box;
    max-width:150px;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}
#comment h2 .bg{background-position:right bottom; background-repeat:no-repeat; background-size:auto 100%;}
#comment .txt{padding:1%;}
#comment h2 .txt{
    width:78%;
    vertical-align:top;
    box-sizing:border-box;
    padding:5% 2% 0;
    padding-left:0;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
}



#comment h2 .charaName{
    width:81%;
    border-bottom:#cfbe8d 3px double;
    font-size:22px;
    box-sizing:border-box;
    padding-left:1%;
    margin-bottom:7px;
    line-height:30px;
    font-weight:100;
}

#comment h2 .castName{
    width:75%;
    padding-left:1%;
    box-sizing:border-box;
    font-size:40px;
    line-height:40px;
    font-weight:100;
    color:#484848;
}

#comment .questionBox{
    margin:10px 0 20px;
}
#comment h3{
    font-size:13px;
    color:#fff;
    padding:3px 0;
    box-sizing:border-box;
    font-weight:100;
    border-left:#cfbe8d 5px solid;
    border-bottom:#cfbe8d 2px solid;

}
#comment h3 .line{
    padding:2px 2% 0;
    padding-left:2.5em;
    text-indent:-2em;
}
/*キャラ毎色替え
----------------------------------------------------------*/
#comment .vol_1 h2 .charaName:first-letter{color:#2592a9;}
#comment .vol_1 h2 .bg{background-image:url(../special/img/comment/comment1_bg.png);}
#comment .vol_1 h3{background-color:#2592a9; text-shadow:0 0 5px #2592a9;}

#comment .vol_2 h2 .charaName:first-letter{color:#655584;}
#comment .vol_2 h2 .bg{background-image:url(../special/img/comment/comment2_bg.png);}
#comment .vol_2 h3{background-color:#655584; text-shadow:0 0 5px #655584;}

#comment .vol_3 h2 .charaName:first-letter{color:#ee5196;}
#comment .vol_3 h2 .bg{background-image:url(../special/img/comment/comment3_bg.png);}
#comment .vol_3 h3{background-color:#ee5196; text-shadow:0 0 5px #ee5196;}


#comment .vol_4 h2 .charaName:first-letter{color:#e27f17;}
#comment .vol_4 h2 .bg{background-image:url(../special/img/comment/comment4_bg.png);}
#comment .vol_4 h3{background-color:#e27f17; text-shadow:0 0 5px #e27f17;}

#comment .vol_5 h2 .charaName:first-letter{color:#868690;}
#comment .vol_5 h2 .bg{background-image:url(../special/img/comment/comment5_bg.png);}
#comment .vol_5 h3{background-color:#868690; text-shadow:0 0 5px #868690;}

#comment .vol_6 h2 .charaName:first-letter{color:#9fbb4c;}
#comment .vol_6 h2 .bg{background-image:url(../special/img/comment/comment6_bg.png);}
#comment .vol_6 h3{background-color:#9fbb4c; text-shadow:0 0 5px #9fbb4c;}
/*発売記念バックナンバー*/
#back-number .box{
    width:96%;
    max-width:960px;
    margin:0 auto;
}

#back-number a.popup{
    width:32.3%;
    max-width:480px;
    margin:10px 0.5%;
    box-sizing:border-box;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    border:#cfbe8d 3px solid;
}
#back-number a.popup img{
    width:100%;
}

/*----------------------------------------------------------------
スマホエリア
-----------------------------------------------------------------*/

@media (max-width: 976px) {
    #productBox h2{
        padding:0;
    }

    #productBox .floatBox{
        width:98%;
        max-width:480px;
        margin:0 auto 10px;
        display:block;
    }
    /*--------------------------------------------
    スペシャル
    ----------------------------------------------*/
    /*キャストコメント*/  
    #comment h2 .charaName{
        font-size:18px;
        line-height:18px;
    }
    
    #comment h2 .castName{
        font-size:36px;
        line-height:36px;
    }
    
    #comment h2 .txt{
        padding:5% 2% 0;
        padding-left:0;
    }


}
@media (max-width: 787px) {
    /*--------------------------------------------
    トップ
    ----------------------------------------------*/
    
    #news{
        width:49%;
        margin:5px 0.5%;
        vertical-align:top;
        display:inline-block;
        *display: inline;   /*IE用のハック*/
        zoom: 1;            /*IE用の hasLayout を true にするための記述*/
    }
    #news .box{
        height:250px;
    }
    
    
    
    #twitter{
        width:49%;
        margin:5px 0.5%;
        vertical-align:top;
        display:inline-block;
        *display: inline;   /*IE用のハック*/
        zoom: 1;            /*IE用の hasLayout を true にするための記述*/

    }
    
   .pcBox{
        display:none;
    }
    .mobileBox{
        display:block;
    }
    

    /*--------------------------------------------
    ストーリー
    ----------------------------------------------*/
    #story{
        padding:50px 0 150px;
        font-size:16px;
    }
    
    #story h1{
        margin-bottom:60px;
    }
    #story p{
        padding-bottom:80px;
    }
    
    .largeTxt{
        font-size:24px;
    }
    #story strong{
        font-size:20px;
    }
    /*--------------------------------------------
    キャラクター
    ----------------------------------------------*/
    .charaBox{
        overflow-x:hidden;
    }
    .charaBox .over{
        top:25%;
        padding:0px 2%;
    }
    
    .charaBox .over .prof{
        font-size:12px;
        margin: 5px 0;
        background-image:url(../img/bg_white.png);
        border:#cfbe8d 1px solid;
        border-left:#cfbe8d 4px solid;

    }
    .charaBox .over p{
        padding:3px;
        font-size:13px;
        margin: 5px 0;
        background-image:url(../img/bg_white.png);
        border:#cfbe8d 1px solid;
        border-left:#cfbe8d 4px solid;

    }
    .charaBox .over p br{
        display:none;
    }
    .charaBox .over p .br2{
        display:inline;
    }
    
    .sampleVoice{
        width:60%;
        margin:5px 0 0;
    }

    .charaBox .over2{
    width:100%;
    position:relative;
    top:0;
    padding:10px 2% 15px;
    box-sizing:border-box;
    }
    img.stand{
        width:80%;
        max-width:698px;
        margin-right:-10%;
    }
    
    #vol_6 img.stand{
        width:80%;
        max-width:698px;
        margin-right:-17%;
    }

    .charaBox .cdBox{
        width:100%;
    }
    
    #chara #subNavi .btBox a{
        width:15.6%;
        margin:2px 0.5%;

    }

    /*--------------------------------------------
    CDINFO
    ----------------------------------------------*/
    #cdinfo #subNavi{
        width:100%;
    }
    
    #cdinfo #subNavi .btBox a{
    /*width:100%;*/
    width:32.3%;
    margin:3px 0.5%;
    }
    #cdinfo #subNavi .btBox a:first-child{
    width:99%;
    margin:3px 0.5%;

    }
    
    #cdinfo #subNavi .btBox a .txt{
    width:100%;
    height:auto;
    display:block;
    padding:10px 0;
    }
    
    
    #productBox .trackList,#productBox .story{
        width:98%;
        max-width:480px;
        margin:0 auto 10px;
        display:block;
    }

    /*--------------------------------------------
    スペシャル
    ----------------------------------------------*/
    #special #subNavi{
        width:100%;
    }
    
    #special #subNavi .btBox a{
    /*width:100%;*/
    width:32.3%;
    margin:3px 0.5%;
    position:relative;
    }
    #special #subNavi .btBox a .txt{
    width:100%;
    height:auto;
    display:block;
    padding:15px 0;
    }
     #banner .bannerBox img{
        width:32.3%;
    }
    #song .artistBox .txt h4{
        margin-top:10px;
    }
    
        /*SS*/
        
        #thirdNavi{
            width:98%;
            margin:0 auto 10px;
            padding:3px 0.5%;
            display:block;
        
        }
       #thirdNavi a{
            width:25%;
            margin:5px 0;
            box-sizing:border-box;
            padding:5px 1%;
            display:block;
            vertical-align:top;
            display:inline-block;
            *display: inline;   /*IE用のハック*/
            zoom: 1;            /*IE用の hasLayout を true にするための記述*/
            
            border-bottom:#d9c6cc 0px dashed;
            
            font-size:13px;

            border-left:#d9c6cc 1px dotted;
            border-right:#d9c6cc 1px dotted;
        }
        .secondMain{
            width:98%;
            margin:0 auto;
            display:block;
        
        }

        #ss .talkBox .fukidashi .txt{
            font-size:14px;
            line-height:1.3em;
    
        }

        #ss .talkBox:nth-child(odd) .fukidashi{
            background-position:left 10px;
        }
        #ss .talkBox:nth-child(even) .fukidashi{
            background-position:right 10px;
        }

    
        #ss .talkBox .fukidashi .txt br{
            display:none;
    
        }
    
        /*キャストコメント*/  
        #comment h2 .charaName{
            font-size:18px;
            line-height:18px;
        }
        
        #comment h2 .castName{
            font-size:36px;
            line-height:36px;
        }
        #comment h2 .txt{
            padding:5% 2% 0;
        }
}
@media (max-width: 481px) {
    #news{
        width:96%;
        margin:5px auto;
        display:block;
    }
    
        #news .box{
            height:150px;
        }
    
    
    #twitter{
        width:96%;
        margin:5px auto;
        display:block;
    }
       
    #movie{
        width:96%;
        margin:0 auto;
        display:block;
    
    }
    
    #pickup{
        width:96%;
        margin:0 auto;
        display:block;
    }
    
    #movie_pc{
        display:none;
    }
    #movie_smp{
        display:block;
        padding:10px 1%;
        box-sizing:border-box;

    }
    #movie {
        display: inherit;
        position: relative;
        margin: 1%;
        padding-bottom: 56.25%;
        padding-top: 10px;
        height: 0;
        overflow: hidden;
    }
    
    #movie iframe,  
    #movie object,  
    #movie embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .topImg a{
        width:96%;
        position:relative;
        bottom:0;
        right:0;
        display:block;
        margin:5px auto;
        background-color:#fff;
    }
    /*--------------------------------------------
    ストーリー
    ----------------------------------------------*/
    #story{
        padding:50px 0 100px;
        font-size:14px;
    }
    
    #story h1{
        font-size:48px;
        line-height:48px;
        margin-bottom:40px;
    }
    #story p{
        padding-bottom:50px;
    }
    
    .largeTxt{
        font-size:22px;
    }
    #story strong{
        font-size:16px;
    }
    /*--------------------------------------------
    キャラクター
    ----------------------------------------------*/
    .charaBox{
        text-align:right;
        background-repeat:no-repeat;
        background-position:left top;
        background-size:150% auto;
        padding-top:200px;
    
    }
    #chara #subNavi .btBox a{
        width:24%;

    }
    .sampleVoice{
    width:100%;
    margin:0 auto 10px;
}

    img.stand,#vol_6 img.stand{
        width:100%;
        max-width:698px;
        margin-right:0;
    }
    .charaBox .over{
        width:100%;
        box-sizing:border-box;
        position:relative;
    }
    .charaBox .cdBox img{
        width:100%;
        display:block;
        margin-bottom:3px;
    }
    .charaBox .cdBox .txt{
        width:100%;
        display:block;
    }

    /*--------------------------------------------
    CDINFO
    ----------------------------------------------*/
    
    #cdinfo #subNavi .btBox a{
    }
    
    #scheduleBox a{
        width:98%;
        max-width:545px;
        margin:5px 1%;
        display:block;
    }

    
    #productBox{
        width:100%;
        margin:0 0 10px;
    
    }
    
    
    #productBox h2 .volBox{
    width:15%;
    margin:2px 0;
    max-width:68px;
    font-size:24px;
    
    }


    #productBox h2 .cdTxt{
        width:80%;
        text-align:left;
        height:50px;
        bottom:0;
    }
    #productBox h2 .charaName{
        width:100%;
        display:block;
        line-height:1.2em;
        margin:0;
        padding:0;
    }
        
    #productBox img.jacket{
        width:90%;
        margin:0 auto 10px;
        display:block;
    }
    #productBox .floatBox .txt dt{
        display:block;
        font-size:13px;
    }
    #productBox .floatBox .txt dd{
         font-size:13px;
    }
    #productBox .floatBox .txt ul{
        width:99%;
        display:block;
       
    }
    #productBox .floatBox{
        width:100%;
        margin:0;
    }
    
    #productBox .story a{
        width:100%;
        box-sizing:border-box;
    }
    .bonusWrap{
        display:block;
    }
    
    .bonusBox{
       display:block;
        width:100%;
        margin:4px 0;
    
    }
    .bonusBox h2{
        font-size:18px;
    }
    .bonusBox h3{
        font-size:14px;
    }
    /*--------------------------------------------
    スペシャル
    ----------------------------------------------*/
    #special #subNavi .btBox a{
        /*width:100%;*/
        width:49%;
        margin:3px 0.5%;
        position:relative;
    }
    #banner .bannerBox .bn200 img{
        width:49%;
        margin:2px 0.5%;
    }
    #banner .bannerBox .bn180 img{
        width:32.3%;
    }
    
    #banner .bannerBox .bn160 img{
        width:32.3%;
    }
    #twitter-icon .twiIconBox p{
        font-size:14px;

    }

    #twitter-icon .twiIconBox a{
            width:33.3%;
        max-width:160px;
        margin:2px 0;
        vertical-align:top;
        display:inline-block;
        *display: inline;   /*IE用のハック*/
        zoom: 1;            /*IE用の hasLayout を true にするための記述*/
        box-sizing:border-box;
       border:#fff 4px solid;
    }
    #song strong{
        line-height:100px;
        font-size:48px;
    }

    #song .artistBox .img{
        width:100%;
        display:block;
    }
    #song .artistBox .txt{
        width:100%;
        display:block;
    }
    
    /*SS*/
    #thirdNavi a{
        width:33.3%;
        font-size:12px;
    }
    #ss .talkBox .fukidashi .txt{
        font-size:13px;
    }
    #ss .talkBox{
        padding-top:6%;
    }
#ss .freeTxt{
	font-size:14px;
	text-align:center;
	line-height:1.3em;
}
    /*キャストコメント*/
    #comment .txt br{
            display:none;
    }
    /*キャストコメント*/  
    #comment h2 .charaName{
        font-size:14px;
        line-height:14px;
    }
    
    #comment h2 .castName{
        font-size:20px;
        line-height:20px;
    }
    
    #comment h2 .txt{
        padding:5% 2% 0;
    }
    
    #comment h2{
            background-position:left 130%;
    
    
    }


}