@charset "UTF-8";

#main_visual h1 img {width: 320px;}

#particles-js {
	position: absolute;
	width: 100%;
	height:100vh;
	background-color:rgb(255,255,255,0.3);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
}

#main_visual{
  display: flex;
  position: relative;
  overflow:hidden;
  height:100vh;
}
#main_visual_inner{
	left: 0;
    right: 0;
    position: relative;
    margin: auto;
}

.header_change{
	top:-68px;
	transition: .5s;
	position:absolute;
	width:100%;
}
.header_change.show{
	top:0;
	position: fixed;
	background-color:rgba(255,255,255,.9);
}

.site_header{/*transition:0.5s;*/}
.site_header.opa0{opacity:0;}



@media screen and (max-width:769px) {
	
	#main_visual_inner{padding:10px 0;}
	.header_change{display:none;}
	.site_header{display:none;}
	.site_header.opa0{opacity:1;}
	#top_h1{margin-top:0;font-size:1.6rem;}
	#main_visual,
	#particles-js{height:30vh;}
	
	#contents h1{padding-top:20px;}
	#contents{margin-top:0;}
}