@charset 'Shift_JIS';

/* - First{ Y.H } - Last{ Y.H } - Update{ 2010-01-28 } - About{ guide style of Item trade } */

/* guide
-------------------------------------------------- */
/* 共通 */
#bodyArea #cts_guide.contents{
clear:both;
width:644px;
margin:10px 0 0;
padding-bottom:10px;
color:#5c5350;
}
		#cts_guide.contents h2{
		height:26px;
		padding-left:0;
		border-bottom:none;
		background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_box-gry5_top.gif) left bottom no-repeat;
		}

#cts_guide.contents .ctsBox_bg{
position:relative;
width:634px;
padding:0 5px;
background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_box-gry5.gif) 0 0 repeat-y;
}
#cts_guide.contents .ctsBox_bg:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; }

#cts_guide.contents img{
vertical-align:bottom;
}



/* about（交換所とは）
------------------------ */
/* about */
.contents #about{
clear:both;
width:644px;
margin:0 0 15px;
padding-bottom:5px;
background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_box-gry5_btm.gif) left bottom no-repeat;
}
.contents #about .ctsBox_bg{
width:634px;
padding:0 5px;
}
		.contents #about .ctsBox_bg:after{ content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden; }
		.contents #about .ctsBox_bg h3{
		padding-top:14px;
		color:#333;
		}
		.contents #about .ctsBox_bg p{
		padding:12px 20px 14px 20px;
		color:#333;
		}
		.contents #about img{
		float:left;
		padding-right:15px;
		}


/* types */
.contents #types{
clear:both;
width:644px;
margin:0 0 15px;
padding-bottom:5px;
background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_box-gry5_btm.gif) left bottom no-repeat;
}
.contents #types .ctsBox_bg{
width:634px;
padding:14px 5px 5px;
}
		.contents #types .ctsBox_bg:after{ content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden; }
		.contents #types .ctsBox_bg h3{
		padding:10px 20px 5px;
		}
		.contents #types .ctsBox_bg p{
		padding:0 20px 5px;
		}

.contents #types .ctsBox_bg p.goTo{
padding:5px 10px 5px 0;
text-align:right;
}
.contents #types .ctsBox_bg p.goTo a{
font-size:11px;
text-decoration:none;
}
.contents #types .ctsBox_bg p.goTo a:hover{
text-decoration:underline;
}


/* tradeBox */
.contents #types .ctsBox_bg .tradeBox{
margin:0 10px;
padding:10px;
background:#f6f6f6;
margin-bottom:5px;
}
.contents #types .ctsBox_bg .tradeBox h3{
clear:both;
}
		.contents #types .ctsBox_bg .tradeBox strong{
		color:#f0783d;
		font-weight:normal;
		}
		.contents #types .ctsBox_bg .tradeBox p{
		padding:0;
		}
		/* list */
		.contents #types .ctsBox_bg .tradeBox ul.list{
		width:100%;
		overflow:hidden;
		padding-bottom:5px;
		}
		.contents #types .ctsBox_bg .tradeBox ul.list:after{ content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden; }
		.contents #types .ctsBox_bg .tradeBox ul.list li{
		float:left;
		margin-right:10px;
		padding-left:10px;
		background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_blet_555) 3px 6px no-repeat;
		}
		/* flowBox */
		.contents #types .ctsBox_bg .tradeBox ul.flowBox{
		width:100%;
		overflow:hidden;
		}
		.contents #types .ctsBox_bg .tradeBox ul.flowBox:after{ content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden; }
		.contents #types .ctsBox_bg .tradeBox ul.flowBox li{
		float:left;
		}


/* Flow(交換所の使い方・交換ボックスでの取引)
------------------------ */
.contents #flow{
clear:both;
width:644px;
margin:0 0 15px;
padding-bottom:5px;
background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_box-gry5_btm.gif) left bottom no-repeat;
}
.contents #flow p{
padding-right:20px;
}
.contents #flow .ctsBox_bg{
width:619px;
padding:20px 0 20px 25px;
}

.contents #flow .stepBox{
position:relative;
width:auto;
padding:20px 0;
background:url(//images.hange.jp/hangame/shop/itemtrade/guide/pic_line.gif) left bottom no-repeat;
}
		.contents #flow .stepBox.end{
		background:none;
		padding-bottom:0;
		}
		.contents #flow .stepBox h3{
		color:#333;
		margin-bottom:-5px;
		}
		.contents #flow .stepBox .step{
		width:619px;
		overflow:hidden;
		padding-top:15px;
		}
		.contents #flow .stepBox .step:after{ content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden; }
		.contents #flow .stepBox .step strong,
		.contents #flow .stepBox .step em{
		color:#f00;
		font-style:normal;
		}
		.contents #flow .stepBox .step img{
		float:left;
		padding-right:10px;
		}
		.contents #flow .stepBox .step h4,
		.contents #flow .stepBox .step h5,
		.contents #flow .stepBox .step p{
		float:right;
		width:334px;
		padding-right:20px;
		}
		.contents #flow .stepBox .step h4,
		.contents #flow .stepBox .step h5{
		height:20px;
		color:#555;
		font-weight:bold;
		line-height:1.1;
		padding-bottom:0;
		}
		.contents #flow .stepBox .step p{
		padding-bottom:15px;
		}
		.contents #flow .stepBox .step p strong{
		color:#f0783d;
		font-weight:normal;
		}
		.contents #flow .stepBox .step .goTo{
		padding-top:5px;
		}


/* question（よくある質問）
------------------------ */
.contents #question{
clear:both;
width:644px;
margin:0 0 15px;
padding-bottom:5px;
background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_box-gry5_btm.gif) left bottom no-repeat;
}
.contents #question .ctsBox_bg{
width:624px;
padding:20px 0 13px 20px;
}
.contents #question .ctsBox_bg p{
padding:12px 0 14px;
}
		.contents #question .ctsBox_bg p.goTo{
		height:41px;
		padding:0;
		background:url(//images.hange.jp/hangame/shop/itemtrade/guide/bg_question.gif) center bottom no-repeat;
		text-align:center;
		}