/*border: 1px solid;*/



*{

margin: 0px;

padding: 0px;

}



html{

height: 100%;

overflow-y: scroll;

}



body{

height: 100%;

font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","ＭＳ Ｐゴシック","MS PGOTHIC",sans-serif;

color: #555555;

}



img,hr{

border: none;

}



p,h1,h2,h3,li{

font-size: 14px;

line-height: 1.3;

text-align: left;

}



h1,h2,h3{

font-weight: bold;

}



strong,em{

font-style: normal;

font-weight: bold;

}



.strike{

color: #333333;

text-decoration: line-through;

}



.red{

color: #ff0000;

}



.clearfix{

zoom:1;

}



.clearfix:after{

content: "";

display: block;

clear: both;

overflow:hidden;

}



.none{

display: none;

}



.space3{

padding: 3px 0px 0px 0px;

}



.space5{

padding: 5px 0px 0px 0px;

}



.space7{

padding: 7px 0px 0px 0px;

}



.space10{

padding: 10px 0px 0px 0px;

}



.space15{

padding: 15px 0px 0px 0px;

}



.space20{

padding: 20px 0px 0px 0px;

}



.space25{

padding: 25px 0px 0px 0px;

}



/*共通------------------------------------------*/



#wrap{

background: url(../img/bg.png) repeat;

background-color: #72c7d1;

background-attachment: fixed;

}



#container{

width: 980px;

min-height: 100%;

margin: 0px auto 0px auto;

background: url(../img/bg_main.png) repeat-y;

}



body > #container{

height: auto;

}



#main{

width: 870px;

margin: 0px auto 0px auto;

position: relative;

}



#header{

height: 135px;

position: relative;

}



#footer{

width: 850px;

margin: 10px auto 0px auto;

/*position: absolute;

bottom: 0px;*/

}



#footer p{

font-size: 10px;

text-align: center;

line-height: normal;

}



hr.solid{

height: 1px;

background: url(../img/line_solid.png) repeat-x;

}



hr.dash{

height: 1px;

background: url(../img/line_dash.png) repeat-x;

}



/*トップ----------------------------------------*/



#top_base{

width: 960px;

margin: 0px 10px 0px 10px;

background: url(../pict/top_base.png) no-repeat;

}



#top_riffraff{

position: absolute;

top: 11px;

left: 8px;

}



#top_sorry{

position: absolute;

top: 543px;

left: 490px;

}



ul#menu{

list-style: none;

width: 858px;

margin: 524px auto 0px auto;

}



ul#menu li{

float: left;

}



ul#menu li a{

width: 139px;

height: 47px;

display: block;

margin: 0px 2px 0px 2px;

}



ul#menu li.menu_st a{

background: url(../img/menu_story.png);

}

ul#menu li.menu_ch a{

background: url(../img/menu_chara.png);

}

ul#menu li.menu_ga a{

background: url(../img/menu_gallery.png);

}

ul#menu li.menu_dl a{

background: url(../img/menu_down.png);

}

ul#menu li.menu_sp a{

background: url(../img/menu_special.png);

}

ul#menu li.menu_sc a{

background: url(../img/menu_spec.png);

}



ul#menu li a:hover{background-position:0 -47px;}



#top_entry{

width: 870px;

margin: 10px 0px 0px 0px;

}



#top_left{

width: 400px;

margin: 0px 0px 0px 7px;

float: left;

}



#top_right{

width: 449px;

float: right;

}



.top_youtube{

margin: 0px 0px 5px 0px;

}



.top_bn{

margin: 6px 0px 0px 0px;

}



#news,#publishing{

width: 449px;

height: 260px;

display: block;

position: relative;

}



#news{

background: url(../img/news.png) no-repeat;

}



#publishing{

background: url(../img/publishing.png) no-repeat;

}



#news dl,#publishing dl{

width: 438px;

height: 210px;

position: absolute;

top: 33px;

left: 2px;

overflow: auto;

}



.box{

width: 398px;

margin: 0px auto 0px auto;

font-size: 12px;

line-height: 1.3;

}



.box dt{

float: left;

width: 90px;

font-weight: bold;

color: #23b8bc;

}



.box dd{

padding: 0px 0px 0px 100px;

}



.box hr.solid{

margin: 5px 0px 5px 0px;

}



