@charset "UTF-8";

/* ぺぺぺぺ */

body {
}

#container {
	background: url() #fff;
}

#contents {
}

	#contents #eyeCatch {
		background: url(/img/h_top.jpg) transparent no-repeat 0 0;
		height: 266px;
		position: relative;
	}

		#contents #eyeCatch h1 {
			width: 217px;
			text-indent: -99999px;
			overflow: hidden;
			position: absolute;
			top: 41px;
			left: 14px;
		}

		#contents #eyeCatch h1 a {
			display: block;
			height: 167px;
		}


		#contents #eyeCatch ul {
			position: absolute;
			left: 14px;
			bottom: 7px;

		}

			#contents #eyeCatch ul li {
				position: absolute;
				bottom: 0;
				text-indent: -99999px;
				overflow: hidden;
			}

			#contents #eyeCatch ul li a {
				display: block;
				height: 28px;
			}

			#contents #eyeCatch ul li#toGetBlogParts {
				width: 214px;
				left: 0;
			}

			#contents #eyeCatch ul li#toCheckRate {
				width: 190px;
				left: 217px;
			}

	#contents #main {
		background: url(/img/bg_topgra.gif) transparent no-repeat 0 0;
		padding: 12px 24px 2px 24px;
	}

		#contents #main #intro {
		}

		#contents #main #intro h3 {
			background: url(/img/h_dorekurai2.gif) transparent no-repeat 0 0;
			height: 43px;
			overflow: hidden;
			text-indent: -99999px;
		}

		#contents #main #intro .sectionBody {
			margin-top: 6px;
			margin-left: 51px;
		}


		#contents #main #flow {
			margin-top: 20px;
			position: relative;
			height: 159px;
		}

		#contents #main #flow li {
			position: absolute;
			top: 0;
			height: 159px;
			overflow: hidden;
			text-indent: -99999px;
		}

			#contents #main #flow li#flowStep1 {
				left: 0;
				background: url(/img/cp_flow_step1.gif) transparent no-repeat 0 0;
				width: 227px;
			}

			#contents #main #flow li#flowStep2 {
				left: 237px;
				background: url(/img/cp_flow_step2.gif) transparent no-repeat 0 0;
				width: 222px;
			}

			#contents #main #flow li#flowStep3 {
				left: 480px;
				background: url(/img/cp_flow_step3.gif) transparent no-repeat 0 0;
				width: 233px;
			}





	#contents #main #gotoPlay {
		margin-top: 22px;
		text-align: center;
		background-color: #fff;
	}

		#contents #main #gotoPlay a {
			display: block;
			background: url(/img/bt_play.gif) transparent no-repeat 0 0;
			width: 206px;
			height: 44px;
			margin: 0 auto;
			overflow: hidden;
			text-indent: -99999px;
			outline: none;
		}

		#contents #main #gotoPlay a:focus {
			-moz-outline-style: none;
		}

		#contents #main #gotoPlay a:hover {
			text-decoration: none;
		}

	#contents .section {
/*
		border-top: 2px solid #e5e5e5;
		margin: 18px auto 0 20px;
		padding-top: 18px;
*/
	}


	#contents #main #example {
		margin-top: 2px;
		border-top: 2px solid #e5e5e5;
		padding-top: 26px;
		position: relative;
	}

		#contents #main #example h4 {
			background: url(/img/h_example.gif) transparent no-repeat 0 0;
			width: 667px;
			height: 67px;
			overflow: hidden;
			text-indent: -99999px;
		}

		#contents #main #example img#cpEbisawa {
			display: block;
			width: 183px;
			height: 244px;
			position: absolute;
			top: 26px;
			right: -24px;
			z-index: 4;
		}


		#contents #main #example .sectionBody {
			position: relative;
			z-index: 5;
		}

		#contents #main #example table {
			border-collapse: separate;
			border-spacing: 0 8px;
		}

		#contents #main #example table caption {
			caption-side: top;
			text-align: left;
			padding-top: 22px;
			padding-bottom: 12px;
			color: #444;
		}

		#contents #main #example table td {
		}

		#contents #main #example table td.age {
			padding: 18px;
/*
			width: 336px;
			width: 300px;
*/
			padding-top: 46px;
			padding-bottom: 84px;
		}

		#contents #main #example table td.age div {
			position: relative;
			width: 300px;
		}

		#contents #main #example table td#age20,
		#contents #main #example table td#age40 {
			border-right: 9px solid #fff;
		}

		#contents #main #example table td#age30,
		#contents #main #example table td#age50 {
			border-left: 9px solid #fff;
		}

		#contents #main #example table td#age20 {
			background: url(/img/bg_example20.gif) transparent no-repeat 0 0;
		}

		#contents #main #example table td#age30 {
			background: url(/img/bg_example30.gif) transparent no-repeat 0 0;
		}

		#contents #main #example table td#age40 {
			background: url(/img/bg_example40.gif) transparent no-repeat 0 0;
		}

		#contents #main #example table td#age50 {
			background: url(/img/bg_example50.gif) transparent no-repeat 0 0;
		}

		#contents #main #example table td img.cpMan {
			position: absolute;
			right: -14px;
			bottom: -90px;
			z-index: 6;
		}


		#contents #main #example table table {
			background-color: transparent;
			border-collapse: collapse;
			border-spacing: 0;
			width: 100%;
		}

		#contents #main #example table table th,
		#contents #main #example table table td {
			line-height: 1.33;
			border: 0;
			border-bottom: 1px dotted #ccc;
			padding: 0;
			padding-top: 0.5em;
			padding-bottom: 0.2em;
		}

		#contents #main #example table table th {
			text-align: right;
			font-weight: bold;
			padding-right: 0.5em;
			white-space: nowrap;
		}

		#contents #main #example table table td {
			padding-right: 56px;
		}

		#contents #main #example table table .maximum th strong,
		#contents #main #example table table .maximum td span {
			color: #f33;
		}

		#contents #main #example table table .minimum th strong,
		#contents #main #example table table .minimum td span {
			color: #33f;
		}

#footer {
	margin-top: 0;
}




.guideBody {
}

.guideBody p {
	margin-bottom: 2em;
}

.guideBody #code {
	text-align: center;
	border: 2px solid #999;
	padding: 1em;
	margin-top: 40px;
	background-color: #ddd;
}

.guideBody #code h2 {
	background-color: #fff;
	width: 480px;
	border: 1px solid #ccc;
	margin: 0 auto 0.5em auto;
	font-size: 18px;
	font-weight: bold;
}

.guideBody #code textarea {
	width: 480px;
}

.guideBody h3 {
	font-size: 14px;
	margin-top: 2.5em;
	margin-bottom: 1em;
}

.guideBody ul li {
	margin-bottom: 3em;
}

.guideBody ul li img {
	vertical-align: top;
	border: 1px solid #ccc;
	margin-right: 1em;
	float: left;
}