/* ****************************************************

	/worldview/css/modal.css

***************************************************** */


/* layout.css overwrite
***************************************************** */

html {
/*	background: #3c3c39;*/
	background: none;
}
body {
	background: none;
}

#modalContent {
/*	margin-top: 120px;*/
/*	margin: 120px 130px 0 0;*/
	padding: 120px 0 0 0;
	width: 900px; 
	height: 560px;
}

.modalInner {
	background: url(../img/modal_bg02.gif) no-repeat left top;
}

.modalSection {
	position: relative;
	overflow: visible;
	width: 900px;
	height: 560px;
	background: url(../img/modal_bg01.gif) no-repeat left bottom;
}

.nameTtl {
	position: absolute;
	top: 40px;
	left: 60px;
}

.txtArea {
	position: absolute;
	top: 210px;
	left: 70px;
	width: 380px;
}
.txtArea p {
	margin-bottom: 20px;
}
.txtArea p span {
	font-weight: bold;
}

.timeLine {
	position: absolute;
	top: 440px;
	left: 60px;
	width: 450px;
}
.timeLine dt,
.timeLine dd {
	float: left;
	width: 50px;
}


.btnArea {
	position: absolute;
	bottom: 0;
	left: 60px;
	width: 450px;
}
.btnArea li {
	float: left;
}
.btnArea li#back {
	width: 154px;
}
.btnArea li#cboxClose {
	width: 130px;
}
.btnArea li#to {
	width: 154px;
}

.bgImg {
	position: absolute;
	bottom: -70px;
	right: -130px;
}


/* background
***************************************************** */
.tokugawa {	background: url(../img/modal/modal_bg_tokugawa.png) no-repeat -130px -120px;}
#uesugi {	background: url(../img/modal/modal_bg_uesugi.png) no-repeat right bottom;}
#shimazu {	background: url(../img/modal/modal_bg_shimazu.png) no-repeat right bottom;}
#sasuke {	background: url(../img/modal/modal_bg_sasuke.png) no-repeat right bottom;}
#sanada {	background: url(../img/modal/modal_bg_sanada.png) no-repeat right bottom;}
#otani {	background: url(../img/modal/modal_bg_otani.png) no-repeat right bottom;}
#motochika {	background: url(../img/modal/modal_bg_motochika.png) no-repeat right bottom;}
#moori {	background: url(../img/modal/modal_bg_moori.png) no-repeat right bottom;}
#mitsunari {	background: url(../img/modal/modal_bg_mitsunari.png) no-repeat right bottom;}
#maihime {	background: url(../img/modal/modal_bg_maihime.png) no-repeat right bottom;}
#magoichi {	background: url(../img/modal/modal_bg_magoichi.png) no-repeat right bottom;}
#maeda {	background: url(../img/modal/modal_bg_maeda.png) no-repeat right bottom;}
#kuroda {	background: url(../img/modal/modal_bg_kuroda.png) no-repeat right bottom;}
#kobayakawa {	background: url(../img/modal/modal_bg_kobayakawa.png) no-repeat right bottom;}
#katakura {	background: url(../img/modal/modal_bg_katakura.png) no-repeat right bottom;}
#honda {	background: url(../img/modal/modal_bg_honda.png) no-repeat right bottom;}
#hojo {	background: url(../img/modal/modal_bg_hojo.png) no-repeat right bottom;}
#fuma {	background: url(../img/modal/modal_bg_fuma.png) no-repeat right bottom;}
#date {	background: url(../img/modal/modal_bg_date.png) no-repeat right bottom;}



/* cboxIframe
***************************************************** */

.cboxIframe {
	overflow: visible;
}


/* contents
***************************************************** */

.timeLine a:hover img,
.storyWrap .storyLnk01 a:hover img,
.storyWrap .storyLnk02 a:hover img {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	/* This works in IE 8 & 9 too */
	/* ... but also 5, 6, 7 */
	filter: alpha(opacity=60);
	/* Older than Firefox 0.80 */
	-moz-opacity:0.60;
	/* Safari 1.x (pre WebKit!) */
	-khtml-opacity: 0.60;
	/* Modern!
	/* Firefox 0.9+, Safari 2?, Chrome any?
	/* Opera 9+, IE 9+ */
	opacity: 0.60;
	zoom:1;
}


/* ClearFix
***************************************************** */
.clearfix:after,
.timeLine dl:after,
.btnArea ul:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix,
.timeLine dl,
.btnArea ul {
	display: block; /* for safari firefox3 */
	zoom: 1;  /* for IE 7*/
}

* html .clearfix,
* html .timeLine dl,
* html .btnArea ul {
	display: inline-block; /* for IE6 */
}

/* IE7 hacks */
*:first-child+html .clearfix,
*:first-child+html .timeLine dl,
*:first-child+html .btnArea ul {
	display: inline-table;
}/* end hacks */

