@charset "utf-8";
/* CSS Document */

/* ----------
Ani 
------------ */

@keyframes links {
	0% {transform: translate(0,-3px);}
	30% {transform: translate(0,-10px);}
	80% {transform: translate(0,5px);}
	100% {transform: translate(0,0);}
}

/* ----------
 // Ani 
------------ */
.tabbox img{
 width: 100%;
 height: auto;
}

.tabbox {
position:relative;
width:100%; 
margin:0 auto;
text-align: center;
font-size:0;
}

.tabbox input{
 display: none;
}

.tabcontent {
display: none;
width:1300px;
height: 1310px; 
padding: 0 0 20px 0;
position: relative;
z-index: 0;
}

#tabcontent1{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara01.png); 
 background-repeat:no-repeat;
}

#tabcontent2{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara02.png); 
 background-repeat:no-repeat;
}

#tabcontent3{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara03.png); 
 background-repeat:no-repeat;
}

#tabcontent4{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara04.png); 
 background-repeat:no-repeat;
}

#tabcontent5{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara05.png); 
 background-repeat:no-repeat;
}

#tabcontent6{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara06.png); 
 background-repeat:no-repeat;
}

#tabcontent7{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara07.png); 
 background-repeat:no-repeat;
}

#tabcontent8{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara08.png); 
 background-repeat:no-repeat;
}

#tabcontent9{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara09.png); 
 background-repeat:no-repeat;
}

#tabcontent10{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara10.png); 
 background-repeat:no-repeat;
}

#tabcontent11{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara11.png); 
 background-repeat:no-repeat;
}

#tabcontent12{
 width:1300px;
 background-image:url(../images/character/marugamejyou_chara12.png); 
 background-repeat:no-repeat;
}

#tabcheck1:checked ~ #tabcontent1 { display: block; }
#tabcheck2:checked ~ #tabcontent2 { display: block; }
#tabcheck3:checked ~ #tabcontent3 { display: block; }
#tabcheck4:checked ~ #tabcontent4 { display: block; }
#tabcheck5:checked ~ #tabcontent5 { display: block; }
#tabcheck6:checked ~ #tabcontent6 { display: block; }
#tabcheck7:checked ~ #tabcontent7 { display: block; }
#tabcheck8:checked ~ #tabcontent8 { display: block; }
#tabcheck9:checked ~ #tabcontent9 { display: block; }
#tabcheck10:checked ~ #tabcontent10 { display: block; }
#tabcheck11:checked ~ #tabcontent11 { display: block; }
#tabcheck12:checked ~ #tabcontent12 { display: block; }

.tab01_off, .tab02_off, .tab03_off, .tab04_off, .tab05_off, .tab06_off, .tab07_off, .tab08_off, .tab09_off, .tab10_off, .tab11_off, .tab12_off{
 width: 8%; 
 display: inline-block; 
 margin:0;
 padding:10px 0;
}

 .tab01_on, .tab02_on, .tab03_on, .tab04_on, .tab05_on, .tab06_on, .tab07_on, .tab08_on, .tab09_on, .tab10_on, .tab11_on, .tab12_on {
 width: 9%; 
 display: none; 
 margin:0;
 padding:10px 0;
}


