﻿@charset "UTF-8";

/* CSS Document */
/*--------------------------------------
  Body Module
---------------------------------------*/

#fodHeaderWrap{
	height:90px;
	width:100%;
	min-width:1024px;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-header.png);
	background-repeat: repeat-x;
	background-size: 2px 90px;
	-webkit-background-size: 2px 90px;
	background-position: 0 0;
}

#fodHeader{
	margin:0 auto;
	height:90px;
	width:1024px;
	position:relative;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-header-sub.png);
	background-repeat: no-repeat;
	background-size: 1024px 36px;
	-webkit-background-size: 1024px 36px;
	background-position: center 0;
}

#fodLogo{
	width:150px;
	position:absolute;
	top:0; left:12px;
	z-index:9;
}
#fodLogo a{
	display:block;
	height:90px;
	width:118px;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/fod_logo_201604.png);
	background-repeat: no-repeat;
	background-size: 118px 90px;
	-webkit-background-size: 118px 90px;
	background-position: 0 0;
	text-indent:-9999px;
}

#subMenu{
	height:36px;
	float:right;
	margin-right:12px;
}

#subMenu li{
	display:block;
	margin:0;
	float:left;
	background:transparent;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/line-submenu.png);
	background-repeat: no-repeat;
	background-size: 2px 24px;
	-webkit-background-size: 2px 24px;
	background-position: 0 center;
}

#subMenu li a{
	display:block;
	height:36px;
	padding:0 12px;
	font-size:13px;
	line-height:36px;
}

#subMenu .sm-firstChild{	background:none;}

#subMenu .fujiTop a{
	padding-left:36px;
	background:transparent;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/cxLogo-mini.png);
	background-repeat: no-repeat;
	background-size: 21px 20px;
	-webkit-background-size: 21px 20px;
	background-position: 12px 6px;
}

#subMenu .fujiMenu a{
	width:120px;
	padding-left:36px;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/ico-arrows.png);
	background-repeat: no-repeat;
	background-size: 80px 400px;
	-webkit-background-size: 80px 400px;
	background-position: 12px -68px;
}
#subMenu .fujiMenu a:hover{
	background-position: 12px -108px;
}

#fodHeaderTopBottom{
	position:absolute;
	width:100%;
	top:36px;
	height:54px;
	line-height:54px;
}

#fodHeaderTopBottom #btnMenu li{
	height:54px;
}
#fodHeaderTopBottom #btnMenu a{
	display:block;
	text-indent: -9999px;
	height:54px;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_201508.png);
	background-repeat:no-repeat;
	background-color:transparent;
	background-size: 1143px 108px;
	-webkit-background-size: 1143px 108px;
}

#fodHeaderTopBottom .signin{
	position:absolute;
	right:321px;
	width:185px;
}

#fodHeaderTopBottom li.login{
	position:absolute;
	right:502px;
	/*width:114px;*/
	width: 199px;
}

#fodHeaderTopBottom .mymenu{
	position:absolute;
	right:586px;
	width:131px;
}

#fodHeaderTopBottom .charge{
	position:absolute;
	right:454px;
	width:131px;
}

#fodHeaderTopBottom .bought{
	position:absolute;
	right:320px;
	width:133px;
}

#fodHeaderTopBottom .present{
	position:absolute;
	right:699px;
	width:131px;
}

#fodHeaderTopBottom .headerMaga{
	position:absolute;
	right:699px;
	width:153px;
}

#fodHeaderTopBottom .headerMagaLogin{
	position:absolute;
	right:699px;
	width:153px;
}

#fodHeaderTopBottom .login .present{
	position:absolute;
	right:717px;
	width:131px;
}

#fodHeaderTopBottom .login .headerMaga{
	position:absolute;
	right:717px;
	width:153px;
}

#fodHeaderTopBottom .login .headerMagaLogin{
	position:absolute;
	right:717px;
	width:153px;
}

#fodHeaderTopBottom .signin a{	background-position:-638px 0;}
#fodHeaderTopBottom li.login a{	background-position:-524px 0;}
#fodHeaderTopBottom .mymenu a{	background-position:-131px 0;}
#fodHeaderTopBottom .charge a{	background-position:-262px 0;}
#fodHeaderTopBottom .bought a{	background-position:-393px 0;}
#fodHeaderTopBottom .present a,
#fodHeaderTopBottom .headerMaga a,
#fodHeaderTopBottom .headerMagaLogin a {
	background-position: 0px 0px;
}

#fodHeaderTopBottom #btnMenu li.login a {
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_login_20151215.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 199px 108px;
}

#fodHeaderTopBottom #btnMenu li.headerMaga a {
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_maga_login.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 154px 108px;
}

