@charset "utf-8";

@import url(common.css);

#container {
	padding-top: 20px;
}

/* Font */
/* -------------------------------------------------------------------------------- */

.blog .date,
#topics,
#work .inner2,
#contact,
#contact2 {
	font-size: 85%;
}


/* Common */
/* -------------------------------------------------------------------------------- */

.ebox {
	margin-bottom: 30px;
}
.ebox-l {
	margin-bottom: 20px;
}


/* Img-Title */
/* -------------------------------------------------------------------------------- */

#main h2,
#contact2 .ic01,
#contact2 .ic02,
.blog .title .navi {
	font-size: 2px;
	text-indent: -9999em;
}

#main h2 a,
#contact2 .ic01 a,
#contact2 .ic02 a,
.blog .title .navi a {
	display: block;
}


/* Clear */
/* -------------------------------------------------------------------------------- */

#work .inner,
#work .inner2 {
	zoom: 100%;
}
#work .inner:after,
#work .inner2:after {
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}


/* Kengakukai */
/* -------------------------------------------------------------------------------- */

#kengaku {
	float: left;
	width: 500px
}

/* Topics */
/* -------------------------------------------------------------------------------- */

#topics {
	width: 180px;
	float: right;
	background: #660;
	color: #FFF;
}
#topics h2 {
	background: url(../../images/t-topics.jpg) no-repeat left top;
}
#topics h2 a {
	display: block;
	height: 104px;
}
#topics .inner {
	padding: 5px;
}


/* News Wazablog Common */
/* -------------------------------------------------------------------------------- */

.blog {
	width: 340px;
}

/* Title */
.blog .title {
	position: relative;
}
.blog h2 a {
	width: 320px;
	height: 23px;
}
.blog .title .navi {
	position: absolute;
	top: 1px;
	right: 0px;
	width: 16px;
	background: url(../../images/feed.gif) no-repeat left top;
}
.blog .title .navi a {
	height: 16px;
}

/* Inner */
.blog .inner {
	padding-top: 5px;
}

/* List */
.blog li {
	padding: 3px 5px 3px 70px;
}
.blog li.bg {	background: #ECE8DA;}
.blog a.date {
	color: #990;
	font-weight: bold;
}
.blog a.date:hover {
	text-decoration: none;
}
.blog a.entry {
	color: #4D4D4D;
}
.blog a.entry:hover {
	color: #C30;
}

/* News */
#news {	float: left;}
#news .title { background: url(../../images/t-blog.gif) no-repeat left top;}
#news .inner { background: url(../../images/blog-bg.gif) no-repeat left top;}

/* Wazablog */
#takumiblog {	float: right;}
#takumiblog .title { background: url(../../images/t-takumiblog.gif) no-repeat left top;}
#takumiblog .inner { background: url(../../images/takumiblog-bg.gif) no-repeat left top;}


/* About + Workman */
/* -------------------------------------------------------------------------------- */

/* Common */
.intro {
	width: 340px;
}
.intro h2 a {
	height: 28px;
}
.intro .inner {
	padding: 9px 0 0 130px;
}
.intro .inner p {
	margin-bottom: 5px;
}
.intro .inner li {
	float: left;
	margin-right: 5px;
	white-space: nowrap;
	font-weight: bold;
	background: url(../images/p-ar01.gif) no-repeat left center;
	padding-left: 15px;
}
.intro .inner li:hover {
	background: url(../images/p-ar01-on.gif) no-repeat left center;
}

/* About */
#about { float: left;}
#about h2 {	background: url(../../images/t-about.gif) no-repeat left top;}
#about .inner {	background: url(../../images/about-bg.jpg) no-repeat left top;}

/* Workman */
#workman { float: right;}
#workman h2 {	background: url(../../images/t-workman.gif) no-repeat left top;}
#workman .inner {	background: url(../../images/workman-bg.jpg) no-repeat left top;}


/* Work */
/* -------------------------------------------------------------------------------- */

#work {
	color: #CCC;
	background: url(../../images/work-bg.gif) no-repeat 0px 48px;
}

/* Title */
#work h2 { background: url(../../images/t-work.gif) no-repeat left top;}
#work h2 a { height: 48px;}

/* Inner */
#work .inner {
	padding-top: 9px;
	margin-bottom: 10px;
	margin-left: 150px;
	width: 530px;
}
#work .inner p {
	margin-bottom: 5px;
}

/* List1 */
#work .inner li {
	float: left;
	margin-right: 8px;
	white-space: nowrap;
}
#work .inner li a {
	background: url(../../images/p-arrow.gif) no-repeat left center;
	padding-left: 15px;
	color: #D3AD37;
	font-weight: bold;
}
#work .inner li a:hover {
	color: #CC3300;
	background: url(../../images/p-arrow-on.gif) no-repeat left center;
}

/* Inner2 */
#work .inner2 {
	background: url(../../images/work-bg2.gif) no-repeat left bottom;
	padding: 10px 20px 20px 20px;
}

/* List2 */
#work .inner2 li {
	float: left;
	text-align: right;
	margin-right: 10px;
}
* html #work .inner2 li img {
	margin-bottom: 3px;
}
#work .inner2 li a {
	color: #CCC;
}
#work .inner2 li a:hover {
	color: #CC3300;
	text-decoration: none;
}
#work .inner2 .iwl-r {
	margin-right: 0;
}
#work .inner2 .iwl01 {
	margin-bottom: 10px;
}


/* Contact */
/* -------------------------------------------------------------------------------- */

#contact {
	float: left;
	width: 450px;
	color: #666;
}
#contact p {
	line-height: 1.5;
	margin-top: 10px;
}

/* Title */
#contact h2 {
	background: url(../../images/t-contact.gif) no-repeat left top;
}
#contact h2 a {
	height: 44px;
}


/* Contact2 */
/* -------------------------------------------------------------------------------- */

#contact2 {
	float: right;
	width: 223px;
}

/* List */
#contact2 .ic01 {
	background: url(../images/btn-tel.gif) no-repeat left top;
	height: 44px;
	margin-bottom: 5px;
}
#contact2 .ic02 {
	background: url(../images/btn-form.gif) no-repeat left top;
	margin-bottom: 7px;
}
#contact2 .ic02 a {
	height: 44px;
}
#contact2 .ic03 {
	margin-bottom: 4px;
}
#contact2 .ic03 a {
	background: url(../images/p-ar02.gif) no-repeat left center;
	padding-left: 15px;
	color: #4D4D4D;
}
#contact2 .ic03 a:hover {
	background: url(../images/p-ar01-on.gif) no-repeat left center;
	color: #CC3300;
}
#contact2 p {
	text-align: right;
	margin: 10px 0 0 0;
}


/* Taikoban */
/* -------------------------------------------------------------------------------- */

#taikoban {
	width: 180px;
	float: right;
}
