@charset "Shift_JIS";

#contents #character {
	width: 800px;
	height: 480px;
}

#character_navigation {
	float: left;
	padding: 20px 0px 0px 16px;
}
#character_navigation strong {
	color: #ff0;
	padding-left: 4px;
}
#character_navigation li {
	display: inline;
}
#character_navigation li a {
	display: block;
	background-repeat: no-repeat;
	background-position: 2px 0;
	font-weight: bold;
	color: #fff;
	padding-left: 40px;
	padding-top: 14px;
	margin-bottom: 7px;
	line-height: 16px;
}
#character_navigation #c1 a {
	background-image: url(../img/character/1_cn.gif);
}
#character_navigation #c2 a {
	background-image: url(../img/character/2_cn.gif);
}
#character_navigation #c3 a {
	background-image: url(../img/character/3_cn.gif);
}
#character_navigation #c4 a {
	background-image: url(../img/character/4_cn.gif);
}
#character_navigation #c5 a {
	background-image: url(../img/character/5_cn.gif);
}
#character_navigation #c6 a {
	background-image: url(../img/character/6_cn.gif);
}
#character_navigation #c7 a {
	background-image: url(../img/character/7_cn.gif);
}
#character_navigation #c8 a {
	background-image: url(../img/character/8_cn.gif);
}
#character_navigation #c9 a {
	background-image: url(../img/character/9_cn.gif);
}
#character_navigation #c10 a {
	background-image: url(../img/character/10_cn.gif);
}
#character_navigation #c11 a {
	background-image: url(../img/character/11_cn.gif);
}
#character_navigation #c12 a {
	background-image: url(../img/character/12_cn.gif);
}
#character_navigation li .on,
#character_navigation li a:hover {
	background-position: 2px -72px;
	color: #c00;
	text-decoration: none;
}

#contents .character_wrap {
	width: 590px;
	height: 480px;
	margin-top: 12px;
	float: right;
	line-height: 17px;
}
#contents .character_wrap h3 {
	margin-bottom: 8px;
	font-size: 16px;
	line-height: 20px;
	color: #C00;
}
#contents .character_wrap .char_title {
	color: #fff;
	background-color: #333;
	width: 160px;
	line-height: 24px;
	text-indent: 6px;
}
#contents .character_wrap .intro {
	margin-bottom: 12px;
}
#contents #introduction {
	width: 300px;
	background: url(../img/character/bg.png) repeat 0 0 ;
}
#contents #introduction2 {
	background-color: #FFF;
}
#contents .character10 #introduction2 {
	width: 428px;
}
#contents .character10 .char_title {
	width: 100%;
	font-size: 11px;
}
#contents .character11 #introduction2 {
	width: 378px;
}
#contents .character11 .char_title {
	width: 200px;
}
#contents .hide_title {
	color: #F00;
	margin: 12px 0;
}
#contents .hide {
	color: #FFF;
}
#contents .wrap {
	padding: 10px;
}
#contents .wrap img {
	display: block;
}
* html #introduction { behavior: expression(IEPNGFIX.fix(this)); }


#contents .character1 {
	background: url(../img/character/1_bg.jpg) no-repeat 0 0 ;
}
#contents .character2 {
	background: url(../img/character/2_bg.jpg) no-repeat 0 0 ;
}
#contents .character3 {
	background: url(../img/character/3_bg.jpg) no-repeat 0 0 ;
}
#contents .character4 {
	background: url(../img/character/4_bg.jpg) no-repeat 0 0 ;
}
#contents .character5 {
	background: url(../img/character/5_bg.jpg) no-repeat 0 0 ;
}
#contents .character6 {
	background: url(../img/character/6_bg.jpg) no-repeat 0 0 ;
}
#contents .character7 {
	background: url(../img/character/7_bg.jpg) no-repeat 0 0 ;
}
#contents .character8 {
	background: url(../img/character/8_bg.jpg) no-repeat 0 0 ;
}
#contents .character9 {
	background: url(../img/character/9_bg.jpg) no-repeat 0 0 ;
}
#contents .character10 {
	background: url(../img/character/10_bg.jpg) no-repeat 0 0 ;
}
#contents .character11 {
	background: url(../img/character/11_bg.jpg) no-repeat 0 0 ;
}
#contents .character12 {
	background: url(../img/character/12_bg.jpg) no-repeat 0 0 ;
}