@charset "utf-8";
/* CSS Document */

/*永遠にゆらゆら動く2番*/
.animation {
    animation-timing-function: ease-in-out;
    animation-iteration-count:infinite;
    animation-direction:alternate;
    animation-duration:2.5s;
    width:260px;
}
.keyframe0 {
    animation-name: anim_v;
}
@keyframes anim_v {
    0% {
        transform:translate(0,0px);
    }
    100% {
        transform: translate(0,30px);
  }
}

.hero01 {
    position:absolute;
    left:0%;
    top:0px;
    width:240px;
    height:320px;
    background: url("../img/h01.png") no-repeat;
    background-size:100% auto;
    z-index: 100 !important;
}
.hero02 {
    position:absolute;
    right:10%;
    bottom:100px;
    width:260px;
    height:250px;
    background: url("../img/h02.png") no-repeat;
    background-size:100% auto;
     z-index: 100 !important;
}
.hero05 {
    position:absolute;
    left:2%;
    top:40px;
    width:240px;
    height:250px;
    background: url("../img/h05.png") no-repeat;
    background-size:100% auto;
     z-index: 100 !important;
}
.hero06 {
    position:absolute;
    right:2%;
    top:40px;
    width:240px;
    height:380px;
    background: url("../img/h06.png") no-repeat;
    background-size:100% auto;
     z-index: 100 !important;
}
.hero07 {
    position:absolute;
    right:1%;
    top:600px;
    width:220px;
    height:350px;
    background: url("../img/h07.png") no-repeat;
    background-size:100% auto;
    z-index: 100 !important;
}
.hero08 {
    position:absolute;
    left:2%;
    bottom:10px;
    width:240px;
    height:350px;
    background: url("../img/h08.png") no-repeat;
    background-size:100% auto;
     z-index: 100 !important;
}
.hero09 {
    position:absolute;
    right:1%;
    bottom:-80px;
    width:220px;
    height:350px;
    background: url("../img/h09.png") no-repeat;
    background-size:100% auto;
     z-index: 100 !important;
}

/*--------------------------------
        h1  h2
----------------------------------*/
section.h1 {
    width:100%;
	background: #EDE52E url("../img/bg_h1.png");
	padding:0;
	text-align: center;
	border-bottom:solid 10px #000;
}
h1 img {
    vertical-align: bottom;
    width:100%;
    max-width:1000px;
}
h3 {
	margin:0 auto 50px;
	border:solid 2px #000;
    border-bottom:solid 6px #000;
	color:#F8EF39;
	font-size:20px;
	font-weight:700;
	letter-spacing: 2px;
	padding:4px 0 6px;
	text-align: center;
}
h3.bgred {
	background: #E71E2F;
}
h3.bgblue {
	background: #009DE1;
}
h3 img {
	margin:8px 100px 0;
    width:100px;
}

/*--------------------------------
     section_bgposter
----------------------------------*/

.cs {
    text-align: center;
    margin:150px 0;
    font-size:40px;
}

@media screen and (max-width: 500px) {
	
.animation {
    width:140px;
}


h3 {
	margin:0 auto 40px;
	font-size:17px;
	letter-spacing: 0px;
    padding:5px 0 4px;
}
h3 img {
	margin:8px 10px 0;
    width:50px;
}
	
.cs {
    margin:100px 0;
    font-size:20px;
}


}