/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
 
 
body {
	min-width:1000px;
}
 
 
 
/******************************************************************************
contents1
******************************************************************************/
#contents1{
	background:#000;
	width:100%;
}

#contents1 .inner{
	margin: 0px auto;
	background-image:url(../images/top.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	height:900px;
	width:100%;
	
}


#contents1 .link{
	text-align:left;
	height:38px;
	width:100%;
}

#contents1 .link a:link , #contents1 .link a:visited{
	height:38px;
	width:50%;
	display:block;
	text-indent:-10000px;
	background-image:url(../images/1st_link.png);
	background-repeat:no-repeat;
	background-position:right;
}


#contents1 .link a:hover , #contents1 .link a:active{
	height:38px;
	width:50%;
	display:block;
	text-indent:-10000px;
	background-image:url(../images/1st_link_over.png);
	background-repeat:no-repeat;
	background-position:right;
}

#contents1 .inner .banner{
	margin: 0px auto;
	width:1000px;
	height:862px;
	text-align:left;
	
}

#contents1 .inner .banner .banner1{
	margin: 605px 0px 0px 770px;
	width:200px;
	height:231px;
	text-align:left;
}

#contents1 .inner .banner .banner1 img{
	position:absolute;
}

#contents1 .inner .banner .banner1 .back{
	opacity:0;
}

#contents1 .inner .banner .banner1 .txt{
	opacity:0;
}


#contents1 .inner .banner .banner1 .click{
	margin: 175px 0px 0px 68px;
	opacity:0;
}



/******************************************************************************
title
******************************************************************************/

#title{
	margin:100px 0px 0px 0px;
	height:154px;
	width:100%;
	background-image:url(../images/title_base.jpg);
	background-repeat:repeat-x;
	background-position:center top;
	text-align:center;
}

#title img{
	margin:35px 0px 0px 0px;
}


/******************************************************************************
contents1
******************************************************************************/
#contents2 .char1_back{
	display: block;
}
#contents2 .char2_back{
	display: none;
}



#contents2{
	margin:50px 0px 0px 0px;
	width:100%;
	height:1000px;
}

#contents2 .char1_back{
	position:absolute;
	width:100%;
	height:1000px;
	background-image:url(../images/chara1_bg1.jpg);
	background-position:center top;
	background-repeat:no-repeat;
}


#contents2  .chara1_prof{
	margin:0px auto;
	width:800px;
	height:1000px;

}

#contents2  .chara1_prof1{
	margin:280px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	width:300px;
	height:220px;
	text-align:left;
}	
	
#contents2  .chara1_prof dl{
	font-size:20px;
	padding:0px 0px 0px 0px;
	color:#ffffff;
	}

#contents2  .chara1_prof dt{
	float:left;
	margin:0px 0px 5px 0px;
	padding:0px;
	width:80px;
	text-align:left;
}

#contents2  .chara1_prof dd{
	margin:0px 0px 5px 0px;
	text-align:left;
	font-weight:bold;
}
	
#contents2  .chara1_prof2{
	color:#000;
	width:600px;
	height:400px;
	margin:0px 0px 0px 0px;
}

#contents2  .chara1_prof2 .txt{
	font-size:16px;
	float:left;
	line-height:1.6em;
	padding:20px 0px 0px 20px;
	text-align:center;
	color: #FFFFFF;
}



#contents2 .char2_back{
	position:absolute;
	width:100%;
	height:1000px;
	background-image:url(../images/chara2_bg1.jpg);
	background-position:center top;
	background-repeat:no-repeat;
}


#contents2  .chara2_prof{
	margin:0px auto;
	width:800px;
	height:1000px;

}

#contents2  .chara2_prof1{
	margin:280px 0px 0px 620px;
	padding:0px 0px 0px 0px;
	width:300px;
	height:220px;
	text-align:left;
}	
	
