@charset 'utf-8';

/* -----------------------------------------------------------
CSS Information

File name:      november2008.css
Update:         2008/11/11
Author:         J.M
Style Info:     2008年11月イベント用CSS

	01. 全体用
	02. アイテムページ用
	03. イベントページ用

----------------------------------------------------------- */



/* ----------------------------------------------------------------------
  01. 全体用
---------------------------------------------------------------------- */

/* import style
------------------------------------------------------------------- */
@import url('../mod_default.css');
@import url('../mod_layout.css');
@import url('../mod_headerfooter.css');
@import url('../mod_common.css');
/*@import url('../mod_login.css');
@import url('../mod_form.css');*/




/* siteTitleArea
---------------------------------------------------------------------- */
body#event #siteTitleArea {
	display: none;
}



/* This page style
---------------------------------------------------------------------- */
#eventContentsArea {
	margin: 0 auto;
	width: 810px;
	background: #fff;
	text-align: left;
}

#eventContentsArea img {
	vertical-align: bottom;
}





/* ----------------------------------------------------------------------
  02. アイテムページ用
---------------------------------------------------------------------- */

/* タイトル枠用
------------------------------------------- */
#eventContentsArea #titleArea {
	width: 810px;
	height: 315px;
	background: #f5f2e2 url("/image/event/november2008/item/bg_title.jpg") no-repeat;
}

#eventContentsArea #titleArea .titleArea-inner {
	margin-left: 195px;
	width: 420px;
	height: 315px;
}

#eventContentsArea #titleArea .titleArea-inner p.date {
	text-align: right;
}



/* ナビゲーション用
------------------------------------------- */
#eventContentsArea #titleArea #eventNavi {
	margin-left: 40px;
}

#eventContentsArea #titleArea #eventNavi li {
	float: left;
}



/* メイン枠用
------------------------------------------- */
#eventContentsArea #mainArea {
	position: relative;
	width: 810px;
	height: 1170px;
	background: #917b3f url("/image/event/november2008/item/bg_main.jpg") no-repeat;
}

#eventContentsArea #mainArea h3,
#eventContentsArea #mainArea p {
	margin: 0;
	padding: 0;
	border: none;
	line-height: 1;
}



/* 各ボックス用
------------------------------------------- */
#eventContentsArea #avatarBox {
	position: absolute;
	width: 685px;
	height: 310px;
	top: 30px;
	left: 125px;
}

#eventContentsArea #itemBox {
	position: absolute;
	width: 685px;
	height: 310px;
	top: 405px;
	left: 125px;
}

#eventContentsArea #avatarBox .avatarBox-inner,
#eventContentsArea #avatarBox .itemBox-inner {
	position: relative;
}

#eventContentsArea #help01Box {
	position: absolute;
	width: 310px;
	height: 250px;
	top: 765px;
	left: 85px;
}

#eventContentsArea #help02Box {
	position: absolute;
	width: 310px;
	height: 250px;
	top: 765px;
	right: 85px;
}

#eventContentsArea #staffBox {
	position: absolute;
	width: 480px;
	height: 78px;
	bottom: 27px;
	left: 120px;
}



/* pタグ用
------------------------------------------- */
#eventContentsArea #avatarBox p.limited {
	position: absolute;
	top: 26px;
	left: 212px;
}

#eventContentsArea #avatarBox p.teddybear {
	position: absolute;
	top: 296px;
	left: 536px;
}

#eventContentsArea #itemBox p.limited {
	position: absolute;
	top: 22px;
	left: 191px;
}

#eventContentsArea #avatarBox p.avatarImg {
	position: absolute;
	top: 0;
	right: 0;
	_right: -1px;
	z-index: 2;
}

#eventContentsArea #itemBox p.roomImg {
	position: absolute;
	top: 63px;
	right: 0;
	_right: -1px;
	z-index: 2;
}

#eventContentsArea #help01Box p.text,
#eventContentsArea #help02Box p.text {
	margin: 0;
	padding: 10px 25px;
	color: #e3ca8e;
	line-height: 1.4;
}



/* アイテムリスト用
------------------------------------------- */
#eventContentsArea #avatarBox ul {
	zoom: 1;
}

#eventContentsArea #avatarBox li {
	margin-left: 10px;
	float: left;
	width: 119px;
	text-align: center;
}

#eventContentsArea #itemBox li {
	margin-right: 15px;
	float: left;
	width: 136px;
	text-align: center;
}

#eventContentsArea #avatarBox li dd.name,
#eventContentsArea #itemBox li dd.name {
	margin-top: 10px;
	height: 33px;
	color: #ffcc33;
	line-height: 1.2;
}

#eventContentsArea #avatarBox li dd.price,
#eventContentsArea #itemBox li dd.price {
	color: #ddd;
	font-size: 10px;
}

#eventContentsArea #avatarBox li dd.price span,
#eventContentsArea #itemBox li dd.price span {
	font-weight: bold;
}