.tab01_off:hover img, .tab02_off:hover img, .tab03_off:hover img, .tab04_off:hover img, .tab05_off:hover img, .tab06_off:hover img, .tab07_off:hover, .tab08_off:hover, .tab09_off:hover, .tab10_off:hover img, .tab11_off:hover img, .tab12_off:hover img {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

#tabcheck1:checked ~ .tab01_off { display: none; }
#tabcheck1:checked ~ .tab01_on { display: inline-block; }
#tabcheck2:checked ~ .tab02_off { display: none; }
#tabcheck2:checked ~ .tab02_on { display: inline-block; }
#tabcheck3:checked ~ .tab03_off { display: none; }
#tabcheck3:checked ~ .tab03_on { display: inline-block; }
#tabcheck4:checked ~ .tab04_off { display: none; }
#tabcheck4:checked ~ .tab04_on { display: inline-block; }
#tabcheck5:checked ~ .tab05_off { display: none; }
#tabcheck5:checked ~ .tab05_on { display: inline-block; }
#tabcheck6:checked ~ .tab06_off { display: none; }
#tabcheck6:checked ~ .tab06_on { display: inline-block; }
#tabcheck7:checked ~ .tab07_off { display: none; }
#tabcheck7:checked ~ .tab07_on { display: inline-block; }
#tabcheck8:checked ~ .tab08_off { display: none; }
#tabcheck8:checked ~ .tab08_on { display: inline-block; }
#tabcheck9:checked ~ .tab09_off { display: none; }
#tabcheck9:checked ~ .tab09_on { display: inline-block; }
#tabcheck10:checked ~ .tab10_off { display: none; }
#tabcheck10:checked ~ .tab10_on { display: inline-block; }
#tabcheck11:checked ~ .tab11_off { display: none; }
#tabcheck11:checked ~ .tab11_on { display: inline-block; }
#tabcheck12:checked ~ .tab12_off { display: none; }
#tabcheck12:checked ~ .tab12_on { display: inline-block; }


.sabunnwrapper{
 width: 1300px;
 margin: 0;
}

.sabunnwrapper input{ display: none; }

.allimage {
 display: block;
 float: right;
 width:1000px; 
 position:relative;
}

.allimage2 {
 display: none;
 float: right;
 width:1000px; 
 z-index: 0;
 position:relative;
}

.tuujyou01{
 display: inline-block;
 padding-top: 670px;
 margin-left: -80px;
}

.sabunn01_a{
 display: inline-block;
 padding-top: 670px;
 }

.tuujyou02{
 display: inline-block;
 padding-top: 710px;
 margin-left: -80px;
}

.sabunn02_a{
 display: inline-block;
 padding-top: 710px;
 }

.tuujyou03{
 display: inline-block;
 padding-top: 780px;
 margin-left: -80px;
}

.sabunn03_a{
 display: inline-block;
 padding-top: 780px;
 }

.tuujyou04{
 display: inline-block;
 padding-top: 740px;
 margin-left: -80px;
}

.sabunn04_a{
 display: inline-block;
 padding-top: 740px;
 }

.tuujyou05{
 display: inline-block;
 padding-top: 780px;
 margin-left: -80px;
}

.sabunn05_a{
 display: inline-block;
 padding-top: 780px;
 }

.tuujyou06{
 display: inline-block;
 padding-top: 780px;
 margin-left: -80px;
}

.sabunn06_a{
 display: inline-block;
 padding-top: 780px;
 }

.tuujyou07{
 display: inline-block;
 padding-top: 710px;
 margin-left: -80px;
}

.sabunn07_a{
 display: inline-block;
 padding-top: 710px;
 }

.tuujyou08{
 display: inline-block;
 padding-top: 710px;
 margin-left: -80px;
}

.sabunn08_a{
 display: inline-block;
 padding-top: 710px;
 }

.tuujyou09{
 display: inline-block;
 padding-top: 710px;
 margin-left: -80px;
}

.sabunn09_a{
 display: inline-block;
 padding-top: 710px;
 }

.sabunn10_a{
 display: inline-block;
 padding-top: 710px;
 }

.sabunn11_a{
 display: inline-block;
 padding-top: 710px;
 }

#buttoncheck01:checked ~ #buttoncontent01_a{ display: none; }
#buttoncheck01:checked ~ #buttoncontent01{ display: block; }
#buttoncheck01_a:checked ~ #buttoncontent01 { display: none;}
#buttoncheck01_a:checked ~ #buttoncontent01_a{ display: block; }

#buttoncheck02:checked ~ #buttoncontent02_a{ display: none; }
#buttoncheck02:checked ~ #buttoncontent02{ display: block; }
#buttoncheck02_a:checked ~ #buttoncontent02 { display: none;}
#buttoncheck02_a:checked ~ #buttoncontent02_a{ display: block; }

#buttoncheck03:checked ~ #buttoncontent03_a{ display: none; }
#buttoncheck03:checked ~ #buttoncontent03{ display: block; }
#buttoncheck03_a:checked ~ #buttoncontent03 { display: none;}
#buttoncheck03_a:checked ~ #buttoncontent03_a{ display: block; }

#buttoncheck04:checked ~ #buttoncontent04_a{ display: none; }
#buttoncheck04:checked ~ #buttoncontent04{ display: block; }
#buttoncheck04_a:checked ~ #buttoncontent04 { display: none;}
#buttoncheck04_a:checked ~ #buttoncontent04_a{ display: block; }

#buttoncheck05:checked ~ #buttoncontent05_a{ display: none; }
#buttoncheck05:checked ~ #buttoncontent05{ display: block; }
#buttoncheck05_a:checked ~ #buttoncontent05 { display: none;}
#buttoncheck05_a:checked ~ #buttoncontent05_a{ display: block; }

#buttoncheck06:checked ~ #buttoncontent06_a{ display: none; }
#buttoncheck06:checked ~ #buttoncontent06{ display: block; }
#buttoncheck06_a:checked ~ #buttoncontent06 { display: none;}
#buttoncheck06_a:checked ~ #buttoncontent06_a{ display: block; }

#buttoncheck07:checked ~ #buttoncontent07_a{ display: none; }
#buttoncheck07:checked ~ #buttoncontent07{ display: block; }
#buttoncheck07_a:checked ~ #buttoncontent07 { display: none;}
#buttoncheck07_a:checked ~ #buttoncontent07_a{ display: block; }

#buttoncheck08:checked ~ #buttoncontent08_a{ display: none; }
#buttoncheck08:checked ~ #buttoncontent08{ display: block; }
#buttoncheck08_a:checked ~ #buttoncontent08 { display: none;}
#buttoncheck08_a:checked ~ #buttoncontent08_a{ display: block; }

#buttoncheck09:checked ~ #buttoncontent09_a{ display: none; }
#buttoncheck09:checked ~ #buttoncontent09{ display: block; }
#buttoncheck09_a:checked ~ #buttoncontent09 { display: none;}
#buttoncheck09_a:checked ~ #buttoncontent09_a{ display: block; }

#buttoncheck10:checked ~ #buttoncontent10_a{ display: none; }
#buttoncheck10:checked ~ #buttoncontent10{ display: block; }
#buttoncheck10_a:checked ~ #buttoncontent10 { display: none;}
#buttoncheck10_a:checked ~ #buttoncontent10_a{ display: block; }

#buttoncheck11:checked ~ #buttoncontent11_a{ display: none; }
#buttoncheck11:checked ~ #buttoncontent11{ display: block; }
#buttoncheck11_a:checked ~ #buttoncontent11 { display: none;}
#buttoncheck11_a:checked ~ #buttoncontent11_a{ display: block; }
