body{
		/* background-image: url("images/pattern2.png");
		background-repeat: repeat;
		background-attachment: fixed; */
		background-color: rgba(241,239,237,1.00);
	}

.flexiblebox {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
  align-items: center; /* 縦方向中央揃え */
  -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
  justify-content: center; /* 横方向中央揃え */
}

.arrow{
  width: 25px;
  height: 25px;
  border: 5px solid;
  border-color: #FFF #FFF transparent transparent;
  transform: rotate(45deg);
}

/* 矢印下向き */
.arrow1{
  width: 35px;
  height: 35px;
  border: 10px solid;
  border-color:  transparent transparent #000 #000;
  transform: rotate(-45deg);
  position: absolute;
  top: 96%; left: 44%;
}
/* 矢印上向き */
.arrow2{
  width: 30px;
  height: 30px;
  border: 5px solid;
  border-color: #565656 #565656 transparent transparent;
  transform: rotate(-45deg);
}
.arrow3{
  width: 30px;
  height: 30px;
  border: 5px solid;
  border-color:  transparent transparent #565656 #565656;
  transform: rotate(45deg);
}


.triangle{
  width: 0;
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-bottom: 30px solid black;
}
/* 三角右向き */
.triangle1A{
  width: 0;
  height: 0;
  border-left: 130px solid #000;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  position: absolute;
  top: 50%; left: 33%;
}
/* 三角右向き */
.triangle1B{
  width: 0;
  height: 0;
  border-left: 50px solid #0099ff;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.triangle2{
  width: 0;
  height: 0;
  border-top: 30px solid transparent;
  border-right: 30px solid black;
  border-bottom: 30px solid transparent;
}

/* 三角下向き */
.triangle3{
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 110px solid #97ca33;
}
/* 三角下向き */
.triangle3-1{
  width: 0; height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 200px solid #fff;
}



@media screen and (max-width: 640px) {

	
/* 矢印下向き */	
.arrow1{
  width: 20px;
  height: 20px;
  border: 8px solid;
  border-color:  transparent transparent #000 #000;
  transform: rotate(-45deg);
  position: absolute;
  top: 95%; left: 40%;
}
	
/* 三角右向き */	
.triangle1A{
  width: 0;
  height: 0;
  border-left: 20vw solid #000;
  border-top: 2vw solid transparent;
  border-bottom: 2px solid transparent;
  position: absolute;
  top: 35%; left: 8%;
}
}

/*スクロールでフェードイン*/
.fadein {
    opacity : 0.1;
    transform : translate(0, 80px);
    transition : all 600ms;
    }

/* 画面内に入った状態 */
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }