@charset "utf-8";

@import url(ini.css);
@import url(font.css);


@import url(other_contents.css);/*TOP以外のページ用*/
/*
星ノ音サンクチュアリ CSS

全ページ共通スタイル
及びTOPページ用

各コンテンツ・キャンペーンページCSSはpage_contents.css内に書く

各ページbodyにはIDを設定
TOPページ→page_top
STORYページ→page_story
WORLDページ→page_world
CHARACTERページ→page_character
GALLERYページ→page_gallery
SPECページ→page_spec
DOWNLOADページ→page_download
CAMPAIGNページ→page_campaign

*/
html,body,container{
  height:100%;
}


body{
	background-color:#FFF;
	background-image:url(../img/bg-pt_bg.jpg);
	background-repeat:repeat;
}

body > .container {
	height:auto;
}

.container{
	width:958px;
	padding:0 47px;
	min-height:100%;
	margin:0 auto;
	text-align:center;
	background-image:url(../img/main_bg.png);
	background-repeat:repeat-y;
}

h1,h2{
	display:none;
}


#header{
	background-image:url(../img/header_bg.jpg);
	width:958px;
	height:100px;
	position:relative;
}
#footer{
	background-image:url(../img/footer_bg.jpg);
	background-position:top;
	background-repeat:repeat-x;
	background-color:#ff859c;
	width:958px;
	padding:10px 0 0;
	margin-bottom:0;
	
	position:relative;
	
}
/*星ノ音TOPへ戻る*/
.contents .go-to-hoshinone{
	width:84px;
	height:22px;
	background-image:url(../img/hoshinone-top_btn.jpg);
	background-position:0px 0px;
	margin-top:5px;	
	margin-left:15px;
}

.contents .go-to-hoshinone a{
	display:block;
	width:84px;
	height:22px;
	background-image:url(../img/hoshinone-top_btn.jpg);
	background-position:0 -22px;
}

#header a.go-to-hoshinone{
	display:block;
	width:270px;
	height:45px;
	position:absolute;
}

/*ま～まれぇどHPへ戻る*/
#header a.marmalade{
	display:block;
	width:77px;
	height:33px;
	background-image:url(../img/marmalade_btn.png);
	background-repeat:no-repeat;
	position:absolute;
	margin-left:870px;
	margin-top:15px;
}
#header a.marmalade:hover{
	background-image:url(../img/marmalade_btn.png);
	background-repeat:no-repeat;
	background-position:0 -33px;
}



/*ヘッダナビゲーションバーここから*/
#header ul#header-navigation{
	width:945px;
	height:40px;
	margin-top:52px;
	
	float:left
}
#header ul#header-navigation li{
	float:left;
}
#header ul#header-navigation a{
	display:block;
	width:135px;
	height:40px;
}


#header .story a{
	background-image:url(../img/head-nav_btn.png);
	background-position:0px 0px;
}
#header .story{
	background-image:url(../img/head-nav_btn.png);
	background-position:0px -40px;
}

#header .world a{
	background-image:url(../img/head-nav_btn.png);
	background-position:-135px 0px;
}
#header .world{
	background-image:url(../img/head-nav_btn.png);
	background-position:-135px -40px;
}

#header .character a{
	background-image:url(../img/head-nav_btn.png);
	background-position:-270px 0px;
}
#header .character{
	background-image:url(../img/head-nav_btn.png);
	background-position:-270px -40px;
}

#header .gallery a{
	background-image:url(../img/head-nav_btn.png);
	background-position:-405px 0px;
}
#header .gallery{
	background-image:url(../img/head-nav_btn.png);
	background-position:-405px -40px;
}

#header .spec a{
	background-image:url(../img/head-nav_btn.png);
	background-position:-540px 0px;
}
#header .spec{
	background-image:url(../img/head-nav_btn.png);
	background-position:-540px -40px;
}

#header .download a{
	background-image:url(../img/head-nav_btn.png);
	background-position:-675px 0px;
}
#header .download{
	background-image:url(../img/head-nav_btn.png);
	background-position:-675px -40px;
}

#header .campaign a{
	background-image:url(../img/head-nav_btn.png);
	background-position:-810px 0px;
}
#header .campaign{
	background-image:url(../img/head-nav_btn.png);
	background-position:-810px -40px;
}

/*ここから非アクティブ*/

#header li.inactive-world{
	display:block;
	width:135px;
	height:40px;
	background-image:url(../img/head-nav_btn.png);
	background-position:-135px -80px;
}
#header li.inactive-spec{
	display:block;
	width:135px;
	height:40px;
	background-image:url(../img/head-nav_btn.png);
	background-position:-540px -80px;
}
#header li.inactive-download{
	display:block;
	width:135px;
	height:40px;
	background-image:url(../img/head-nav_btn.png);
	background-position:-675px -80px;
}
#header li.inactive-campaign{
	display:block;
	width:135px;
	height:40px;
	background-image:url(../img/head-nav_btn.png);
	background-position:-810px -80px;
}

#header li span{
	display:none;
}


/*フッターここから*/


