/*
 メインページのスタイル集
 */

/* headerタグのスタイル */
header {
    position            : fixed;        /* ヘッダー固定 */
    width               : 100%;         /* ヘッダーの幅100% */
    height              : 60px;         /* ヘッダーの高さ45px */
    background-color    : #FFFFFF;      /* 背景色 白 */
    border-bottom       : medium solid; /* 幅全体に下線を引く */
    border-bottom-width : thin;         /* 細い境界線 */
    z-index             : 1;            /* 最前面に表示 */
}
/* BODYタグのスタイル */
body {
    position   : relative; /* 相対位置 */
    width      : 100%;
    margin     : 0;
    overflow-x : hidden;   /* 横スクロールは表示しない */
}
/* mainタグのスタイル */
main {
    position : relative;
    width    : 100%;
}
/* navタグのスタイル */
nav {
    position : relative;
    top      : 50px;
    width    : 100%;
    height   : 380px;
}
footer {
    position         : fixed;
    bottom           : 0px;
    width            : 100%;
    height           : 40px;
    background-color : #00679a;
    z-index          : 10;
}

/*
 メインページヘッダー部のスタイル設定
 */

/* メインHTMLのヘッダーコンテンツ */
.header-contents {
    position : relative; /* 相対位置 */
    top      : 15px;      /* 上部開始位置 */
    width    : 1030px;   /* コンテンツ幅の固定 */
    height   : 100%;
    margin   : auto;     /* コンテンツの中央寄せ */
}

/* メインHTMLのヘッダー左のスタイル */
.header-contents-left {
    display : inline-block;  /* 横並び */
    float   : left;          /* 左寄せ */
}


/* メインHTMLのヘッダー右のスタイル */
.header-contents-right {
    display : inline-block;  /* 横並び */
    float   : right;         /* 右寄せ */
}


/*
 メインページメニュー部のスタイル設定
 */

/* メインメニューコンテンツのスタイル */
.nav-contents {
    position : relative;
    width    : 1040px;
    margin   : auto;
}

/* メインメニューのバックグラウンドコンテンツのスタイル */
.nav-background-contents {
    position : relative;
    margin   : 0px auto;
    width    : 100%;
    height   : 100%;
}

/* メインメニューのバックグラウンドコンテンツのスタイル */
.nav-background-contents {
    position : relative;
    margin   : 0px auto;
    width    : 100%;
    height   : 100%;
}

/* メインメニューのバックグラウンドイメージのスタイル */
.nav-background-img {
    position : relative;
    width    : 1040px;
    height   : 320px;
}

/* メニューボタンの構成、位置 */
.main-menu {
	position:absolute;
}
.main-menu p {
	width: inherit;
	height: inherit;
	background-size : inherit;
}

/* ホームボタン */
.home-absolute	{
	top:10px;
	left:20px;
	width: 150px;
	height: 150px;
	background-size : 150px;
}

/* 企業情報ボタン */
.company-absolute{
	top:130px;
	left:155px;
	width: 160px;
	height: 160px;
	background-size : 160px;
}

/* 代表ご挨拶ボタン */
.president-absolute	{
	top:10px;
	left:285px;
	width: 190px;
	height: 190px;
	background-size : 190px;
}

/* 事業内容ボタン */
.works-absolute	{
	top:130px;
	left:670px;
	width: 140px;
	height: 140px;
	background-size : 140px;
}

/* 採用情報ボタン */
.recruit-absolute	{
	top:5px;
	left:810px;
	width: 150px;
	height: 150px;
	background-size : 150px;
}

/* 文字の位置 */
.main-menu-caption{
	position: absolute;
	top: 50%;
	left: 5%;
	width: 86%;
	height: auto;
	margin: auto;
	text-align: center;
	font-family:Meiryo;
	font-size: 24px;
	color:#ffffff;
	text-shadow:-1px -1px 1px #0d0d0d;
	cursor:pointer;
}

/* 初期ボタン構成 */
.circle-default {
	cursor:pointer; /* カーソルの形状 */
	opacity:0.7; /* 透過度 */
	background-image: url('../img/main/btn_default.png');
}


/* hover時のボタン構成 */

.circle-hover {
	opacity:0.7; /* 透過度 */
	background-image: url('../img/main/btn_onfocus.png')!important;
}

/* 選択状態のボタン構成 */
.circle-active {
	opacity:0.7; /* 透過度 */
	background-image: url('../img/main/btn_active.png')!important;
}


/*
 メインページメインコンテンツ部のスタイル設定
 */

/* メインHTMLのヘッダーコンテンツ */
.main-contents {
    position : relative; /* 相対位置 */
    width    : 1040px;   /* コンテンツ幅の固定 */
    margin   : auto;     /* コンテンツの中央寄せ */
}

/* メインHTMLのヘッダー左のスタイル */
.main-object {
    width   : 100%;
    border  : 0px;
    margin  : 0px;
    padding : 0px;
}


/*
 メインページフッター部のスタイル設定
 */

/* フッターエリア */
.footer-area {
	margin-top:10px;
	font-family:Meiryo;
	font-size: 14px;
	color:#ffffff; /* 白 */
 	text-align: center;
}

/* フッターボックス */
.footer-box {
	position:relative;
 	border:1px solid #00679a; /* 範囲、位置確認用 */ 
	margin:auto; /* 中央寄せ */
	width:1030px; /* 長さ */
	height:35px;
/*border: 9px solid #000;*/
}

/* フッターリンク */
.footer-link {		
	float:left;
	cursor:pointer;
	color:#ffffff; /* 白 */
	text-decoration: underline; /* 下線 */
	margin-right:10px; /* 10px間隔を空けて配置 */

}

/* コピーライト */
.copyright {
	float:right; /* 右に配置 */
	font-family:Meiryo;
	font-size: 14px;
	color:#ffffff; /* 白 */
	//text-align:right; /* 右に配置 */
}