#eventContentsArea #avatarBox .avatarImg {
	position: absolute;
	top: 0;
	right: 0;
}

#eventContentsArea #itemBox .roomImg {
	position: absolute;
	top: 0;
	right: 0;
}

#eventContentsArea #avatarBox p.caution,
#eventContentsArea #itemBox p.caution {
	clear: both;
	margin: 10px 0 0 20px;
	font-size: 10px;
	color: #e3ca8e;
}






/* 下部枠用
------------------------------------------- */
#eventContentsArea #bottomArea {
	position: relative;
	width: 810px;
	height: 145px;
	background: #f5f2e2 url("/image/event/november2008/item/bg_bottom.jpg") no-repeat;
}

#eventContentsArea #bottomArea p {
	margin: 0 0 0 304px;
	padding-top: 28px;
}





/* ----------------------------------------------------------------------
  02. アイテムページ用
---------------------------------------------------------------------- */

/* メイン枠用
------------------------------------------- */
#eventContentsArea.event #mainArea {
	position: relative;
	width: 810px;
	height: 1200px;
	background: #917b3f url("/image/event/november2008/event/bg_main.jpg") no-repeat;
}



/* 各ボックス用
------------------------------------------- */
#eventContentsArea.event #introBox {
	position: absolute;
	width: 640px;
	top: 23px;
	left: 85px;
}

#eventContentsArea.event #hideandseekBox01 {
	position: absolute;
	width: 580px;
	top: 293px;
	left: 115px;
}

#eventContentsArea.event #hideandseekBox02 {
	position: absolute;
	width: 580px;
	top: 706px;
	left: 115px;
}

#eventContentsArea.event #hideandseekBox01 .box-inner,
#eventContentsArea.event #hideandseekBox02 .box-inner {
	position: relative;
}

#eventContentsArea.event #more {
	position: absolute;
	width: 160px;
	height: 100px;
	top: 598px;
	left: 321px;
	background: url("/image/event/november2008/event/pic_more.gif") no-repeat;
}

#eventContentsArea.event #staffBox {
	position: absolute;
	width: 480px;
	height: 78px;
	bottom: 57px;
	left: 120px;
}



/* 各要素用
------------------------------------------- */
#eventContentsArea.event #introBox h3 {
	padding-left: 30px;
}

#eventContentsArea.event #introBox li {
	float: left;
}


/* #hideandseekBox01 */
#eventContentsArea.event #hideandseekBox01 h3,
#eventContentsArea.event #hideandseekBox02 h3 {
	padding-left: 20px;
}

#eventContentsArea.event #hideandseekBox01 ul {
	margin-top: 23px;
}

#eventContentsArea.event #hideandseekBox01 li {
	float: left;
	margin-right: 12px;
	width: 123px;
}

#eventContentsArea.event #hideandseekBox01 li.itemImg {
	margin-right: 0;
	padding-left: 28px;
	background: url("/image/event/november2008/event/ico_arrow.gif") left center no-repeat;
}

#eventContentsArea.event #hideandseekBox01 li.itemImg div.itemBox p.caution {
	width: 135px;
	font-size: 12px;
	line-height: 1.4;
	color: #ffcc00;
	text-align: center;
}

#eventContentsArea.event #hideandseekBox01 li.itemImg div.itemBox p.caution span,
#eventContentsArea.event #hideandseekBox02 li.itemImg div.itemBox p.caution span {
	color: #ffcc00;
	font-weight: bold;
}


#eventContentsArea.event #hideandseekBox01 p.text,
#eventContentsArea.event #hideandseekBox02 p.text {
	position: absolute;
	width: 380px;
	height: 70px;
	top: 238px;
	left: 15px;
	font-size: 12px;
	line-height: 1.5;
	color: #e3ca8e;
}



/* #hideandseekBox02 */
#eventContentsArea.event #hideandseekBox02 ul {
	margin-top: 8px;
}

#eventContentsArea.event #hideandseekBox02 li {
	float: left;
	width: 332px;
	margin-right: 15px;
}

#eventContentsArea.event #hideandseekBox02 li.itemImg {
	margin-right: 0;
	padding-left: 40px;
	width: 180px;
	background: url("/image/event/november2008/event/ico_arrow.gif") left center no-repeat;
}

#eventContentsArea.event #hideandseekBox02 li.itemImg div.itemBox p.caution {
	width: 172px;
	font-size: 12px;
	line-height: 1.4;
	color: #ffcc00;
	text-align: center;
}



/* more */
#eventContentsArea.event #more p {
	display: none;
}







/* clearfix
------------------------------------------- */
#eventContentsArea #titleArea #eventNavi ul:after,
#eventContentsArea #avatarBox ul:after,
#eventContentsArea #itemBox ul:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}



#eventContentsArea.event #introBox ul:after,
#eventContentsArea.event #hideandseekBox01 ul:after,
#eventContentsArea.event #hideandseekBox02 ul:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}