@charset "utf-8";


/**************************************************************************************************
Initialization
**************************************************************************************************/
body,div,
dl,dt,dd,
ul,ol,li,
h1,h2,h3,h4,h5,h6,
table,td,th,
pre,code,
form,fieldset,legend,input,textarea,
p,blockquote {
	margin	: 0;
	padding	: 0;
}

body {
	font-size	: 12px;
	color		: #333333;
	font-family	: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Verdana,sans-serif;
}

table {
	border-collapse	: collapse;
	border-spacing	: 0;
}

fieldset,img {
	border	: 0;
}

img {
	vertical-align	: top;
}

ul,ol{
	list-style	: none;
}


address,caption,cite,code,dfn,th,var {
	font-style	: normal;
	font-weight	: normal;
}

input, textarea, select {
	padding		: 5px;
	font-weight	: normal;
	font-size	: 12px;
}

a img.img_alpha:hover{
	filter			: alpha(opacity=70);
	-moz-opacity	: 0.70;
	-khtml-opacity	: 0.70;
	opacity			: 0.70;
}


/* Clearfix CLASS
-------------------------------------------------------------------------------------------------*/
.Clearfix:after {
	display		: block;
	clear		: both;
	height		: 0;
	visibility	: hidden;
	content		: ".";
	line-height	: 0;
}

.Clearfix {
	display		: inline-table;
	min-height	: 1%;
}

/* FOR MAC IE \*/
* html .Clearfix {
	height	: 1%;
}
.Clearfix {
	display	: block;
}
/* END OF FOR MAC IE */


/* LINK
-------------------------------------------------------------------------------------------------*/
a:link,
a:active,
a:visited {
	color			: #B49164;
	text-decoration	: underline;
}
a:hover {
	color			: #FF7D00;
	text-decoration	: underline;
}


/* OUTLINE
-------------------------------------------------------------------------------------------------*/
#container{
	width		: 100%;
	background	: #F6F5F2;
}


/* HEADER
-------------------------------------------------------------------------------------------------*/
#header{
	width			: 100%;
	background		: #ffffff url(../img/header_back.png) repeat-x;
	padding-top		: 8px;
	border-bottom	: 1px solid #cccccc;
}

	#header_in{
		width		: 900px;
		margin		: 0 auto;
	}

		#header #header_in .left{
			float		: left;
			width		: 500px;
			padding-top	: 7px;
		}

		#header #header_in .right{
			float			: right;
			width			: 390px;
			text-align		: right;
			padding-right	: 10px;
		}

		#header #header_in .right h2{
			font-size		: 12px;
			font-weight		: normal;
			padding			: 2px 0;
			border-bottom	: 1px dotted #cccccc;
		}

		#header #header_in .right p{
			padding	: 10px 0;
		}


/* Menu
-------------------------------------------------------------------------------------------------*/

#menu{
	width		: 900px;
	height		: 43px;
	margin		: 5px auto 10px auto;
	background	: url(../img/menu_bar.png) no-repeat;
}

	#menu ul a{
		display		: block;
		overflow	: hidden;
		list-style	: none;
		width		: 151px;
		height		: 43px;
		float		: left;
		text-indent	: -900px;
	}

		#menu ul li.top a:hover{
			background-image	: url(../img/bt_top.png);
			background-position	: -151px 0;
		}

		#menu ul li.function a:hover{
			background-image	: url(../img/bt_function.png);
			background-position	: -302px 0;
		}

		#menu ul li.result a:hover{
			background-image	: url(../img/bt_result.png);
			background-position : -453px 0;
		}

		#menu ul li.mail a:hover{
			background-image	: url(../img/bt_mail.png);
			background-position	: -604px 0;
		}


/* MAINBANNER
-------------------------------------------------------------------------------------------------*/
#main{
	width		: 880px;
	height		: 300px;
	margin		: 5px auto 0 auto;
	background	: url(../img/main.png) no-repeat;
}

	 #loopslider {
		margin			: 0 auto;
		width			: 900px;
		height			: 150px;
		text-align		: left;
		position		: relative;
		top				: -120px;
		overflow		: hidden;
		margin-bottom	: -120px;
	}

		#loopslider ul {
			height		: 150px;
			float		: left;
			display		: inline;
			overflow	: hidden;
		}

			#loopslider ul li {
				float		: left;
				display		: inline;
				overflow	: hidden;
				width		: 150px;
			}

			#loopslider ul li img{
				height		: 140px;
				padding		: 2px;
				border		: 1px solid #cccccc;
				background	: #ffffff;
			}



/* =======================================
ClearFixElements
======================================= */
#main #loopslider ul:after {
	content		: ".";
	height		: 0;
	clear		: both;
	display		: block;
	visibility	: hidden;
}

#main #loopslider ul {
	display		: inline-block;
	overflow	: hidden;
}


