@charset "utf-8";

.chara_wp{background:url(../img/chara/chara_bg.jpg) top center;}
.chara_wp_cont_box{width: 95%; max-width: 1370px; margin: 0 auto; padding-top: 100px; background:url(../img/chara/chara_bg_in.jpg) top center repeat-y; -moz-background-size: 100% auto; background-size:100% auto;}

.chara_title{width: 40%; max-width: 465px; margin: 0 auto 0 auto; }


.chara_bg0{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara0.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg1{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara1.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg2{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara2.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg3{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara3.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg4{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara4.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg5{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara5.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg6{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara6.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg7{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara7.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg8{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara8.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}

.chara_bg9{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara9.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg10{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara10.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg11{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara11.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg12{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara12.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg13{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara13.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg14{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara14.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg15{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara15.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}

.chara_bg16{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara16.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg17{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara17.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg18{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara18.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg19{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara19.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg20{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara20.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}
.chara_bg21{width: 95%; max-width: 1100px; margin: 0 auto; background:url(../img/chara/chara21.png) top right no-repeat; -moz-background-size: 60% auto; background-size:60% auto;}



.chara_data{width: 80%; max-width: 700px; padding-top: 5%;}
.chara_data2{width: 80%; max-width: 700px; padding-top: 5%;}
.chara_txt{font-size:18px; line-height:1.61; padding: 3% 5% 5% 5%;
    text-shadow: 
    #fff 2px 0px 2px, #fff -2px 0px 2px,
    #fff 0px -2px 2px, #fff -2px 0px 2px,
    #fff 2px 2px 2px, #fff -2px 2px 2px,
    #fff 2px -2px 2px, #fff -2px -2px 2px,
    #fff 1px 2px 2px, #fff -1px 2px 2px,
    #fff 1px -2px 2px, #fff -1px -2px 2px,
    #fff 2px 1px 2px, #fff -2px 1px 2px,
    #fff 2px -1px 2px, #fff -2px -1px 2px,
    #fff 1px 1px 2px, #fff -1px 1px 2px,
    #fff 1px -1px 2px, #fff -1px -1px 2px;
    color: #a20014;
}

.chara_txt2{font-size:18px; line-height:1.61; padding: 3% 5% 20% 5%;
    text-shadow: 
    #fff 2px 0px 2px, #fff -2px 0px 2px,
    #fff 0px -2px 2px, #fff -2px 0px 2px,
    #fff 2px 2px 2px, #fff -2px 2px 2px,
    #fff 2px -2px 2px, #fff -2px -2px 2px,
    #fff 1px 2px 2px, #fff -1px 2px 2px,
    #fff 1px -2px 2px, #fff -1px -2px 2px,
    #fff 2px 1px 2px, #fff -2px 1px 2px,
    #fff 2px -1px 2px, #fff -2px -1px 2px,
    #fff 1px 1px 2px, #fff -1px 1px 2px,
    #fff 1px -1px 2px, #fff -1px -1px 2px;
    color: #473a00;
}

.chara_txt3{font-size:18px; line-height:1.61; padding: 3% 5% 10% 5%;
    text-shadow: 
    #fff 2px 0px 2px, #fff -2px 0px 2px,
    #fff 0px -2px 2px, #fff -2px 0px 2px,
    #fff 2px 2px 2px, #fff -2px 2px 2px,
    #fff 2px -2px 2px, #fff -2px -2px 2px,
    #fff 1px 2px 2px, #fff -1px 2px 2px,
    #fff 1px -2px 2px, #fff -1px -2px 2px,
    #fff 2px 1px 2px, #fff -2px 1px 2px,
    #fff 2px -1px 2px, #fff -2px -1px 2px,
    #fff 1px 1px 2px, #fff -1px 1px 2px,
    #fff 1px -1px 2px, #fff -1px -1px 2px;
    color: #473a00;
}


.chara_list_box{width: 90%; max-width: 1000px; margin: 2% auto 0 auto; padding-bottom: 2%;}
.chara_list_box li{width: 10%; margin:0.5%;}

.chara_list_box2{width: 90%; max-width: 880px; margin: 0 auto 0 auto ; padding-bottom: 2%;}
.chara_list_box2 li{width: 11.4%; margin:0.5%;}


.chara_tab0{background:url(../img/chara/chara0_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab1{background:url(../img/chara/chara1_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab2{background:url(../img/chara/chara2_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab3{background:url(../img/chara/chara3_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab4{background:url(../img/chara/chara4_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab5{background:url(../img/chara/chara5_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab6{background:url(../img/chara/chara6_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab7{background:url(../img/chara/chara7_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab8{background:url(../img/chara/chara8_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

.chara_tab9{background:url(../img/chara/chara9_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab10{background:url(../img/chara/chara10_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab11{background:url(../img/chara/chara11_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab12{background:url(../img/chara/chara12_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab13{background:url(../img/chara/chara13_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab14{background:url(../img/chara/chara14_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab15{background:url(../img/chara/chara15_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab16{background:url(../img/chara/chara16_btn_off.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

.chara_tab0:hover{background:url(../img/chara/chara0_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab1:hover{background:url(../img/chara/chara1_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab2:hover{background:url(../img/chara/chara2_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab3:hover{background:url(../img/chara/chara3_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab4:hover{background:url(../img/chara/chara4_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab5:hover{background:url(../img/chara/chara5_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab6:hover{background:url(../img/chara/chara6_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab7:hover{background:url(../img/chara/chara7_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab8:hover{background:url(../img/chara/chara8_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

.chara_tab9:hover{background:url(../img/chara/chara9_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab10:hover{background:url(../img/chara/chara10_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab11:hover{background:url(../img/chara/chara11_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab12:hover{background:url(../img/chara/chara12_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab13:hover{background:url(../img/chara/chara13_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab14:hover{background:url(../img/chara/chara14_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab15:hover{background:url(../img/chara/chara15_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.chara_tab16:hover{background:url(../img/chara/chara16_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

.charapage0 .chara_tab0{background:url(../img/chara/chara0_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage1 .chara_tab1{background:url(../img/chara/chara1_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage2 .chara_tab2{background:url(../img/chara/chara2_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage3 .chara_tab3{background:url(../img/chara/chara3_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage4 .chara_tab4{background:url(../img/chara/chara4_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage5 .chara_tab5{background:url(../img/chara/chara5_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage6 .chara_tab6{background:url(../img/chara/chara6_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage7 .chara_tab7{background:url(../img/chara/chara7_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage8 .chara_tab8{background:url(../img/chara/chara8_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}


.charapage9 .chara_tab9{background:url(../img/chara/chara9_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage10 .chara_tab10{background:url(../img/chara/chara10_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage11 .chara_tab11{background:url(../img/chara/chara11_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage12 .chara_tab12{background:url(../img/chara/chara12_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage13 .chara_tab13{background:url(../img/chara/chara13_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage14 .chara_tab14{background:url(../img/chara/chara14_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}
.charapage15 .chara_tab15{background:url(../img/chara/chara15_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

.charapage16 .chara_tab16{background:url(../img/chara/chara16_btn_on.jpg) top center no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

/* voice
----------------------------------------- */
.voice_box{width: 99%; max-width: 480px; margin: 2% 0; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;}
.voice_box li{ width: 31%; max-width: 160px; margin: 0 1%;}
.voice_box img{width: 100%; max-width: 160px;}

.voice_no{filter:alpha(opacity=65); -moz-opacity:0.65; -khtml-opacity:0.65; opacity:0.65;}


/* soukanzu
----------------------------------------- */
.soukanzu{width: 90%; max-width: 930px; padding-top: 8%; margin: 0 auto; background:url(../img/chara/soukanzu.png) 80% 0 no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}


@media screen and (max-width: 1300px) {
.soukanzu{width: 90%; max-width: 930px; padding-top: 9.4%; margin: 0 auto; background:url(../img/chara/soukanzu.png) 80% 0 no-repeat; -moz-background-size: 100% auto; background-size:100% auto;}

}

.soukanzu li{width: 17%; /* background-color:rgba(0,0,0,0.65); */}
.soukanzu strong{ 	position: absolute; width: 0; height: 0; overflow: hidden;}

.chara_soukanz_tab{width: 50%; max-width: 288px; margin: 0 auto; padding-bottom: 5%;}

.chara_line1{width: 92%; max-width: 930px; margin: 0 auto 10.7% auto;}
.chara_line2{width: 92%; max-width: 930px; margin: 0 auto 13.7% auto;}
.chara_line3{width: 92%; max-width: 930px; margin: 0 auto 19.7% auto;}
.chara_line4{width: 92%; max-width: 930px; margin: 0 auto 0 auto; padding-bottom: 10%;}

.soukanzu_1{margin-right:1.5%;}
.soukanzu_2{margin-right:5.5%;}
.soukanzu_3{margin-right:6.5%;}
.soukanzu_4{margin-right:1%;}
.soukanzu_5{}

.soukanzu_6{margin-right:1.5%;}
.soukanzu_7{margin-right:6.0%;}
.soukanzu_8{margin-right:6%;}
.soukanzu_9{margin-right:1%;}
.soukanzu_10{}

.soukanzu_11{margin-right:1.5%;}
.soukanzu_12{margin-right:11.5%;}
.soukanzu_13{margin-right:1%;}
.soukanzu_14{margin-right:1%;}
.soukanzu_15{}

.soukanzu_16{margin-left: 4%; margin-right:9%;}
.soukanzu_17{margin-right:1.5%;}
.soukanzu_18{}




.soukanzu_1 a, .soukanzu_2 a, .soukanzu_3 a, .soukanzu_4 a, .soukanzu_5 a, .soukanzu_6 a, .soukanzu_7 a, .soukanzu_8 a, .soukanzu_9 a, .soukanzu_10 a, .soukanzu_11 a, .soukanzu_12 a, .soukanzu_13 a, .soukanzu_14 a, .soukanzu_15 a, .soukanzu_16 a, .soukanzu_17 a, .soukanzu_18 a{width: 100%; padding-bottom: 116%; display:block;}

.chara_movie_btn{width: 92%; max-width: 475px; margin: 0;}



@media screen and (max-width: 700px) {
.chara_title{width: 70%; max-width: 465px; margin: 0 auto 3% auto; padding-top: 5%;}
.chara_wp_cont_box{width: 95%; max-width: 1370px; margin: 0 auto; background:url(../img/chara/chara_bg_in.jpg) top center repeat-y; -moz-background-size: auto 110%; background-size: auto 110%;}

.chara_bg0{width: 100%; margin: 0 auto; background:url(../img/chara/chara0.png) 90% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg1{width: 100%; margin: 0 auto; background:url(../img/chara/chara1.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg2{width: 100%; margin: 0 auto; background:url(../img/chara/chara2.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg3{width: 100%; margin: 0 auto; background:url(../img/chara/chara3.png) 100% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg4{width: 100%; margin: 0 auto; background:url(../img/chara/chara4.png) 100% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg5{width: 100%; margin: 0 auto; background:url(../img/chara/chara5.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg6{width: 100%; margin: 0 auto; background:url(../img/chara/chara6.png) 100% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg7{width: 100%; margin: 0 auto; background:url(../img/chara/chara7.png) 70% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg8{width: 100%; margin: 0 auto; background:url(../img/chara/chara8.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}

.chara_bg9{width: 100%; margin: 0 auto; background:url(../img/chara/chara9.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg10{width: 100%; margin: 0 auto; background:url(../img/chara/chara10.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg11{width: 100%; margin: 0 auto; background:url(../img/chara/chara11.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg12{width: 100%; margin: 0 auto; background:url(../img/chara/chara12.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg13{width: 100%; margin: 0 auto; background:url(../img/chara/chara13.png) 50% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg14{width: 100%; margin: 0 auto; background:url(../img/chara/chara14.png) 80% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg15{width: 100%; margin: 0 auto; background:url(../img/chara/chara15.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}

.chara_bg16{width: 100%; margin: 0 auto; background:url(../img/chara/chara16.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg17{width: 100%; margin: 0 auto; background:url(../img/chara/chara17.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg18{width: 100%; margin: 0 auto; background:url(../img/chara/chara18.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg19{width: 100%; margin: 0 auto; background:url(../img/chara/chara19.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg20{width: 100%; margin: 0 auto; background:url(../img/chara/chara20.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}
.chara_bg21{width: 100%; margin: 0 auto; background:url(../img/chara/chara21.png) 110% 0 no-repeat; -moz-background-size: 120% auto; background-size:120% auto;}


.chara_data{width: 90%; padding-top: 110%; margin: 0 auto;}
.chara_data2{width: 90%; padding-top: 110%; margin: 0 auto;}
.chara_txt{font-size:16px; padding: 3% 5% 5% 5%;}
.chara_txt2{font-size:16px; padding: 3% 5% 5% 5%;}
.chara_txt3{font-size:16px; padding: 3% 5% 5% 5%;}

.chara_list_box{width: 90%; max-width: 1000px; margin: 2% auto 0 auto; padding-bottom: 2%;}
.chara_list_box li{width: 18.9%; margin:0.5%;}

.chara_list_box2{width: 90%; max-width: 1000px; margin: 2% auto 0 auto; padding-bottom: 2%;}
.chara_list_box2 li{width: 18.9%; margin:0.5%;}

.chara_movie_btn{width: 98%; max-width: 800px; margin: 0;}
}