#contents2  .chara2_prof dl{
	font-size:20px;
	padding:0px 0px 0px 0px;
	color:#ffffff;
	}

#contents2  .chara2_prof dt{
	float:left;
	margin:0px 0px 5px 0px;
	padding:0px;
	width:80px;
	text-align:left;
}

#contents2  .chara2_prof dd{
	margin:0px 0px 5px 0px;
	text-align:left;
	font-weight:bold;
}
	
#contents2  .chara2_prof2{
	margin:0px 0px 0px 370px;
	color:#000;
	width:600px;
	height:400px;
}

#contents2  .chara2_prof2 .txt{
	font-size:16px;
	float:left;
	line-height:1.6em;
	padding:40px 0px 0px 20px;
	text-align:center;
	color: #FFFFFF;
}

#contents2  .char{
	position:absolute;
	width:100%;
	height:1000px;
	}

#contents2 .char .inner{
	margin:0px auto;
	width:1000px;
	height:1000px;
	text-align:left;
	}

#contents2 .char .char_image{
	margin:0px 0px 0px 373px;/*margin:0px 0px 0px 373px; キャラクター1*/
	background-image:url(../images/chara.png);
	background-repeat:no-repeat;
	width:627px;
	height:1000px;
	text-align:left;
	cursor:pointer;
	}

#contents2 .char .char_image .char_1{
	position:absolute;
	}

#contents2 .char .char_image .char_2{
	position:absolute;
	opacity:0;
	}
	
#contents2 .line1{
	position:absolute;
	margin:-5px 0px 0px -8px;
	opacity:0;
	}

#contents2 .line2{
	position:absolute;
	margin:-5px 0px 0px -6px;
	opacity:0;
	}

#contents2 .character_change{
	margin:330px 0px 0px 323px;
	position:absolute;
	opacity:0;
	}


#contents2 .voice1{
	margin:244px 0px 0px 318px;
	position:absolute;
	z-index:99;
	width:133px;
	height:153px;
	overflow:hidden;
	display: none;
}

#contents2 .voice1 .sample_voice_b{
	width:133px;
	height:76px;
	overflow:hidden;
	cursor:pointer;
}

#contents2 .voice1 .sample_voice_b .button{
	position:absolute;
}

#contents2 .voice1 .sample_voice_b .icon{
	position:absolute;
	margin:23px 0px 0px 46px;
}

#contents2 .voice1 .time_voice_b{
	width:133px;
	height:77px;
	overflow:hidden;
	cursor:pointer;
}

#contents2 .voice1 .time_voice_b .button{
	position:absolute;
}

#contents2 .voice1 .time_voice_b .icon{
	position:absolute;
	margin:10px 0px 0px 46px;
}


#contents2 .voice2{
	margin:242px 0px 0px 545px;
	position:absolute;
	z-index:99;
	width:133px;
	height:153px;
	overflow:hidden;
	display:none;
}

#contents2 .voice2 .sample_voice_b{
	width:133px;
	height:76px;
	overflow:hidden;
	cursor:pointer;
}

#contents2 .voice2 .sample_voice_b .button{
	position:absolute;
}

#contents2 .voice2 .sample_voice_b .icon{
	position:absolute;
	margin:23px 0px 0px 46px;
}

#contents2 .voice2 .time_voice_b{
	width:133px;
	height:77px;
	overflow:hidden;
	cursor:pointer;
}

#contents2 .voice2 .time_voice_b .button{
	position:absolute;
}

#contents2 .voice2 .time_voice_b .icon{
	position:absolute;
	margin:10px 0px 0px 46px;
}



/******************************************************************************
contents3
******************************************************************************/
#contents3{
	margin:0px auto;
	width:1000px;
	line-height:2.5em;
}




/******************************************************************************
footer
******************************************************************************/
#footer{
	background:url(../images/footer.jpg);
	height:166px;
	background-repeat:repeat;
	background-repeat:repeat-x;
	background-position:center top;
	text-align:center;

}