@charset "utf-8";

/*------------------------------------------------------------
site : IMAGICA BS　黒い野望ドラマ 三連作
URL：http://www.imagica-bs.com/yabou/magic_city/
file : /yabou/css/magic_city.css
copyright : IMAGICA TV Corp.
------------------------------------------------------------*/

/*============================================================
div#visual_magic_city
============================================================*/
#visual_magic_city{	
	width:100%;
	background:url(../img/bg_visual.jpg) no-repeat center top;
}

#visual_magic_city .box_yabou{	
	position:relative;
	width:980px;
	height:713px;
	text-align:center;
}

#visual_magic_city .box_yabou h1{	
	font-size:100%;
}
#visual_magic_city .box_yabou h1 img{	
	position:absolute;
	top:318px;
	left:-8px;
}

#visual_magic_city .box_yabou p.lead_yabou{	
	position:absolute;
	top:114px;
	left:-2px;
}

#visual_magic_city .box_yabou .fb_yabou{	
	position:absolute;
	top:20px;
	left:0;
}
#visual_magic_city .box_yabou .tw_yabou{	
	position:absolute;
	top:50px;
	left:0;
}

#visual_magic_city .box_yabou p.btn_yabou{	
	position:absolute;
	top:568px;
	right:0;
}
#visual_magic_city .box_yabou p.btn_yabou2{	
	position:absolute;
	top:610px;
	right:0;
}
#visual_magic_city .box_yabou p.txt_yabou{	
	position:absolute;
	top:568px;
	left:0;
}

/* ul#navi_magic_city
============================================================*/
#visual_magic_city .box_yabou ul#navi_magic_city{
	position:absolute;
	top:482px;
	left:0;
	width:881px;
	height:51px;
	background:url(../img/navi.png) no-repeat 0 0;
}
#visual_magic_city .box_yabou ul#navi_magic_city li{
	position:absolute;
	top:0;
	height:51px;
	text-indent:-9999px;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi1{
	width:233px;
	left:0;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi2{
	width:116px;
	left:274px;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi3{
	width:190px;
	left:431px;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi4{
	width:219px;
	left:662px;
}

#visual_magic_city .box_yabou ul#navi_magic_city li a{
	height:51px;
	display:block;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi1 a{
	width:233px;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi2 a{
	width:116px;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi3 a{
	width:190px;
}
#visual_magic_city .box_yabou ul#navi_magic_city li.navi4 a{
	width:219px;
}

/*============================================================
div#introduction_magic_city
============================================================*/
#introduction_magic_city{	
	width:100%;
	background:#987d34 url(../img/bg_introduction_base.jpg) no-repeat center top;
}
#introduction_magic_city .box_yabou{	
	position:relative;
	width:1000px;
	min-height:783px;
	height:auto !important;
	height:783px;
	background:url(../img/bg_introduction.jpg) no-repeat 520px 147px;
}

#introduction_magic_city .box_yabou h2{	
	position:absolute;
	top:38px;
	right:0;
}

#introduction_magic_city p.lead_yabou{	
	position:absolute;
	top:33px;
	left:3px;
}
#introduction_magic_city p.txt_yabou{	
	width:480px;
	color:#000;
	position:absolute;
	top:143px;
	left:10px;
}

/*============================================================
div#story_magic_city
============================================================*/
#story_magic_city{	
	position:absolute;
	top:443px;
	left:0;
	width:980px;
	height:340px;
	background:url(../img/bg_story.png) no-repeat 10px 24px;
}

#introduction_magic_city .box_yabou #story_magic_city h2{	
	position:absolute;
	top:23px;
	left:438px;
}

#story_magic_city p.txt_yabou{	
	width:405px;
	position:absolute;
	top:20px;
	left:590px;
}

/*============================================================
div#charactor_magic_city
============================================================*/
#character_magic_city{	
	position:relative;
	width:100%;
	height:600px;
}
#character_magic_city .left_yabou{
	position:absolute;
	top:0;
	left:0;
	width:50%;
	height:600px;
	background:#4f4f4f;
}
#character_magic_city .right_yabou{
	position:absolute;
	top:0;
	right:0;
	width:50%;
	height:600px;
	background:#282828;
}

#character_magic_city .box_yabou{	
	position:relative;
	width:1080px;
	height:600px;
	background:url(../img/bg_character.gif) no-repeat center top;
}

#character_magic_city .box_yabou h2{
	position:absolute;
	top:351px;
	left:339px;
}

#character_magic_city .box_yabou p{	
	position:absolute;
}
#character_magic_city .box_yabou p.img_chara01{top:67px; left:423px;}
#character_magic_city .box_yabou p.img_chara02{top:230px; left:633px;}
#character_magic_city .box_yabou p.img_chara03{top:406px; left:165px;}
#character_magic_city .box_yabou p.img_chara04{top:418px; left:459px;}
#character_magic_city .box_yabou p.img_chara05{top:406px; left:710px;}
#character_magic_city .box_yabou p.img_chara06{top:52px; left:78px;}
#character_magic_city .box_yabou p.img_chara07{top:186px; left:50px;}
#character_magic_city .box_yabou p.img_chara08{top:69px; left:742px;}
#character_magic_city .box_yabou p.img_chara09{top:185px; left:890px;}

/*============================================================
div#background_magic_city
============================================================*/
#background_magic_city{	
	width:980px;
	height:530px;
	background:url(../img/bg_background.jpg) no-repeat right 50px;
}

#background_magic_city h2{	
}
#background_magic_city h2 img{	
	margin-top:50px;
}

#background_magic_city p.lead_yabou{	
	margin:15px 0 0 0;
}
#background_magic_city p.txt_yabou{	
	width:550px;
	margin:15px 0 0 0;
}

/*============================================================
div#end_magic_city
============================================================*/
#end_magic_city{	
	width:980px;
	height:50px;
	text-align:center;
}