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


.white_bk {
	background-color: #FFF;
	padding-bottom: 140px;
}
/*　竜1匹目------------------------------------------------　*/
#ryuu01 {
	background-image: url("../images/ryuu01.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
}
#ryuu01.active {
	-webkit-animation: bgroop01 50s linear;/*　竜の移動時間　*/
	animation: bgroop01 50s linear;
}
 @-webkit-keyframes bgroop01 {
 0% {
 background-position: 0 0;
}
 50% {
 background-position: 0 -550px;/*竜の画像高さの半分ぐらい*/
}
 100% {
 background-position: 0 -1100px;/*竜の画像高さにあわせる*/
}
}
@keyframes bgroop01 {
 0% {
 background-position: 0 0;
}
 50% {
 background-position: 0 -550px;/*竜の画像高さの半分ぐらい*/
}
 100% {
 background-position: 0 -1100px;/*竜の画像高さにあわせる*/
}
}

/*　竜2匹目------------------------------------------------　*/
#ryuu02 {
	background-image: url("../images/ryuu02.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
}
#ryuu02.active {
	-webkit-animation: bgroop02 50s linear;/*　竜の移動時間　*/
	animation: bgroop02 50s linear;
}
@-webkit-keyframes bgroop02 {
 0% {
 background-position: 0 0;
}
 50% {
 background-position: -550px 0;/*竜の画像高さの半分ぐらい*/
}
 100% {
 background-position: -1100px 0;/*竜の画像高さにあわせる*/
}
}
@keyframes bgroop02 {
 0% {
 background-position: 0 0;
}
 50% {
 background-position: -550px 0;/*竜の画像高さの半分ぐらい*/
}
 100% {
 background-position: -1100px 0;/*竜の画像高さにあわせる*/
}
}


/*　竜3匹目------------------------------------------------　*/
#ryuu03 {
	background-image: url("../images/ryuu03.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
}
#ryuu03.active {
	-webkit-animation: bgroop03 50s linear;/*　竜の移動時間　*/
	animation: bgroop03 50s linear;
}
@-webkit-keyframes bgroop03 {
 0% {
 background-position: 0 0;
}
 50% {
 background-position: 0 -550px;/*竜の画像高さの半分ぐらい*/
}
 100% {
 background-position: 0 -1100px;/*竜の画像高さにあわせる*/
}
}
@keyframes bgroop03 {
 0% {
 background-position: 0 0;
}
 50% {
 background-position: 0 -550px;/*竜の画像高さの半分ぐらい*/
}
 100% {
 background-position: 0 -1100px;/*竜の画像高さにあわせる*/
}
}

@media screen and (max-width:767px) {
/*　竜1匹目　*/
#ryuu01 {
	background-image: url("../images/ryuu01_sp.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
}
/*　竜2匹目　*/
#ryuu02 {
	background-image: url("../images/ryuu02_sp.gif");
	background-repeat: no-repeat;
	background-position: right 0;
}
/*　竜3匹目　*/
#ryuu03 {
	background-image: url("../images/ryuu03_sp.gif");
	background-repeat: no-repeat;
	background-position: 0 0;
}
}



/*　フェイドイン・アウト用白壁　*/
.bkRGBA01, .bkRGBA02, .bkRGBA03 {
	height: 100%;
}
.bkRGBA01.active, .bkRGBA02.active, .bkRGBA03.active {
	-webkit-animation: 50s;/*　竜の移動時間に合わせる　*/
	animation: 50s rgbopa;
	background: rgba(255,255,255,1);
}
 @-webkit-keyframes rgbopa {
 0% {
 background: rgba(255,255,255,0);
}
 90% {
 background: rgba(255,255,255,0);
}
 100% {
 background: rgba(255,255,255,1);
}
}
 @keyframes rgbopa {
 0% {
 background: rgba(255,255,255,0);
}
 90% {
 background: rgba(255,255,255,0);
}
 100% {
 background: rgba(255,255,255,1);
}
}
.w_gradation {
	background-image: url("../images/w_gradation.png");
	background-repeat: repeat-x;
}