/*キャラクターアイコン変化*/


/*キャラクター紹介用項目*/

#char_main_in_box1{
	float:left;
	margin:10px auto 0px 10px;
	width:300px;
	height:710px;
}


#char_main_in_box2{
	float:left;
	margin:10px 0px 0px 25px;
	width:650px;
	height:710px;
}


#char_main_box{
	margin:0px auto 0px auto;
	width:1000px;
	height:100%;
}

#char_line{
    margin:150px 0px 0px 0px;
    padding-top:0px;
    width:70px;
    height:30px;
}

#c_1{
    float:left;
    margin:10px 0px 0px -10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_01.jpg);
}
#c_1:hover{
    background:url(../c_img/i_on_01.jpg);
}

#c_2{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
  background:url(../c_img/i_off_02.jpg);
}
#c_2:hover{
    background:url(../c_img/i_on_02.jpg);
}

#c_3{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_03.jpg);
}
#c_3:hover{
background:url(../c_img/i_on_03.jpg);
}

#c_4{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_04.jpg);
}
#c_4:hover{
background:url(../c_img/i_on_04.jpg);
}

#c_5{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_05.jpg);
}
#c_5:hover{
background:url(../c_img/i_on_05.jpg);
}






/*2列目*/



#c_6{
    float:left;
    margin:10px 0px 0px -10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_06.jpg);
}
#c_6:hover{
    background:url(../c_img/i_on_06.jpg);
}

#c_7{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
  background:url(../c_img/i_off_07.jpg);
}
#c_7:hover{
    background:url(../c_img/i_on_07.jpg);
}

#c_8{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_08.jpg);
}
#c_8:hover{
background:url(../c_img/i_on_08.jpg);
}

#c_9{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_09.jpg);
}
#c_09:hover{
background:url(../c_img/i_on_09.jpg);
}

#c_10{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_10.jpg);
}
#c_10:hover{
background:url(../c_img/i_on_10.jpg);
}



/*3列目*/



#c_11{
    float:left;
    margin:10px 0px 0px -10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_11.jpg);
}
#c_11:hover{
    background:url(../c_img/i_on_11.jpg);
}

#c_12{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
  background:url(../c_img/i_off_12.jpg);
}
#c_12:hover{
    background:url(../c_img/i_on_12.jpg);
}

#c_13{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_13.jpg);
}
#c_13:hover{
background:url(../c_img/i_on_13.jpg);
}

#c_14{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_14.jpg);
}
#c_14:hover{
background:url(../c_img/i_on_14.jpg);
}

#c_15{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_15.jpg);
}
#c_15:hover{
background:url(../c_img/i_on_15.jpg);
}


/*4列目*/



#c_16{
    float:left;
    margin:10px 0px 0px -10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_16.jpg);
}
#c_16:hover{
    background:url(../c_img/i_on_16.jpg);
}

#c_17{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
  background:url(../c_img/i_off_17.jpg);
}
#c_17:hover{
    background:url(../c_img/i_on_17.jpg);
}

#c_18{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_18.jpg);
}
#c_18:hover{
background:url(../c_img/i_on_18.jpg);
}

#c_19{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_19.jpg);
}
#c_19:hover{
background:url(../c_img/i_on_19.jpg);
}

#c_20{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_20.jpg);
}
#c_20:hover{
background:url(../c_img/i_on_20.jpg);
}



/*5列目*/



#c_21{
    float:left;
    margin:10px 0px 0px -10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_21.jpg);
}
#c_21:hover{
    background:url(../c_img/i_on_21.jpg);
}

#c_22{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
  background:url(../c_img/i_off_22.jpg);
}
#c_22:hover{
    background:url(../c_img/i_on_22.jpg);
}

#c_23{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_23.jpg);
}
#c_23:hover{
background:url(../c_img/i_on_23.jpg);
}

#c_24{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_24.jpg);
}
#c_24:hover{
background:url(../c_img/i_on_24.jpg);
}

#c_25{
    float:left;
    margin:10px 0px 0px 10px;
    padding-top:0px;
    width:110px;
    height:110px;
    background:url(../c_img/i_off_25.jpg);
}
#c_25:hover{
background:url(../c_img/i_on_25.jpg);
}







/*キャラクター立絵*/


#char_tati_001{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_001.png);
    position:absolute;
}
#char_tati_001:hover{
    background-image:url(../char_html/img/tati_001_on.png);
}



#char_tati_002{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_002.png);
    position:absolute;
}
#char_tati_002:hover{
    background-image:url(../char_html/img/tati_002_on.png);
}




#char_tati_003{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_003.png);
    position:absolute;
}
#char_tati_003:hover{
    background-image:url(../char_html/img/tati_003_on.png);
}




#char_tati_004{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_004.png);
    position:absolute;
}
#char_tati_004:hover{
    background-image:url(../char_html/img/tati_004_on.png);
}




#char_tati_005{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_005.png);
    position:absolute;
}
#char_tati_005:hover{
    background-image:url(../char_html/img/tati_005_on.png);
}




