﻿@charset "UTF-8";

/* ----------------------------------------
	Grouped Table View
---------------------------------------- */

.groupedTableView{
	width:100%;
	background-color:#FFF;
	border:1px solid #CCC;
	border-radius: 6px !important;
	-webkit-border-radius: 6px;
	border-collapse:separate;
	border-spacing:0;

	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
	
}

.groupedTableView td{
	/*padding:8px;*/
	padding:8px 0;
}

.groupedTableView td p{
	margin:0 8px;
}

.groupedTableView .gTV-itemCell td{
	border-top:1px solid #CCC;
}
.groupedTableView .gTV-itemCell td.courseTd {
	padding-left: 48px;
}
.groupedTableView .gTV-itemCell td.courseTd.selected {
	background-image:url(http://i.fod.fujitv.co.jp/pc/image/new_img/icons-sprite.png);
	background-repeat: no-repeat;
	background-size: 60px 1600px;
	-webkit-background-size: 60px 1600px;
	background-position: 7px -995px;
}

.groupedTableView tbody .gTV-itemCell:first-child td{
	border:none;
}

.groupedTableView .itemTitle{ 
	margin-bottom: 4px;
	font-size: 16px;
	line-height: 18px;
	font-weight:bold;
}


/* ----------------------------------------
	My Menu Navigation
---------------------------------------- */

#mymenu-nav{
	padding:12px;
}

#mymenu-nav ul{
	background-color:#ebeae8;
	border:1px solid #CCC;
	border-radius: 6px !important;
	-webkit-border-radius: 6px;
	
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.4);
	-webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.4);
}
@media only screen and (min-width: 1px) {
	#mymenu-nav ul{
		border-width:0;
	}
}

#mymenu-nav ul li#userInfo{
	height:45px;
	border-radius: 6px 6px 0 0 !important;
	-webkit-border-radius: 6px 6px 0 0 !important;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-mymenu-point.png);
	background-repeat: repeat-x;
	background-size: 2px 60px;
	-webkit-background-size: 2px 60px;
	background-position: 0 0;
	padding:10px 8px 4px 8px;
}

#mymenu-nav ul li#userInfo #loginIDtype{
	color:#888;
	margin-bottom:4px;
	text-align:center;
}
#mymenu-nav ul li#userInfo #holdPoint{
	color:#444;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	-webkit-text-shadow: 0px 1px 0px #FFF;
	text-shadow: 0px 1px 0px #FFF;
}
#mymenu-nav ul li#userInfo #holdPoint .point{
	color:#4d94ff;
	font-size:18px;
	margin:0 4px;
}

#mymenu-nav ul li{
	border-top:1px solid #FFF;
	border-bottom:1px solid #b0afae;
}

#mymenu-nav ul li a{
	display:block;
	padding:13px 8px 13px 48px;
	
	font-size:14px;
	font-weight:bold;
	
	-webkit-text-shadow: 0px 1px 0px rgba(255, 255, 255, 1);
	text-shadow: 0px 1px 0px rgba(255, 255, 255, 1);
	
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/icons-sprite.png);
	background-repeat: no-repeat;
	background-size: 60px 1600px;
	-webkit-background-size: 60px 1600px;
}

#btnEditProf span{
	font-size:12px;
}

#mymenu-nav ul li#notice{
	height:25px;
	border-radius: 6px 6px 0 0 !important;
	-webkit-border-radius: 6px 6px 0 0 !important;
	background-color:#d1d1d1;
	background-size: 2px 60px;
	-webkit-background-size: 2px 60px;
	background-position: 0 0;
	padding:10px 8px 4px 8px;
}
#mymenu-nav ul li#notice{
	background-color:#d1d1d1;
}

#mymenu-nav ul li#notice #title{
	color:#444;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	-webkit-text-shadow: 0px 1px 0px #FFF;
	text-shadow: 0px 1px 0px #FFF;
}


