f/*======================================

     global

=======================================*/
body{
    width: 100%;
    margin: 0 auto;
    background: #f8f8f4 url(../img/bg_body.gif) center top repeat-y;
    font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    line-height: 120%;
}
body:before{
	position: absolute;
	top: 0;
	left: 50%;
	width: 1004px;
	margin-left: -502px;
	height: 12px;
	content: '';
    background: transparent url(../img/bg_header.png) left top repeat-x;
}
h1,h2,h3,h4{
	font-size: 100%;
	line-height: normal;
}
a:link{
	color: #539de1;
	text-decoration: none;
}
a:visited{
	color: #539de1;
	text-decoration: none;
}
a:active{
	color: #f44583;
	text-decoration: none;
}
a:hover{
	color: #539de1;
	text-decoration: underline;
}
/*======================================

     Header

=======================================*/
div#header{
    position: relative;
    width: 1000px;
    margin: 0 auto;
    padding-top: 64px;
}
div#header p{
	/*display: none; if jquery.bgSwitcher is on*/
	position: absolute;
	top: 24px;
	left: 12px;
	width: 698px;
	height: 0 !important;
	height /**/: 25px;
	padding-top: 25px;
	margin: 0 0 0 30px;
	font-size: 12px;
	overflow: hidden;
	outline: none;
	background: transparent url(../img/logo.gif) left top no-repeat;
}

div#header ul#nav{
    width: 940px;
    height: 73px;
    margin: 0 auto;
    padding: 0;
}
div#header ul#nav li{
	position: relative;
    float: left;
    list-style: none;
}

div#header ul#nav li a.main{
	display: block;
    width: 120px;
    height: 0 !important;
	height /**/: 72px;
	padding-top: 72px;
    margin: 0 1px 0 0;
    outline: none;
    overflow: hidden;
    font-size: 12px;
    text-align: center;
    line-height: 73px;
    border-style: solid;
    border-color: #e5e5e5;
    border-width: 0 0 1px 1px;
    background-color: #f7f6f3;
    background-image: url(../img/navi.png);
}
div#header ul#nav li#navi01 a.main{
	background-position: left top;
}
div#header ul#nav li#navi02 a.main{
	background-position: -122px top;
}
div#header ul#nav li#navi03 a.main{
	background-position: -244px top;
}
div#header ul#nav li#navi04 a.main{
	background-position: -366px top;
}
div#header ul#nav li#navi05 a.main{
	background-position: -488px top;
}
div#header ul#nav a.main:active{
	background-color: #fff;
}
div#header ul#nav a.main:hover{
	background-color: #fff;
	border-color: #fff;
}
div#header ul#nav li.cd a.main{
	background-color: #fff;
	border-bottom: none;
}
div#header ul#nav li.opened a.main{
	width: 119px;
	height: 71px;
	background-color: #e9e6de;
	border: solid 1px #c9c7c0;
	border-bottom: solid 1px #e9e6de;
	background-image: url(../img/navi_pink.png);
}
div#header ul#nav li#search{
    width: 329px;
    background-color: #dfe1e3;
    display: block;
    height: 73px;
    margin: 0 1px 0 0;
    outline: none;
    overflow: hidden;
    font-size: 12px;
    line-height: 73px;
}

