@charset "utf-8";

/*///////////////////////////////////////////////////////////////////////////////////////DEFAULT*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, re,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent;
}
article, aside, dialog, figure, footer, header,hgroup, nav, section { display: block; }
body { text-align:center; font-size:62.5%; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ" , Meiryo, "ＭＳ Ｐゴシック", sans-serif;}
body, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, ul, li, form, table, caption, tbody, tfoot, thead, tr, th, td { margin:0; padding:0;}
h1, h2, h3, h4, h5, h6, table, caption, tbody, tfoot, thead, tr, th, td, input, textarea { font-size:62.5%;}
img { border:none;}
ul { list-style:none;}
.hidden-txt { position:absolute; top:-9999px; left:-9999px; font-size:1px; line-height:0.5em;}
.clearfix:after {
content: ".";
display:block;
clear:both;
height:0;
visibility:hidden;
}
.clearfix { min-height: 1px;}
* html .clearfix {
height: 1px;
/*¥*//*/
height: auto;
overflow: hidden;
/**/
}

/*/////////////////////////////////////////////////////////////////////////
コンテンツ用CSS
/////////////////////////////////////////////////////////////////////////*/
body#top {
height:100%;
}
.bgmaximage {
position:fixed !important;
display:none;
}
#maincontent {
width:100%;
height: 100%;
overflow: auto;
}
.loader {
position:absolute;
z-index:9999;
width:39px;
height:39px;
top:49%;
left:49%
}

footer#top-foot {
background:#000;
width:100%;
height:30px;
position:fixed !important;
position:absolute;
left:0;
bottom:0;
}
div#copyright {
background:url(../img/foot_bg.gif) no-repeat left top;
width:280px;
height:30px;
margin:0 auto;
text-align:left;
}
p#mail-btn {
padding-top:10px;
}
p#mail-btn a {
display:block;
background:url(../img/mail_btn.gif) no-repeat left top;
width:11px;
height:10px;
}
p#mail-btn a:hover {
filter: alpha(opacity=50);-moz-opacity:0.50;opacity:0.50;
}

/*-----------------------------------------------------------------portfolio*/

#portfolio {
background:#e6e6e0 url(../portfolio/img/bg.gif) repeat left top;
overflow:auto;
}
#portfolio a {
color:#000;
text-decoration:none;
}
#portfolio a:hover {
color:#999;
}
div#wrapper {
width:960px;
margin:0 auto;
text-align:left;
position:relative;
}

h1#portfolio-t {
background:url(../portfolio/img/portfolio_t.gif) no-repeat left top;
width:510px;
height:28px;
text-indent:-9999px;
margin:60px 0 40px;
}

ul#menu {
position:absolute;
left:780px;
top:10px;
}
ul#menu li {
float:left;
}
ul#menu li#menu1 a {
width:38px;
}
ul#menu li#menu2 a {
width:43px;
margin-left:20px;
}
ul#menu li#menu3 a {
width:55px;
margin-left:20px;
}

div#work {
margin-bottom:50px;
}

ul#portfolio-list {
margin-right:-24px;
zoom:1;
}
* html ul#portfolio-list { /* for IE6 */
margin-right:-48px;
}
ul#portfolio-list li {
background:#fff;
float:left;
width:274px;
margin:0 24px 24px 0;
padding:15px;
border-radius:4px;
-webkit-border-radius:4px; 
-moz-border-radius:4px;
}
ul#portfolio-list h1 {
font-size:120%;
font-weight:normal;
}
ul#portfolio-list p {
color:#666;
font-family:Meiryo, "ＭＳ Ｐゴシック", Garamond;
line-height:160%;
letter-spacing:0.1em;
}
.font-s {
font-size:85%;
}
p.more-btn {
margin-top:5px;
}
p.more-btn a {
background:url(../portfolio/img/more_btn.gif) no-repeat left top;
display:block;
width:274px;
height:24px;
}
p.more-btn a:hover {
background-position:0 -30px;
}

div#about {
margin-bottom:80px;
padding:30px 10px 35px;
border-top:1px #666 solid;
border-bottom:1px #666 solid;
}
div#about h1 {
background:url(../portfolio/img/about_t.gif) no-repeat left top;
width:192px;
height:21px;
margin-bottom:10px;
text-indent:-9999px;
font-size:1px;
}
p#about-txt {
float:left;
}
p#about-txt a {
text-decoration:underline;
}
div#about p {
font-size:120%;
line-height:180%;
}
div#skill-box {
float:right;
background:#dadad5;
padding:12px 30px;
border-radius:4px;
-webkit-border-radius:4px; 
-moz-border-radius:4px;
}

div#about h2 {
font-size:120%;
}

footer#portfolio-foot {
background:#000;
width:100%;
height:30px;
}

/*eof*/
