@charset "utf-8";
/*****Reset*****/
html {
	overflow-y: scroll;
}

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; }

/*------------------------total------------------------------*/
body {
	font-size: 12px;
	font-height: 150%;
	font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック', sans-serif; 
	color: #222;
	margin: 0;
	padding: 0;
	background: #fff;
}

li {
	margin: 10px;
	list-style: none;
	display: inline
}

ol, ul {
	margin: 0 0 0.2em 0;
	padding: 0;
}
 
img {
	border: 0;
	vertical-align: bottom;
}

hr {
	border: 1px solid #E4DEDE;
	margin: 15px auto 5px auto;
		_margin: 0 auto;
    padding: 0;
    width: 100%;
}

/*Win Firefox*/
:focus {
	--moz-outline-style: none;
}
/*Mac Firefox*/
a { 
	outline: none; 
}

h1 {
	font-size: 14px;
	line-height: 16px;
	font-weight: bold;
}

h2,h3 {
	font-size: 12px;
	line-height: 14px;
	font-weight: bold;
}

h3 {
	margin-bottom:8px;
}

td,th,p,pre {
	text-align: left;
	margin-bottom: 0.8em;
	font-size: 12px;
	line-height: 140%;
	font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック', sans-serif; 
}

.p_top {
	padding-top: 0.8em;
}

a {
	color: #E7297A;
	font-weight: bold;
	text-decoration: none;
}

a:hover {
	color: #333;
	font-weight: bold;
	text-decoration: underline;
} 

.clear {
	clear: both;
	display: block;
	margin: 0;
	padding: 0;
}

.center {
	text-align: center;
}

.indent{
	text-indent:20px;
}



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

#header-wrap {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;	
}

#header-container {
	height: 156px;
	background: #fff;
}

#header {
	width: 940px;
	margin: 0 auto;
	position: relative;
}


#header_l{
	width:320px;
	height:389px;
	float:left;
	position: absolute;
    top: 0px;
    left: 20px;
	z-index: 30;
}

#header h1 {
    position: absolute;
    top: 0px;
    left: 350px;
	width: 250px;
	height: 13px;
	z-index: 30;
	color: #E4DEDE;
	font: 10px/12px Verdana, Arial, sans-serif;
}

#header h1 em{
	color: #90b874;
	font-size: small;
	display: block;
}

#container {
	width: 940px;
	margin: 0 auto;
	font-size: 1.4em;
	overflow: auto;
	padding: 156px 0 30px;
	background: #fff;
}

#content-l {
	float: left;
	width: 280px;
	margin-top: 230px;
	padding-left:25px;
		_padding-left:20px;
}

#content-r {
	float: right;
	width: 580px;
	margin-top: 25px;
	margin-right: 20px;
		_margin-right: 15px;
}

#footer-wrap {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;	
}

#footer-container {
	height: 30px;
	background: #fff;
}

#footer {
	width: 940px;
	margin: 0 auto;
	position: relative;
}
/*----------------------------------------------------------------*/
/*------------------------navigation------------------------------*/

#navigation {
	float: right;
	width: 606px;
	height: 96px;
}

#navigation li  {  
list-style-type: none;  
display:table-cell;  
*display:inline;  
*zoom:1;   
margin:0;  
padding:0;  
} 
 
