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

/************** init **************/
html {
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
 pre, form, fieldset, input, textarea, p, blockquote, th, td	{
	margin: 0;	padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var	{
	font-style: normal;
}
table	{
	border-collapse: collapse;	border-spacing: 0;
}
caption, th	{
	text-align: left;
}
q:before ,q:after	{
	content: '';
}
object, embed	{
	vertical-align: top;
}
hr, legend	{
	display: none;
}
h1, h2, h3, h4, h5, h6	{
	font-size: 100%;
}

h2 {
	font-weight:bold;
	font-size:110%;
	margin-bottom:10px;
	border-bottom:solid 1px #000000;
}
h3{
	font-weight:bold;
	font-size:161%;
	color:#FF4C3F;
}

img, abbr, acronym, fieldset	{
	border: 0;
	vertical-align: bottom;
}
li	{
	list-style-type: none;
}

/************** init Font **************/
body {
	font-family: verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	font-size: 13px;
	line-height: 150%;
	color:#333333;
	overflow:hidden; 
	background-color:#000000;
	
	
	background-image: url(../images/wave_back1.jpg);
	background-image: url(../images/wave_back2.jpg);
	background-image: url(../images/wave_back3.jpg);
	background-image: url(../images/wave_back4.jpg);
	background-image: url(../images/wave_back5.jpg);
	background-image: url();
	
}


#supersize img, #supersize a{  
    height:100%;  
    width:100%;  
    display:none;
		position:fixed;
		/* IE5 later && javascript-on */
		position: expression('absolute');
		top: expression((documentElement.scrollTop || document.body.scrollTop) + 0 + 'px');
		left: expression((documentElement.scrollLeft || document.body.scrollLeft) + 0 + 'px');
}  
#supersize .activeslide, #supersize .activeslide img{  
    display:inline;  
} 


/************** init A tag **************/
a:link,
a:visited,
a:active  {  
	text-decoration: none;  
	color: #000000;  
}  
a:hover {  
	text-decoration: underline;  
	color: #666666;  
} 

/************** clearfix **************/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
} 
/* Hides from IE-mac \*/ 
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
	}
/* End hide from IE-mac */



/************** frame **************/
div#container{
	position:absolute;
	top:0;
	left:0;
	width:100%;
}
div#header{
	background:url(../images/white_back.png) repeat;
	height:47px;
	margin-top:10px;
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	
	/* IE5 later && javascript-on */
	position: expression('absolute');
	top: expression((documentElement.scrollTop || document.body.scrollTop) + 0 + 'px');
	left: expression((documentElement.scrollLeft || document.body.scrollLeft) + 0 + 'px');
}

div#wrapper{
}

div#main{
	margin:auto;
	margin-top:50px;
	margin-left:50px;
	position:absolute;
	top:35px;
	width:9000px;
}
div.main-left{
	width:415px;
	float:left;
}
div.main-right{
	width:415px;
	float:right;
}
div.section{
	overflow:hidden;
	padding:20px;
	background:url(../images/white_back.png) repeat;
	float:left;
	margin-right:500px;
	width:860px;
	height:380px;
	position:relative;
}

#footer{
	position:fixed;
	top:505px;
	left:50px;
	width:890px;
	text-align:right;
	color:#000;
	font-size:93%;
	
	
	/* IE5 later && javascript-on */
	position: expression('absolute');
	top: expression((documentElement.scrollTop || document.body.scrollTop) + 505 + 'px');
	left: expression((documentElement.scrollLeft || document.body.scrollLeft) + 50 + 'px');
}

/************** header **************/
div#header h1{
	float:left;
	padding-left:70px;
}
div#header p {
	color:#FFFFFF;
	padding-top:15px;
	padding-right:15px;
	font-size:92%;
}
ul#global-navi{
	float:left;
	margin-left:20px;
	padding-top:15px;
}
ul#global-navi li{
	float:left;
	margin-right:10px;
}
ul#global-navi a:hover{
	color:#666666;
}



div#top-logo{
	position:absolute;
	top:50%;
	left:50%;
	width:222px;
	height:112px;
	margin-left:-111px;
	margin-top:-56px;
}


div.red-line{
	float:left;
	width:30px;
	text-align:center;
	
}

img.arrow{
	margin:0 2px;
}

div.arrow-right{
	position:absolute;
	top:385px;
	left:690px;
	width:200px;
	text-align:right;
}
div.arrow-left{
	position:absolute;
	top:385px;
	left:10px;
	width:200px;
}

/************** home **************/
div#home div.main-left{
	text-align:center;
}
div#home div.main-left img{
	margin-top:130px;
}
div#simple{
	margin:10px auto 15px auto;
}
div#home-blog{
	background:url(../images/blog_back.png) no-repeat;
	width:416px;
	height:162px;
	padding:30px 0 0 5px;
	margin:auto;
	margin-top:20px;
	position:relative;
}
div#home-blog ul#surflive{
	position:absolute;
	top:110px;
	left:240px;
	font-size:77%;
	line-height:120%;
}
div#home-blog ul#surflive ul li{
} 

	

/************** about **************/
div#about dl{
	margin-top:10px;
	margin-bottom:20px;
}
div#about dt{
	float:left;
	width:70px;
	line-height:155%;
	border-bottom:solid 1px #999999;
	text-indent:2px;
}
div#about dd{
	width:330px;
	line-height:155%;
	border-bottom:solid 1px #999999;
}
div#about ul{
	margin:5px 10px;
}


/************** skill **************/

div#skill dl{
	margin-top:10px;
	margin-bottom:10px;
}
div#skill dt{
	float:left;
	width:90px;
	line-height:155%;
	border-bottom:solid 1px #999999;
	text-indent:2px;
}
div#skill dd{
	width:300px;
	line-height:155%;
	border-bottom:solid 1px #999999;
}
ul#framework{
	margin:10px 20px;
}
ul#framework li{
	list-style:disc;
}
	
	
/************** work **************/
div#work div.main-left{
	width:240px;
}
div#work div.main-right{
	width:590px;
}
div#work ul{
	margin-top:20px;
}
div#works{
	overflow:auto;
	width:590px;
	height:340px;
	padding:10px 0 10px 10px;
	background:url(../images/black_back.png) repeat;
}	
div.work{
	clear:both;
	overflow:hidden;
	margin-bottom:20px;
}
div.work img{
	float:left;
	margin-right:10px;
}	
div.p{
	color:#000000;
	margin-left:20px;
}
	

/************** price **************/
p.price-red{
	float:right;
	color:#FF0000;
	text-align:left;
	width:300px;
	font-size:123.1%;
	font-weight:bold;
}
div#price div.main-left ul{
	margin:5px 0 15px 25px;
	font-size:93%;
}
div#price div.main-left ul li{
	list-style:disc;
	font-size:93%;
}
div#price div.main-right dl{
	margin:5px 0 15px 10px;
}
div#price div.main-right dt{
	float:left;
	width:130px;
	line-height:155%;
	border-bottom:solid 1px #999999;
	text-indent:2px;
	font-size:93%;
}
div#price div.main-right dd{
	line-height:155%;
	border-bottom:solid 1px #999999;
	font-size:93%;
}


div#lab div.main-left{
	width:860px;
}