.box hr.dash{

margin: 2px 0px 2px 0px;

}



/*コンテンツ共通--------------------------------*/



#nav_logo{

position: absolute;

top: 14px;

left: 10px;

}



#nav_riffraff{

position: absolute;

top: 11px;

left: 715px;

}



ul#nav{

list-style: none;

width: 651px;

position: absolute;

top: 87px;

left: 213px;

}



ul#nav li{

float: left;

}



ul#nav li a{

width: 90px;

height: 38px;

display: block;

margin: 0px 3px 0px 0px;

}



ul#nav li.nav_st a{

background: url(../img/nav_story.png);

}

ul#nav li.nav_ch a{

background: url(../img/nav_chara.png);

}

ul#nav li.nav_ga a{

background: url(../img/nav_gallery.png);

}

ul#nav li.nav_dl a{

background: url(../img/nav_down.png);

}

ul#nav li.nav_sp a{

background: url(../img/nav_special.png);

}

ul#nav li.nav_sc a{

background: url(../img/nav_spec.png);

}

ul#nav li.nav_tp a{

background: url(../img/nav_top.png);

}



ul#nav li a:hover{background-position:0 -38px;}



/*ストーリ--------------------------------------*/



#story{

width: 870px;

height: 770px;

background: url(../pict/story.png) no-repeat;

position: relative;

}



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



#chara01,#chara02,#chara03,#chara04,#chara05,#chara06,#chara07{

width: 870px;

height: 770px;

position: relative;

}



#chara01{

background: url(../pict/chara01.png) no-repeat;

}

#chara02{

background: url(../pict/chara02.png) no-repeat;

}

#chara03{

background: url(../pict/chara03.png) no-repeat;

}

#chara04{

background: url(../pict/chara04.png) no-repeat;

}

#chara05{

background: url(../pict/chara05.png) no-repeat;

}

#chara06{

background: url(../pict/chara06.png) no-repeat;

}

#chara07{

background: url(../pict/chara07.png) no-repeat;

}



ul#chara{

list-style: none;

width: 264px;

position: absolute;

top: 53px;

left: 299px;

}



ul#chara li{

float: left;

}



ul#chara li a{

width: 88px;

height: 88px;

display: block;

margin: 0px 0px 0px 0px;

}



ul#chara li.chara_bt01 a{

background: url(../pict/chara_bt01.png);

}

ul#chara li.chara_bt02 a{

background: url(../pict/chara_bt02.png);

}

ul#chara li.chara_bt03 a{

background: url(../pict/chara_bt03.png);

}



ul#chara li a:hover{background-position:0 -88px;}



ul#chara2{

list-style: none;

width: 292px;

position: absolute;

top: 68px;

left: 563px;

}



ul#chara2 li{

float: left;

}



ul#chara2 li a{

width: 73px;

height: 73px;

display: block;

margin: 0px 0px 0px 0px;

}



ul#chara2 li.chara_bt04 a{

background: url(../pict/chara_bt04.png);

}

ul#chara2 li.chara_bt05 a{

background: url(../pict/chara_bt05.png);

}

ul#chara2 li.chara_bt06 a{

background: url(../pict/chara_bt06.png);

}

ul#chara2 li.chara_bt07 a{

background: url(../pict/chara_bt07.png);

}



ul#chara2 li a:hover{background-position:0 -73px;}



ul#voice{

list-style: none;

position: absolute;

top: 640px;

left: 61px;

}



ul#voice li{

float: left;

}



ul#voice li a{

width: 54px;

height: 54px;

display: block;

margin: 0px 10px 0px 0px;

}



ul#voice li.voice01 a{

background: url(../img/voice01.png);

}

ul#voice li.voice02 a{

background: url(../img/voice02.png);

}

ul#voice li.voice03 a{

background: url(../img/voice03.png);

}

ul#voice li.voice04 a{

background: url(../img/voice04.png);

}

ul#voice li.voice05 a{

background: url(../img/voice05.png);

}

ul#voice li.voice06 a{

background: url(../img/voice06.png);

}



ul#voice li a:hover{background-position:0 -54px;}



/*ギャラリ--------------------------------------*/



#gallery{

width: 870px;

height: 810px;

background: url(../img/gallery.png) no-repeat;

position: relative;

}



#gallery_entry{

padding: 95px 0px 0px 29px;

}



