@charset "UTF-8";
/* CSS Document */
html,body{
    width: 100%;
}

html {
  background-color: transparent;
  background-image: none;
}

body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	
	line-height:180%;
	color:#333;
	background-color:#f5f5f5;
	-webkit-text-size-adjust: 100%;
}

a{
	outline:none;
	color:#0066cc;
	text-decoration:none;
}
a:link {
	color:#0066cc;
}
a:visited {
	color:#6699cc;
}
a:hover {
	color:#6699cc;
}
a:active {
	color:#6699cc;
}

/* a:hover img ------------------------------------*/

a:hover img{
	opacity:0.8;
}

/* .cf ------------------------------------*/
.cf:before, .cf:after {content:' '; display:table;}
.cf:after {clear:both;}
.cf {*zoom: 1;} /* For IE 6/7*/

@font-face {
    font-family: 'icomoon';
    src:    url('../fonts/icomoon.eot?9sgmfz');
    src:    url('../fonts/icomoon.eot?9sgmfz#iefix') format('embedded-opentype'),
        url('../fonts/icomoon.ttf?9sgmfz') format('truetype'),
        url('../fonts/icomoon.woff?9sgmfz') format('woff'),
        url('../fonts/icomoon.svg?9sgmfz#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-toppage:before {
    content: "\e904";
}
.icon-company:before {
    content: "\e900";
}
.icon-contact:before {
    content: "\e901";
}
.icon-equipment:before {
    content: "\e902";
}
.icon-products:before {
    content: "\e903";
}

/* .wrapper ------------------------------------*/
#wrapper{
	width:100%;
	padding:0;
	margin:0 0 100px 0;
	overflow: hidden;
}
#wrapper:after{
    content: ".";
    display: block;
    height: 0;
    font-size:0;
    clear: both;
	visibility:hidden;
}

/* .inner ------------------------------------*/
.inner{
	width:980px;
	text-align:left;
	margin:0 auto;	
}
.inner:after{
    content: ".";
    display: block;
    height: 0;
    font-size:0;
    clear: both;
	visibility:hidden;
}

/* header ------------------------------------*/
header{
	width:100%;
	background-color: #1d1d1d;
	margin:0;
	padding:0;
	position:relative;
	min-width:980px;
}

header #logo{
	position:absolute;
	top:22px;
	left:20px;
}

header nav{
	float:right;
}

header nav ul li{
	text-align:center;
	float:left;
	width:100px;
	height:80px;
	margin:0;
	border-left:1px solid #333;
}

header nav ul li a{
	display:block;
	width:100px;
	height:80px;
}

header nav ul li a span{
	color:#fff;
	font-size:500%;
}

header nav ul li a:hover{
	background-color:#333;
}

header nav ul li a:hover span{
	color:#fff;
}

body#products header nav ul li:nth-of-type(2){
	background-color:#FFF;
}
body#products header nav ul li:nth-of-type(2) a span{
	color:#000;
}
body#products header nav ul li:nth-of-type(2) a:hover span{
	color:#fff;
}

body#equipment header nav ul li:nth-of-type(3){
	background-color:#FFF;
}
body#equipment header nav ul li:nth-of-type(3) a span{
	color:#000;
}
body#equipment header nav ul li:nth-of-type(3) a:hover span{
	color:#fff;
}

body#company header nav ul li:nth-of-type(4){
	background-color:#FFF;
}
body#company header nav ul li:nth-of-type(4) a span{
	color:#000;
}
body#company header nav ul li:nth-of-type(4) a:hover span{
	color:#fff;
}

body#contact header nav ul li:nth-of-type(5){
	background-color:#FFF;
}
body#contact header nav ul li:nth-of-type(5) a span{
	color:#000;
}
body#contact header nav ul li:nth-of-type(5) a:hover span{
	color:#fff;
}

/* toPageTop ------------------------------------*/

#toPageTop{
	width:100%;
	
	background-color:#262626;
	text-align:center;
	font-size:80%
}

#toPageTop a{
	padding:10px 0;
	color:#fff;
	width:100%;
	display:block;
}

#toPageTop a:hover{
	background-color:#333;
}

/* footer ------------------------------------*/

footer{
	width:100%;
	background-color:#1d1d1d;
	color:#fff;
	font-size:80%;
	padding:50px 0 40px 0;
}

footer .inner{
	text-align:center;
}

footer .inner nav{
	display:block;
	width:100%;
}

footer .inner nav ul{
	text-align:center;
	margin:0 0 40px 0;
	padding:0 0 0 30px;
}

footer .inner nav ul:before{
	content:'|';
	margin-right: 30px;
}

footer .inner nav ul li{
	display:inline-block;
	margin:0 30px 0 0;
}

footer .inner nav ul li:after{
	content:'|';
	margin-left: 30px;
}

footer .inner nav ul li a{
	color:#fff;
}

footer .inner nav ul li a:hover{
	text-decoration:underline;
}

#footerLogo{
	margin:0 0 20px 0;
}

#copyright{
	margin:20px 0 0 0;
}