#mymenu-nav #btnHistory{		background-position: 6px -395px;}
#mymenu-nav #btnCharge{			background-position: 6px -444px;}
#mymenu-nav #btnPointHistory{	background-position: 6px -493px;}
#mymenu-nav #btnEditCourse{		background-position: 6px -544px;}
#mymenu-nav #btnEditProf{		background-position: 6px -591px;}
#mymenu-nav #btnLogout{			background-position: 6px -643px;}
#mymenu-nav #btnGoCarrier{		background-position: 6px -241px;}

#mymenu-nav .btnAlert{			background-position: 6px -1390px; color:red;}


#mymenu-nav ul li a:hover{
	background-color:#d1d1d1;
	text-decoration: none;
}

#mymenu-nav ul li.current{
	border:none;
	background-color:#d1d1d1;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-mymenu-current.png);
	background-repeat: repeat-x;
	background-size: 2px 2px;
	-webkit-background-size: 2px 2px;
	background-position: 0 0;
}

#mymenu-nav li.first-child{	border-top:none;}
#mymenu-nav li.last-child{	border-bottom:none;}

.sideAdditionalLinks{
	padding:0 12px;
}
.sideAdditionalLinks p{
	margin-bottom:12px;
}

.sideAdditionalLinks .btn-gotoGuide span,
.sideAdditionalLinks .btn-gotoContact span{
	display:block;
	height:20px;
	line-height:20px;
	padding: 14px 8px 10px 48px;
	font-size:14px;
	font-weight:bold;
	text-align:left;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/icons-sprite.png);
	background-repeat: no-repeat;
	background-size: 60px 1600px;
	-webkit-background-size: 60px 1600px;
}
.sideAdditionalLinks .btn-gotoGuide span{	background-position: 6px -690px;}
.sideAdditionalLinks .btn-gotoContact span{	background-position: 6px -739px;}


/* ----------------------------------------
	購入確認
---------------------------------------- */

/*購入コンテンツ詳細*/
.target-content-area{
	padding:12px;
}

.lBtype-buy img.lB-thumbnail {
	width:160px;	height:120px;
	background-size: 160px 120px;
	-webkit-background-size: 160px 120px;
}

.lBtype-buy .lB-program-title,
.lBtype-buy .lB-episode-title,
.lBtype-pack .lB-program-title,
.lBtype-pack .lB-episode-title,
.lBtype-episode .lB-program-title,
.lBtype-episode .lB-episode-title{
	font-size:16px;
	font-weight:bold;
	margin-bottom:6px;
}

.lBtype-buy .lB-rightData{
	padding-left:172px;
	min-height: 120px;
	font-size:14px;
	line-height:18px;
}

.target-content-area .sell-data{
	margin: 6px 0;
	font-size:14px;
	color:#666;
}

.target-content-area .sell-data span{
	font-weight:bold;
}

.operation-area.section{
	padding-top:16px;
	padding-bottom:4px;
}

.operation-area .msg-area{
	font-size:14px;
	margin-bottom:8px;
	color:#666;
}
.operation-area .msg-area span{
	font-weight:bold;
}

.operation-area .shortage-pt{
	font-weight:bold;
	color:#ff0000;
}

.operation-area .commonBtn{
	margin:12px 0;
	width:444px;
}

.operation-btn-list li{
	margin-bottom: 12px;
}

.operation-area .registerBtn-buy {
	width:444px;
	height:60px !important;
	line-height:60px !important;
	font-size: 16px;
}

.operation-area .registerBtn-charge {
	width:444px;
	height:60px !important;
	line-height:60px !important;
	font-size: 16px;
}

.operation-area .registerBtn-goCharge{
	height:60px !important;
	line-height:60px !important;
}

.operation-area .RatingBuyBtn {
	width:444px;
	height:60px !important;
	line-height:30px !important;
	font-size: 16px;
}

/* ----------------------------------------
	チャージポイントリスト / 月額コースリスト
---------------------------------------- */

#course_box{
	
}

#course_box .groupedTableView .btn,
#course_box2 .groupedTableView .btn{
	width:196px;
}

