/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{ box-sizing:border-box; border:0;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
hr{ border:0;}
button{ border:0; padding:0; background:none; font-size:1em; outline:0;}



  
.fontL{
	font-family: source-han-serif-japanese, serif;
	font-style: normal;
	font-weight: 300;
}

.fontR{
	font-family: source-han-serif-japanese, serif;
	font-style: normal;
	font-weight: 400;
}

.fontM{
	font-family: source-han-serif-japanese, serif;
	font-style: normal;
	font-weight: 500;
}

.fontB{
	font-family: source-han-serif-japanese, serif;
	font-style: normal;
	font-weight: 700;
}

.fontH{
	font-family: source-han-serif-japanese, serif;
	font-style: normal;
	font-weight: 900;
}



/*/////////////////////////
base layout　helve
//////////////////////////*/
html,body{
	font-family: source-han-serif-japanese, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HGP明朝B", serif;
	font-style: normal;
	font-size:14px;
	font-weight: 500;
	line-height:2;
	width:100%;
	height:100%;
	background-color:#282828;
	font-feature-settings : "pkna";
}


body{

	font-weight:normal;
	letter-spacing:0.2em;

	width:100%;
	height:100%;
	overflow-y:scroll;
	overflow-x:hidden;
	
	text-align:center;
	
	 -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
	
	color:#000;
	

}

body.fixed{ overflow-x:hidden;}


img{ vertical-align:bottom;}

a, a:link {
    color:#000;
    text-decoration:none;
	outline:0;
	
}
a:hover, a:active {
    color:#000;
    text-decoration:none;
}
a:visited {
    color:#000;
    text-decoration:none;
}


h1,
h2,
h3,
h4,
h5,
h6{ padding:0; margin:0 auto 0 auto; font-weight:normal; display:block;}


hr{ border:0; padding:0; margin:0; height:1px;}
p{ margin-bottom:2em;}

select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}


:placeholder-shown {
    color: #c00; }

/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder {
    color: #c00; }

/* Firefox 18- */
:-moz-placeholder {
    color: #c00; opacity: 1; }

/* Firefox 19+ */
::-moz-placeholder {
    color: #c00; opacity: 1; }

/* IE 10+ */
:-ms-input-placeholder {
    color: #c00; }
	

/* loading cover
----------------------------------------------- */

#loader{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background:#fff;
	z-index:9999;
	
}

#loadingAnim{
	position: fixed;
	top: 50%;
	left: 50%;
	width: 35px;
	height: 35px;
	margin:-15px 0 0 -18px;
	display:none;
	
	

}

#loading_count{
	display:none;
	position: fixed;
	top: 50%;
	left: 50%;
	margin:30px 0 0 -50px;
	text-align:center;

	color:#999;
	font-size:1rem;
	width:100px;
	
	padding:0;
}

/* IE Only
----------------------------------------------- */
#dp_swf_engine{ display:none;}


/* wrap
----------------------------------------------- */

#container	{ opacity:0; position:relative; z-index:5; width:100%; height:auto;}

body#top.home #container	{ width:100%; height:100vh;}
#container.open{ opacity:1;}

.pcDevice{}
.touchDevice{}




#base		{  position:relative; width:100%; margin:auto;}





#primary{ position:relative; z-index:8;min-height:100vh; width:100%;padding:150px 0; display:none;  background-color:transparent;}


#secondary{ width:100%; padding:100px 0 25vh 0; background-color:#fff; overflow:hidden;}

#secondary section{ transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);}
#secondary.deactive .contents{ opacity:0; pointer-events: none; } 

#contentsBase{
	position:fixed; 
	bottom:-80px; 
	left:0; 
	z-index:3; 
	width:100%; 
	height:80px; 
	background-color:#fff; 
	opacity:.8;
	transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);
}

#contentsBase.active{ bottom:0px;opacity:.95;}
#contentsBase.open{ height:100%;}

header#globalHeader{}
footer#globalFooter{  
	position:fixed; 
	bottom:-80px; 
	left:0; 
	z-index:10; 
	width:100%; 
	min-width:600px;
	height:80px; 
	transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);
}
footer#globalFooter.active{ bottom:0px; }
footer#globalFooter.deactive{ bottom:-80px !important; }




#primaryClose{ width:80px; height:80px; position:fixed; top:30px; right:30px;z-index:9;  opacity:0;transition: all 300ms cubic-bezier(0.77, 0, 0.175, 1); cursor:pointer;}
	#primaryClose.active{ opacity:1;}

#primaryClose:before{ content:''; display:block; width:80px; height:0; position:absolute; top:30px; left:0; border-bottom:solid 2px #ccc;transform: rotate(-45deg);}
#primaryClose:after{ content:''; display:block; width:80px; height:0;position:absolute; top:30px; left:0; border-bottom:solid 2px #ccc;transform: rotate(45deg);}
      

.globalInner{width:80%; max-width:1200px; margin:auto; position:relative;}




/* action
----------------------------------------------- */
#bg{ position:fixed;width:100%;min-width:600px; height:100%; top:0; left:0; z-index:1; background:url(./img/bg.jpg) right center no-repeat; background-size:cover;}

#bgCover{  
	position:fixed; 
	top:0; 
	left:0; 
	z-index:2; 
	width:100%; 
	height:100%; 
	background-color:#000; 
	opacity:0; 
	transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);
}

#bgCover.active{ opacity:.6;}


/* action
----------------------------------------------- */
#container.fixed{ position:fixed;width:100%; height:100%; overflow:hidden; }






/* no intro
----------------------------------------------- */

body.noIntro #bgCover.active{transition: all 1ms; background-color:transparent; opacity:0 !important;}

body.noIntro #contentsBase,
body.noIntro footer#globalFooter{bottom:0;}