@charset "utf-8";

/* ############################################################

	Styles description
	Last Up Date: 2011.11.10
	Author		: nobuhiro.saito
	
############################################################ */
/*
==========================================================

* leadArea style

==========================================================
*/
div.leadArea {
	padding: 0 20px;
	overflow: hidden; /* clearfix */
	zoom: 1; /* clearfix */
}
div.leadArea div.lead {
	float: left;
	width: 290px;
	margin-bottom: 20px;
	font-size: 82%
}
div.leadArea div.lead div.head {
	font-size: 110%;
	font-weight: bold;
}
div.leadArea div.flow {
	float: right;
	width: 380px;
	margin-bottom: 20px;
	padding: 8px 7px;
	border: #e9e9e9 solid 4px;
}
div.leadArea div.flow dt {
	background: url(../images/icon_circle.gif) no-repeat 0 50%;
	margin-bottom: 10px;
	padding: 2px 0 0 20px;
	font-weight: bold;
}
div.leadArea div.flow dd {
	margin-bottom: 10px;
}
div.leadArea div.flow dd ol {
	list-style: none;
	margin: 0;
	overflow: hidden; /* clearfix */
	zoom: 1; /* clearfix */
}
div.leadArea div.flow dd ol li {
	float: left;
}

/* button */
div.btnArea {
	margin-bottom: 30px;
	text-align: center;
}
div.btnArea a.btn {
	display: inline-block;
	margin-bottom: 10px;
	padding: 10px 10px;
	border: #ccc074 solid 1px;
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	background: #ffe437 url(../images/bg_btn.gif) repeat-x 0 0;
	font-weight: bold;
	text-decoration: none;
}
div.btnArea a.btn span.catch {
	padding-right: 5px;
	font-size: 82%;
	vertical-align: middle;
	color: #000000;
}
div.btnArea a.btn span.ttl {
	padding-left: 15px;
	background: url(../images/arrow_right_g.gif) no-repeat 0 50%;
	vertical-align: middle;
	color: #bf0000;
}
div.btnArea p {
	margin: 0;
}

/*
==========================================================

* unique style

==========================================================
*/
dl.totoSM {
	margin: 0;
}
dl.totoSM dt {
	font-weight: bold;
}
dl.totoSM dd {
	padding: 5px;
}
dl.totoSM dl.func {
	margin-top: 10px;
}
dl.totoSM dl.func dt {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: #000000 solid 1px;
	font-size: 123%;
	font-weight: bold;
	vertical-align: middle;
}
dl.totoSM dl.func dt span {
	display: inline-block;
	vertical-align: middle;
}
dl.totoSM dl.func dt span.icon {
	margin-right: 10px;
	padding: 4px 12px;
	background: #000000;
	color: #ffffff;
}
dl.totoSM dl.func dd {
	padding-left: 10px;
	line-height: 1.2;
}



/*
==========================================================

* STEP style

==========================================================
*/
ol.mainStep {
	margin: 0 0 20px 0;
	list-style: none;
}
ol.mainStep li.step {
	margin-bottom: 10px;
	padding: 0 20px;
	overflow: hidden; /* clearfix */
	zoom: 1; /* clearfix */
}
ol.mainStep li.step div.legend {
	float: left;
	width: 270px;
	padding-right: 20px;
	background: url(../images/bg_arrow_right_g.gif) no-repeat 100% 15px;
}
ol.mainStep li.step div.legend div.inner {
	margin-bottom: 10px;
	padding: 7px 7px 0 7px;
	border: #ffd900 solid 3px;
}
ol.mainStep li.step div.legend div.inner h3 {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: #000000 solid 1px;
	font-size: 123%;
	font-weight: bold;
	vertical-align: middle;
}
ol.mainStep li.step div.legend div.inner h3 span {
	display: inline-block;
	vertical-align: middle;
}
ol.mainStep li.step div.legend div.inner h3 span.icon {
	margin-right: 10px;
	padding: 4px 12px;
	background: #000000;
	color: #ffffff;
}
ol.mainStep li.step div.legend div.body {
	padding: 0 3px;
}
ol.mainStep li.step div.legend div.body p {
	margin: 0 0 15px 0;
}
ol.mainStep li.step div.legend div.body ul {
	margin-bottom: 15px;
}
ol.mainStep li.step div.legend div.body ul li {
	line-height: 1.2;
	margin: 0 0 5px 1em;
	text-indent: -1em;
}
ol.mainStep li.step div.legend div.body ul.attr {
	color: #bf0000;
}
ol.mainStep li.step div.legend div.body dl {
	margin-bottom: 15px;
}
ol.mainStep li.step div.legend div.body dt {
	font-weight: bold;
}
ol.mainStep li.step div.figure {
	float: right;
	width: 420px;
	padding-bottom: 50px;
	background: url(../images/arrow_down.gif) no-repeat 50% 100%;
}
ol.mainStep li.step div.figureInner {
	padding: 10px 0;
}
ol.mainStep li.step div.figureInner h4 {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: #000000 solid 1px;
	font-size: 123%;
	font-weight: bold;
	vertical-align: middle;
}
ol.mainStep li.step div.figureInner h4 span {
	display: inline-block;
	vertical-align: middle;
}
ol.mainStep li.step div.figureInner h4 span.icon {
	margin-right: 10px;
	padding: 4px 12px;
	background: #000000;
	color: #ffffff;
}
ol.mainStep li.step div.figureInner div.body {
	overflow: hidden; /* clearfix */
	zoom: 1; /* clearfix */
}
ol.mainStep li.step div.figureInner div.minFig {
	float: left;
	width: 200px;
}
ol.mainStep li.step div.figureInner div.minLeg {
	float: right;
	width: 210px;
}
ol.mainStep li.step div.figureBox {
	margin-top: 10px;
	padding: 7px 7px 0 7px;
	border: #ffd900 solid 3px;
}
ol.mainStep li.step div.figureBox h4 {
	margin-bottom: 10px;
	padding: 3px 5px 10px;
	border-bottom: #000000 solid 1px;
	font-size: 123%;
}
ol.mainStep li.step div.figureBox div.body {
	padding: 5px;
}
ol.mainStep li.step div.figureBox div.body p {
	margin-bottom: 15px;
}
ol.mainStep li.step div.last {
	padding-bottom: 10px;
	background: none;
}