@charset "utf-8";

/* ==============================================
 *	Name:    top.css
 *	Purpose: individual CSS
 *	Author:  �m�L�����I
 *	Version: 1 Oct 2009
================================================= */





/* ==========================================================================================================
     Top page body
========================================================================================================== */


#top_contents_left{
	float:left;
	display:inline;
	margin:0;
	padding:0;
	width:730px;
	}

#top_contents_right{
	float:left;
	display:inline;
	margin:12px 0px 0px 10px;
	padding:0;
	width:240px;
	}





/* ==========================================================================================================
     Top Left flash area
========================================================================================================== */

#flasharea{
	width:290px;
	height:300px;
	float:left;
	display:inline;
	margin:5px 0px 0px 0px;
	padding:0;
	}


/* ==========================================================================================================
     Top Left search area
========================================================================================================== */

.searcharea{
	width:405px;
	float:left;
	display:inline;
	margin:10px 0px 0px 10px;
	padding:60px 0px 0px 25px; 
	background:url(../../images/top/searcharea_back.jpg) no-repeat;
	}
	.searcharea_wrap01{
		float:left;
		display:inline;
		margin:0px 0px 10px 0px;
		padding:0;
		width:405px;
		}
		.searcharea_wrap01 span{
			float:left;
			display:inline;
			margin:0px 0px 0px 0px;
			font-weight:bold;
			width:60px;
			line-height:20px;
			}
		select.searcharea_01,
		select.searcharea_02,
		select.searcharea_03{
			float:left;
			display:inline;
			width:110px;
			border:solid 1px #7F9DB9;
			}
		select.searcharea_01{
			margin:0px 15px 0px 0px;
			}
.searcarea_dotline{
	float:left;
	display:inline;
	margin:10px 0px;
	padding:0;
	width:380px;
	height:1px;
	line-height:0;
	font-size:0;
	background:url(../../images/share/dot_line_h.jpg) repeat-x;
	}
.searcharea_wrap01_title{
	float:left;
	display:inline;
	margin:0px 0px 0px 0px;
	font-weight:bold;
	width:60px;
	height:100px;
	line-height:100px;
	}
	.searcharea_wrap02{
		float:left;
		display:inline;
		margin:0px 0px 5px 0px;
		padding:0;
		}
		.searcharea_wrap02 input{
			float:left;
			display:inline;
			margin:4px 3px 0px 2px;
			}
			/* IE6 only */
			*html .searcharea_wrap02 input{
				float:left;
				display:inline;
				margin:0px;
				}
				/* IE7 only */
				*+html body .searcharea_wrap02 input{
					float:left;
					display:inline;
					margin:0px;
					}
					/* IE 8 only */	  
					head~/* */body 
					.searcharea_wrap02 input{ /* for ie8 */ 
						float:left;
						display:inline;
						margin:0px;
						}
					html:not(:target) 
					.searcharea_wrap02 input{ /* for others */ 
						float:left;
						display:inline;
						margin:4px 3px 0px 2px;
						}
		.searcharea_wrap02 span.style{
			float:left;
			display:inline;
			margin:0px 0px 0px 0px;
			font-weight:normal;
			line-height:20px;
			width:80px;
			}
		.searcharea_wrap02 span.style_w{
			float:left;
			display:inline;
			margin:0px 0px 0px 0px;
			font-weight:normal;
			line-height:20px;
			width:140px;
			}
			input#searcharea_btn{
				float:left;
				display:inline;
				margin:0px 0px 0px 30px;
				padding:0;
				}
		




/* ==========================================================================================================
     Top Left contents share
========================================================================================================== */

.title_bar730{
	float:left;
	display:inline;
	margin:20px 0px 0px 0px;
	padding:0;
	width:730px;
	height:40px;
	}
.contents_left_wrap730{
	width:728px;
	float:left;
	display:inline;
	margin:0;
	padding:0px 0px 10px 0px;
	border:1px solid #B8D0DD;
	border-top:none;
	background:#F3F8FA;
	}
.wrap200{
	float:left;
	display:inline;
	margin:0px 0px 0px 0px;
	width:200px;
	}
	.title_bar200{
		float:left;
		display:inline;
		margin:10px 0px 0px 0px;
		padding:0;
		width:200px;
		height:40px;
		}
	.contents_left_wrap200{
		width:198px;
		float:left;
		display:inline;
		margin:0;
		padding:0px 0px 10px 0px;
		border:1px solid #B8D0DD;
		border-top:none;
		background:#F3F8FA;
		}