#gallery ul.thm{

list-style: none;

width: 825px;

}



#gallery ul.thm li{

float: left;

}



#gallery ul.thm li a{

width: 262px;

height: 150px;

display: block;

margin: 0px 13px 20px 0px;

}



#gallery ul.thm li.thm01 a{

background: url(../pict/thm01.png);

}

#gallery ul.thm li.thm02 a{

background: url(../pict/thm02.png);

}

#gallery ul.thm li.thm03 a{

background: url(../pict/thm03.png);

}

#gallery ul.thm li.thm04 a{

background: url(../pict/thm04.png);

}

#gallery ul.thm li.thm05 a{

background: url(../pict/thm05.png);

}

#gallery ul.thm li.thm06 a{

background: url(../pict/thm06.png);

}

#gallery ul.thm li.thm07 a{

background: url(../pict/thm07.png);

}

#gallery ul.thm li.thm08 a{

background: url(../pict/thm08.png);

}

#gallery ul.thm li.thm09 a{

background: url(../pict/thm09.png);

}

#gallery ul.thm li.thm10 a{

background: url(../pict/thm10.png);

}

#gallery ul.thm li.thm11 a{

background: url(../pict/thm11.png);

}

#gallery ul.thm li.thm12 a{

background: url(../pict/thm12.png);

}



#gallery ul.thm li a:hover{background-position:0 -150px;}



/*スペシャル・ダウンロード----------------------*/



.entry_cap{

margin: 0px 0px 8px 0px;

}



.bt_dl01,.bt_dl02{

width: 145px;

height: 27px;

display: block;

margin: 0px auto 0px auto;

}



.bt_dl01{

background: url(../img/bt_dl01.png);

}



.bt_dl02{

background: url(../img/bt_dl02.png);

}



.bt_dl01:hover,.bt_dl02:hover{background-position:0 -27px;}



/*ダウンロード----------------------------------*/



#down_header{

width: 870px;

height: 92px;

background: url(../img/down_header.png) no-repeat;

}



#down_body{

width: 870px;

background: url(../img/down_body.png) repeat-y;

padding: 10px 0px 0px 0px;

}



#down_footer{

width: 870px;

height: 33px;

background: url(../img/down_footer.png) no-repeat;

}



.down_entry{

width: 812px;

margin: 0px auto 0px auto;

padding: 0px 0px 16px 0px;

}



.dl_trial{

width: 640px;

margin: 4px auto 4px auto;

display: block;

}



.dl_trial_ss ul{

list-style: none;

width: 780px;

margin: 0px auto 0px auto;

}



.dl_trial_ss ul li{

float: left;

width: 256px;

margin: 0px 2px 0px 2px;

}



.dl_trial_ss ul li img{

margin: 2px 0px 2px 0px;

}



.dl_trial_txt01{

font-size: 12px;

text-align: center;

margin: 10px 0px 0px 0px;

}



.dl_trial_txt02{

text-align: center;

margin: 8px 0px 8px 0px;

}



.dl_trial_txt02 em{

font-style: normal;

font-weight: bold;

color: #23b8bc;

}



.dl_trial_txt03{

font-size: 12px;

text-align: center;

line-height: 1.6;

margin: 8px 0px 0px 0px;

}



#dl_song{

width: 606px;

height: 447px;

margin: 4px auto 0px auto;

background: url(../pict/dl_song_bg.png) no-repeat;

position: relative;

}



#dl_song a{

width: 582px;

height: 120px;

display: block;

background: url(../pict/dl_song.png);

position: absolute;

top: 9px;

left: 12px;

}



#dl_song a:hover{background-position:0 -120px;}



#dl_twicon p{

font-size: 12px;

text-align: center;

margin: 4px 0px 0px 0px;

}



#dl_twicon ul{

list-style: none;

width: 402px;

margin: 0px auto 0px auto;

display: block;

}



#dl_twicon li{

float: left;

}



#dl_twicon ul li img{

margin: 6px 3px 0px 3px;

}



#dl_twicon a.bt_dl02{

margin: 12px auto 0px auto;

}



#dl_twitback ul{

list-style: none;

width: 825px;

margin: 4px auto 0px auto;

}



#dl_twitback ul li{

float: left;

width: 262px;

margin: 0px 13px 0px 0px;

}



#dl_twitback ul li img{