#char_tati_006{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_006.png);
    position:absolute;
}
#char_tati_006:hover{
    background-image:url(../char_html/img/tati_006_on.png);
}



#char_tati_007{
    float:left;
    margin:0px 0px 10px 660px;
    padding-top:0px;
    width:350px;
    height:600px;
    background-image:url(../char_html/img/tati_007.png);
    position:absolute;
}
#char_tati_007:hover{
    background-image:url(../char_html/img/tati_007_on.png);
}

#char_tati_008{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_008.png);
    position:absolute;
}
#char_tati_008:hover{
    background-image:url(../char_html/img/tati_008_on.png);
}
#char_tati_009{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_009.png);
    position:absolute;
}
#char_tati_009:hover{
    background-image:url(../char_html/img/tati_009_on.png);
}
#char_tati_010{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_010.png);
    position:absolute;
}
#char_tati_010:hover{
    background-image:url(../char_html/img/tati_010_on.png);
}
#char_tati_011{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_011.png);
    position:absolute;
}
#char_tati_011:hover{
    background-image:url(../char_html/img/tati_011_on.png);
}
#char_tati_012{
    float:left;
    margin:0px 0px 10px 500px;
    padding-top:0px;
    width:570px;
    height:600px;
    background-image:url(../char_html/img/tati_012.png);
    position:absolute;
}
#char_tati_012:hover{
    background-image:url(../char_html/img/tati_012_on.png);
}
#char_tati_013{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_013.png);
    position:absolute;
}
#char_tati_013:hover{
    background-image:url(../char_html/img/tati_013_on.png);
}

#char_tati_014{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_014.png);
    position:absolute;
}
#char_tati_014:hover{
    background-image:url(../char_html/img/tati_014_on.png);
}

#char_tati_015{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_015.png);
    position:absolute;
}
#char_tati_015:hover{
    background-image:url(../char_html/img/tati_015_on.png);
}
#char_tati_016{
    float:left;
    margin:0px 0px 10px 480px;
    padding-top:0px;
    width:500px;
    height:600px;
    background-image:url(../char_html/img/tati_016.png);
    position:absolute;
}
#char_tati_016:hover{
    background-image:url(../char_html/img/tati_016_on.png);
}
#char_tati_017{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_017.png);
    position:absolute;
}
#char_tati_017:hover{
    background-image:url(../char_html/img/tati_017_on.png);
}
#char_tati_018{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_018.png);
    position:absolute;
}
#char_tati_018:hover{
    background-image:url(../char_html/img/tati_018_on.png);
}
#char_tati_019{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_019.png);
    position:absolute;
}
#char_tati_019:hover{
    background-image:url(../char_html/img/tati_019_on.png);
}
#char_tati_020{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_020.png);
    position:absolute;
}
#char_tati_020:hover{
    background-image:url(../char_html/img/tati_020_on.png);
}
#char_tati_021{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_021.png);
    position:absolute;
}
#char_tati_021:hover{
    background-image:url(../char_html/img/tati_021_on.png);
}
#char_tati_022{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_022.png);
    position:absolute;
}
#char_tati_022:hover{
    background-image:url(../char_html/img/tati_022_on.png);
}
#char_tati_023{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_023.png);
    position:absolute;
}
#char_tati_023:hover{
    background-image:url(../char_html/img/tati_023_on.png);
}
#char_tati_024{
    float:left;
    margin:0px 0px 10px 600px;
    padding-top:0px;
    width:400px;
    height:600px;
    background-image:url(../char_html/img/tati_024.png);
    position:absolute;
}
#char_tati_024:hover{
    background-image:url(../char_html/img/tati_024_on.png);
}
#char_tati_025{
    float:left;
    margin:0px 0px 10px 500px;
    padding-top:0px;
    width:600px;
    height:600px;
    background-image:url(../char_html/img/tati_025.png);
    position:absolute;
}
#char_tati_025:hover{
    background-image:url(../char_html/img/tati_025_on.png);
}


/*ボタン*/


#menu_bar_char{
	margin:0px 0px 0px 0px;
	width:1000;
	height:50;
	background-image:url(../char_html/img/fotter.jpg);
}

#btm_back{
    float:left;
    margin:0px 0px 0px 0px;
    padding-top:0px;
    width:150px;
    height:50px;
    background-image:url(../char_html/img/back_off.png);
}
#btm_back:hover{
background-image:url(../char_html/img/back_on.png);
}



#btm_top{
    float:left;
    margin:0px 0px 0px 280px;
    padding-top:0px;
    width:150px;
    height:50px;
    background-image:url(../char_html/img/top_off.png);
}
#btm_top:hover{
background-image:url(../char_html/img/top_on.png);
}




#btm_next{
    float:left;
    margin:0px 0px 0px 250px;
    padding-top:0px;
    width:150px;
    height:50px;
    background-image:url(../char_html/img/next_off.png);
}
#btm_next:hover{
background-image:url(../char_html/img/next_on.png);
}