.wrap520{
	float:left;
	display:inline;
	margin:0px 0px 0px 10px;
	width:520px;
	}
	.title_bar520{
		float:left;
		display:inline;
		margin:10px 0px 0px 0px;
		padding:0;
		width:520px;
		height:40px;
		}
	.contents_left_wrap520{
		width:518px;
		float:left;
		display:inline;
		margin:0;
		padding:0px 0px 10px 0px;
		border:1px solid #B8D0DD;
		border-top:none;
		background:#F3F8FA;
		}
	


/* =============================================
     Top Left kodawari
================================================ */
.kodawari_wrap01{
	float:left;
	display:inline;
	margin:10px 5px 0px 5px;
	padding:4px 5px 0px 5px;
	width:140px;
	height:36px;
	background:url(../../images/top/kodawari_s.jpg) no-repeat;
	}
	.kodawari_wrap03{
		float:left;
		display:inline;
		margin:10px 5px 0px 10px;
		padding:4px 5px 0px 5px;
		width:140px;
		height:36px;
		background:url(../../images/top/kodawari_s.jpg) no-repeat;
		}
.kodawari_wrap02{
	float:left;
	display:inline;
	margin:10px 0px 0px 5px;
	padding:4px 0px 0px 5px;
	width:215px;
	height:36px;
	background:url(../../images/top/kodawari_l.jpg) no-repeat;
	}
	.kodawari_wrap04{
		float:left;
		display:inline;
		margin:10px 0px 0px 5px;
		padding:4px 0px 0px 2px;
		width:218px;
		height:36px;
		background:url(../../images/top/kodawari_l.jpg) no-repeat;
		}
	.kodawari_wrap01 img,
	.kodawari_wrap02 img,
	.kodawari_wrap03 img,
	.kodawari_wrap04 img{
		float:left;
		display:inline;
		}
	.kodawari_wrap01 a,
	.kodawari_wrap03 a{
		float:left;
		display:inline;
		line-height:32px;
		font-size:14px;
		margin:0px 0px 0px 10px;
		}
	.kodawari_wrap02 a{
		float:left;
		display:inline;
		line-height:32px;
		font-size:12px;
		margin:0px 0px 0px 10px;
		}
	.kodawari_wrap04 a{
		float:left;
		display:inline;
		line-height:32px;
		font-size:12px;
		margin:0px 0px 0px 5px;
		}



/* =============================================
     Top Left area
================================================ */

span.area{
	float:left;
	display:inline;
	margin:5px 9px;
	width:170px;
	font-weight:bold;
	font-size:14px;
	}
	ul.area_list{
		float:left;
		display:inline;
		width:170px;
		margin:0px 5px 0px 9px;
		//tmp margin:0px 5px 0px 9px;
		}
		ul.area_list li{
			float:left;
			display:inline;
			margin:0px 0px 5px 2px;
			//tmp margin:0px 0px 0px 2px;
			width: 150px;
			//tmp width:70px;
			background:url(../../images/top/area_list.jpg) no-repeat;
			padding:0px 0px 0px 10px;
			}
			ul.area_list li a{
				line-height:20px;
				}
		


/* =============================================
     Top Left kyuubo
================================================ */
.kyuubo_wrap{
	float:left;
	display:inline;
	width:500px;
	margin:10px 9px 0px 9px;
	}
	.kyuubo_wrap img{
		float:left;
		display:inline;
		height:60px;
		width:80px;
		border:1px solid #1A5089;
		}
	.kyuubo_wrap span{
		float:left;
		display:inline;
		width:400px;
		margin:5px 0px 0px 10px
		}
		.kyuubo_wrap span a{
			line-height:20px;
			}
		.kyuubo_wrap	 a:hover img    {opacity:0.6; filter: alpha(opacity=60); }



/* =============================================
     Top Left brand
================================================ */

.brand_h_wrap{
	float:left;
	display:inline;
	width:500px;
	margin:5px 9px;
	}