margin: 0px 0px 12px 0px;

}



#dl_twitback p{

font-size: 11px;

text-align: center;

}



#dl_twitback hr{

margin: 12px 0px 12px 0px;

}



#dl_prebook hr{

margin: 0px 0px 12px 0px;

}



/*スペシャル------------------------------------*/



#special_header{

width: 870px;

height: 92px;

background: url(../img/special_header.png) no-repeat;

}



#special2_header{

width: 870px;

height: 33px;

background: url(../img/special2_header.png) no-repeat;

}



#special_body{

width: 870px;

background: url(../img/special_body.png) repeat-y;

padding: 10px 0px 0px 0px;

}



#special_footer{

width: 870px;

height: 33px;

background: url(../img/special_footer.png) no-repeat;

}



.special_entry{

width: 812px;

margin: 0px auto 0px auto;

padding: 0px 0px 16px 0px;

}



.special2_entry{

width: 712px;

margin: 0px auto 0px auto;

padding: 0px 0px 16px 0px;

}



.special_entry .entry{

width: 812px;

height: 270px;

position: relative;

}



.special_entry .entry01{

background: url(../img/sp_entry01.png) no-repeat;

}



.special_entry .entry02{

background: url(../img/sp_entry02.png) no-repeat;

}



.special_entry .entry03{

background: url(../img/sp_entry03.png) no-repeat;

}



.special_entry .entry06{

background: url(../img/sp_entry06.png) no-repeat;

}



.special_entry .entry07{

background: url(../img/sp_entry07.png) no-repeat;

}



.special_entry .entry08{

background: url(../img/sp_entry08.png) no-repeat;

}



.entry_bn_left{

width: 582px;

height: 120px;

display: block;

margin: 0px 0px 8px 0px;

}



.entry_bn_right{

width: 582px;

height: 120px;

display: block;

margin: 0px 0px 8px 230px;

}



.entry_bn01{

background: url(../pict/sp_entry01.png);

}



.entry_bn02{

background: url(../pict/sp_entry02.png);

}



.entry_bn03{

background: url(../pict/sp_entry03.png);

}



.entry_bn04{

background: url(../pict/sp_entry04.png);

margin: 16px 0px 4px 0px;

}



.entry_bn06{

background: url(../pict/sp_entry06.png);

}



.entry_bn07{

background: url(../pict/sp_entry07.png);

}



.entry_bn_left:hover{background-position:0 -120px;}

.entry_bn_right:hover{background-position:0 -120px;}



.special_entry .box_left{

width: 541px;

height: 231px;

position: absolute;

top: 18px;

left: 20px;

overflow: auto;

}



.special_entry .box_right{

width: 541px;

height: 231px;

position: absolute;

top: 18px;

left: 250px;

overflow: auto;

}



.special_entry p em{

font-style: normal;

font-weight: bold;

color: #23b8bc;

}



.special_entry dl{

width: 270px;

float: left;

margin: 14px 0px 0px 0px;

}



.special_entry .store_list{

width: 260px;

margin: 0px auto 0px auto;

font-size: 11px;

line-height: 1.3;

}



.special_entry .store_list dt{

float: left;

width: 35px;

font-weight: bold;

color: #23b8bc;

}



.special_entry .store_list dd{

padding: 0px 0px 0px 36px;

}



.special_entry .store_list hr{

margin: 3px 0px 3px 0px;

}



.store_list2{

width: 540px;

margin: 0px auto 0px auto;

}



.special_entry ul.thm{

list-style: none;

width: 825px;

}



.special_entry ul.thm li{

float: left;

width: 262px;

display: block;

margin: 10px 13px 4px 0px;

}



.special_entry ul.thm li img{

margin: 0px 0px 5px 0px;

}



.special_entry ul.thm li p{

text-align: center;

}



.special_entry hr{

margin: 0px 0px 10px 0px;

}



#bn_txt{

margin: 0px 0px 16px 0px;

}



#bn_720x300 textarea,#bn_600x160 textarea,#bn_120x600 textarea,#bn_200x200 textarea,#bn_200x40 textarea{

border: 1px solid #cccccc;

padding: 2px;

font-size: 12px;

line-height: 1.5;

resize: none;

}



#bn_720x300{

width: 720px;

margin: 0px auto 10px auto;

}

#bn_720x300 dl{