#footer #product-cap{
	width:67px;
	height:70px;
	background-image:url(../img/footer-product_cap2.png);
	position:absolute;
	z-index:1;
	
	margin-top:50px;
	margin-left:60px;
}

/*ページナビ*/
#page-nav{
		width:918px;
		height:20px;
		padding:10px 0 20px 20px;
		position:relative;
}

#page-nav .go-to-marmalade{
	width:125px;
	height:27px;
	background-image:url(../img/mamalade-top_btn.jpg);
	background-position:0px 0px;
	float:left;
}

#page-nav .go-to-marmalade a{
	display:block;
	width:125px;
	height:27px;
	background-image:url(../img/mamalade-top_btn.jpg);
	background-position:0 -27px;
}

#page-nav .go-to-hoshinone{
	width:84px;
	height:22px;
	background-image:url(../img/hoshinone-top_btn.jpg);
	background-position:0px 0px;
	float:left;
	
	margin-left:590px;
}

#page-nav .go-to-hoshinone a{
	display:block;
	width:84px;
	height:22px;
	background-image:url(../img/hoshinone-top_btn.jpg);
	background-position:0 -22px;
}



#page-nav .go-to-pagetop{
	float:left;
	margin-left:20px;
}
/*ページトップへ戻る*/
.go-to-pagetop{
	width:84px;
	height:22px;
	background-image:url(../img/page-top_btn.jpg);
	background-position:0px 0px;
}

.go-to-pagetop a{
	display:block;
	width:84px;
	height:22px;
	background-image:url(../img/page-top_btn.jpg);
	background-position:0 -22px;
}
/*フッターナビゲーション*/
#footer .navigation{
   position:relative;
   overflow:hidden;
}
#footer .navigation ul{
   position:relative;
   left:50%;
   float:left;
}
#footer .navigation ul li{
	position:relative;
   	left:-50%;
	float:left;
	color:#999;
	display:block;
	margin:1em;
	
	font-size:80%;
	font-weight:bold;
	
	border-left:2px solid #FFF;
	padding-left:1em; 
}
#footer .navigation ul li:first-child{
	border:none;
}
#footer .navigation ul li a{
	background-color:#ff859c;
	padding:2px 5px;
	font-size:10px;
	text-decoration:none;
	color:#fff;
	border: solid 1px #FFFFFF;
	background-image: linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -o-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0, rgb(255,130,150)),
	color-stop(1, rgb(255,142,163))
	);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	
}
#footer .navigation ul li a:hover{
	background-color: #FFF;
	padding:2px 5px;
	font-size:10px;
	text-decoration:none;
	color:#ff859c;
	border: solid 1px  #FFF;
	background-image: linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -o-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(255,130,150) 0%, rgb(255,142,163) 100%);
	background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0, rgb(255,231,232)),
	color-stop(1, rgb(255,190,202))
	);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	
}
/*フッター製品情報*/
#footer .product{
	width:808px;
	padding-left:150px;
}
#footer .product table{
	width:340px;
	float:left;
	font-size:80%;
	color:#FFF;
}
#footer .product table th{
	text-align:right;
	font-weight:bold;
	color:#ffc6d1;
}
#footer .product table td{
	text-align:left;
	padding-left:1em;
}

#footer .copyright{
	color:#FFF;
	font-size:70%;
	padding-right:1em;
}

/*TOPページコンテンツここから*/
#page_top #top-area{
	margin-top:20px;
	margin-bottom:20px;
	position:relative;
}
/*TOP絵上のボタン*/
#page_top #top-area .button{
	display:block;
	width:135px;
	height:125px;
	background-image:url(../img/top/top_btn02.png);
	background-repeat:no-repeat;
	z-index:1;
	position:absolute;
	margin-left:840px;
	margin-top:-35px;
}
#page_top #top-area .button span{
	display:none;
}


/*更新エリア*/
#info-area{
	width:918px;
	padding:0 20px;
	margin-top:20px;
	position:relative;
}

/*新着情報*/
#page_top #news a,
#page_top #news a:visited
{
	font-weight:bold;
	color:#feffe3;
}

#page_top #news{
	width:587px;
	height:310px;
	background-image:url(../img/news-area_bg.png);
	float:left;
	
	padding-left:20px;
	padding-right:20px;
	padding-top:80px;
	position:relative;
}
#page_top #news .new1,
#page_top #news .new2
{
	width:85px;
	height:51px;
	background-image:url(../img/new_icon.png);
	position:absolute;
	margin-left:10px;

	z-index:1;
/*テキスト非表示*/
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

#page_top #news .new2{
	margin-top:101px;
}

#news .box{
	width:473px;
	height:74px;
	background-image:url(../img/news-panel_bg.png);
	background-repeat:no-repeat;
	text-align:left;
	color:#FFF;
	font-size:90%;
	
	margin-bottom:10px;
	
	padding-top:17px;
	padding-left:50px;
	padding-right:10px;
}

