@charset "utf-8";

/*----------------------------------------
共通
------------------------------------------*/
#works_container,
#about2_container,
#about_container,
#concept_container,
#top_container{
	width: 950px;
	height: 642px;
	margin: 70px auto 0;
	position: relative;
}
#top_container{background:url('../img/top_back.png') no-repeat ;}
#concept_container{background:url('../img/concept_back.png') no-repeat ;}
#about_container{background:url('../img/about_back.png') no-repeat ;}
#about2_container{background:url('../img/about2_back.png') no-repeat ;}
#works_container{background:url('../img/works_back.png') no-repeat ;}

.left_contents{position:relative;}
/*右側コンテンツ共通*/
.right_contents{
	position: absolute;
	width: 50%;
	top: 108px;
	left: 450px;
}

/*トップページインフォメーション*/
.info{
	position: absolute;
	width: 300px;
	height: 60px;
	top: 330px;
	left: 110px;
	background :#FFF;
}
.info a{font-size: 10px; color: #999980;  }

/*準備中*/
.junbi{
	font-size: 13px;
	text-align: center;
	margin: 150px 100px 0 0;
}
/*メニュー*/
.main_nav{
	position: absolute;
	top: 383px;
	left: 137px;
	width:197px;
}
.main_nav li{
	display:inline-block;
	list-style:none;
	width: 48.5%;
	padding:5px 0;
	text-align:center;
}
.main_nav li:nth-child(3),
.main_nav li:first-child{border-right: solid 1px #999980;}
.main_nav li:nth-child(2),
.main_nav li:first-child{border-bottom: solid 1px #999980;}
.main_nav li:nth-child(2),
.main_nav li:nth-child(4){margin-left: -5.5px;}
.main_nav li:nth-child(3),
.main_nav li:nth-child(4){margin-top: -0.5px; }

.main_nav li:hover{opacity: 0.5;}



/*----------------------------------------
works_top
------------------------------------------*/

.works_navi{width:336px; margin-left: 21px;}
.works_navi li{
	display: inline-block;
	width: 49%;
	list-style:none;
}

.works_navi li a{
	display: block;
	width: 167px;
	height:84px;
}

.works_navi li .catalog{background:url('../img/works_catalog.jpg') no-repeat ;}
.works_navi li .catalog:hover{background:url('../img/works_catalog_shiro.jpg') no-repeat ;}

.works_navi li .pamp{background:url('../img/works_pamp.jpg') no-repeat ;}
.works_navi li .pamp:hover{background:url('../img/works_pamp_shiro.jpg') no-repeat ;}

.works_navi li .adver{background:url('../img/works_adver.jpg') no-repeat ;}
.works_navi li .adver:hover{background:url('../img/works_adver_shiro.jpg') no-repeat ;}

.works_navi li .pac{background:url('../img/works_pac.jpg') no-repeat ;}
.works_navi li .pac:hover{background:url('../img/works_pac_shiro.jpg') no-repeat ;}

.works_navi li .logo{background:url('../img/works_logo.jpg') no-repeat ;}
.works_navi li .logo:hover{background:url('../img/works_logo_shiro.jpg') no-repeat ;}

.works_navi li .branding{background:url('../img/works_bra.jpg') no-repeat ;}
.works_navi li .branding:hover{background:url('../img/works_bra_shiro.jpg') no-repeat ;}

.works_navi li .web{background:url('../img/works_web.jpg') no-repeat ;}
.works_navi li .web:hover{background:url('../img/works_web_shiro.jpg') no-repeat ;}

.works_navi li .other{background:url('../img/works_other.jpg') no-repeat ;}
.works_navi li .other:hover{background:url('../img/works_other_shiro.jpg') no-repeat ;}


/*----------------------------------------
footer
------------------------------------------*/
.footer{
	width: 100%;
	text-align: center;
	font-size:10px;
	position:absolute;
	bottom:150px;
	color: #999980;
}