@charset "UTF-8";

/*

px   %
10 = 77 
11 = 85  
12 = 93 (was 93)  
13 = 100  
14 = 108 (was 107) 
15 = 116 (was 114) 
16 = 123.1 (was 122) 
17 = 131 (was 129) 
18 = 138.5 (was 136) 
19 = 146.5 (was 144) 
20 = 153.9 (was 152) 
21 = 161.6 (was 159) 
22 = 167
23 = 174
24 = 182
25 = 189
26 = 197

*/

/*====================================

ブラウザのデフォルトリセット　初期設定

====================================*/
html, body, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p,
header, hgroup, nav, section, article, aside, footer, figure, figcaption {
    margin: 0;
    padding: 0;
    font-size: 100%;
}

body {
	line-height: 1.0;
	text-align: center;
	color:#fff;
	line-height: 1.6;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	background-color:#000;
	font-size:77%;
}


html,body {
	text-align:center;
	
}

article, aside, canvas, details, figcaption, figure,
header, hgroup, nav, menu, section, summary {
    display: block;
}

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

ul, ol {
    list-style: none;
}

table {
    border-spacing: 0;
    empty-cells: show;
}

a {
	color:#fff;
	text-decoration:underline;
}

a:hover {
	color:#fff;
	text-decoration:none;
}

a:visited {
	color:#fff;
	text-decoration:underline;
}

em {
	font-style: normal;
	font-weight: bold;
}

.mb10 {
	margin-bottom: 10px;
}


/*--------------------------------------
  clear
---------------------------------------*/

.clrfx{
	min-height:1%;
}
.clrfx:after{
/* for modern browser */
	content:"";
	clear:both;
	height:0px;
	display:block;
	visibility:hidden;
}
* html .clrfx{/* for IE */
	/*\*/height:1%;/* for WinIE */
	display:inline-table;/* for MacIE */
}
body*.clrfx:after{
	content:".";
}


/*--------------------------------------
  float
---------------------------------------*/

.fl {
	float:left;
}

/*--------------------------------------
  layout
---------------------------------------*/
#fadein {
	margin:0;
	padding:0;
}

.bgmaximage{
  position:fixed !important;
  display:none;
  background-image: linear-gradient(left bottom, rgb(0,73,102) 0%, rgb(0,32,72) 27%, rgb(82,60,129) 59%, rgb(36,0,38) 100%);
	background-image: -o-linear-gradient(left bottom, rgb(0,73,102) 0%, rgb(0,32,72) 27%, rgb(82,60,129) 59%, rgb(36,0,38) 100%);
	background-image: -moz-linear-gradient(left bottom, rgb(0,73,102) 0%, rgb(0,32,72) 27%, rgb(82,60,129) 59%, rgb(36,0,38) 100%);
	background-image: -webkit-linear-gradient(left bottom, rgb(0,73,102) 0%, rgb(0,32,72) 27%, rgb(82,60,129) 59%, rgb(36,0,38) 100%);
	background-image: -ms-linear-gradient(left bottom, rgb(0,73,102) 0%, rgb(0,32,72) 27%, rgb(82,60,129) 59%, rgb(36,0,38) 100%);
	background-image: -webkit-gradient(
	linear,
	left bottom,
	right top,
	color-stop(0, rgb(0,73,102)),
	color-stop(0.27, rgb(0,32,72)),
	color-stop(0.59, rgb(82,60,129)),
	color-stop(1, rgb(36,0,38))
	);
	filter: alpha(opacity=45);
	-moz-opacity:0.45;
	opacity:0.45;
}

#bg {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	margin: 0;
	padding:0;
	z-index:1;
	
}



header {
	padding-top:25%;
}

@-webkit-keyframes movelogo {
    from{
        opacity:0;
        -webkit-transform: translateY(3em);
		 -moz-transform: translateY(3em);
		  -ms-transform: translateY(3em);
		   -o-transform: translateY(3em);
		    -transform: translateY(3em);
    }
    to{
        opacity:1;
        -webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		-transform: translateY(0);
    }
}

header img {
	width:100px;
	padding-bottom:10px;
	-webkit-animation-name: movelogo;
    -webkit-animation-iteration-count:1; /* 1回 */
    -webkit-animation-duration:1s;
	
	-moz-animation-name: movelogo;
    -moz-animation-iteration-count:1; /* 1回 */
    -moz-animation-duration:1s;
	
	-ms-animation-name: movelogo;
    -ms-animation-iteration-count:1; /* 1回 */
    -ms-animation-duration:1s;
	
	-o-animation-name: movelogo;
    -o-animation-iteration-count:1; /* 1回 */
    -o-animation-duration:1s;
	
	-animation-name: movelogo;
    -animation-iteration-count:1; /* 1回 */
    -animation-duration:1s;
}