#course_box .groupedTableView .btn a,
#course_box2 .groupedTableView .btn a{
	display: block; 
	width:180px;
	height:44px;
	line-height:44px;
	text-align: center;
	font-size: 16px;
	font-weight:bold;
	color:#FFF;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	border-width:0;
	background-color:transparent;
	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btn-cmnListBtn.png);
	background-repeat: no-repeat;
	background-size: 540px 100px;
	-webkit-background-size: 540px 100px;
	background-position: 0 0;
	
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4), 0px 1px 0px 0px rgba(255, 255, 255, 0.30) inset, 0px -1px 0px 0px rgba(0, 0, 0, 0.35) inset;
	-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 1px 0px 0px rgba(255, 255, 255, 0.30) inset, 0px -1px 0px 0px rgba(0, 0, 0, 0.35) inset;
	-webkit-text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
	text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
	padding:0 0;
	margin:0 8px;
}

#course_box .groupedTableView .btn a:hover,
#course_box2 .groupedTableView .btn a:hover{	background-position: 0 -50px;	text-decoration: none;}

#course_box .groupedTableView .btn_cancel  a,
#course_box2 .groupedTableView .btn_cancel a{
	background-position: -360px 0;
}

#course_box .groupedTableView .btn_cancel a:hover,
#course_box2 .groupedTableView .btn_cancel a:hover{	background-position: -360px -50px;	text-decoration: none;}



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

	#mymenu-nav ul li#userInfo{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-mymenu-point@2x.png);}
	#mymenu-nav ul li a{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/icons-sprite@2x.png);}
	#mymenu-nav ul li.current{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/bg-mymenu-current@2x.png);}
	.sideAdditionalLinks .btn-gotoGuide span,
	.sideAdditionalLinks .btn-gotoContact span{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/icons-sprite@2x.png);}
	#course_box .groupedTableView .btn a{	background-image: url(http://i.fod.fujitv.co.jp/pc/image/new_img/btn-cmnListBtn@2x.png);}

}



/* 201307 */
.lBtype-pack.history .lB-rightData .lB-title {
	font-size: 16px;
}
.history .listBox a.lB-wrapLink {
	min-height: initial;
}
.history .listBox .lB-lowBox .lb-length p {
	font-size: 14px;
	margin: 6px 0;
}
table.pointHistory {
	margin-bottom:1em;
	margin-top:0.5em;
	padding: 0;
	border: 1px #999999 solid;
	border-collapse: collapse;
	width:100%;
}
table.pointHistory th {
	color: #555555;
	padding: 8px 10px;
	background: #e0e0e0;
	border-collapse: collapse;
	border: 1px #999999 solid;
	text-align: center;
}
table.pointHistory td {
	color: #555555;
	padding: 8px 10px;
	background: #FFF;
	border-collapse: collapse;
	border: 1px #999999 solid;
	text-align: center;
}
table.pointHistory td.tdRight {
	text-align: right;
}
.sampleMovieBtn {
	width: 250px;
	font-size: 12px;
}
.importantText {
	font-size: 14px;
	font-weight:bold;
	color:#ff0000;
	margin-bottom: 8px;
}
.courseInfo {
	margin-bottom: 8px;
}
.payment {
	font-size:18px;
	padding-top: 8px;
	font-weight:bold;
	line-height: 24px;
	-webkit-text-shadow: 0px 1px 0px #fff;
	text-shadow: 0px 1px 0px #fff;
}
.payment span {
	font-size: 14px;
	font-weight: normal;
	margin-left: 2em;
}
.okCancelBtn {
	width: 324px;
	margin-right: auto;
	margin-left: auto;
}
.okCancelBtn li {
	font-size: 16px;
	float: left;
	width: 150px;
	margin-right: 6px;
	margin-left: 6px;
}


/* ----------------------------------------
	完了画面
---------------------------------------- */
.complete .mainColumn
{
	text-align:center;
	width:100%;
	min-height:300px
}
.complete .procedure-notice
{
	background-image:none;
	margin:50px 0 40px 0;
}
.complete .okCancelBtn {
	width:140px
}