#fodHeaderTopBottom #btnMenu li.headerMagaLogin a {
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_maga.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 154px 108px;
}

#fodHeaderTopBottom #btnMenu li.login a:hover {
	background-position: 0px -54px;
}

#fodHeaderTopBottom #btnMenu li.headerMaga a:hover {
	background-position: 0px -54px;
}

#fodHeaderTopBottom #btnMenu li.headerMagaLogin a:hover {
	background-position: 0px -54px;
}

#fodHeaderTopBottom .signin a:hover{	background-position:-638px -54px;}
#fodHeaderTopBottom li.login a:hover{	background-position:-524px -54px;}
#fodHeaderTopBottom .mymenu a:hover{	background-position:-131px -54px;}
#fodHeaderTopBottom .charge a:hover{	background-position:-262px -54px;}
#fodHeaderTopBottom .bought a:hover{	background-position:-393px -54px;}
#fodHeaderTopBottom .present a:hover,
#fodHeaderTopBottom .headerMaga a:hover,
#fodHeaderTopBottom .headerMagaLogin a:hover {
	background-position: 0px -54px;
}

/*Genre Nav*/
#fodHeaderNav-wrap{
	height:40px;
	width:100%;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-genreNav.png);
	background-repeat: repeat-x;
	background-size: 2px 40px;
	-webkit-background-size: 2px 40px;
	background-position: 0 0;
	border-bottom:1px solid #f7f7f7;
}

#fodHeaderNav{
	margin:0 auto;
	height:40px;
	width:980px;
	position:relative;
}
#fodHeaderNav li{
	position:absolute;
}
#fodHeaderNav li a{
	display:block;
	height:40px;
	text-indent:-9999px;
	background-color:transparent;
	background-repeat: no-repeat;
	background-position-y:0;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/genreNav-items_201509.png);
	background-size: 1024px 120px;
	-webkit-background-size: 1024px 120px;
}

#fodHeaderNav li a:hover{
	background-position-y:-40px;
}
#fodHeaderNav li a:active{
	background-position-y:-80px;
}

#fodHeaderNav li.drama{ width: 141px; left:0px;}
#fodHeaderNav li.variety{ width: 139px; left: 141px;}
#fodHeaderNav li.anime{ width: 141px; left: 280px;}
#fodHeaderNav li.movie_menu{ width: 134px; left: 421px;}
#fodHeaderNav li.sports{ width: 148px; left: 555px;}
#fodHeaderNav li.announcer{ width: 137px; left: 703px;}
#fodHeaderNav li.webOnly{ width: 141px; left: 840px;}

#fodHeaderNav li.drama a{ background-position: -13px 0;}
#fodHeaderNav li.variety a{ background-position: -154px 0;}
#fodHeaderNav li.anime a{ background-position: -293px 0;}
#fodHeaderNav li.movie_menu a{ background-position: -434px 0;}
#fodHeaderNav li.sports a{ background-position: -568px 0;}
#fodHeaderNav li.announcer a{ background-position: -716px 0;}
#fodHeaderNav li.webOnly a{ background-position: -853px 0;}

#fodHeaderNav li.drama a:hover{ background-position: -13px -40px;}
#fodHeaderNav li.variety a:hover{ background-position:-154px -40px;}
#fodHeaderNav li.anime a:hover{ background-position:-293px -40px;}
#fodHeaderNav li.movie_menu a:hover{ background-position:-434px -40px;}
#fodHeaderNav li.sports a:hover{ background-position:-568px -40px;}
#fodHeaderNav li.announcer a:hover{ background-position:-716px -40px;}
#fodHeaderNav li.webOnly a:hover{ background-position:-853px -40px;}

#fodHeaderNav li.drama a:active{ background-position: -13px -80px;}
#fodHeaderNav li.variety a:active{ background-position:-154px -80px;}
#fodHeaderNav li.anime a:active{ background-position:-293px -80px;}
#fodHeaderNav li.movie_menu a:active{ background-position:-434px -80px;}
#fodHeaderNav li.sports a:active{ background-position:-568px -80px;}
#fodHeaderNav li.announcer a:active{ background-position:-716px -80px;}
#fodHeaderNav li.webOnly a:active{ background-position:-853px -80px;}

#fodHeaderNav li.drama a.current{ background-position: -13px -80px;}
#fodHeaderNav li.variety a.current{ background-position:-154px -80px;}
#fodHeaderNav li.anime a.current{ background-position:-293px -80px;}
#fodHeaderNav li.movie_menu a.current{ background-position:-434px -80px;}
#fodHeaderNav li.sports a.current{ background-position:-568px -80px;}
#fodHeaderNav li.announcer a.current{ background-position:-716px -80px;}
#fodHeaderNav li.webOnly a.current{ background-position:-853px -80px;}


