@charset "utf-8";
/*--------------------------------------
	e-CAPCOM 買い物フロー関係ページ用CSS

	2008/12/29 version 1.00
--------------------------------------*/

/* 画面遷移 */

#CP_mainSpan ul.shoppingStep{
	width: 700px;
	margin: 0 auto;
	background: url(../images/SP/flowBack.gif) no-repeat left top;
}

#CP_mainSpan ul.shoppingStep li{
	display: inline;
}


/* ヘッダー */

#CP_mainSpan .shopHead{
	color:#3366ff;
	font-size:140%;
	font-weight:bold;
	text-align:center;
	padding:10px 0 20px;
}

#CP_mainSpan h3.loginHead{
	color:#3366FF;
	font-size:130%;
	font-weight:bold;
	text-align:center;
}


/* 操作方法についてのワンポイント説明 */

#CP_mainSpan table.shopPoint{
	width: 690px;
	margin: 10px auto;
	font-size:90%;
}

#CP_mainSpan table.shopPoint th{
	padding: 5px ;
	border: 1px solid #ccc;
	background-color: #e0e0e0;
}


#CP_mainSpan table.shopPoint td{
	padding: 5px;
	border: 1px solid #ccc;
	background-color: #ffffff;
}



/* 購入商品一覧（縦配置）*/

#CP_mainSpan table.shop{
	width: 690px;
	margin: 0 auto 10px;
}

#CP_mainSpan table.shop caption{
	padding: 5px;
	border-top: 1px solid #089dcb;
	border-left: 1px solid #089dcb;
	border-right: 1px solid #089dcb;
	font-weight: bold;
	text-align:center;
	vertical-align: middle;
	background:url(../images_common/mainContent_caption_back.gif) repeat-x left top;
	color:#333;
}

#CP_mainSpan table.shop th{
	padding: 5px;
	border: 1px solid #ccc;
	font-weight: bold;
	text-align:center;
	vertical-align: middle;
	background-color: #e8f6ff;
}

#CP_mainSpan table.shop tr{
	text-align:center;
}

#CP_mainSpan table.shop td{
	padding: 5px;
	border: 1px solid #ccc;
	vertical-align: middle;
	background-color: #ffffff;
}

#CP_mainSpan table.shop td.imageArea{
	width:110px;
	margin:0 auto;
	text-align:center;
}

#CP_mainSpan table.shop td.imageArea img{
}

#CP_mainSpan table.shop td.name{
	text-align:left;
}

/*#CP_mainSpan table.shop td.other{
	width:80px;
}*/

#CP_mainSpan table.shop td.price{
	text-align:right;
	/*width:80px;*/
	width:100px;
}

#CP_mainSpan table.shop td.quantity{
	/*width:30px;*/
	width:80px;
	margin:0 auto;
	text-align:center;
}

#CP_mainSpan table.shop td.priceSum{
	width:150px;
	text-align:right;
}

#CP_mainSpan table.shop td.quantity input{
	text-align:right;
	width:20px;
}

#CP_mainSpan table.shop td.changeButton{
	width:60px;
	margin:0 auto;
	text-align:center;
}

#CP_mainSpan table.shop td.changeButton input{
	width:50px;
	margin:5px 0;
}

/* 商品テーブル（小） */
#CP_mainSpan table.shopSmall{
	width: 100%;
	margin: 10px auto;
}

#CP_mainSpan table.shopSmall th{
	padding: 5px;
	border: 1px solid #ccc;
	font-weight: bold;
	text-align:center;
	vertical-align: middle;
	background-color: #e8f6ff;
}

#CP_mainSpan table.shopSmall tr{
	text-align:center;
}

#CP_mainSpan table.shopSmall td{
	padding: 5px;
	border: 1px solid #ccc;
	vertical-align: middle;
	background-color: #ffffff;
}



/* 特典部分 */

#CP_mainSpan table.privilege{
	width: 680px;
	margin: 0 auto 10px;
	font-size:90%;
	border: 1px solid #ccc;
}

#CP_mainSpan table.privilege th{
	font-weight:bold;
	color:#0066ff;
	font-size:120%;
	text-align:center;
	background:#e0e0e0;
	padding:5px 0;
	border: 1px solid #ccc;
}

#CP_mainSpan table.privilege td{
	padding: 5px;
	background-color: #ffffff;
	vertical-align: middle;
	font-size:90%;
}

#CP_mainSpan table.privilege td.seg{
	border-left:1px solid #ccc;
}

#CP_mainSpan table.privilege td ul{
	padding: 5px;
}

#CP_mainSpan table.privilege td ul li{
	list-style-type:disc;
	list-style-position: outside;
	padding: 2px 0px 2px;
	margin-left:5px;
}



/* ゲスト情報入力 */

#CP_mainSpan table.resist{
	width: 690px;
	margin: 10px auto;
}