div#header ul#nav li ol.subNav{
	display: none;
	position: absolute;
	top: 73px;
	left: 0;
	border: solid 1px #c9c7c0;
	border-top: none;
	width: 210px;
	padding: 10px;
	padding-bottom: 0;
	padding-top: 12px;
	margin: 0;
	font-size: 12px;
	list-style: none;
	background: #e9e6de url(../img/sub_menu_back.gif) right top no-repeat;
	z-index: 6001;
	border-radius: 0 8px 8px 8px; /* CSS3 */
	-webkit-border-radius: 0 8px 8px 8px; /* Safari, Chrome */
	-moz-border-radius: 0 8px 8px 8px; /* Firefox */
}
div#header ul#nav li ol.subNav li{
	width: 200px;
	margin: 0;
	padding: 5px;
	border-top: dotted 1px #acacac;
	background: transparent url(../img/big_arrow.png) 195px center no-repeat;
}
div#header ul#nav li ol.subNav li.noArrow{
	background-image: none;
}
div#header ul#nav li ol.subNav li span{
	display: block;
	color: #89753f;
	font-size: 10px;
	line-height: 10px;
	padding: 4px 0 0;
}
div#header ul#nav li ol.subNav li a{
	display: block;
	font-size: 12px;
	color: #555;
	line-height: 130%;
	padding: 10px 0;
	padding-right: 30px;
	cursor: pointer;
}
div#header ul#nav li ol.subNav li.new a{
	padding: 20px 0;
	padding-left: 30px;
	background: transparent url(../img/icon/new.png) left center no-repeat;
}
div#header ul#nav li ol.subNav li.viewAll{
	display: none;
	margin-bottom: 10px;
	background-image: none;
	background-color: #6b7e8a;
	border: none;
	border-radius: 6px; /* CSS3 */
	-webkit-border-radius: 6px; /* Safari, Chrome */
	-moz-border-radius: 6px; /* Firefox */
}
div#header ul#nav li ol.subNav li.viewAll a{
	display: block;
	font-size: 12px;
	padding: 5px 0;
	font-weight: bold;
	text-align: center;
	color: #fff;
}

/*======================================

     Search

=======================================*/
div#header form {
	position: relative;
	width: 330px;
	height: 72px;
	padding: 0;
	padding-top: 1px;
	margin: 0;
	background: transparent url(../img/input_search.gif) center center no-repeat;
}
div#header div#cse-search-form{
	text-align: center;
	font-weight: bold;
	color: #aaa;
}
div#header form input {
	position: absolute;
	top: 21px;
	left: 52px;
	border: none;
	width: 222px;
	height: 32px;
	line-height: 32px;
	margin: 0;
	padding: 0;
	background: none;
	outline: none;
	font-size: 12px;
	font-weight: normal;
}
div#header form table.gsc-branding{
	display: none;
}
div#header form input.gsc-search-button{
	display: none;
}
div#header form div.gsc-clear-button{
	position: absolute;
	top: 29px;
	right: 24px;
	width: 16px;
	height: 0 !important;
	height /**/: 16px;
	padding-top: 16px;
	margin: 0;
	overflow: hidden;
	outline: none;
	background: transparent url(../img/button/delete.gif) left top no-repeat;
}
div#results{
	width: 940px;
	margin: 0 auto;
}
div#results .gsc-thinWrapper{
	width: 100%;
}


/*======================================

     Bottom Area

=======================================*/
div#bottomArea{
	clear: both;
	width: 940px;
	margin: 0 auto 20px;
	padding: 10px;
	padding-bottom: 8px;
	background-color: #e6e6e6;
	border-radius: 6px; /* CSS3 */
	-webkit-border-radius: 6px; /* Safari, Chrome */
	-moz-border-radius: 6px; /* Firefox */
}
div#bottomArea div#leftColumn{
	float: left;
	width: 312px;
}

div#bottomArea div#centerColumn{
	float: left;
	width: 310px;
	margin: 0 2px;
}