/* CONTENTS
-------------------------------------------------------------------------------------------------*/
#contents{
	width	: 880px;
	margin	: 0 auto 20px auto;

}

	#contents .left{
		float		: left;
		width		: 640px;
		margin-top	: 20px;
	}

		#contents .left .banner{
			margin-bottom	: 20px;
		}

		#contents .left .func{
			width			: 640px;
			margin-bottom	: 30px;
		}

			#contents .left .func .func_a{
				width			: 310px;
				height			: 132px;
				float			: left;
				margin-bottom	: 10px;
			}

			#contents .left .func .func1{
				background		: url(../img/func_pc.png) no-repeat;
				margin-right	: 10px;
			}

			#contents .left .func .func2{
				background		: url(../img/func_smp.png) no-repeat;
				margin-left		: 10px;
			}

			#contents .left .func .func3{
				background		: url(../img/func_pickup.png) no-repeat;
				margin-right	: 10px;
			}

			#contents .left .func .func4{
				background		: url(../img/func_tweet.png) no-repeat;
				margin-left		: 10px;
			}

		#contents .left .func dl{
			padding-left	: 100px;
			padding-top		: 10px;

		}

			#contents .left .func dl dt{
				font-size	: 13px;
				color		: #FF7D00;
				font-weight	: bold;
				border-bottom	: 1px dotted #cccccc;
				padding-bottom	: 3px;
				margin-bottom	: 3px;
			}

			#contents .left .func dl dd{
				font-size	: 10px;
			}

		#contents .left .title1{
			background	: url(../img/title1.png) no-repeat;
			width		: 640px;
			height		: 35px;
		}

			#contents .left .title1 h3{
				font-size	: 15px;
				color		: #ffffff;
				float		: left;
				width		: 570px;
				text-indent	: 50px;
				line-height	: 40px;
			}

		#contents .left p{
			float		: right;
			width		: 70px;
			padding-top	: 7px;
		}

		#contents .left .hplist{
			margin	: 20px 0 30px 0;
		}

			#contents .left .hplist dl{
				float		: left;
				width		: 200px;
				border		: 1px solid #cccccc;
				margin		: 0 5px 10px 6px;
				background	: #FFFFFF;
			}

				#contents .left .hplist dl:hover{
					background	: #FFEDAD;

				}

				#contents .left .hplist dl dt{
					width	: 180px;
					margin	: 0 auto;
					padding	: 10px 0;
				}

				#contents .left .hplist dl dd{
					padding		: 0 0 10px 0;
					text-align	: center;

				}

		#contents .left .oshiraselist{
			margin	: 20px 0 30px 0;
		}

			#contents .left .oshiraselist dl{}

				#contents .left .oshiraselist dl dt{
					clear			: left;
					float			: left;
					width			: 120px;
					color			: #FF7D00;
					font-weight		: bold;
					background		: url(../img/list_arrow.png) no-repeat center left;
					text-indent		: 20px;
					padding			: 10px 0;
				}

				#contents .left .oshiraselist dl dd{
					border-bottom	: 1px dotted #cccccc;
					padding			: 10px 0 10px 120px;
				}

	#contents .right{
		float		: left;
		width		: 240px;
		margin-top	: 20px;
	}

		#contents .right .right_in{
			margin	: 0 0 0 20px;
		}

			#contents .right .right_in .banner{
				margin-bottom	: 20px;
			}

				#contents .right .right_in .banner ul{}

					#contents .right .right_in .banner ul li{}

			#contents .right .right_in .title2{
				background	: url(../img/title2.png) no-repeat;
				width		: 220px;
				height		: 42px;
			}

			#contents .right .right_in h3{
				font-size	: 15px;
				color		: #ffffff;
				width		: 210px;
				text-indent	: 50px;
				line-height	: 50px;
			}

			#contents .right .right_in ul.list{
				width			: 208px;
				border			: 1px solid #cccccc;
				padding			: 5px;
				margin-bottom	: 20px;
			}

				#contents .right .right_in ul.list li{
					background	: url(../img/list_arrow.gif) no-repeat center left;
					padding		: 3px 0 3px 15px;
				}





/* FOOTER
-------------------------------------------------------------------------------------------------*/
#footer{

}

	#footer .footer_back{
		width		: 900px;
		height		: 77px;
		background	: url(../img/footer_back.png) no-repeat;
		margin		: 0 auto;

	}

	#footer .footer_back .copy{
		padding		: 60px 0 0 20px;
		margin		: 0 auto;
		color		: #ffffff;
	}


/* FUNCTION
-------------------------------------------------------------------------------------------------*/

.function .title{
	color		: #FF5000;
	font-size	: 15px;
	text-align	: center;
	margin		: 10px 0;
}

.function .title2{
	background	: #FFA278;
	color		: #ffffff;
	text-align	: center;
	font-size	: 18px;
	padding		: 5px 0;
}

	.function .fnc_block1{

	}

	.function .fnc_block1 dl{
		border		: 1px solid #cccccc;
		background	: #E5FFE5;
		width		: 205px;
		float		: left;
		min-height	: 230px;
		margin		: 0 3px 20px 3px;
	}

		.function .fnc_block1 dl dt{
			background	: url(../img/fnc_back1.png) no-repeat;
			color		: #ffffff;
			font-size	: 15px;
			width		: 204px;
			margin		: 10px auto;
			text-align	: center;
		}

		.function .fnc_block1 dl dd{
			margin	: 10px 0;
		}

		.function .fnc_block1 dl dd.dd1{
			background	: url(../img/fnc_back2.png);
			width		: 196px;
			margin		: 0 auto;
			text-align	: center;
			padding		: 5px 0;
			color		: #ffffff;
		}

		.function .fnc_block1 dl dd.dd2{
			text-align	: center;
		}


		.data h3 {
			margin: 20px 0;
			width: 880px;
			height: 35px;
			color: #ffffff;
			font-size: 15px;
			background: url(../img/data/title.png) no-repeat;
			text-indent: 50px;
			line-height: 40px;
		}
		.data h4 {
			margin-bottom: 10px;
			font-size: 14px;
		}

			.data table {
				margin-bottom: 20px;
				width: 880px;
			}
				.data table th {
					padding: 5px;
					background: #bbbbbb;
				}
					.data table th.th1 {width: 30px;}
					.data table th.th2 {width: 200px;}
					.data table th.th3 {width: 120px;}
					.data table th.th4 {width: 420px;}
					.data table th.th5 {width: 100px;}

				.data table td {
					padding: 10px 5px;
					border-bottom: 1px dotted #cccccc;
				}