@charset "UTF-8";

body {
	margin-top: 0 !important;
	padding: 0;
	

	/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #C9C9C9 100%);
	/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #C9C9C9 100%);
	/* Opera */ 
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #C9C9C9 100%);
	/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #C9C9C9));
	/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #C9C9C9 100%);
	/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to top, #FFFFFF 0%, #C9C9C9 100%);
background-attachment: fixed;
}
* { font-size:100%; text-decoration:none; color: #666;list-style: none;}
*:link { text-decoration: none; }
*:visited { text-decoration: none; }
*:hover { text-decoration: none; }
*:active { text-decoration: none; }


/* --------------------header-------------------- */


#header {
	position: fixed;
	top: 0px;
	left: 0px;	/* For IE 8 */
	width: 100%;
	height: 100px;
	z-index: 97;
	background-color: #E5E5E5;	
}

#switch {
	position: fixed;
	left: 50px;
	top: 32px;
	font-size:150%;
	font-family: 'Michroma', sans-serif;
	letter-spacing: 0.3em;
	cursor: pointer;
	z-index: 99;
}

#mark {
	position: fixed;
	right: 50px;
	top: 35px;
	width:112px;
	height:30px;
	z-index: 99;
}

#menu {
	width: 550px;
	font-family: 'Open Sans', sans-serif;
	font-size:85%;
	letter-spacing: 3px;
	position: fixed;
	left: 250px;
	top: 25px;
	float: left;
} 

ul.dropdown                         {
	position: absolute;
}
ul.dropdown li                      { float: left; zoom: 1; }
ul.dropdown a:hover		            { color: #FFCC00; }
ul.dropdown a:active                { color: #fff; }
ul.dropdown li a                    { display: block; padding: 2px 15px; border-right: 1px solid #666; white-space: nowrap; }
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li:hover                { position: relative;  }
ul.dropdown li.hover a              { color: #FFCC00; }

/* 
	LEVEL TWO
*/
ul.dropdown ul {
	visibility: hidden;
	position: absolute;
	top: 100%;
	left: -40px;
	font-size: 75%;
	line-height:1.2em;
}
				  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%; display: inline-block; } 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible; }

#back-top {
	position: absolute;
	left: 50px;
	top: 200px;
}

#back-top a {
	width: 30px;
	display: block;
	text-align: left;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-decoration: none;
	outline: none;
	color: #222;
	/* transition */
    -webkit-transition: 1s;
	-moz-transition: 1s;
	-o-transition: 1s;
	transition: 1s;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
	border: 1px solid #222;
	
	padding: 5px 5px 5px 5px ;
}
#back-top a:hover {
    color: #fff;
    border: 1px solid #fff;
  
}

.loading {
     height: 16px;
     width: 16px;
            }


/* --------------------header-------------------- */

/* --------------------footer-------------------- */
#footer {
	position: fixed;
	bottom: 0px;
	left:0px;
	width: 100%;
	z-index: 5;
	height: 50px;
	background-color: #FFFFFF;
}

#footer p {
	font-size: 60%;
	font-family: "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3", "メイリオ","serif";
	padding:0px 50px 0px 50px;
}


/* --------------------------------------------- */

#work_image {
	position: absolute;
	top: 125px;
	left:0;
	width: 100%;
	z-index: 3;
	padding-bottom:100px;
	margin:0 auto;
}

.imgArea { 
	top:0px;
	left:0px;
}

.imgArea:after {
	visibility: hidden;
	display: block;
	clear: both;
}

.imgArea a {
	font-family: 'Open Sans', sans-serif;
	font-size:80%;
	list-style: none;
	letter-spacing: 1px;
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	display: block;
	width: 100px;
	height: 100px;
	line-height: 100px;
	text-align: center;
}

.imgArea a:active {
position:relative;
top:2px;
}

.imgArea a:hover {
	color: #FFCC00;
}

.imgArea a:current {
	color: #FFCC00;
}

.loading {
     height: 16px;
     width: 16px;
}