div#bottomArea div#rightColumn{
	float: right;
	width: 312px;
}
div#bottomArea div.module{
	position: relative;
	width: 280px;
	margin-bottom: 2px;
	background-color: #fff;
	padding: 16px;
	border-radius: 3px; /* CSS3 */
	-webkit-border-radius: 3px; /* Safari, Chrome */
	-moz-border-radius: 3px; /* Firefox */
}
div#bottomArea div.module.dark{
	background-color: #343434;
}
div#bottomArea div.module p{
	font-size: 12px;
}
div#bottomArea div.module a.continue{
	display: block;
	font-size: 12px;
	text-align: right;
}
div#bottomArea div.module h2,
div#bottomArea div.module h3,
div#bottomArea div.module h4{
	padding: 0;
	padding-left: 10px;
	margin: 0;
	font-size: 14px;
	line-height: 130%;
}
div#bottomArea div.module.dark h2,
div#bottomArea div.module.dark h3,
div#bottomArea div.module.dark h4{
	color: #fff;
}
div#bottomArea div.module.dark p{
	color: #fff;
}
div#bottomArea div.module h2 a:link{
	color: #ff60a7;
	text-decoration: none;
}
div#bottomArea div.module h2 a:active{
	color: #ff60a7;
	text-decoration: none;
}
div#bottomArea div.module h2 a:visited{
	color: #ff60a7;
	text-decoration: none;
}
div#bottomArea div.module h2 a:hover{
	color: #ff60a7;
	text-decoration: underline;
}
div#bottomArea div.module.dark a:link{
	color: #54cdff;
}


div#bottomArea div.module div.tPerson{
	clear: both;
	margin-bottom: 20px;
}
div#bottomArea div.module div.tPerson a{
	width: 280px;
	height: 70px;
	font-size: 12px;
}
div#bottomArea div.module div.tPerson a.tPic{
	float: left;
	width: 70px;
	border: solid 1px #ccc;
}
div#bottomArea div.module div.tPerson a.tPic:hover{
	border-color: #ff60a7;
}
div#bottomArea div.module div.tPerson a.tCom{
	float: right;
	width: 200px;
	font-size: 11px;
	line-height: 135%;
	color: #888;
}
div#bottomArea div.module div.tPerson a.tCom span{
	display: block;
	margin-bottom: 3px;
	font-size: 12px;
	font-weight: bold;
	color: #444;
}
div#bottomArea div.module a.fbIcon{
	float: left;
	width: 59px;
	height: 60px;
}
div#bottomArea div.module div.badge{
	position: absolute;
	top: 7px;
	left: -20px;
	width: 40px;
	height: 0 !important;
	height /**/: 40px;
	padding-top: 40px;
	margin: 0;
	overflow: hidden;
	outline: none;
}
div#bottomArea div.module div.badge.article{
	background: transparent url(../img/icon/circle_article.png) left top no-repeat;
}
div#bottomArea div.module div.badge.twitter{
	background: transparent url(../img/icon/circle_twitter.png) left top no-repeat;
}
div#bottomArea div.module div.badge.cd{
	background: transparent url(../img/icon/circle_cd.png) left top no-repeat;
}
div#bottomArea div.module div.badge.pr{
	background: transparent url(../img/icon/circle_pr.png) left top no-repeat;
}
div#bottomArea div.module div.badge.ad{
	background: transparent url(../img/icon/circle_ad.png) left top no-repeat;
}
div#bottomArea div.module.dark div.badge.article{
	background: transparent url(../img/icon/circle_article_dark.png) left top no-repeat;
}
div#bottomArea div.module.dark div.badge.twitter{
	background: transparent url(../img/icon/circle_twitter.png) left top no-repeat;
}
div#bottomArea div#faceBook{
	padding: 30px 16px;
}
div#bottomArea div#faceBook h2{
	float: right;
	width: 205px;
	font-size: 14px;
	color: #343434;
}
div#bottomArea div#faceBook h2 span{
	display: block;
	font-size: 12px;
	font-weight: normal;
}
div#bottomArea div#faceBook h2 a{
	color: #343434;
}
div#bottomArea div#everyBody p,
div#bottomArea div#twitterReader p{
	padding-bottom: 15px;
	border-bottom: solid 1px #ccc;
}
div#bottomArea div#everyBody div.twtr-tweet-text p{
	border: none;
}
div#bottomArea div#twitterReader p{
	margin-bottom: 20px;
}

