@charset "UTF-8";

/* -------------------------- */
/* AUTHOR: SOL i Architect .Inc Masayuki Fujimoto */
/* LAST MODIFIED: 2012.1.7 sat */
/* -------------------------- */

#headerBox h1 {
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}


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

#headerBox h1 {
	float:left;
	margin-top:9px;
}
	#headerBox h1 a {
		width:410px;
		height:78px;
		display:block;
		background:url(../images/basis/logo.png) no-repeat;
	}
	

/*------------------------------
mainImg
------------------------------*/

#mainImg {
	width:100%;
	height:380px;
	overflow:hidden;
	margin-bottom:24px;
}
	
	#loopslider {
		clear:both;
		width: 100%;
		height: 380px;
		position: relative;
		overflow: hidden;
	}
		#loopslider ul {
			width:100%;
			height: 380px;
			display: inline;
			overflow: hidden;
		}
			#loopslider ul li {
				float: left;
				width:600px;
				height:380px;
				display: block;
				overflow: hidden;
				margin-left:1px;
			}
	
	#mainImg p {
		width:380px;
		margin:0 auto;
		margin-top:-108px;
		position:relative;
		z-index:100;
	}


/* -------------------------- */
/* wrapper */
/* -------------------------- */

#columnBox ,
#columnBox02 {
	clear:both;
	overflow:hidden;
	margin-bottom:15px;
}

#columnBox02 {
	margin-bottom:0;
}

	#columnBox .column01 {
		float:left;
		width:314px;
		margin-right:29px;
	}
	
		#columnBox .topTitle {
			overflow:hidden;
		}
			#columnBox .topTitle p.bgYellow { background:url(../images/index/bg_indexMore01.png) no-repeat; }
			#columnBox .topTitle p.bgPink { background:url(../images/index/bg_indexMore02.png) no-repeat; }
	
		#columnBox .topNowBox .imgBox ,
		#columnBox .topWorksBox .imgBox {
			width:294px;
			height:178px;
			background:url(../images/index/bg_index01.png) no-repeat;
			padding:7px 10px;
		}
			#columnBox .topNowBox .imgBox .pic ,
			#columnBox .topWorksBox .imgBox .pic  {
				position:absolute;
				z-index:10;
			}
			#columnBox .topNowBox .imgBox p.txt ,
			#columnBox .topWorksBox .imgBox p.txt {
				width:287px;
				height:21px;
				background:url(../images/index/bg_index05.png) repeat-x;
				position:absolute;
				z-index:20;
				font-size:1.2em;
				color:#fff;
				padding:7px 0 0 7px;
				top:204px;
			}
			#columnBox .topNowBox .imgBox p.txt a ,
			#columnBox .topWorksBox .imgBox p.txt a { color:#fff; text-decoration:none; }
			#columnBox .topNowBox .imgBox p.txt a:hover ,
			#columnBox .topWorksBox .imgBox p.txt a:hover { color:#fff; text-decoration:none; }
			
			#columnBox .topWorksBox .imgBox p.txt {
				top:457px;
			}
	#columnBox .columnEnd {
		margin-right:0;
	}
	
	#columnBox .topVoiceBox {
		width:304px;
		height:438px;
		overflow:hidden;
		background:url(../images/index/bg_index02.png) no-repeat;
		padding:7px 0 0 10px;
	}
		#columnBox .topVoiceBox dl {
			width:294px;
			height:128px;
			overflow:hidden;
			background:url(../images/index/bg_index06.png) no-repeat;
			margin-bottom:22px;
		}
			#columnBox .topVoiceBox dl dt {
				float:left;
				width:134px;
				height:128px;
				display:block;
				overflow:hidden;
			}
				#columnBox .topVoiceBox dl dt img {
					width:134px;
				}
			#columnBox .topVoiceBox dl dd {
				float:left;
				width:160px;
			}
				#columnBox .topVoiceBox dl dd span {
					display:block;
				}
				#columnBox .topVoiceBox dl dd span.name {
					font-size:12px;
					padding:12px 0 0 17px;
				}
				#columnBox .topVoiceBox dl dd span.txt {
					font-size:12px;
					line-height:1.4em;
					padding:18px 0 0 16px;
				}
				#columnBox .topVoiceBox dl dd span.date {
					font-size:1.0em;
					margin:10px 0 0 16px;
					padding:5px 5px 0 0;
					text-align:right;
					border-top:1px dotted #c0b8a4;
				}
				
				#columnBox .topVoiceBox dl dd a { text-decoration:none; }
				#columnBox .topVoiceBox dl dd a:hover { text-decoration:underline; }
	
	
	.column02 {
		float:left;
		width:657px;
		margin:14px 29px 0 0;
	}
		.newsFeed ,
		.blogFeed {
			width:637px;
			overflow:hidden;
			padding:10px;
		}
			.newsFeed { background:url(../images/index/bg_index03.png) repeat-y; }
			.blogFeed { background:url(../images/index/bg_index04.png) repeat-y; }
			
			.newsFeed ul ,
			.blogFeed ul {
				width:637px;
			}
				.newsFeed ul li ,
				.blogFeed ul li {
					border-bottom:1px dotted #c0b8a4;
					padding:10px 0 10px 6px;
					font-size:1.2em;
				}
					.newsFeed ul li span.icon ,
					.blogFeed ul li span.icon {
						display:inline-block;
						background-color:#fff;
						-moz-border-radius: 20px;
						-webkit-border-radius: 20px;
						-khtml-border-radius: 20px;
						border-radius: 20px;
						text-align:center;
						font-size:10px;
						font-weight:bold;
						padding:2px 0;
						margin-right:15px;
					}
					.newsFeed ul li span.icon {
						width:80px;
						color:#f39400;
						border:2px solid #ffb644;
					}
					.blogFeed ul li span.icon {
						width:165px;
						color:#9ea400;
						border:2px solid #dadf5a;
					}
					#columnBox ul li span.date {
						color:#a38a6e;
					}
					
	.column03 {
		float:left;
		width:314px;
	}
		.topStaffBox {
			margin:0;
			padding:0;
		}
		.column03 .facebook {
			margin-top:15px;
			background-color:#fff;
		}