.home ,.home a ,.home a:hover,.home a:focus {
width:88px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_1.jpg) no-repeat;
text-decoration: none;float:left;
}
.home {
margin:0;display:inline;
}
.home,.home a:hover,.home a:focus {
background:url(../images/nav/over_1.jpg) no-repeat;
}
.about ,.about a ,.about a:hover,.about a:focus {
width:90px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_2.jpg) no-repeat;
text-decoration: none;float:left;
}
.about {
margin: 0;display:inline;
}
.about,.about a:hover,.about a:focus {
background:url(../images/nav/over_2.jpg) no-repeat;
}
.works ,.works a ,.works a:hover,.works a:focus {
width:89px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_3.jpg) no-repeat;
text-decoration: none;float:left;
}
.works {
margin:0;display:inline;
}
.works,.works a:hover,.works a:focus {
background:url(../images/nav/over_3.jpg) no-repeat;
}
.gallery ,.gallery a ,.gallery a:hover,.gallery a:focus {
width:95px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_4.jpg) no-repeat;
text-decoration: none;float:left;
}
.gallery {
margin:0;display:inline;
}
.gallery,.gallery a:hover,.gallery a:focus {
background:url(../images/nav/over_4.jpg) no-repeat;
}
.blog ,.blog a ,.blog a:hover,.blog a:focus {
width:78px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_5.jpg) no-repeat;
text-decoration: none;float:left;
}
.blog {
margin:0;display:inline;
}
.blog,.blog a:hover,.blog a:focus {
background:url(../images/nav/over_5.jpg) no-repeat;
}
.link ,.link a ,.link a:hover,.link a:focus {
width:63px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_6.jpg) no-repeat;
text-decoration: none;float:left;
}
.link {
margin:0;display:inline;
}
.link,.link a:hover,.link a:focus {
background:url(../images/nav/over_6.jpg) no-repeat;
}
.contact ,.contact a ,.contact a:hover,.contact a:focus {
width:103px;height:96px;text-indent:-2000px;
background:url(../images/nav/base_7.jpg) no-repeat;
text-decoration: none;float:left;
}
.contact {
margin:0;display:inline;
}
.contact,.contact a:hover,.contact a:focus {
background:url(../images/nav/over_7.jpg) no-repeat;
}
/*----------------------------------------------------------------*/
/*------------------------main-content----------------------------*/
.head_link {
    position: absolute;
    top: 0px;
    left: 863px;
	width: 320px;
	height: 13px;
	z-index: 30;
	color: #E4DEDE;
	font: 10px/12px Verdana, Arial, sans-serif;
}

.head_link2 {
    position: absolute;
    top: 0px;
    left: 867px;
	width: 80px;
	height: 13px;
	z-index: 30;
	color: #E4DEDE;
	font: 10px/12px Verdana, Arial, sans-serif;
}

.head_link a:link, .head_link a:hover, .head_link a:visited{
	color: #D6CECE;
}

.head_link2 a:link, .head_link2 a:hover, .head_link2 a:visited {
	color: #D6CECE;
}

.copy {
	float: left;
	width: 400px;
	padding-top:20px;
	height:13px;
	color: #E4DEDE;
	padding-left:20px;
}

.copy a:link, .copy a:hover, .copy a:visited {
	font-weight: bold;
	text-decoration: none;
	color: #E4DEDE;
}

.c_name1 {
    position: absolute;
    top: 120px;
    right: 0px;
	z-index: 30;
	width: 321px;
	height: 40px;
}

.c_name2 {
	float: right;
	width: 268px;
	height: 50px;
	z-index: 10;

}

.c_name3 {
	float: right;
	width: 306px;
	height: 50px;
	z-index: 10;

}

.infodate {
	font-size: 13px;
	color: #000;
	font-weight: bold;
	border-bottom: thin dotted #E4DEDE;
}

#mycustomscroll1 {
	/* Typical fixed height and fixed width example */
	width: 270px;
	height: 300px;
	overflow: auto;
	/* IE overflow fix, position must be relative or absolute*/
	position: relative;
	background-color: #fff;
	margin-top: 60px;
	padding: 0 7px 0 0;
}

#mycustomscroll2 {
	/* Typical fixed height and fixed width example */
	width: 565px;
	height: 500px;
	overflow:auto;
	float:right;
	/* IE overflow fix, position must be relative or absolute*/
	position: relative;
	background-color: #fff;
	margin-top: 15px;
	padding: 0 7px 0 0;
}

.clearfloat {
clear:both; height:0px;
line-height:0px; visibility: hidden;
}
/*----------------------------------------------------------------*/
/*------------------------content_TOP----------------------------*/
.box_r{
	position: relative;
	width:580px;
	background-color:#fff;
}

.workinfo {	
	font-size: 12px;
	color: #333;
	line-height: 15px;
}
.worktitles {
	font-size: 12px;
	color: #000;
	font-weight:bold;
	line-height:150%;
	padding:5px 0 5px 22px;
	background:url(../images/icon.gif) no-repeat left 1px;
}

.thumb1 {
	position:absolute;
	width:580px;
	height:192px;
	z-index:10;
	left: 0px;
	top: 0px;
}