.brand_h_wrap  a:hover img{
					opacity:0.4; filter: alpha(opacity=60);
					}
			
	.brand_wrap01{
		float:left;
		display:inline;
		margin:0px 10px 0px 0px;
		width:160px;
		background:url(../../images/top/under_white_160.gif) no-repeat;
		}
	.brand_wrap02{
		float:left;
		display:inline;
		margin:0px 0px 0px 0px;
		width:160px;
		background:url(../../images/top/under_white_160.gif) no-repeat;
		}
		.brand_wrap01 img,
		.brand_wrap02 img{
			float:left;
			display:inline;
			width:160px;
			height:60px;
			}
		.brand_wrap01 span,
		.brand_wrap02 span{
			float:left;
			display:inline;
			width:160px;
			margin:10px 0px 0px 0px;
			}
			.brand_wrap01 span a,
			.brand_wrap02 span a{
				line-height:20px;
				}






/* ==========================================================================================================
     Top Right base 
========================================================================================================== */


.title_bar240{
	float:left;
	display:inline;
	margin:10px 0px 0px 0px;
	padding:0;
	width:240px;
	height:40px;
	}
.contents_right_wrap{
	float:left;
	display:inline;
	margin:0;
	padding:0px 0px 10px 0px;
	border:1px solid #B8D0DD;
	//border-top:none;
	background:#F3F8FA;
	width:238px;
	}

	.contents_right_wrap a{
		margin:0;
		padding:0;
		}
	 .contents_right_wrap a:hover img{
					opacity:0.4; filter: alpha(opacity=60);
					}

		


/* ===============================================
     Top Right brand
================================================== */
	.panel {float:left;
		display:blok; 
		margin:5px 4px 0px 6px;
		background:url(../../images/top/under_white_110.gif) no-repeat;
		}
	
	.panel2{
		float:left;
		display:inline;
		margin:5px 0px 0px 2px;
		background:url(../../images/top/under_white_110.gif) no-repeat;
		}
	.member_btn{
		float:left;
		display:inline;
		margin:20px 9px 0px 9px;
		width:220px;
		height:40px;
		font-size:0;
		line-height:0;
		background:url(../../images/top/member_btn.jpg) no-repeat;
		}
		.member_btn a{
			display:block;
			width:100%;
			height:100%;
			}
			.member_btn a:hover{
				background:url(../../images/top/member_btn_on.jpg) no-repeat;
				}


/* ============================================
     Top Right pickup
=============================================== */
ul.pickup_wrap{
	float:left;
	display:inline;
	margin:10px 0px 0px 10px;
	padding:0;
	width:220px;
	}
	ul.pickup_wrap li{
		float:left;
		display:inline;
		line-height:20px;
		width:200px;
		padding:0px 0px 0px 20px;
		margin:5px 0px 0px 0px;
		background:url(../../images/top/pickup_list.jpg) no-repeat;
		}
		ul.pickup_wrap li a{
			line-height:20px;
			}
			

/* =============================================
     Top Right mail
=============================================== */
.mail_text{
	float:left;
	display:inline;
	margin:10px 9px;
	width:220px;
	line-height:20px;
	}
	input.mailmagazine{
		float:left;
		display:inline;
		margin:0px 0px 0px 8px;
		padding:2px;
		width:156px;
		line-height:20px;
		height:20px;
		border:1px solid #B8D0DD;
		color:#666666;
		}
	input#mail_btn{
		float:left;
		display:inline;
		margin:0px 0px 0px 0px;
		}
	.qr_wrap{
		float:left;
		display:inline;
		margin:10px 9px;
		padding:0;
		width:220px;
		}
		.qr_wrap img{
			float:left;
			display:inline;
			}
		.qr_wrap span{
			float:left;
			display:inline;
			width:130px;
			margin:10px 0px 0px 10px;
			}





/* ==========================================================================================================
     ichiran
========================================================================================================== */

.ichiran_head{
	float:left;
	display:inline;
	margin:20px 0px 0px 0px;
	padding:0;
	height:50px;
	line-height:0;
	font-size:0;
	width:980px;
	background:url(../../images/top/ichiran_head.jpg) no-repeat;
	}

	.ichiran_wrap{
		float:left;
		display:inline;
		margin:0px 0px 20px 0px;
		padding:0px 10px 10px 10px;
		border:1px solid #B8D0DD;
		border-top:none;
		width:958px;
		line-height:20px;
		}
		.ichiran_wrap a{
			line-height:20px;
			color:#666666;
			}