
/*----------------------------------
  media分岐
------------------------------------*/	
	
/* smサイズ、デスクトップ : Medium Devices, Desktops */
@media only screen and (max-width : 991px) {
}

/* xsサイズ、スマホ横持ち、タブレット : Small Devices, Tablets */
@media only screen and (max-width : 767px) {
}

/* xxsサイズ :　スマホ縦持ち Extra Small Devices, Phones */  
@media only screen and (max-width : 479px) {
}
	



@media (max-width: 767px){
/*@media (max-width: 991px){*/
.svgs{
	display:none;
	}
}

@keyframes rotate{
	0%{transform:rotate(0deg)}
	50%{transform:rotate(180deg)}
	100%{transform:rotate(360deg)}
}
@keyframes rotate2{
	0%{transform:rotate(0deg)}
	50%{transform:rotate(-180deg)}
	100%{transform:rotate(-360deg)}
}

@keyframes swing{
	0%{transform:rotateZ(2deg)}
	100%{transform:rotateZ(-2deg)}
}


.svgs #svg-triangle{
	position:absolute;
	top:50px;
	left:120px;
	opacity:0.2;
	animation:rotate 20s linear 0s infinite;
	
	}

@media (min-width: 767px) and (max-width: 1039px){
.svgs #svg-triangle{
	left:50px;
	opacity:0.1;
	}
}
.svgs #svg-square{
	position:absolute;
	top:400px;
	right:120px;
	opacity:0.3;
	transform-origin:40% 80%;
	animation:rotate2 30s linear 0s infinite;
	z-index:-1;
}
@media (min-width: 767px) and (max-width: 1039px){
.svgs #svg-square{
		right:100px;
}
}
.svgs #svg-circle{
	position:absolute;
	top:50%;
	right:300px;
	opacity:0.05;
	transform-origin:center left;
	animation:rotate2 30s linear 0s infinite;
	z-index:-1;
}
.svgs #svg-circle2{
	position:absolute;
	top:15%;
	left:300px;
	opacity:0.5;
	transform-origin:center right;
	animation:rotate2 30s linear 0s infinite;
	z-index:-1;
}
.svgs #svg-leaf1{
	position:absolute;
	top:15%;
	left:50px;
	opacity:0.1;
	transform-origin:bottom left;
	animation:swing 2s ease 0s infinite alternate forwards;
	z-index:-1;
}
.svgs #svg-leaf2{
	position:absolute;
	top:45%;
	right:20px;
	opacity:0.1;
	transform-origin:bottom right;
	animation:swing 2s ease 0s infinite alternate forwards;
	z-index:-1
	}
