﻿/* -------------------------------------------------------------------------
 * エレメントと共通クラス
 * ------------------------------------------------------------------------- */

/* フォントの全体指定
 --------------------------------------------------------------------------- */
* {
	font-size   : 12px;
	line-height : 150%;
	color       : #000;
}

/* ボディの初期化
 --------------------------------------------------------------------------- */
body {
	margin           : 0;
	padding          : 0;
	background-image : url(../imgs/bg_page.gif);
}

/* リンク
 --------------------------------------------------------------------------- */
a {
	color           : #dc1c02;
	text-decoration : underline;
}

a:hover {
	color           : #e36c0c;
	text-decoration : none;
}

h1 {
	width            : 702px;
	height           : 32px;
	margin           : 0 0 15px 0;
	background-image : url(../imgs/bg_title.gif);
}
	h1 span {
		display  : block;
		color    : #f7e3bb;
		position : relative;
		top      : 7px;
		left     : 14px;
	}

h2 {
	color               : #10664b;
	padding             : 0 0 0 17px;
	margin              : 0 0 10px 0;
	background-repeat   : no-repeat;
	background-image    : url(../imgs/icon.gif);
	background-position : 0 2px;
}

.hr {
	border : none;
	background-image    : url(../imgs/hr.gif);
	background-repeat   : no-repeat;
	background-position : 50% 50%;
	height : 28px;
}

form {
	margin  : 0;
	padding : 0;
}

/* -------------------------------------------------------------------------
 * ラップ
 * ------------------------------------------------------------------------- */

/* 高さ100%用ハック
 --------------------------------------------------------------------------- */
html, body {
	height     : 100%;
	text-align : center;
}

#wrap {
	min-height        : 100%;
	width             : 900px;
	text-align        : center;
	margin            : 0 auto;
	position          : relative;
	background-image  : url(../imgs/bg_cont.gif);
	background-repeat : repeat-y;
	background-position : 50% 0;
}

 /* IE6対応 */
* html #wrap { height : 100%; }

	/* ヘッダー
	 --------------------------------------------------------------------------- */
	#wrap-header {
		width               : 100%;
		height              : 260px;
		margin              : 0 auto;
		background-repeat   : no-repeat;
		background-position : center;
		text-align          : center;
	}
		#jp #wrap-header {
			background-image    : url(../imgs/header.jpg);
		}
		#na #wrap-header, #eu #wrap-header {
			background-image    : url(../imgs/header_en.jpg);
		}
		#fr #wrap-header {
			background-image    : url(../imgs/header_fr.jpg);
		}
		#de #wrap-header {
			background-image    : url(../imgs/header_de.jpg);
		}
	
		#wrap-header div {
			color       : #0b8589;
			position    : relative;
			top         : 170px;
			font-weight : bold;
		}

	/* ボディ
	 --------------------------------------------------------------------------- */
	#wrap-body {
		width            : 100%;
		padding-bottom   : 90px;
		text-align       : center;
		margin           : 0 auto;
	}
		#na #wrap-body {
			padding-bottom   : 150px;
		}

	/* フッター
	 --------------------------------------------------------------------------- */
	#wrap-footer {
		width            : 100%;
		height           : 90px;
		position         : absolute;
		bottom           : 0;
		left             : 0;
		text-align       : center;
		background-image : url(../imgs/footer.jpg);
		background-repeat : no-repeat;
		background-position : 50% 0;
	}
		#na #wrap-footer {
			height           : 150px;
		}
	
		/* 閉じるボタン */
		#wrap-footer #close {
			width           : 120px;
			height          : 20px;
			color           : #c5aa7c;
			display         : block;
			text-decoration : none;
			margin          : 0 auto;
			position        : relative;
			top             : 7px;
		}
		
		/* コピーライト */
		#wrap-footer #copy {
			color    : #85817f;
			position : relative;
			top      : 40px;
			background-image : url(../imgs/bg_footer.gif);
		}
			#na #wrap-footer #copy {
				top      : 30px;
			}
			#copy table {
				width : 740px;
				height : 100px;
			}

		#esrb {
			width   : 153px;
			height  : 63px;
			display : block;
			background-image : url(../imgs/esrb.gif);
		}
		
		#privacy {
			width   : 144px;
			height  : 53px;
			display : block;
			background-image : url(../imgs/privacy.gif);
		}
		
/* -------------------------------------------------------------------------
 * コンテンツ
 * ------------------------------------------------------------------------- */
#contents {
	width      : 702px;
	margin     : 0 auto;
	text-align : left;
}

	#contents .tx1 {
		padding : 0 14px 0 14px;
	}
	

.textbox {
}
	.textbox-header {
		width             : 702px;
		height            : 3px;
		font-size         : 1px;
		background-image  : url(../imgs/table_top.gif);
		background-repeat : no-repeat;
	}
	.textbox-body {
		background-color : #dad6cc;
		padding           : 11px 14px 11px 14px;
	}
	.textbox-footer {
		width             : 702px;
		height            : 3px;
		font-size         : 1px;
		background-image  : url(../imgs/table_bottom.gif);
		background-repeat : no-repeat;
	}

/* -------------------------------------------------------------------------
 * その他クラス
 * ------------------------------------------------------------------------- */
.error {
	color : #dc0000;
	font-weight : bold;
}

.require {
	color : #dc0000;
}

.note {
	color : #9c3f01;
}

.sbtn, .lbtn {
	display          : block;
	width            : 190px;
	height           : 31px;
	background-image : url(../imgs/bt_small.gif);
	text-decoration  : none;
}
.sbtn:hover, .lbtn:hover {
	background-position : 0 bottom;
}
	.sbtn span, .lbtn span {
		text-align  : center;
		display     : block;
		position    : relative;
		top         : 6px;
		color       : #FFF;
		font-weight : bold;
	}

.lbtn {
	width            : 230px;
	background-image : url(../imgs/bt_large.gif);
}

.input {
	width  : 250px;
	border : 1px solid #000;
	background-color : #e4e1da;
}

.select {
	width  : 250px;
}

.textarea {
	width  : 500px;
	height : 100px;
	border : 1px solid #000;
	background-color : #e4e1da;
}

.margin {
	width : 40px;
}

.hide {
	display : none;
}

#rulebox {
	width    : 100%;
	height   : 400px;
	overflow : auto;
}

.tabmag {
	height : 5px;
	font-size : 1px;
}