@charset "UTF-8";

/* ===================================
	File Name   : top.css
	Discription : Top Page Layout CSS
	Editors     : Bface suzuki
	Last Editor : Bface saeki
	Last Update : 2011/09/22
====================================== */

/*========== Style Contents ==========

	1. Individual Redefinition
	2. Section [EventRequest] Setting
	3. Section [MediaNetaSample] Setting
	4. Section [CdDvdBook] Setting
	5. お見舞い文 Setting
	6. Parts [Topics] Setting
	
	*. Clear Release
	
	**. Css Hack
	
====================================== */





/*===== ■1. Individual Redefinition =====*/
#GlovalNavi li a#GnTopPage { background-position: 0px -32px;}
#Footer ul#FooterNavi li a#FnTopPage { background-position: 0px -12px;}

#Entirety {
	background: url(common/img/bg_entire-top.jpg) repeat-x;
}

#MainVisual {
	height: 345px;
	background: url(img/img_main-visual01.jpg) no-repeat;
	/*margin: 0px auto 30px;*/
	margin: 0px auto 15px;/*映画告知banner用*/
}

#MainVisual p {
	position: absolute;
	top: 116px;
	left: 433px;
}

#MainVisual ul#BtnDetailProfile {
	position: absolute;
	top: 287px;
	left: 653px;
}

#MainVisual ul#BtnDetailProfile li a {
	display: block;
	width: 180px;
	height: 21px;
	background: url(img/btn_main-visual.jpg) no-repeat;
}

#MainVisual ul#BtnDetailProfile li a:hover { background-position: 0px -21px;}

.Section ul.BtnDetail li a {
	display: block;
	width: 76px;
	height: 22px;
	background: url(img/btn_list.gif) no-repeat;
}

.Section ul.BtnDetail li a:hover { background-position: 0px -22px;}

body#Top h1 {
	position: absolute;
	left: 3px;
	top: 5px;
}

body#Top h2 {
	margin: 0px 0px 15px;
	position: static;
}

body#Top #LeftBox {
	float: left;
	width: 420px;
}

body#Top #RightBox {
	float: right;
	width: 420px;
}

/*===== ■2. Section [EventRequest] Setting =====*/
#BannerMovie {
	margin: 0px auto 25px;
}

#BannerMovie li a {
	display: block;
	width: 880px;
	height: 90px;
	background: url(img/banner_movie.jpg) no-repeat;
}

#BannerMovie li a:hover { background-position: 0px -90px;}

#EventBox {
	width: 420px;
	position: relative;
	float: left;
	margin-bottom: 20px;
}

#EventBox ul.BtnDetail {
	position: absolute;
	right: 0px;
	top: 0px;
}

#EventBox em.RSS {
	position: absolute;
	left: 190px;
	top: 4px;
}

#EventBox p#NoArticle {
	text-align: center;
	font-size: 108%;
	font-weight: bold;
	margin: 30px 0px;
}

#EventBox dl {
	width: 390px;
	margin: 0px auto 15px;
	border-bottom: #CFC09A 1px dotted;
}

#EventBox dl dt {
	display: inline;
	background: url(common/img/mark_arrow-brown01.gif) no-repeat left 2.5px;
	padding-left: 15px;
	font-size: 116%;
}

#EventBox dl dt a,
#EventBox dl dt a:link {
	font-weight: bold;
}

#EventBox dl dt a:visited {
	color: #993300;
}

#EventBox dl dt a:hover {
	color: #BC601D;
}

#EventBox dl dd {
	background: url(event/img/icon_others.jpg) no-repeat 15px 0px;
	min-height: 85px;
	height: auto !important;
	heihgt: 85px;
	padding-left: 52px;
}
#EventBox dl dd.IconSeijo { background: url(event/img/icon_seijou.jpg) no-repeat 15px 0px;}
#EventBox dl dd.IconTsukiji { background: url(event/img/icon_tsukiji.jpg) no-repeat 15px 0px;}


#EventBox dl dd ul {
	margin: 10px 0px 10px 15px;
}

#EventBox dl dd ul li {
	font-size: 93%;
	margin-bottom: 3px;
}

#EventBox dl dd ul li em {
	float: left;
	margin-right: 5px;
}

#EventBox dl dd p {
	font-size: 93%;
	padding: 0px 15px;
	margin-bottom: 15px;
}


#RequestBox {
	width: 420px;
	float: right;
	margin-bottom: 20px;
}

