@charset "UTF-8";

/* -------------------------------------------------------------
作成: 2008.12.5
最終更新日: 2009.07.02
作成者: NT
最終編集者: NT

mainArea.css： メイン部分エリアのCSS
------------------------------------------------------------- */

/* -------------------------------------------------------------
メイン部分の枠指定
------------------------------------------------------------- */

#container #wrapper #mainArea h2 {
	width:790px;
	height:97px;
	background:url(../image/top/h2.jpg) no-repeat center top;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #leftContents {
	margin:0;
	padding:0;
	float:left;
}

#container #wrapper #mainArea #rightContents {
	margin:0;
	padding:0;
	float:right;
}

/* -------------------------------------------------------------
更新日時
------------------------------------------------------------- */

#container #wrapper #mainArea #lastUpdate {
	position:absolute;
	top:55px;
	right:35px;
	color:#623301;
	font-size:10px;
	font-weight:bold;
}

/* -------------------------------------------------------------
パネル
------------------------------------------------------------- */

#container #wrapper #mainArea #panel {
	width:380px;
	background:url(../image/top/bg_panel.jpg) no-repeat left top;
	margin:0 0 0 5px;
	padding:0;
}

#container #wrapper #mainArea #panel #dropClearCount {
	margin:14px 88px 0 0;
	padding:0;
	line-height:26px;
	font-size:26px;
	font-weight:bold;
	color:#fff100;
	text-align:right;
}

#container #wrapper #mainArea #panel ul#panelList {
	margin:25px 0 0 31px;
	padding:0;
}

#container #wrapper #mainArea #panel ul#panelList li {
	width:112px;
	height:112px;
	margin:0;
	padding:0 1px 1px 0;
	float:left;
}

#container #wrapper #mainArea #panel ul#panelList li img {
	margin:0;
	padding:0;
	vertical-align:bottom;
}

#container #wrapper #mainArea #panel .textArea {
	width:330px;
	margin:0 0 20px 35px;
	padding:0;
}

/* -------------------------------------------------------------
アナウンス総数
------------------------------------------------------------- */

#container #wrapper #mainArea #announce {
	width:350px;
	margin:0 0 0 35px;
	padding:0;
}

#container #wrapper #mainArea #announce h3 {
	width:340px;
	height:30px;
	background:url(../image/top/h3_announce.gif) no-repeat center top;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #announce #counterArea {
	width:350px;
	height:75px;
	margin:0;
	padding:0;
	background:url(../image/top/bg_announce.jpg) no-repeat center top;
}

#container #wrapper #mainArea #announce #dropCount {
	line-height:70px;
	font-size:24px;
	font-weight:bold;
	color:#fff100;
	text-align:center;
}

/* -------------------------------------------------------------
最近のキリ番
------------------------------------------------------------- */

#container #wrapper #mainArea #milestone {
	width:340px;
	margin:0 0 0 35px;
	padding:0;
}

#container #wrapper #mainArea #milestone h3 {
	width:340px;
	height:30px;
	background:url(../image/top/h3_milestone.gif) no-repeat center top;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #milestone table {
	width:340px;
	margin:8px 0 8px;
}

#container #wrapper #mainArea #milestone table th {
	font-size:10px;
}

#container #wrapper #mainArea #milestone table td {
	font-size:10px;
}

#container #wrapper #mainArea #milestone table td.num {
	width:80px;
	text-align:center;
	font-weight:bold;
	color:#ce0000;
}

#container #wrapper #mainArea #milestone .textArea {
	margin:0 5px 0px 5px;
}

/* -------------------------------------------------------------
メンテナンス
------------------------------------------------------------- */

#container #wrapper #mainArea #maintenance {
	width:356px;
	margin:0 0 15px 0;
	padding:0;
	background-color:#fefdd1;
	border:solid 2px #ce0000;
	line-height:24px;
	font-size:12px;
	font-weight:bold;
	color:#ce0000;
	text-align:center;
}

/* -------------------------------------------------------------
インフォメーション
------------------------------------------------------------- */

#container #wrapper #mainArea #information {
	width:360px;
	margin:0 35px 0 0;
	padding:0;
}

#container #wrapper #mainArea #information h3 {
	width:360px;
	height:30px;
	background:url(../image/top/h3_information.gif) no-repeat center top;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #information #infoTextArea {
	width:358px;
	height:240px;
	margin:8px 0 15px 0;
	padding:0;
	background-color:#ffffff;
	border:solid 1px #59493f;
	overflow-y:scroll;
}

#container #wrapper #mainArea #information #infoTextArea dl {
	margin:0 15px 0;
}

#container #wrapper #mainArea #information #infoTextArea dl dt {
	padding-top:10px;
	color:#d43100;
	font-weight:bold;
}

#container #wrapper #mainArea #information #infoTextArea dl dd {
	padding-bottom:10px;
	border-bottom:dotted 1px #59493f;
}

#container #wrapper #mainArea #information #infoTextArea dl dd.first {
	border:none;
}