.thumb2 {
	position:absolute;
	width:285px;
	height:177px;
	z-index:10;
	left: 0px;
	top: 240px;
}

.thumb3 {
	position:absolute;
	width:285px;
	height:177px;
	z-index:11;
	left: 295px;
	top: 240px;
}

.thumb4 {
	position:absolute;
	width:200px;
	height:91px;
	z-index:11;
	left: 0px;
	top: 478px;
}

.thumb5 {
	position:absolute;
	width:340px;
	height:100px;
	z-index:15;
	left: 243px;
	top: 475px;
	font-size: 11px;
}

.info1 {
	position:absolute;
	width:580px;
	height:30px;
	z-index:13;
	left: 0px;
	top: 200px;
}

.info2 {
	position:absolute;
	width:285px;
	height:30px;
	z-index:13;
	left: 0px;
	top: 425px;
}

.info3 {
	position:absolute;
	width:285px;
	height:30px;
	z-index:13;
	left: 295px;
	top: 425px;
}
/*----------------------------------------------------------------*/
/*-------------------------contents_ABOUT-------------------------*/

.text_b1{
	width:570px;
	margin:0px 0 0 10px;
}

.text_b2{
	width:570px;
	margin:20px 0 0 10px;
		_margin:10px 0 0 10px;
}

.inner {
	width:525px;
	margin:0;
	padding-left:22px;
}

.profile{
	width:370px;
	display:inline;
}

.profile p　{
	font-size: 12px;
	line-height: 130%;
	margin: 0 0 5px 0;
	text-align: left;
}

.indent{
	text-indent:20px;
}

.photo {
	width: 120px;
	margin: 0 25px 20px 0;
	float: left;
	display:inline;
}

.skill {
	position:absolute;
	width:200px;
	height:100px;
	z-index:11;
	left: 10px;
	top: 460px;
		_top: 470px;
}

.p_top {
	padding-top: 0.1em;
}
.skill p {
	font-size: 12px;
	line-height: 110%;
	margin: 0 0 5px 0;
	padding-left:22px;
	text-align: left;
}
/*----------------------------------------------------------------*/
/*---------------------contents_WORKS&GALLERY---------------------*/
ul#work_info {
	float:right;
	width:270px;
	margin:0;
	padding:0;
}

ul#work_info li {
	width:270px;
	float:left;
	margin:0 0 4px 0;
	line-height:160%;
	font-size: 12px;
}

ul#work_info img { display: block; padding-bottom: 5px; }
/*----------------------------------------------------------------*/
/*-------------------------contents_BLOG--------------------------*/


#blogbox {
	width: 910px;
	height: 580px;
	position: relative;
	margin: 60px 0.2em 0 0;
	background-color: #fff;
}
iframe {
	height: 580px;
	margin-left: 30px;
}
/*----------------------------------------------------------------*/
/*-------------------------contents_LINK-------------------------*/
.banner_box {
	float:left;
	height:62px;
	border-right:2px solid #E4DEDE;
	margin-right:10px;
}

.banner_box p {
	margin-top:10px;
}

.banner_box ul {
	margin:0 15px 15px 0;
}

.banner_box li {
	margin:0 15px 0 0;
}

#linksmain {
	width:540px;
	background:#FFF;
}

*:first-child + html #linksmain {
	padding-bottom:5px;
}

#linksmain .item {
	float:left;
	margin:0 3px 3px 0;
	width:125px;
	height:40px;
	background:#fff;

}

#linksmain .item + .item + .item + .item + .item + .item,
#linksmain .item + .item + .item {
	margin-right:3px;
}

#linksmain .item + .item + .item + .item {
	margin-right:3px;
}

#linksmain .item p,
#linksmain .item h3 {
	margin: 0;
}

.linksinner {
	padding:0 3px 3px 0;
}

.l-h1 {
	width: 300px;
	margin-bottom: 10px;
}

.l-h2 {
	width: 300px;
	margin-bottom: 10px;
	_margin-top:-20px;
}


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

.foot_ob {
    position: absolute;
    bottom: -30px;
    right: 0px;
    width: 395px;
    height: 119px;
	z-index:40;
	/* IE6対策（位置固定） */
    	_position: absolute;
    	_top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight＋119)+'px'); 
		_bottom: -6px;
		_z-index:100;
}