#CP_mainSpan table.resist caption{
	padding: 5px;
	border-top: 1px solid #089dcb;
	border-left: 1px solid #089dcb;
	border-right: 1px solid #089dcb;
	font-weight: bold;
	text-align:center;
	vertical-align: middle;
	background:url(../images_common/mainContent_caption_back.gif) repeat-x left top;
	color:#fff;
}

#CP_mainSpan table.resist th{
	width: 160px;
	padding: 5px 5px 5px 25px;
	border: 1px solid #ccc;
	font-weight: bold;
	vertical-align: middle;
	background-color: #e8f6ff;
}


#CP_mainSpan table.resist td{
	padding: 5px 5px 5px 15px;
	border: 1px solid #ccc;
	vertical-align: middle;
	background-color: #ffffff;
}


/* その他 */

#CP_mainSpan .allDelete{
	margin:0 auto;
	width:690px;
	text-align:right;
}

#CP_mainSpan .button{
	text-align: center;
}


#CP_mainSpan .button input{
	padding: 0 20px 10px;
}


#CP_mainSpan .login350Left{
	width: 350px;
	margin-left:10px;
	text-align:center;
	float:left;
}

#CP_mainSpan .login350Right{
	width: 350px;
	margin-right:10px;
	text-align:center;
	float:right;
}

#CP_mainSpan .mainBox350{
	width: 340px;
	height:115px;
	padding: 0 10px;
	margin: 0 auto;
	vertical-align:middle;
	background: url(../images_common/mainContent_back350_middle.gif) no-repeat top left;
}

#CP_mainSpan .caption350{
	color:#3366ff;
	font-weight:bold;
	font-size:90%;
	padding:10px 0;
	line-height:1.6;
}

#CP_mainSpan .necessary{
	padding-left: 25px;
	color: #ff6600;
	background: url(../images_common/icon_necessary.gif) no-repeat 5px center;
}

#CP_mainSpan .wide80{
	width:80px;
}

#CP_mainSpan .wide500{
	width:500px;
}

#CP_mainSpan .autoMargin{
	margin:0 auto;
}

#CP_mainSpan table.shop th.totalPayHead{
	font-weight:bold;
	text-align:right;
	letter-spacing: 0.4em;
}

#CP_mainSpan table.shop th.totalPayHeadFinal{
	border:3px double #333;
	font-weight:bold;
	text-align:right;
	letter-spacing: 0.4em;
	background:#e0f0ff;
}

#CP_mainSpan table.shop td.totalPay{
	width:300px;
	font-size:110%;
	text-align:right;
	padding-right:20px;
	letter-spacing: 0.4em;
}

#CP_mainSpan table.shop td.totalPayFinal{
	border:3px double #333;
	width:400px;
	font-size:110%;
	text-align:right;
	letter-spacing: 0.4em;
	padding-right:20px;
	background:#e0f0ff;
	color:#cc0000;
	font-weight:bold;
}

/* 2009.06.09 追加分 */

#CP_mainSpan .centerContent{
	padding-bottom: 5px;
	margin: 0 20px 0;
	overflow: hidden;
}


#CP_mainSpan .itemBoxTop{
	position: relative;
	float: left;
	width: 120px;
	height: 220px;
	margin: 0 0 0 20px;
}

#CP_mainSpan .itemBox{
	position: relative;
	float: left;
	width: 120px;
	height: 220px;
	margin: 25px 0 0 20px;
}

#CP_mainSpan .itemIcon{
	position: absolute;
	left: -5px;
	top: -5px;
}


#CP_mainSpan .itemText{
	padding: 5px 0 10px 0;
	font-size: 75%;
	display: block;
	height:50px;
}

#CP_mainSpan .itemText img{
	vertical-align:text-bottom;
	padding-right:3px;
}

#CP_mainSpan .itemPrice{
	padding: 5px 0 10px 0;
	text-align:center;
	font-weight:bold;
	color:#ff3300;
	display: block;
	font-size: 90%;
}

#CP_mainSpan .itemStock{
	display: block;
	height:14px;
}

#CP_mainSpan .itemStock .soldOut{
	text-align:center;
	color:#ffffff;
	background:#333;
	display: block;
	font-size: 90%;
}


#CP_mainSpan .itemCategory{
	padding: 3px;
	margin: 3px 0 0 0;
	border-left: 5px solid #888;
	font-family: verdana;
	font-size: 70%;
	color: #333;
	display: block;
	text-align: left;
	background: #ccc;
}

#CP_mainSpan .itemMachine{
	padding: 3px;
	margin: 3px 0 0 0;
	border-left: 5px solid #888;
	font-family: verdana;
	font-size: 70%;
	color: #333;
	display: block;
	text-align: left;
	background: #ccc;
}


/* for IE7 */
*+html .mainContent {
	overflow: auto;
}