@charset "UTF-8";

*{
	margin:0px;
	padding:0px;
}

img{
	border:none;
	vertical-align:bottom;
}

body,html{width:100%; margin:0; 
height:100%;
/*overflow-x:hidden;*/
}






/* ヘッダーに関するCSS 
--------------------------------------------------------------------------------*/
#header{
	width:100%;
	margin:auto;
	/*background-image:url(../img/koi_back.png);*/
	position: relative; 
	 min-height: 100%; 
	 overflow:hidden;
	 height: 100%;
	/* background-color:#ccc;*/
	}
	
	
#ma{
	width:100%;
	margin:auto;
	overflow:hidden;
	 min-height:100%; 
	}
	
	

	

	



#nvma_01{
	width:100%;
	margin:0 auto;
	
	}
	
	

	


#de{
	width: 8%;
	position: absolute;
	z-index: 1;
	height:auto;
	right: 0;
	/*top:18em;*/
	overflow: hidden;
/*	min-hight:43.7em;
	max-hight:43.7em;*/
	}

#de_02{
	width: 8%;
	position: absolute;
	z-index: 1;
	height: auto;
	left: 0;
	bottom: 1em;
	overflow: hidden;
/*	min-hight:43.7em;
	max-hight:43.7em;*/
	}




.path_02 {
	stroke :none;
	fill :none;
    /*stroke :#666;*/
    stroke-width: 0.5;
    animation: anime1 15s ease-in-out forwards;
}



@keyframes anime1 {
    0% {
        fill :none;
        stroke-dasharray: 0,500;
      
    }
    50% {
        fill :none;
        stroke-dasharray: 500,0;
		
        
    }
    100% {
        fill :none;
		stroke :#fff;
		 stroke-width: 0.75;
        stroke-dasharray: 500,0;
        opacity:0.2;
    }
}	
	







/*メインのロゴ*/

@media screen and (min-width:1000px) {
   
.box1{
      /*position: fixed;*/
      top:3em;
      width:25%;
      margin:18% 6% 20% 38%;
      /*padding:3em;*/
      z-index: 1;
      text-align:center;
      height:auto;
	  max-height:500px;
    }



.path {
	fill :none;
    /*stroke :#666;*/
    stroke-width: 1;
    animation: anime2 7s ease-in-out forwards;
}
 

@keyframes anime2 {
    0% {
        fill :none;
		stroke :#999;
        stroke-dasharray: 0,500;
		opacity:0.6;
    }
    50% {
        fill :#fff;
		stroke :#000;
        stroke-dasharray: 500,0;
		opacity:0.9;
    }
    100% {
        fill :#222;
		stroke :#000;
		stroke-width: 0.3;
        stroke-dasharray: 500,0;
		/*mix-blend-mode :screen;*/
		opacity:0.9;
		
    }
}
	
	
}







@media screen and (max-width:999px) {
   
.box1{
      /*position: fixed;*/
      top:3em;
      width:55%;
      margin:50% 25% 50% 25%;
      /*padding:3em;*/
      z-index: 1;
      text-align:center;
      height:auto;
	  max-height:500px;
    }



.path {
	fill :none;
    /*stroke :#666;*/
    stroke-width: 1;
    animation: anime2 7s ease-in-out forwards;
}
 

@keyframes anime2 {
    0% {
        fill :none;
		stroke :#999;
        stroke-dasharray: 0,500;
		opacity:0.6;
    }
    50% {
        fill :#fff;
		stroke :#000;
        stroke-dasharray: 500,0;
		opacity:0.9;
    }
    100% {
        fill :#222;
		stroke :#000;
		stroke-width: 0.3;
        stroke-dasharray: 500,0;
		/*mix-blend-mode :screen;*/
		opacity:0.9;
		
    }
}
	
	
}






#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #fff;
  z-index: 1;
}
#loader {
  display: none;
  position: fixed;
  top: 55%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #000;
  z-index: 2;
}






/* ラッパーに関するCSS 
--------------------------------------------------------------------------------*/
#wrapper{
	margin:auto;
	/*background-color:#CFF;*/
	width:100%;
	
	
	}

	
    
    #nn{
	    width:100%
	   ;
	   overflow:hidden;
	    
	    
	    }

	  
.sticky-wrapper hey  {
	position:fixed;
	}
		

	
		
/* フッターに関するCSS 
--------------------------------------------------------------------------------*/