#RequestBox p {
	font-size: 93%;
	margin-bottom: 15px;
}

#RequestBox ul {
	width: 270px;
	margin: 0px auto 20px;
}

#RequestBox ul#BtnRequestBox a,
#RequestBox ul#BtnRequestHistory a {
	display: block;
	width: 270px;
	height: 30px;
	background: url(img/btn_request.jpg) no-repeat;
}

#RequestBox ul#BtnRequestHistory a {
	background: url(img/btn_history.jpg) no-repeat;
}

#RequestBox ul#BtnRequestBox a:hover,
#RequestBox ul#BtnRequestHistory a:hover { background-position: 0px -30px;}

#RequestBox ul#BannerBlogNews {
	width: 390px;
	margin: 0px auto;
	padding-top: 20px;
}

#RequestBox ul#BannerBlogNews a {
	display: block;
	width: 390px;
	height: 90px;
	background: url(img/banner_blog-news.jpg) no-repeat;
}

#RequestBox ul#BannerBlogNews a:hover { background-position: -390px 0px;}


/*===== ■3. Section [MediaNetaSample] Setting =====*/
#MediaBlogBox {
	width: 420px;
	margin-bottom: 20px;
	position: relative;
	float: left;
	clear: both;
}

#MediaBlogBox #MediaBox ul.BtnDetail {
	position: absolute;
	right: 0px;
	top: 0px;
}

#MediaBlogBox #MediaBox p {
	font-size: 93%;
	margin: 10px 0px 25px 15px;
}

#MediaBlogBox #MediaBox #BtnMediaType {
	margin-left: 15px;
}

#MediaBlogBox #MediaBox #BtnMediaType li {
	display: inline;
	float: left;
	background: url(common/img/mark_arrow-brown01.gif) no-repeat left 5px;
	padding-left: 15px;
	margin-right: 60px;
	font-size: 116%;
}

#MediaBlogBox #MediaBox #BtnMediaType li a:link {
	font-weight: bold;
}

#MediaBlogBox #MediaBox #BtnMediaType li a:visited {
	color: #993300;
	font-weight: bold;
}

#MediaBlogBox #MediaBox #BtnMediaType li a:hover {
	color: #BC601D;
}

#MediaBlogBox #BlogBox {
	padding-top: 30px;
}

#MediaBlogBox #BlogBox p {
	font-size: 93%;
	margin: 10px 0px 25px 15px;
}

#MediaBlogBox #BlogBox #BannerBlog {
	width: 390px;
	margin: 25px auto 0px;
}

#MediaBlogBox #BlogBox #BannerBlog li {
	margin-bottom: 15px;
}

#MediaBlogBox #BlogBox #BannerBlog li#BannerBlogDiary a,
#MediaBlogBox #BlogBox #BannerBlog li#BannerTwitter a {
	display: block;
	width: 390px;
	height: 90px;
	background: url(img/banner_blog.jpg) no-repeat;
}


#MediaBlogBox #BlogBox #BannerBlog li#BannerTwitter a {
	background: url(img/banner_twitter.jpg) no-repeat;
}

#MediaBlogBox #BlogBox #BannerBlog li#BannerBlogDiary a:hover,
#MediaBlogBox #BlogBox #BannerBlog li#BannerTwitter a:hover { background-position: -390px 0px;}



#NetaBox {
	width: 420px;
	position: relative;
	float: left;
	margin-bottom: 20px;
}

#NetaBox ul.BtnDetail {
	position: absolute;
	right: 0px;
	top: 0px;
}

#NetaBox dl {
	width: 390px;
	margin: 0px auto 15px;
	border-bottom: #CFC09A 1px dotted;
}

#NetaBox dl dt {
	display: inline;
	background: url(common/img/mark_arrow-brown01.gif) no-repeat left 2.5px;
	padding-left: 15px;
	font-size: 116%;
}

#NetaBox dl dt a:link {
	font-weight: bold;
}

#NetaBox dl dt a:visited {
	color: #993300;
}

#NetaBox dl dd {
	font-size: 93%;
	padding: 0px 15px;
	margin: 10px 0px 15px 0px;
}


#SampleBox {
	width: 420px;
	float: right;
	margin-bottom: 10px;
}

#SampleBox dl {
	width: 390px;
	margin: 0px auto 25px;
}

#SampleBox dl dt {
	width: 390px;
	background: url(common/img/bg_lozenge-dot.gif) repeat-x 50%;
	margin-bottom: 15px;
}