#sociallink {
	margin-top:50px;
	width:80px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:50px;
	-webkit-animation-name: movelogo;
    -webkit-animation-iteration-count:1; /* 1回 */
    -webkit-animation-duration:2s;
}

#sociallink ul li {
	float:left;
}

#sociallink ul li img {
	width:40px;
}

#sociallink ul li #gallerontumblr {
	margin-top:20px;
	clear:both;
	display:block;
	width:80px;
	-webkit-animation-name: movelogo;
    -webkit-animation-iteration-count:1; /* 1回 */
    -webkit-animation-duration:2s;
}


@media screen and (max-width: 768px) { 
	footer {
		position:fixed;
		bottom:0;
		padding:10px;
		width:auto;
		text-align:center;
	}

}

@media screen and (min-width: 768px) { 
	footer {
		position:fixed;
		bottom:0;
		padding:10px;
		width:auto;
		text-align:right;
	}

}


.anime-rumblebtn:hover {
	-moz-animation-name: rumblebtn;
	-moz-animation-duration:0.3s;
	-moz-animation-iteration-count:1;
	-o-animation-name: rumblebtn;
	-o-animation-duration: 0.3s;
	-o-animation-iteration-count:1;
	-ms-animation-name: rumblebtn;
	-ms-animation-duration: 0.3s;
	-ms-animation-iteration-count:1;
	-webkit-animation-name: rumblebtn;
	-webkit-animation-duration: 0.3s;
	-webkit-animation-iteration-count:1;
}
@-moz-keyframes rumblebtn {
 0% { transform: translateY(0px); -moz-transform: translateY(0px);}
  4% { transform: translateY(0px); -moz-transform: translateY(2px);}
   8% { transform: translateY(0px); -moz-transform: translateY(0px);}
    12% { transform: translateY(0px); -moz-transform: translateY(0px);}
     16% { transform: translateY(4px); -moz-transform: translateY(2px);}
	  20% { transform: translateY(0px); -moz-transform: translateY(0px);}
	   24% { transform: translateY(0px); -moz-transform: translateY(0px);}
	    28% { transform: translateY(0px); -moz-transform: translateY(2px);}
	     32% { transform: translateY(0px); -moz-transform: translateY(0px);}
  	      36% { transform: translateY(2px); -moz-transform: translateY(2px);}
 		   40% { transform: translateY(0px); -moz-transform: translateY(0px);}
            44% { transform: translateY(0px); -moz-transform: translateY(0px);}
		     48% { transform: translateY(0px); -moz-transform: translateY(3px);}
			  52% { transform: translateY(3px); -moz-transform: translateY(0px);}
			   56% { transform: translateY(0px); -moz-transform: translateY(0px);}
			    60% { transform: translateY(0px); -moz-transform: translateY(1px);}
			     64% { transform: translateY(5px); -moz-transform: translateY(0px);}
				  68% { transform: translateY(0px); -moz-transform: translateY(4px);}
				   72% { transform: translateY(0px); -moz-transform: translateY(0px);}
				    76% { transform: translateY(0px); -moz-transform: translateY(0px);}
				     80% { transform: translateY(0px); -moz-transform: translateY(3px);}
					  84% { transform: translateY(1px); -moz-transform: translateY(0px);}
					   88% { transform: translateY(4px); -moz-transform: translateY(0px);}
					    92% { transform: translateY(0px); -moz-transform: translateY(4px);}
						 96% { transform: translateY(0px); -moz-transform: translateY(0px);}
						  100% { transform: translateY(0px); -moz-transform: translateY(2px);}
}
@-o-keyframes rumblebtn {
 0% { transform: translateY(0px); -o-transform: translateY(0px);}
  4% { transform: translateY(0px); -o-transform: translateY(2px);}
   8% { transform: translateY(0px); -o-transform: translateY(0px);}
    12% { transform: translateY(0px); -o-transform: translateY(0px);}
     16% { transform: translateY(4px); -o-transform: translateY(2px);}
	  20% { transform: translateY(0px); -o-transform: translateY(0px);}
	   24% { transform: translateY(0px); -o-transform: translateY(0px);}
	    28% { transform: translateY(0px); -o-transform: translateY(2px);}
	     32% { transform: translateY(0px); -o-transform: translateY(0px);}
  	      36% { transform: translateY(2px); -o-transform: translateY(2px);}
 		   40% { transform: translateY(0px); -o-transform: translateY(0px);}
            44% { transform: translateY(0px); -o-transform: translateY(0px);}
		     48% { transform: translateY(0px); -o-transform: translateY(3px);}
			  52% { transform: translateY(3px); -o-transform: translateY(0px);}
			   56% { transform: translateY(0px); -o-transform: translateY(0px);}
			    60% { transform: translateY(0px); -o-transform: translateY(1px);}
			     64% { transform: translateY(5px); -o-transform: translateY(0px);}
				  68% { transform: translateY(0px); -o-transform: translateY(4px);}
				   72% { transform: translateY(0px); -o-transform: translateY(0px);}
				    76% { transform: translateY(0px); -o-transform: translateY(0px);}
				     80% { transform: translateY(0px); -o-transform: translateY(3px);}
					  84% { transform: translateY(1px); -o-transform: translateY(0px);}
					   88% { transform: translateY(4px); -o-transform: translateY(0px);}
					    92% { transform: translateY(0px); -o-transform: translateY(4px);}
						 96% { transform: translateY(0px); -o-transform: translateY(0px);}
						  100% { transform: translateY(0px); -o-transform: translateY(2px);}
}
@-ms-keyframes rumblebtn {
 0% { transform: translateY(0px); -ms-transform: translateY(0px);}
  4% { transform: translateY(0px); -ms-transform: translateY(2px);}
   8% { transform: translateY(0px); -ms-transform: translateY(0px);}
    12% { transform: translateY(0px); -ms-transform: translateY(0px);}
     16% { transform: translateY(4px); -ms-transform: translateY(2px);}
	  20% { transform: translateY(0px); -ms-transform: translateY(0px);}
	   24% { transform: translateY(0px); -ms-transform: translateY(0px);}
	    28% { transform: translateY(0px); -ms-transform: translateY(2px);}
	     32% { transform: translateY(0px); -ms-transform: translateY(0px);}
  	      36% { transform: translateY(2px); -ms-transform: translateY(2px);}
 		   40% { transform: translateY(0px); -ms-transform: translateY(0px);}
            44% { transform: translateY(0px); -ms-transform: translateY(0px);}
		     48% { transform: translateY(0px); -ms-transform: translateY(3px);}
			  52% { transform: translateY(3px); -ms-transform: translateY(0px);}
			   56% { transform: translateY(0px); -ms-transform: translateY(0px);}
			    60% { transform: translateY(0px); -ms-transform: translateY(1px);}
			     64% { transform: translateY(5px); -ms-transform: translateY(0px);}
				  68% { transform: translateY(0px); -ms-transform: translateY(4px);}
				   72% { transform: translateY(0px); -ms-transform: translateY(0px);}
				    76% { transform: translateY(0px); -ms-transform: translateY(0px);}
				     80% { transform: translateY(0px); -ms-transform: translateY(3px);}
					  84% { transform: translateY(1px); -ms-transform: translateY(0px);}
					   88% { transform: translateY(4px); -ms-transform: translateY(0px);}
					    92% { transform: translateY(0px); -ms-transform: translateY(4px);}
						 96% { transform: translateY(0px); -ms-transform: translateY(0px);}
						  100% { transform: translateY(0px); -ms-transform: translateY(2px);}
}
@-webkit-keyframes rumblebtn {
 0% { transform: translateY(0px); -webkit-transform: translateY(0px);}
  4% { transform: translateY(0px); -webkit-transform: translateY(2px);}
   8% { transform: translateY(0px); -webkit-transform: translateY(0px);}
    12% { transform: translateY(0px); -webkit-transform: translateY(0px);}
     16% { transform: translateY(4px); -webkit-transform: translateY(2px);}
	  20% { transform: translateY(0px); -webkit-transform: translateY(0px);}
	   24% { transform: translateY(0px); -webkit-transform: translateY(0px);}
	    28% { transform: translateY(0px); -webkit-transform: translateY(2px);}
	     32% { transform: translateY(0px); -webkit-transform: translateY(0px);}
  	      36% { transform: translateY(2px); -webkit-transform: translateY(2px);}
 		   40% { transform: translateY(0px); -webkit-transform: translateY(0px);}
            44% { transform: translateY(0px); -webkit-transform: translateY(0px);}
		     48% { transform: translateY(0px); -webkit-transform: translateY(3px);}
			  52% { transform: translateY(3px); -webkit-transform: translateY(0px);}
			   56% { transform: translateY(0px); -webkit-transform: translateY(0px);}
			    60% { transform: translateY(0px); -webkit-transform: translateY(1px);}
			     64% { transform: translateY(5px); -webkit-transform: translateY(0px);}
				  68% { transform: translateY(0px); -webkit-transform: translateY(4px);}
				   72% { transform: translateY(0px); -webkit-transform: translateY(0px);}
				    76% { transform: translateY(0px); -webkit-transform: translateY(0px);}
				     80% { transform: translateY(0px); -webkit-transform: translateY(3px);}
					  84% { transform: translateY(1px); -webkit-transform: translateY(0px);}
					   88% { transform: translateY(4px); -webkit-transform: translateY(0px);}
					    92% { transform: translateY(0px); -webkit-transform: translateY(4px);}
						 96% { transform: translateY(0px); -webkit-transform: translateY(0px);}
						  100% { transform: translateY(0px); -webkit-transform: translateY(2px);}
}