div#bottomArea div#twitterReader h2{
	width: 215px;
	height: 0 !important;
	height /**/: 21px;
	padding-top: 21px;
	margin: 0;
	margin-left: 10px;
	overflow: hidden;
	outline: none;
	background: transparent url(../img/hl_twitter_reader.gif) left top no-repeat;
}
div#bottomArea div#everyBody h2{
	width: 157px;
	height: 0 !important;
	height /**/: 21px;
	padding-top: 21px;
	margin: 0;
	margin-left: 10px;
	overflow: hidden;
	outline: none;
	background: transparent url(../img/hl_tweet_w_ht.gif) left top no-repeat;
}
div#bottomArea div#twitterReader a#read3Tweet{
	display: block;
	width: 304px;
	height: 0 !important;
	height /**/: 57px;
	padding-top: 57px;
	margin: 0;
	overflow: hidden;
	outline: none;
	background: transparent url(../img/button/read_twitter.gif) left top no-repeat;
}
div#bottomArea div#everyBody a#tweetWtag{
	display: block;
	width: 294px;
	height: 0 !important;
	height /**/: 57px;
	padding-top: 57px;
	margin: 0;
	margin-top: 10px;
	overflow: hidden;
	outline: none;
	background: transparent url(../img/button/tweet.gif) left top no-repeat;
}

/*
.twtr-hd{
	display: none;
}
*/


/*======================================

     Footer

=======================================*/
div#footer{
	clear: both;
	padding: 30px 0 0;
	width: 100%;
	background-color: #909090;
}
div#footer div#siteInfo{
	width: 960px;
	margin: 0 auto 30px;
	color: #fff;
	font-size: 12px;
}
div#footer div#siteInfo p{
	font-size: 10px;
	line-height: 14px;
}
div#footer div#siteInfo a{
	color: #fff;
	text-decoration: none;
}
div#footer div#siteInfo a:visited{
	color: #fff;
	text-decoration: none;
}
div#footer div#siteInfo a:active{
	color: #fff;
	text-decoration: none;
}
div#footer div#siteInfo a:hover{
	color: #fff;
	text-decoration: underline;
}
div#footer div#siteInfo a.footerLink{
	display: block;
	padding-left: 17px;
	line-height: 20px;
	background: transparent url(../img/circle_arrow_dark.png) left 3px no-repeat;
}
div#footer div#siteInfo h4{
	font-size: 14px;
	padding: 0;
	padding-bottom: 5px;
	margin: 0;
	margin-bottom: 10px;
	border-bottom: solid 1px #ccc;
}
div#footer div#siteInfo div{
	float: left;
	width: 220px;
	margin: 0 10px;
}
div#footer div#copyright{
	width: 100%;
	padding: 20px 0;
	background-color: #000;
	color: #fff;
	text-align: center;
	font-size: 10px;
}
div#footer div#siteInfo div.sitemap h4{
	padding-top: 20px;
}
div#footer div#siteInfo div.sitemap h4.headline{
	padding-top: 0;
}
div#footer div#siteInfo div.sitemap p{
	display: block;
	margin: 4px 0;
}
div#footer div#siteInfo div#aboutCompany a.footerLink{
	margin-bottom: 10px;
}

/*======================================

     Social Link

=======================================*/
ul.socialLink{
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.socialLink li{
	float: left;
}
ul.socialLink li a{
	display: block;
	height: 0 !important;
	margin: 0;
	overflow: hidden;
	outline: none;
	background-image: url(../img/button/social_buttons.png);
	background-repeat: no-repeat;
}

div#header ul.socialLink{
    position: absolute;
    right: 20px;
    top: 20px;
}

div#header ul.socialLink li{
    width: 45px;
    margin-left: 8px;
}

div#header ul.socialLink li a{
	width: 36px;
	height /**/: 36px;
	padding-top: 36px;
}
div#header ul.socialLink li.musicaFacebook a{
	background-position: left top;
}
div#header ul.socialLink li.musicaTwitter a{
	background-position: -36px top;
}
div#header ul.socialLink li.musicaContact a{
	background-position: -72px top;
}
div#header ul.socialLink li.musicaRss a{
	background-position: -108px top;
}

ul.socialLink.mini{
	clear: both;
	margin-left: -40px;
}
ul.socialLink.mini li{
	width: 24px;
	height: 24px;
	margin-left: 40px;
	margin-top: 25px;
}
ul.socialLink.mini li a{
	width: 24px;
	height /**/: 24px;
	padding-top: 24px;
}
ul.socialLink li.fMini a{
	background-position: -6px -36px;
}
ul.socialLink li.tMini a{
	background-position: -42px -36px;
}
ul.socialLink li.cMini a{
	background-position: -78px -36px;
}
ul.socialLink li.rMini a{
	background-position: -114px -36px;
}
/*======================================

     Modal Window

=======================================*/
div.modal{
	display: none;
}
div.modal,
div.exModal{
	font-size: 14px;
	color: #666;
}
div.modal h4,
div.exModal h4{
	margin: 0;
	padding: 10px;
	font-size: 16px;
	color: #fff;
	background-color: #888;
	text-align: center;
}
div.modal div.caution,
div.exModal div.caution{
	float: left;
}
div.modal h5,
div.exModal h5{
	width: 140px;
	height: 0 !important;
	height /**/: 50px;
	padding: 50px 0 0 0;
	margin: 0;
	overflow: hidden;
	outline: none;
}
div.modal h5#amazon,
div.exModal h5#amazon{
	margin-left: 8px;
	background: transparent url(../img/shop/amazon.gif) left top no-repeat;	
}
div.modal h5#hmv,
div.exModal h5#hmv{
	margin-left: 5px;
	background: transparent url(../img/shop/hmv.gif) left top no-repeat;	
}
div.modal h5#tower,
div.exModal h5#tower{
	margin-top: 16px;
	margin-left: 12px;
	background: transparent url(../img/shop/tower.gif) left top no-repeat;	
}
div#modal_payDocomo h5{
	height /**/: 40px;
	padding: 40px 0 0 0;
	margin-top: 16px;
	margin-left: 12px;
	background: transparent url(../img/payment/logo_docomo.gif) left -5px no-repeat;	
}
div.modal p,
div.exModal p{
	padding: 5px 10px;
}
div.modal div.caution p,
div.exModal div.caution p{
	width: 220px;
	margin: 5px 22px;
	padding: 3px 0;
	line-height: 16px;
}
div.modal a,
div.exModal a{
	display: block;
	width: 220px;
	margin: 0 22px;
	text-align: left;
	word-break: break-all;
}
div.modal div#qrCode,
div.exModal div#qrCode{
	display: block;
	float: right;
	width: 111px;
	margin: 10px;
}

/* Docomo & Subscription */
div#modal_payDocomo,
div.subscription{
	width: 400px;
}
div#modal_payDocomo h4,
div.subscription h4{
	clear: both;
	font-size: 14px;
}

div#modal_payDocomo p,
div.subscription p{
	line-height: 16px;
}

div#modal_payDocomo a.download,
div.subscription a.download{
	display: block;
	margin: 0 auto;
	width: 280px;
	height: 40px;
	font-size: 14px;
	color: #fff;
	line-height: 40px;
	text-align: center;
	background-color: #00a9e8;
	border-radius: 10px; /* CSS3 */
	-webkit-border-radius: 10px; /* Safari, Chrome */
	-moz-border-radius: 10px; /* Firefox */
}