#news .box img{
	float:left;
	margin-right:20px;	
 /*画像に影と縁取り追加*/
    -webkit-box-shadow: 0 5px 4px -3px #a34e5b;
    -moz-box-shadow: 0 5px 4px -3px #a34e5b;
     box-shadow: 0 5px 4px -3px #a34e5b;
	 
	 border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	border:2px solid #FFF;

}
#news .box  span{
	display:block;
	color:#ffc6d1;
	font-weight:bold;
}

/*雑誌掲載情報*/
#page_top #publish{
	width:229px;
	height:310px;
	padding-top:80px;
	background-image:url(../img/publish-area_bg.png);
	margin-left:30px;
	float:left;
	padding-right:20px;
}

#page_top #publish dl{
	width:204px;
	height:70px;;
	padding-left:25px;
	font-size:90%;
	
	margin:5px auto 10px;
	text-align:left
}

#page_top #publish dt{
	width:70px;
	float:left;
}
#page_top #publish dd{
	color: #099;
	font-weight:bold;
}

#page_top #publish dt img{
 /*画像に影と縁取り追加*/
    -webkit-box-shadow: 0 5px 4px -3px #a34e5b;
    -moz-box-shadow: 0 5px 4px -3px #a34e5b;
     box-shadow: 0 5px 4px -3px #a34e5b;
	 
	 border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	border:2px solid #FFF;

}


/*スクロールバー調整*/
#news .scroll-pane,
#publish .scroll-pane{
	overflow: auto;
    width: 100%;
    height: 285px;

}

/*Twitterティッカー*/
#twitter-bar{
	width:958px;
	height:30px;
	padding-top:20px;
	background-image:url(../img/twitter-bar_bg.jpg);
	background-repeat:no-repeat;
	margin-top:20px;
}

#twitter_ticker {
	margin-left:220px;
	width:688px;
}
#twitter_ticker .twtr-hd {
	height: 0 !important;
	width: 0 !important;
	display: none !important;
}
#twitter_ticker .twtr-widget a img {
	height: 0 !important;
	width: 0 !important;
	display: none !important;
}

#twitter_ticker .twtr-widget .twtr-tweet-wrap {
	padding: 0 !important;
}
#twitter_ticker .twtr-timeline {
	height: 12px !important;
	margin: 0 !important;
}
#twitter_ticker .twtr-ft {
	height: 0 !important;
	width: 0 !important;
	display: none !important;
}
#twtr-widget-1 .twtr-bd, #twtr-widget-1 .twtr-timeline i a, #twtr-widget-1 .twtr-bd p {
	color: #333333 !important;
	font-size: 12px !important;
	height: 12px !important;
	line-height: 1 !important;
	overflow: hidden !important;
}

/*TOPページキャンペーンバナーここから*/
#page_top #banner-area{
	margin-top:20px;
}

#banner-area .banner{
	width:296px;
	height:81px;
	margin-left:13px;
	margin-top:10px;
	float:left;
}

#banner-area .banner a{
	display:block;
	width:296px;
	height:81px;
}

/*準備中バナー*/
#banner-area .blank{
	background-image:url(../img/campaign/campaign-blank_bn.jpg);
	background-repeat:no-repeat;
}

/*キャンペーンバナーボタン*/
#banner-area #souki-yoyaku{
	background-image:url(../img/campaign/campaign_souki-yoyaku_bn.jpg);
	background-position:0px -81px;
}

#banner-area #souki-yoyaku a{
	background-image:url(../img/campaign/campaign_souki-yoyaku_bn.jpg);
	background-position:0px 0px;
}


#banner-area #yoyaku{
	background-image:url(../img/campaign/campaign_yoyaku_bn.jpg);
	background-position:0px -81px;
}

#banner-area #yoyaku a{
	background-image:url(../img/campaign/campaign_yoyaku_bn.jpg);
	background-position:0px 0px;
}

#banner-area #syokai{
	background-image:url(../img/campaign/campaign_syokai_bn.jpg);
	background-position:0px -81px;
}

#banner-area #syokai a{
	background-image:url(../img/campaign/campaign_syokai_bn.jpg);
	background-position:0px 0px;
}


#banner-area #tenpo{
	background-image:url(../img/campaign/campaign_tenpo_bn.jpg);
	background-position:0px -81px;
}

#banner-area #tenpo a{
	background-image:url(../img/campaign/campaign_tenpo_bn.jpg);
	background-position:0px 0px;
}

#banner-area #ouen-banner{
	background-image:url(../img/campaign/campaign_ouenbanner_bn.jpg);
	background-position:0px -81px;
}
#banner-area #ouen-banner a{
	background-image:url(../img/campaign/campaign_ouenbanner_bn.jpg);
	background-position:0px 0px;
}

#banner-area #official-tuhan{
	background-image:url(../img/campaign/campaign_official_bn.jpg);
	background-position:0px -81px;
}
#banner-area #official-tuhan a{
	background-image:url(../img/campaign/campaign_official_bn.jpg);
	background-position:0px 0px;
}

#banner-area #trial{
	background-image:url(../img/campaign/campaign_trial_bn.jpg);
	background-position:0px -81px;
}
#banner-area #trial a{
	background-image:url(../img/campaign/campaign_trial_bn.jpg);
	background-position:0px 0px;
}