@charset "UTF-8";

body{
	width:350px;
    margin-top: 10px;
	margin-left: 0px;
    padding: 10px;
	overflow-x: hidden;
	font-family:  "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;;
}
	
menubar{
		position: relative;
}

#menubarimg{
	width:150px;
    height: auto;
	margin-left: 110px;

}

.close{
	position:absolute;
	width:10px;
	height:30px;
	top:10px;
    left:20px;

}

#top{position:relative;
	top:30px;
	left:130px;
	
	
}



#haikei1{
	width: 400px;
	height: auto;
	margin-top:-130px;
	margin-left:-30px;
}





#ta
{position: absolute;
 margin-left:27px;
 margin-top:50px;
 font-size:14px; }

#bi{position: absolute;
 margin-left:130px;
 margin-top:50px;
 font-size:14px;
 color: aliceblue;}

#syo
{position: absolute;
 margin-left:245px;
 margin-top:50px;
 font-size:16px; }

h4{
    position: relative;
    top: 110px;
    left: 130px;
}

div1{
	padding-top:50px;
	margin-left:50px;
}

#cover{
	margin-top:-30px;
}

div2 p{
	
	position: relative;
	top:20px;
	bottom:70px;
	text-align:  center;
	margin:0.2em 0em;
	padding:10px 30px;
	
}

div2{
	padding-bottom:100px;
	border: 5px solid #fff;
    margin-bottom:20px;}

.scroll-block{
	position: relative;
    top: 5px;
	left:0px;
    width: 250px;
    padding: 20px 20px 20px 20px;
    margin-top: 30px;
    margin-right: 20px;
    margin-left: 30px;
    margin-bottom: 0px;
    background: #666;
    border-radius: 10px;
    color: #fff;
    box-sizing: content-box;
}



.scroll-block{opacity: 0;}

.scroll-block {
animation-name:fadeupanime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeupanime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


.delay-time02{
animation-delay: 0.2s;
}

.delay-time04{
animation-delay: 0.4s;
}

delay-time06{
animation-delay: 0.6s;
}

.delay-time08{
animation-delay: 0.8s;
}






#cocoa{
    
	width: 250px;
    height: auto;
}
#earlbray{
    width: 250px;
    height: auto;
}
#mattya{
    width: 250px;
    height: auto;
}
#sweetpotato{
    width: 250px;
    height: auto;
}
#coconut{
    width: 250px;
    height: auto;
}


#lastimg{
	position: relative;
	left:13px;
    top:75px;
	width:150px;
    height: auto;
}




div5{
    position: absolute;
	top:1790px;
	left:0px;
	margin-left: 0px;
    padding-top: 100px;
	background-color: #414141;
    width: 375px;
    height: 175px;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", "sans-serif";
	font-size: 16px;

}

#instagram{
	position: absolute;
	top: 1800px;
	margin-top: 39px;
	margin-left:-45px;
	width: 50px;
	height: 50px;
	
}

#facebook{
	position: absolute;
	top: 1800px;
	margin-top: 38px;
	margin-left:50px;
	width: 50px;
	height: 50px;
	
	
	
}