@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Butcherman|Dosis:700|Righteous');
* {
    margin: 0px;
    padding: 0px;
}

html, body {
    text-align: center;
    width: 100%;
    position: relative;
    overflow-x: hidden;
  min-height: 100%;
}
.sp{display: none;}
@media screen and (max-width:768px){
  .sp{display: block;position: absolute;left:0;top: 0;}
}
h1{position:absolute;
left:50px;
top:50px;
line-height: 0.7;
font-size: 50px;
/*color:#237b6c;*/
color:#fff;
z-index:0;
text-align: left;
font-family: 'Righteous', cursive;}

.mainImageArea{
  z-index:100;
  margin: 0px auto;
  left:0;
  top:0;
  height:100vh;
}
canvas {
  mix-blend-mode:difference;
}