#SampleBox dl dd p {
	font-size: 93%;
}

#SampleBox dl dd ul#BtnSampleTalk {
	width: 270px;
	margin: 0px auto;
}

#SampleBox dl dd ul#BtnSampleTalk li {
	font-size: 85%;
	text-align: center;
}

#SampleBox dl dd ul#BtnSampleTalk li a {
	display: block;
	width: 270px;
	height: 30px;
	background: url(img/btn_talk-sample.jpg) no-repeat;
	margin-bottom: 3px;
}

#SampleBox dl dd ul#BtnSampleTalk li a:hover { background-position: 0px -30px;}

#SampleBox dl dd p#YouTube {
	width: 340px;
	margin: 0px auto;
}

#SampleBox dl dd p#YouTube strong {
	display: block;
	margin-bottom: 3px;
	font-size: 116%;
}

#SampleBox dl dd ul#YouTubeLink {
	margin: 10px 0px 30px 40px;
}

#SampleBox dl dd ul#YouTubeLink li {
	background: url(common/img/mark_arrow-beige.gif) no-repeat left 4px;
	font-size: 93%;
	padding-left: 12px;
	margin-bottom: 7px;
}

#SampleBox dl dd.BtnSampleBox {
	width: 320px;
	margin: 10px auto;
	border-bottom: #CFC09A 1px dotted;
}

#SampleBox dl dd.BtnSampleBox p {
	width: 167px;
	float: left;
	display: inline;
	padding: 0px 0px 10px 3px;
	margin-bottom: 0px;
}

#SampleBox dl dd.BtnSampleBox ul {
	float: left;
	padding-top: 2px;
}

#SampleBox dl dd.BtnSampleBox ul li {
	background: url(common/img/mark_arrow-brown02.gif) no-repeat left 1px;
	padding-left: 15px;
}

#SampleBox dl dd.BtnSampleBox ul a {
	display: block;
	height: 14px;
	background: url(img/btn_top-cont.gif) no-repeat;
}

#SampleBox dl dd.BtnSampleBox ul a#SampleBoxRequest { width: 57px; background-position: 0px 0px;}
#SampleBox dl dd.BtnSampleBox ul a#SampleBoxEvent { width: 131px; background-position: -57px 0px;}
#SampleBox dl dd.BtnSampleBox ul a#SampleBoxNeta { width: 92px; background-position: -188px 0px;}

#SampleBox dl dd.BtnSampleBox ul a#SampleBoxRequest:hover { width: 57px; background-position: 0px -14px;}
#SampleBox dl dd.BtnSampleBox ul a#SampleBoxEvent:hover { width: 131px; background-position: -57px -14px;}
#SampleBox dl dd.BtnSampleBox ul a#SampleBoxNeta:hover { width: 92px; background-position: -188px -14px;}


#ClubBox {
	width: 420px;
	float: right;
	margin-bottom: 30px;
}

#ClubBox p { margin: 0px 0px 0px 15px;}


#MobileBox {
	width: 420px;
	float: right;
	margin-bottom: 40px;
}

#MobileBox strong {
	display: block;
	margin: 0px 0px 15px 15px;
	font-size: 93%;
}

#MobileBox strong span { display: block;}

#MobileBox p {
	float: left;
	width: 310px;
	margin: 0px;
	padding-left: 15px;
	_position: relative;
}

#MobileBox #QR {
	display: block;
	float: right;
	width: 75px;
	padding-right: 10px;
}


/*===== ■4. Section [CdDvdBook] Setting =====*/
#CdDvdBook {
	clear: both;
	margin-bottom: 20px;
	background: #F5F3EB;
}

#CdDvdBook h2 {
	background: #FFFFFF;
	padding-bottom: 15px;
	margin-bottom: 0px;
}

#CdDvdBook .ItemBox {
	width: 840px;
	background: #FFFFFF;
	padding: 10px;
	margin: 10px auto;
	position: relative;
}

#CdDvdBook .ItemBox span.Genre {
	word-spacing: 85px;
	float: left;
}

#CdDvdBook .ItemBox dl {
	float: left;
	width: 600px;
	margin-left: 15px;
}

#CdDvdBook .ItemBox dl dt {
	font-size: 116%;
	color: #993300;
	font-weight: bold;
	margin-bottom: 10px;
}

#CdDvdBook .ItemBox dl dd p {
	font-size: 93%;
	margin: 0px 0px 10px 5px;
}

