@charset "utf-8";
/* CSS Document */
/*----------------------------------------

wrapper 

-----------------------------------------*/
#wrapper {
	margin:0 auto;
	width:100%;
	background-image:url(../../common/img/bg-wrap.gif);
	background-repeat:no-repeat;
	background-position:center top;
}

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

#works

-----------------------------------------*/
#works {
	padding:20px 30px 50px;
	width:617px;
}
#works h2 {
	padding-bottom:20px;
}

.section {
	border-bottom:1px solid #e3e3e3;
	padding-bottom:30px;
	margin-bottom:30px;
}
.last {
	padding-bottom:0;
	margin-bottom:0;
	border:none;
}

/* works-img -----------------------------------------*/
.works-img {
	float:left;
	border:1px solid #e3e3e3;
}

/* works-area -----------------------------------------*/
.works-area {
	width:210px;
	float:right;
}
.works-area .kind {
	width:95px;
	font-size:84%;
	text-align:center;
	float:right;
	color:#FFFFFF;
}
.cp {
	background-color:#82cbe4;
}
.ec {
	background-color:#b7e482;
}
.mo {
	background-color:#e4beda;
}

/* wworks-list -----------------------------------------*/
dl.works-list {
	clear:both;
	padding:20px 0 20px;
}
dl.works-list dt {
	float:left;
}
dl.works-list dd {
	padding-left:45px;
}
dl.works-list dd.url {
	background:url(../../common/img/icon-url.gif) no-repeat 45px 2px;
	padding-left:60px;
}
dl.works-list dd a {
	text-decoration:underline;
}

/* works-icon -----------------------------------------*/
ul.works-icon {
	width:210px;
	clear:both;
}
ul.works-icon li {
	float:left;
	width:49px;
	text-align:center;
	font-size:84%;
	color:#FFFFFF;
	margin:0 0 3px 3px;
}
ul.works-icon li.on {
	background-color:#000000;
}

ul.works-icon li.off {
	background-color:#cccccc;
}

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

gNav 

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

#gNav-wrap {
	margin:0 auto;
	width:100%;
}

#gNav {
	width:948px;
	margin:0 auto;
	padding-bottom:10px;
}

#gNav ul li {
	float:left;
}

#gNav ul li a {
	display:block;
	height:56px;
	overflow:hidden;
	text-indent:-999px;
	background-image:url(../../common/img/gNav.gif);
	background-repeat:no-repeat;
}
#gNav li.top a {
	background-position:0 0;
	width:136px;
}
#gNav li.service a {
	background-position:-136px 0;
	width:135px;
}
#gNav li.flow a {
	background-position:-271px 0;
	width:135px;
}
#gNav li.price a {
	background-position:-406px 0;
	width:136px;
}
#gNav li.works a {
/*	background-position:-542px 0;
	width:135px;
*/	background-position:-542px 100%;
	width:135px;
}
#gNav li.voice a {
	background-position:-677px 0;
	width:136px;
}
#gNav li.faq a {
	background-position:-813px 0;
	width:135px;
}


#gNav li.top a.on,
#gNav li.top a:hover {
	background-position:0px 100%;
	width:136px;
}
#gNav li.service a.on,
#gNav li.service a:hover {
	background-position:-136px 100%;
	width:135px;
}
#gNav li.flow a.on,
#gNav li.flow a:hover {
	background-position:-271px 100%;
	width:135px;
}
#gNav li.price a.on,
#gNav li.price a:hover {
	background-position:-406px 100%;
	width:136px;
}
#gNav li.works a.on,
#gNav li.works a:hover {
	background-position:-542px 100%;
	width:135px;
}
#gNav li.voice a.on,
#gNav li.voice a:hover {
	background-position:-677px 100%;
	width:136px;
}
#gNav li.faq a.on,
#gNav li.faq a:hover {
	background-position:-813px 100%;
	width:135px;
}