@charset "Shift-JIS";

/* ----------------------------------
	リセット
---------------------------------- */

html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, em, img, small, strong, sub, sup, dl, dt, dd, ol, ul, li,
form, label, table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

body {
	line-height:1;
	font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
}

li {
	list-style-type: none;
}
a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
a:link, a:visited {
	color: #0066cc;
}
a:active, a:hover {
	color: #ff3300;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

hr {
	display:block;
	height:1px;
	border:0;   
	border-top:1px solid #cccccc;
	margin:1em 0;
	padding:0;
}

input, select {
	vertical-align:middle;
}
/* ----------------------------------
	基本
---------------------------------- */
.red {
	color: #ff0000 !important;
}
.bold {
	font-weight: bold;
}
.block {
	display:block;
}
.fleft{
	float: left !important;
}
.fright{
	float: right !important;
}
.clearfix {
	zoom: 1;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.tleft{
	text-align: left !important;
}
.tright{
	text-align: right !important;
}
.tcenter {
	text-align: center !important;
}
.mcenter {
	margin-left: auto !important;
	margin-right: auto !important;
}
.vmiddle{
	vertical-align: middle !important;
}
.mt05 {
	margin-top:5px !important;
}
.mt10 {
	margin-top:10px !important;
}
.mt15 {
	margin-top:15px !important;
}
.mt20 {
	margin-top:20px !important;
}
.mt25 {
	margin-top:25px !important;
}
.mt30 {
	margin-top:30px !important;
}
.mt35 {
	margin-top:35px !important;
}
.mt40 {
	margin-top:40px !important;
}
.mt45 {
	margin-top:45px !important;
}
.mt50 {
	margin-top:50px !important;
}
.mt55 {
	margin-top:55px !important;
}
.mt60 {
	margin-top:60px !important;
}
.mt70 {
	margin-top:70px !important;
}
.mt120 {
	margin-top:120px !important;
}

/* ----------------------------------
	ヘッダ
---------------------------------- */
#oHeader {
	width: auto;
	background: url(../img2/help_hbk.gif) top repeat-x;
	margin: 12px 12px 30px;
	padding: 0 8px 0 0;
	border-right: 1px solid #a6c5e9;
}
#oHeader img {
	float: right;
	display: block;
	zoom:1;
}
#oHeader img.hlogo {
	float: left;
}
#oHeader a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

/* ----------------------------------
	フッタ
---------------------------------- */
#oFooter {
	width: auto;
	background: #e6e6e6;
	margin: 12px;
}
#oFooter img {
	float: right;
}
#oFooter .flogo {
	float: left;
}

/* ----------------------------------
	レイアウト
---------------------------------- */
#MainWidth {
	margin: 12px auto;
	text-align: left;
	max-width: 950px;
}
.toTop {
	text-align: right;
	margin: 0 12px;
	padding: 20px 0 0;
	font-size: 70%;
}

/* ----------------------------------
	ナンバー画像
---------------------------------- */
img.sprite {
	background: url(../img2/sprite_number.png);
	vertical-align: middle;
}
img.sprite.num01 {
	background-position: 0 0;
}
img.sprite.num02 {
	background-position: -33px 0;
}
img.sprite.num03 {
	background-position: -66px 0;
}
img.sprite.num04 {
	background-position: -99px 0;
}
img.sprite.num05 {
	background-position: -132px 0;
}
img.sprite.num06 {
	background-position: -165px 0;
}
img.sprite.num07 {
	background-position: -198px 0;
}
img.sprite.num08 {
	background-position: -231px 0;
}
img.sprite.num09 {
	background-position: -264px 0;
}
img.sprite.num10 {
	background-position: -297px 0;
}
img.sprite2 {
	background: url(../img2/sprite_number2.gif);
	vertical-align: middle;
}
img.sprite2.num01 {
	background-position: 0 0;
}
img.sprite2.num02 {
	background-position: -18px 0;
}
img.sprite2.num03 {
	background-position: -36px 0;
}

/* ----------------------------------
	内容
---------------------------------- */
h1 {
	color: #333333;
	font-size: 30px;
	line-height: 1;
	margin: 0;
	padding: 20px 0;
}
h1 img {
	margin-right: 5px;
}
#MainWidth > p {
	font-size: 85%;
}
.stepBox {
	padding: 30px 0 0;
	font-size: 85%;
	line-height: 140%;
}
.stepBox .leftBox {
	float: left;
	width: 335px;
}
.stepBox .rightBox {
	float: right;
	padding-left: 15px;
	width: 600px;
}
.stepBox .rightBox img {
	border: 0px solid #999999;/*右側画像に枠線必要な場合は0指定 -> */
}
.stepBox .rightBox img.arrow2 {
	border:none;
	margin:15px auto 10px;
	display:block;
}
ul.step > li {
	padding-top: 10px;
	padding-left: 18px;
	text-indent:-18px;
}
.attention {
	margin: 0 12px;
	padding: 30px 0 0;
	font-size: 85%;
	line-height: 140%;
}
.attention li {
	padding-left: 1em;
	text-indent: -1em;
}



@media screen and (max-width:640px) {
	h1 {
		margin: 0 12px;
	}
	#MainWidth > p {
		margin: 0 12px;
	}
	.stepBox {
		margin: 0 12px;
	}
	.stepBox .leftBox {
		width: 100%;
		float:none;
		margin:0 0 20px 0;
	}
	.stepBox .rightBox {
		width: 100%;
		float:none;
		padding-left:0;
	}
	.stepBox .rightBox img {
		width: 100%;
		height: auto;
		margin: 0 auto;
	}
	.stepBox .rightBox img.arrow2 {
		width: 36px;
		height:31px;
	}
}