#CdDvdBook .ItemBox ul {
	position: absolute;
	left: 505px;
	top: 10px;
}

#CdDvdBook .ItemBox ul a {
	display: block;
	width: 203px;
	height: 24px;
}

#CdDvdBook .ItemBox ul.BookLink a { background: url(img/btn_buy-book.gif) no-repeat;}
#CdDvdBook .ItemBox ul.CdLink a { background: url(img/btn_buy-cd.gif) no-repeat;}

#CdDvdBook .ItemBox ul.BookLink a:hover { background-position: 0px -24px;}
#CdDvdBook .ItemBox ul.CdLink a:hover { background-position: 0px -24px;}

#CdDvdBook .ItemBox span.ItemPhoto {
	word-spacing: 85px;
	float: right;
	width: 110px;
	height: 110px;
	background: #EBE1C8;
	text-align: center;
	padding: 1px;
}

#CdDvdBook .ItemBox span.ItemPhoto img {
	display: inline;
}

#CdDvdBook .ItemBox .iTunesLink {
	left: 465px;
	width: 260px;
	text-align: center;
}

#CdDvdBook .ItemBox .iTunesLink li {
	display: inline-block;
	/display: inline;
	/zoom: 1;
	width: 120px;
	margin: 0px;
	font-weight: bold;
	font-size: 77%;
	text-align: center;
	line-height: 140%;
	vertical-align: top;
}

#CdDvdBook .ItemBox .iTunesLink li em {
	display: inline-block;
	/display: inline;
	/zoom: 1;
}

#CdDvdBook .ItemBox .iTunesLink li em a {
	display: inline;
	width: auto;
	height: auto;
}

#CdDvdBook .ItemBox .iTunesLink li em a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
}





/*===== ■5. お見舞い文 Setting =====*/
p#VisitText {
	margin-bottom: 20px;
	padding: 0px 10px;
	font-weight: bold;
	font-size: 108%;
	line-height: 160%;
	text-align: center;
}





/*===== ■6. Parts [Topics] Setting =====*/
#TopTopics {
	margin-bottom: 30px;
	padding-top: 18px;
	background: url(common/img/bg_lozenge-dot.gif) repeat-x;
}

#TopTopics li {
	margin-bottom: 15px;
	padding: 0px 10px 18px;
	background: url(common/img/bg_lozenge-dot.gif) repeat-x bottom;
}

#TopTopics li strong {
	display: block;
	margin-bottom: 5px;
	padding-left: 14px;
	background: url(common/img/mark_lozenge.gif) no-repeat 0px center;
	color: #993300;
}

#TopTopics li p { margin: 0px 0px 0px 15px;}

#TopTopics li p span {
	display: block;
	padding-left: 13px;
	background: url(common/img/mark_arrow-beige.gif) no-repeat 0px center;
}

#TopTopics li.TwoColumn div { float: left;}
#TopTopics li.TwoColumn div.LeftColumn { width: 500px; padding-right: 20px;}
#TopTopics li.TwoColumn div.RightColumn { width: 250px;}

#TopTopics li.TwoColumn div span {
	display: inline-block;
	/display: inline;
	/zoom: 1;
	width: 120px;
	font-weight: bold;
	font-size: 77%;
	text-align: center;
	line-height: 140%;
	vertical-align: top;
}

#TopTopics li.TwoColumn div span em {
	display: inline-block;
	/display: inline;
	/zoom: 1;
}

#TopTopics li div a img:hover {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
}



/*===== ■*.Clear Release  =====*/
#TopTopics li:after,
body#Top #MediaBox #BtnMediaType:after,
body#Top #SampleBox dl dd.BtnSampleBox:after,
body#Top #CdDvdBook .ItemBox:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}

body#Top #TopTopics li,
body#Top #MediaBox #BtnMediaType,
body#Top #SampleBox dl dd.BtnSampleBox,
body#Top #CdDvdBook .ItemBox {
	display: inline-block;
}

/* Hides from IE-mac ￥*/
*html #TopTopics li,
*html body#Top #MediaBox #BtnMediaType,
*html body#Top #SampleBox dl dd.BtnSampleBox,
*html body#Top #CdDvdBook .ItemBox {
	height: 1%;
}

body#Top #TopTopics li,
body#Top #MediaBox #BtnMediaType,
body#Top #SampleBox dl dd.BtnSampleBox,
body#Top #CdDvdBook .ItemBox {
	display: block;
}
/* End hides from IE-mac ￥*/