/* ----------------------------------------
	Search Keyword Form
---------------------------------------- */

#SearchKeywordForm{
	position:absolute;
	width:296px;
	height:36px;
	top:9px;
	right:12px;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_201508.png);
	background-repeat:no-repeat;
	background-color:transparent;
	background-size: 1143px 108px;
	-webkit-background-size: 1143px 108px;
	background-position:-835px -9px;

}

input.keyword{
	position:absolute;
	border:none;
	background:transparent;
	width:240px;
	height:28px;
	font-size:14px;
	color:#999;
	line-height:28px;
	padding:4px 8px;
	top:0;
}

a.search-submit{
	position:absolute;
	display:block;
	width:32px;
	height:32px;
	top:2px;
	right:2px;
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/btn-search.png);
	background-repeat:no-repeat;
	background-color:transparent;
	background-size: 32px 64px;
	-webkit-background-size: 32px 64px;
	background-position:0 0;
}
a.search-submit:hover{	background-position:0 -32px;}
a.search-submit span{	display:none;}

#fod_popular_rank{
	line-height:24px !important;
	position:absolute !important;
	display: none;
	top:40px !important;
	left:-6px !important;
	width:308px;
	background:#FFF;
	background:rgba(255, 255, 255, 0.95);
	z-index:199;
	
	border:2px solid #e5ac73;
	border-radius:6px;
	-webkit-border-radius:6px;

	-webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.4);
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.4);
}

#fod_popular_rank li.rank_title{
	font-weight:bold;
	padding:4px 12px;
	background:none;
}

#fod_popular_rank li.rank_title:after{
	content: "";
	height: 0;
	position: absolute;
	width: 0;
	border: 12px solid transparent;
	border-width:12px 10px 12px 10px ;
	border-bottom-color: #FFF;
	top: -24px;
	left: 60px;
	z-index:88;
}
#fod_popular_rank li.rank_title:before{
	content: "";
	height: 0;
	position: absolute;
	width: 0;
	border: 12px solid transparent;
	border-width:14px 12px 14px 12px ;
	border-bottom-color: #e5ac73;
	top: -29px;
	left: 58px;
	z-index:77;
}

#fod_popular_rank li{
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/lines-content-296.png);
	background-repeat: no-repeat;
	background-size: 296px 2px;
	-webkit-background-size: 296px 2px;
	background-position: center top;
}
#fod_popular_rank li:hover{
	background-color:#fff9ed;
}
#fod_popular_rank li.rank_title:hover{
	background-color:transparent;
}

#fod_popular_rank a{
	position:static;
	display:block;
	width:auto;
	line-height: 14px;
	padding:11px 12px 11px 48px;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/ranking-numbers-kw.png);
	background-repeat: no-repeat;
	background-size: 45px 800px;
	-webkit-background-size: 45px 800px;
}
#fod_popular_rank li.rank1 a{	background-position: 4px 4px;}
#fod_popular_rank li.rank2 a{	background-position: 4px -76px;}
#fod_popular_rank li.rank3 a{	background-position: 4px -156px;}
#fod_popular_rank li.rank4 a{	background-position: 4px -236px;}
#fod_popular_rank li.rank5 a{	background-position: 4px -316px;}
#fod_popular_rank li.rank6 a{	background-position: 4px -396px;}
#fod_popular_rank li.rank7 a{	background-position: 4px -476px;}
#fod_popular_rank li.rank8 a{	background-position: 4px -556px;}
#fod_popular_rank li.rank9 a{	background-position: 4px -636px;}
#fod_popular_rank li.rank10 a{	background-position: 4px -716px;}

#fod_popular_rank a span{
	display:none;
}


/* ----------------------------------------
	FUJITV common Menu  Custom for FOD 2013
---------------------------------------- */