width: 720px;

margin: 0px 0px 8px 0px;

float: left;

}

#bn_720x300 dt{

width: 720px;

}

#bn_720x300 dd{

width: 720px;

padding: 6px 0px 0px 0px;

}

#bn_720x300 textarea{

width: 714px;

height: 34px;

}



#bn_600x160{

width: 812px;

margin: 0px auto 10px auto;

}

#bn_600x160 dl{

width: 812px;

margin: 0px 0px 8px 0px;

}

#bn_600x160 dt{

width: 600px;

float: left;

}

#bn_600x160 dd{

width: 206px;

padding: 0px 0px 0px 606px;

}

#bn_600x160 textarea{

width: 200px;

height: 154px;

}



#bn_120x600{

width: 378px;

margin: 0px auto 10px auto;

}

#bn_120x600 dl{

width: 120px;

margin: 0px 3px 8px 3px;

float: left;

}

#bn_120x600 dt{

width: 120px;

}

#bn_120x600 dd{

width: 120px;

padding: 6px 0px 0px 0px;

}

#bn_120x600 textarea{

width: 114px;

height: 40px;

}



#bn_200x200{

width: 618px;

margin: 0px auto 10px auto;

}

#bn_200x200 dl{

width: 200px;

margin: 0px 3px 8px 3px;

float: left;

}

#bn_200x200 dt{

width: 200px;

}

#bn_200x200 dd{

width: 200px;

padding: 6px 0px 0px 0px;

}

#bn_200x200 textarea{

width: 194px;

height: 80px;

}



#bn_200x40{

width: 612px;

margin: 0px auto 0px auto;

}

#bn_200x40 dl{

width: 612px;

margin: 0px 0px 8px 0px;

}

#bn_200x40 dt{

width: 200px;

float: left;

}

#bn_200x40 dd{

width: 412px;

padding: 0px 0px 0px 206px;

}

#bn_200x40 textarea{

width: 400px;

height: 34px;

}



/*スペック--------------------------------------*/



#spec_header{

width: 870px;

height: 92px;

background: url(../img/spec_header.png) no-repeat;

}



#spec_body{

width: 870px;

background: url(../img/spec_body.png) repeat-y;

position: relative;

}



#spec_footer{

width: 870px;

height: 33px;

background: url(../img/spec_footer.png) no-repeat;

}



.spec_entry{

width: 784px;

margin: 0px auto 0px auto;

padding: 0px 0px 18px 0px;

}



.spec_entry_left{

float: left;

margin: 0px 60px 0px 0px;

}



.spec_entry_right{

float: left;

}



.spec_cap{

margin: 5px 0px 10px 0px;

}



.spec_sub{

margin: 5px 0px 5px 0px;

}



ul.spec{

list-style: none;

margin: 0px 0px 10px 0px;

}



ul.spec li{

background: url(../img/list_mark.png) no-repeat 0px 4px;

padding-left: 20px;

font-size: 14px;

line-height: 1.7;

color: #695d4a;

}



ul.spec1 li{

list-style: none;

background: none;

margin: 0 0 0 20px;

padding: 0;

}



ul.spec2 li{

line-height: 1.4;

list-style: none;

background: none;

margin: 0 0 0 1em;

}



/*キャンペーン----------------------------------*/



.cam{

width: 640px;

margin: 10px auto 0px auto;

}



.cam hr{

margin: 0px 0px 15px 0px;

}



.cam h2{

background: url(../img/list_mark.png) no-repeat 0px 1px;

margin: 30px 0px 0px 0px;

padding-left: 18px;

}



.cam ul{

list-style: disc inside;

}



.cam form{

background: url(../pict/form_back.png) no-repeat 327px 15px;

}



.cam input.form,.cam textarea{

font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","ＭＳ Ｐゴシック","MS PGOTHIC",sans-serif;

color: #555555;

font-size: 14px;

line-height: 1.3;

}



.cam input.form,.cam p.button,.cam textarea{

margin: 0px 0px 12px 0px;

}



.cam input.form{

width: 240px;

height: 18px;

border: 1px #cccccc solid;

padding: 2px;

}



.cam textarea{

width: 320px;

height: 160px;

border: 1px #cccccc solid;

padding: 2px;

resize: none;

}



#thanks{

width: 582px;

margin: 0px 0px 10px 115px;

}