/* 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{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}



/*/////////////////////////
base layout
//////////////////////////*/
html,body{ height: 100%;}



body{
	/*font-family: Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;*/
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;	
	color:#000;
	font-size:12px;
	line-height:160%;
	letter-spacing:0em;

	width:100%;
	 
	

	background:url(../../img/common/bg.gif) #fff;
	background-attachment: fixed;

	
}

body.resize * {
	transition:none !important;
}


img{ vertical-align:bottom;}


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


h1,
h2,
h3,
h4,
h5,
h6{ padding:0; margin:0;}



p{}

canvas {position: fixed; top:0; z-index:5;}


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

#loader{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;

	z-index:9999;
	color:#999;
	
}
/*
	body.modeRed #loader	 { color:#ff484b !important;}
	body.modeOrange #loader { color:#ffa500 !important;}
	body.modeYellow #loader { color:#ffed00 !important;}
	body.modeGreen #loader	 { color:#26ff4f !important;}
	body.modeSky #loader	 { color:#00dfff !important;}
	body.modeBlue #loader	 { color:#0080ff !important;}
	body.modePurple #loader { color:#b800ff !important;}*/
	
	
#loader .per{ width:200px; height:30px; text-align:center; position:absolute; top:50%; left:50%; margin:-30px 0 0 -100px;font-size:18px !important;}

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


/* wrap
----------------------------------------------- */
#container	{ opacity:1;  width: 100%;  min-width: 750px;overflow:hidden;}

	.sp #container{overflow-x:hidden;}

#base		{ width:100%; min-width:750px; min-height:500px;}

.innerBase{ max-width:1000px; width:90%; margin:auto; position:relative;}

	.sp .innerBase{ width:700px; margin:auto; position:relative;}


#header{ position:relative; z-index:1000; height:60px;}

	.middle #header{ height:60px;}
	.sp #header{ height:60px;}

#footer{ background-color:#ff484b; padding:80px 0;  position:relative; z-index:10;}

	


#FooterWrap { background: #000; padding-top: 20px; }





#main{ min-height:300px; position:relative; overflow:hidden; width:100%; max-width:1280px; margin:auto;  background-color:#fff;}

#pageHeader,
#contentsWrap{position:relative; width:1280px; margin:auto; z-index:10; }


@media screen and (max-width: 1300px) {
	#pageHeader,
	#contentsWrap{ background-color:transparent; width:1020px;}
}
@media screen and (max-width: 1040px) {
	#pageHeader,
	#contentsWrap{  background-color:transparent; width:730px;}
}


/* color
----------------------------------------------- */

	body.modeRed .colorBG	 { background-color:#ff484b !important;}
	body.modeOrange .colorBG { background-color:#ffa500 !important;}
	body.modeYellow .colorBG { background-color:#ffed00 !important;}
	body.modeGreen .colorBG	 { background-color:#26ff4f !important;}
	body.modeSky .colorBG	 { background-color:#00dfff !important;}
	body.modeBlue .colorBG	 { background-color:#0080ff !important;}
	body.modePurple .colorBG { background-color:#b800ff !important;}
	
	body.modeRed .colorBorder,
	body.modeRed .frameHover .frame	 { border-color:#ff484b !important;}
	body.modeOrange .colorBorder,
	body.modeOrange .frameHover .frame { border-color:#ffa500 !important;}
	body.modeYellow .colorBorder,
	body.modeYellow .frameHover .frame { border-color:#ffed00 !important;}
	body.modeGreen .colorBorder,
	body.modeGreen .frameHover .frame	 { border-color:#26ff4f !important;}
	body.modeSky .colorBorder,
	body.modeSky .frameHover .frame	 { border-color:#00dfff !important;}
	body.modeBlue .colorBorder,
	body.modeBlue .frameHover .frame	 { border-color:#0080ff !important;}
	body.modePurple .colorBorder,
	body.modePurple .frameHover .frame { border-color:#b800ff !important;}
	
	body.modeRed .colorText a.cssAnim:hover	 { background-color:#ff484b !important;}
	body.modeOrange .colorText a.cssAnim:hover { background-color:#ffa500 !important;}
	body.modeYellow .colorText a.cssAnim:hover { background-color:#E5D200 !important;}
	body.modeGreen .colorText a.cssAnim:hover	 { background-color:#00EF2B !important;}
	body.modeSky .colorText a.cssAnim:hover	 { background-color:#00B4CC !important;}
	body.modeBlue .colorText a.cssAnim:hover	 { background-color:#0076E5 !important;}
	body.modePurple .colorText a.cssAnim:hover { background-color:#9200CC !important;}
	
	
	
	body.modeRed .colorText,
	body.modeRed a,
	body.modeRed a:visited	 { color:#ff484b !important;}
	
	body.modeOrange .colorText,
	body.modeOrange a,
	body.modeOrange a:visited { color:#ffa500 !important;}
	
	body.modeYellow .colorText,
	body.modeYellow a,
	body.modeYellow a:visited { color:#E5D200 !important;}
	
	body.modeGreen .colorText,
	body.modeGreen a,
	body.modeGreen a:visited	 { color:#00EF2B !important;}
	
	body.modeSky .colorText,
	body.modeSky a,
	body.modeSky a:visited	 { color:#00B4CC !important;}
	
	body.modeBlue .colorText,
	body.modeBlue a,
	body.modeBlue a:visited	 { color:#0076E5 !important;}
	
	body.modePurple .colorText,
	body.modePurple a,
	body.modePurple a:visited { color:#9200CC !important;}



	body.modeRed .colorText ht{ border-color:#ff484b !important;}
	
	body.modeOrange .colorText ht{  border-color:#ffa500 !important;}
	
	body.modeYellow .colorText ht{  border-color:#E5D200 !important;}
	
	body.modeGreen .colorText ht{  border-color:#00EF2B !important;}
	
	body.modeSky .colorText ht{  border-color:#00B4CC !important;}
	
	body.modeBlue .colorText ht{  border-color:#0076E5 !important;}
	
	body.modePurple .colorText ht{  border-color:#9200CC !important;}
	
	
	
	#footer .kc_copyright a,
	#footer .kc_copyright a:link,
	#footer .kc_copyright a:visited,
	#footer .kc_copyright a:hover{ color:#000 !important;}


	#kc_header a.kc_dropdown-toggle,
	#kc_header a.kc_dropdown-toggle:link,
	#kc_header a.kc_dropdown-toggle:visited,
	#kc_header a.kc_dropdown-toggle:hover{ color:#fff !important;}