div#modal_payDocomo div.explanation,
div.subscription div.explanation{
	clear: both;
	width: 80%;
	margin: 0 auto 20px;
	background-color: #d0d7e3;
	border-radius: 10px; /* CSS3 */
	-webkit-border-radius: 10px; /* Safari, Chrome */
	-moz-border-radius: 10px; /* Firefox */
}
div#modal_payDocomo div.explanation strong,
div.subscription div.explanation strong{
	display: block;
	height: 32px;
	font-size: 12px;
	line-height: 32px;
	font-weight: bold;
	text-align: center;
	color: #fff;
	background-color: #6f7db6;
	border-radius: 10px 10px 0 0; /* CSS3 */
	-webkit-border-radius: 10px 10px 0 0; /* Safari, Chrome */
	-moz-border-radius: 10px 10px 0 0; /* Firefox */
}
div#modal_payDocomo div.explanation p,
div.subscription div.explanation p{
	padding: 0 15px;
	margin: 10px 0 5px;
	font-size: 12px;
	line-height: 16px;
}
div#modal_payDocomo div.explanation a,
div.subscription div.explanation a{
	display: block;
	padding: 0;
	padding-left: 20px;
	padding-bottom: 12px;
	margin: 0;
	margin-left: 12px;
	font-size: 12px;
	color: #6f7db6;
	text-decoration: underline;
	font-weight: bold;
	background: transparent url(../img/circle_arrow_blue.png) no-repeat left 2px;
}
div#modal_payDocomo div.explanation a:ative,
div.subscription div.explanation a:active{
	color: #6f7db6;
}
div#modal_payDocomo div.explanation a:visited,
div.subscription div.explanation a:visited{
	color: #6f7db6;
}
div#modal_payDocomo div.explanation a:hover,
div.subscription div.explanation a:hover{
	color: #6f7db6;
	text-decoration: none;
}

div.subscription{
	width: 600px;
}
div.subscription div.explanation{
	width: 480px;	
	margin-top: 20px;
	padding-bottom: 10px;
}
div.subscription li{
	font-size: 10px;
	line-height: 14px;
}
div.subscription table{
	border-collapse: collapse;
	border-spacing: 0;
	margin: 20px 20px 10px;
	border-top:1px solid #1D5C79;
	border-right:1px solid #1D5C79;
}
div.subscription table td {
	padding: 5px;
	border-bottom: 1px solid #1D5C79;
	border-left: 1px solid #1D5C79;
	color: #464646;
	background-color: #fff;
	font-size: 12px;
}
div.subscription table th{
	padding: 5px;
	width: 200px;
	border-bottom: 1px solid #1D5C79;
	border-left: 1px solid #1D5C79;
	background-color: #d5dbdd;
	font-size: 14px;
	font-weight: bold;
}
div.subscription a.download{
	background-color: #ef619a;
}
a.modalCloseImg {
	position: absolute;
	top: -12px;
	right: -26px;
	height: 0 !important;
	height /**/: 32px;
	padding-top: 32px;
	margin: 0;
	overflow: hidden;
	outline: none;
	background: url(../img/x.png) no-repeat;
	z-index: 3200;
	cursor: pointer;
	}

/*======================================

     Banner

=======================================*/
div.topBanner{
	width: 180px;
	padding: 18px;
	margin-bottom: 20px;
	border: dotted 1px #ccc;
	background-color: #eee;
}
div.topBanner a,
div.topBanner img{
	display: block;
	margin: 0 auto;
}
div#bottomBanners{
	width: 960px;
	height: 70px;
	margin:  0 auto 20px;
}
div#bottomBanners img{
	display: block;
	float: left;
	margin: 0 10px 0 10px;
}

/*======================================

     Clearfix

=======================================*/

div#detail.musica div#slider div#buy_paperBook div#online ul,
div#bottomArea div.module,
div#bottomArea div.module div.tPerson,
div#bottomArea,
div#footer div#siteInfo,
ul.socialLink{
	_height: 1px;
	zoom:1;/*for IE 5.5-7*/
}

div#detail.musica div#slider div#buy_paperBook div#online ul:after,
div#bottomArea div.module:after,
div#bottomArea div.module div.tPerson:after,
div#bottomArea:after,
div#footer div#siteInfo:after,
ul.socialLink:after{
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}