/* fujitv-navi */
#fujitv-navi-wrap{
	width:100%; height:131px;
	min-width: 1024px;
	position:absolute;
	top:-131px; left:0; z-index:9999;
	overflow:hidden;
}
/*
#fujitv-navi-wrap #gbheader.compatMode{
	height:103px; margin-bottom:3px;
	overflow:hidden;
}
#fujitv-navi-wrap #gbheader.compatMode #gbhTop{
	height:35px;
	overflow:hidden;
}
*/
#fujitv-navi{
/*	height:106px;
	background-position:center 103px; background-repeat:repeat-x;
	overflow:hidden;
*/
	overflow:hidden;
	border-bottom:1px solid #999;
	-webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.4);
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.4);

}
#fujitv-navi-close-wrap{
	width:1024px; height:36px; margin:0 auto;
	position:relative;
	overflow:hidden;
	margin-top:-4px;
}
#fujitv-navi-close{
	display:block;
	margin-right:12px;
	width:160px; height:32px;
	padding-left:8px;
	text-indent:-999em;
	float:right;

	border-bottom:1px solid #999;
	border-left:1px solid #999;
	border-right:1px solid #999;
	border-radius:0 0 4px 4px;
	-webkit-border-radius:0 0 4px 4px;
	
	-webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.4);
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.4);
	
	line-height: 32px;
	text-align: center;
	font-size: 13px;
	color:#444;
	
	background-color:#FFF;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btn-fujimenu-close.png);
	background-repeat: no-repeat;
	background-size: 160px 60px;
	-webkit-background-size: 168px 64px;
	background-position: 0 0;
}
#fujitv-navi-close:hover{
	background-position: 0 -32px;
}


@media only screen and (min-width: 1px) {
	#fujitv-navi{
		border-width:0;
	}
	#fujitv-navi-close{
		border-width:0;
	}
}



/*2013 03/28 fujiMenu customize for FOD */
/*<a*/
#fujitv-navi-close {
	text-indent:0; 
}
#container{
	z-index:0;
	position:relative;
}
/* ----------------------------------------
	SNS
---------------------------------------- */
#fod_social_top span  {
	vertical-align: bottom;
	width: 70px;
	height: 20px;
	overflow: hidden;
	display: inline-block;
	margin-right: 5px;
}

#fod_social_episode span  {
	vertical-align: bottom;
	width: 70px;
	height: 20px;
	overflow: hidden;
	display: inline-block;
	margin-right: 5px;
}

/* ----------------------------------------
	電子書籍
---------------------------------------- */
#book #fodHeaderTopBottom #btnMenu a {
	background-image: url(http://i.fod.fujitv.co.jp/books/pc/image/book_btns-header_20151215.png);
	background-size: 1143px 108px;
}
#book #fodHeaderTopBottom #btnMenu li.login a {
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_login_20151215.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 199px 108px;
}
#book #fodHeaderTopBottom #btnMenu li.login a:hover {
	background-position: 0px -54px;
}

/* ----------------------------------------
	雑誌読み放題
---------------------------------------- */


#book #fodHeaderTopBottom #btnMenu li.headerMaga a {
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_maga_login.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 154px 108px;
}

#book #fodHeaderTopBottom #btnMenu li.headerMaga a:hover {
	background-position: 0px -54px;
}

#book #fodHeaderTopBottom #btnMenu li.headerMagaLogin a {
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_maga.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 154px 108px;
}

#book #fodHeaderTopBottom #btnMenu li.headerMagaLogin a:hover {
	background-position: 0px -54px;
}








/* ----------------------------------------------------------
 High-Resolution Diplay Support
 ---------------------------------------------------------- */
@media only screen and (-webkit-min-device-pixel-ratio: 2), 
only screen and (min-device-pixel-ratio: 2) {

	#fodHeaderWrap{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-header@2x.png);}
	#fodHeader{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-header-sub@2x.png);}
	#fodLogo a{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/fod_logo_201508@2x.png);}
	#subMenu li{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/line-submenu@2x.png);}
	#subMenu .fujiTop a{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/cxLogo-mini@2x.png);}
	#subMenu .fujiMenu a{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/ico-arrows@2x.png);}
	#fodHeaderTopBottom #btnMenu a{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_201508@2x.png);}
	#fodHeaderNav-wrap{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-genreNav@2x.png);}
	#fodHeaderNav li a{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/genreNav-items_201509@2x.png);}
	#SearchKeywordForm{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_201508@2x.png);}
	a.search-submit{	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/btn-search@2x.png);}
	#fod_popular_rank li{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/lines-content-296@2x.png);}
	#fod_popular_rank a{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/ranking-numbers-kw@2x.png);}
	#fujitv-navi-close{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btn-fujimenu-close@2x.png);}
	#book #fodHeaderTopBottom #btnMenu a { background-image: url(http://i.fod.fujitv.co.jp/books/pc/image/201508_book_btns-header@2x.png);}
	#fodHeaderTopBottom #btnMenu li.login a,
	#book #fodHeaderTopBottom #btnMenu li.login a {
		background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_login_20151215@2x.png);
	}
		#fodHeaderTopBottom #btnMenu li.headerMaga a,
		#book #fodHeaderTopBottom #btnMenu li.headerMaga a {
		background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_maga_login@2x.png);
	}
		#fodHeaderTopBottom #btnMenu li.headerMagaLogin a,
		#book #fodHeaderTopBottom #btnMenu li.headerMagaLogin a {
		background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btns-header_maga@2x.png);
	}

}