/* -------------------------------------------------------------
ミッション状況
------------------------------------------------------------- */

#container #wrapper #mainArea #mission {
	width:360px;
	margin:0 35px 0 0;
	padding:0;
}

#container #wrapper #mainArea #mission h3 {
	width:360px;
	height:30px;
	background:url(../image/top/h3_mission.gif) no-repeat center top;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #mission #missionPanelArea {
	width:360px;
	height:158px;
	margin:0;
	padding:0;
}

#container #wrapper #mainArea #mission #missionPanelArea ul {
	width:360px;
	height:158px;
	margin:0;
	padding:0;
	position:relative;
}

#container #wrapper #mainArea #mission #missionPanelArea ul#step1 {
	background:url(../image/top/mission_step1.jpg) no-repeat center top;
}

#container #wrapper #mainArea #mission #missionPanelArea ul#step2 {
	background:url(../image/top/mission_step2.jpg) no-repeat center top;
}

#container #wrapper #mainArea #mission #missionPanelArea ul#step3 {
	background:url(../image/top/mission_step3.jpg) no-repeat center top;
}

#container #wrapper #mainArea #mission #missionPanelArea ul#step4 {
	background:url(../image/top/mission_step4.jpg) no-repeat center top;
}

#container #wrapper #mainArea #mission #missionPanelArea ul li#mission1 {
	position:absolute;
	left:6px;
	top:5px;
}

#container #wrapper #mainArea #mission #missionPanelArea ul li#mission2 {
	position:absolute;
	left:87px;
	top:53px;
}

#container #wrapper #mainArea #mission #missionPanelArea ul li#mission3 {
	position:absolute;
	left:169px;
	top:5px;
}

#container #wrapper #mainArea #mission #missionPanelArea ul li#mission4 {
	position:absolute;
	left:250px;
	top:53px;
}

#container #wrapper #mainArea #mission #missionTextArea {
	width:358px;
	margin:8px 0 15px 0;
	padding:0;
	background:url(../image/top/bg_mission.gif) no-repeat right top #ffffff;
	border:solid 1px #59493f;
}

#container #wrapper #mainArea #mission #missionTextArea h4 {
	width:344px;
	height:33px;
	margin:5px 0 8px;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #mission #missionTextArea h4#step1 {
	background:url(../image/top/h4_1.gif) no-repeat left top;
}

#container #wrapper #mainArea #mission #missionTextArea h4#step2 {
	background:url(../image/top/h4_2.gif) no-repeat left top;
}

#container #wrapper #mainArea #mission #missionTextArea h4#step3 {
	background:url(../image/top/h4_3.gif) no-repeat left top;
}

#container #wrapper #mainArea #mission #missionTextArea h4#step4 {
	background:url(../image/top/h4_4.gif) no-repeat left top;
}

#container #wrapper #mainArea #mission #missionTextArea dl {
	margin:0 15px 0;
}

#container #wrapper #mainArea #mission #missionTextArea dl dt#reward {
	width:106px;
	height:20px;
	background:url(../image/top/mission_reward.gif) no-repeat left top;
	margin:10px 0 5px;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #mission #missionTextArea dl dt#effect {
	width:106px;
	height:20px;
	background:url(../image/top/mission_effect.gif) no-repeat left top;
	margin:10px 0 5px;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #mission #missionTextArea dl dt#task {
	width:106px;
	height:20px;
	background:url(../image/top/mission_task.gif) no-repeat left top;
	margin:10px 0 5px;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #mission #missionTextArea dl dd {
	padding-bottom:10px;
	border-bottom:dotted 1px #59493f;
}

#container #wrapper #mainArea #mission #missionTextArea dl dd.first {
	border:none;
}

/* -------------------------------------------------------------
最近のドロップアナウンス
------------------------------------------------------------- */

#container #wrapper #mainArea #dropAnnounce {
	width:360px;
	margin:0 35px 0 0;
	padding:0;
}

#container #wrapper #mainArea #dropAnnounce h3 {
	width:360px;
	height:30px;
	background:url(../image/top/h3_drop_announce.gif) no-repeat center top;
	line-height:0;
	font-size:0;
	text-indent:-9999px;
}

#container #wrapper #mainArea #dropAnnounce table {
	width:360px;
	margin:8px 0 8px;
}

#container #wrapper #mainArea #dropAnnounce table th {
	font-size:10px;
}

#container #wrapper #mainArea #dropAnnounce table td {
	padding:2px;
	font-size:10px;
}

#container #wrapper #mainArea #dropAnnounce table td.icon {
	text-align:center;
}

#container #wrapper #mainArea #dropAnnounce table td.icon img {
	vertical-align:middle;
}

#container #wrapper #mainArea #dropAnnounce table td.rarity {
	white-space:nowrap;
	color:#ce0000;
}

#container #wrapper #mainArea #dropAnnounce table td.dropTime {
	white-space:nowrap;
}

#container #wrapper #mainArea #dropAnnounce .textArea {
	margin:0 5px 0px 5px;
}