@charset "utf-8";  
  
/* 
reset.css ver 1.0 [2008/5/22] 
*This document validates as CSS level 3 
*http://higash.net/20080522/reset_css.html 
 
Modify YUI Reset CSS, YUI Fonts <span class="hilite">CSS</span> 
*Copyright (c) 2008, Yahoo! Inc. All rights reserved. 
*http://developer.yahoo.com/yui/license.html 
*/  
  
/* --HTML-- */  
html {  
background:#fff;  
color:#333;  
overflow-y:scroll;  
}  
  
/* --BODY-- */  
body {  
font:12px/1.5 'Lucida Grande',Arial,Helvetica,Verdana,sans-serif;  
margin:0;  
overflow:visible;  
padding:0;  
}  
  
/* for IE7 */  
*+html body {  
font-family:'メイリオ';  
font-size:75%;  
}  
  
/* for IE6 */  
* html body {  
font-size:75%;  
}  
  
/* --OTHER TAGS-- */  
a img, fieldset, img {  
border:0;  
}  
  
blockquote, dd, div, dl, dt, fieldset, form,  
h1, h2, h3, h4, h5, h6, input, li, ol, p, pre,  
select, span, textarea, td, th, ul {  
margin:0;  
padding:0;  
}  
  
abbr, acronym {  
border:0;  
}  
  
address, caption, cite, code, dfn, em, th, strong, var {  
font-style:normal;  
font-weight:normal;  
}  
  
caption, th {  
text-align:left;  
}  
  
code, kbd, pre, samp, tt {  
font-family:monospace;  
line-height:100%;  
}  
  
/* for IE7 */  
*+html code, kbd, pre, samp, tt {  
font-size:108%;  
}  
  
h1, h2, h3, h4, h5, h6 {  
font-size:100%;  
font-weight:normal;  
}  
  
input, select, textarea{  
font-size:100%;  
font-family:'Lucida Grande',Arial,Helvetica,Verdana,sans-serif;  
}  
  
ol, ul {  
list-style:none;  
}  
  
q:before, q:after {  
content:'';  
}  
  
/* tables still need 'cellspacing="0"' */  
table {  
border-collapse:collapse;  
border-spacing:0;  
font-size:100%;  
}






body {
    background-color:#fff;
    margin:0 auto;
}

a, a:link, a:active, a:visited {
 color:#999;
 text-decoration:none;
}

a:hover {
     color:#f09 !important;
}

h3 {
    color: #666;
    font-size: 12px;
    line-height: 17px;
    padding: 20px 20px;
}

h4 {
   color: #fff;
   font-size: 10px;
   font-family:Helvetica,Arial;
   line-height: 13px;
   text-align:right;
   font-family:Helvetica,Arial;
   letter-spacing:1px;
   padding: 5px 12px;
}

#container {
    width:960px;
    height:560px;
    margin:0 auto;
    background-image:url('images/interface/backgroundmain.jpg');
    background-repeat: no-repeat;
    margin: -280px 0 0 -480px; position:absolute;
    top: 50%;
    left: 50%;}

#menu {
    width: 125px;
    height: 250px;
    float: left;
    padding:90px 45px;
}

.bar {
    float:left;
    padding:5px;
    list-style:none;
}


/* --MENU-- */

a#news {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/news.jpg");
   background-repeat: no-repeat;
}

a#news:hover {
    background-position: top right;
    background-repeat: no-repeat;
}

a#news2 {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/news2.jpg");
   background-repeat: no-repeat;
}

a#news2:hover {
    background-position: top right;
    background-repeat: no-repeat;
}

a#works {
    display: block;
    width: 120px;
    height: 30px;
    text-indent: -2000px;
    background-image: url("images/bar/works.jpg");
    background-repeat: no-repeat;
}

a#works:hover {
    background-position: top right;
    background-repeat: no-repeat;
}

a#works2 {
    display: block;
    width: 120px;
    height: 30px;
    text-indent: -2000px;
    background-image: url("images/bar/works2.jpg");
    background-repeat: no-repeat;
}

a#works2:hover {
    background-position: top right;
    background-repeat: no-repeat;
}

a#p-works {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/p-works.jpg");
   background-repeat: no-repeat;
}

a#p-works:hover {
   background-position: top right;
   background-repeat: no-repeat;
   }
   
a#p-works2 {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/p-works2.jpg");
   background-repeat: no-repeat;
}

a#p-works2:hover {
   background-position: top right;
   background-repeat: no-repeat;
   }

a#blog {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/blog.jpg");
   background-repeat: no-repeat;
}

a#blog:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#about {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/about.jpg");
   background-repeat: no-repeat;
}

a#about:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#about2 {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/about2.jpg");
   background-repeat: no-repeat;
}

a#about2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#cont {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/cont.jpg");
   background-repeat: no-repeat;
}
a#cont:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#site-m {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/site-m.jpg");
   background-repeat: no-repeat;
}
a#site-m:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#site-m2 {
   display: block;
   width: 120px;
   height: 30px;
   text-indent: -2000px;
   background-image: url("images/bar/site-m2.jpg");
   background-repeat: no-repeat;
}
a#site-m2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#logo {
   display: block;
   width: 120px;
   height: 70px;
   margin: 25px 0 0 0;
   text-indent: -2000px;
   background-image: url("images/bar/logo.jpg");
   background-repeat: no-repeat;
}


/* --CONTENT-- */

#content {
   width:710px;
   height:400px;
   float:left;
   padding:55px 0 0 0;
}

#content1 {
   width:500px;
   height:440px;
   float:left;
   margin: 0px;
   background-image: url('images/content/news.jpg');
   background-repeat: no-repeat;
}

#content2 {
   width:450px;
   height:300px;
   float:left;
   margin: 0px;
   background-image: url('images/content/mid_logo.jpg');
   background-repeat: no-repeat;
}

#box {
   width:190px;
   height:270px;
   float:left;
   padding:25px 0 0 20px;
}

.box {
    float:left;
    padding:6px 5px;
    list-style:none;
}


/* --INDEX PHOTO-- */

a#lounge {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/lounge.jpg");
   background-repeat: no-repeat;
}
a#lounge:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#banana {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/banana.jpg");
   background-repeat: no-repeat;
}
a#banana:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#closet {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/closet.jpg");
   background-repeat: no-repeat;
}
a#closet:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#nikon {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/28ti.jpg");
   background-repeat: no-repeat;
}
a#nikon:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#lighting {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/lighting.jpg");
   background-repeat: no-repeat;
}
a#lighting:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#wine {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/wine.jpg");
   background-repeat: no-repeat;
}
a#wine:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#sakata {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/sakata.jpg");
   background-repeat: no-repeat;
}
a#sakata:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#webbed {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/webbed.jpg");
   background-repeat: no-repeat;
}
a#webbed:hover {
   background-position: top right;
   background-repeat: no-repeat;
}


/* --NEWS PHOTO-- */

a#tunnel {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/tunnel.jpg");
   background-repeat: no-repeat;
}
a#tunnel:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#shortcake {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/shortcake.jpg");
   background-repeat: no-repeat;
}
a#shortcake:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#elephant {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/elephant.jpg");
   background-repeat: no-repeat;
}
a#elephant:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#chair {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/chair.jpg");
   background-repeat: no-repeat;
}
a#chair:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#doughnut {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/doughnut.jpg");
   background-repeat: no-repeat;
}
a#doughnut:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#morning {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/morning.jpg");
   background-repeat: no-repeat;
}
a#morning:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#modernistic {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/modernistic.jpg");
   background-repeat: no-repeat;
}
a#modernistic:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#dove {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/photo/dove.jpg");
   background-repeat: no-repeat;
}
a#dove:hover {
   background-position: top right;
   background-repeat: no-repeat;
}



/* --BOX-- */

a#design {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/design.jpg");
   background-repeat: no-repeat;
}
a#design:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#design2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/design2.jpg");
   background-repeat: no-repeat;
}
a#design2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#photo {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/photo.jpg");
   background-repeat: no-repeat;
}
a#photo:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#photo2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/photo2.jpg");
   background-repeat: no-repeat;
}
a#photo2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#web {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/web.jpg");
   background-repeat: no-repeat;
}
a#web:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#web2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/web2.jpg");
   background-repeat: no-repeat;
}
a#web2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#project {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/project.jpg");
   background-repeat: no-repeat;
}

a#project:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#project2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/project2.jpg");
   background-repeat: no-repeat;
}

a#project2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#ware {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/ware.jpg");
   background-repeat: no-repeat;
}

a#ware:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#ware2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/ware2.jpg");
   background-repeat: no-repeat;
}

a#ware2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#etc {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/etc.jpg");
   background-repeat: no-repeat;
}

a#etc:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#etc2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/etc2.jpg");
   background-repeat: no-repeat;
}

a#etc2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#movie {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/movie.jpg");
   background-repeat: no-repeat;
}

a#movie:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#movie2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/movie2.jpg");
   background-repeat: no-repeat;
}

a#movie2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#zoo {
   display: block;
   width: 180px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/zoo-colle.jpg");
   background-repeat: no-repeat;
}
a#zoo:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#zoo2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/zoo-colle2.jpg");
   background-repeat: no-repeat;
}
a#zoo2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#tstn {
   display: block;
   width: 180px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/tstn-colle.jpg");
   background-repeat: no-repeat;
}
a#tstn:hover {
   background-position: top right;
   background-repeat: no-repeat;
}

a#tstn2 {
   display: block;
   width: 85px;
   height: 85px;
   text-indent: -2000px;
   background-image: url("images/box/tstn-colle2.jpg");
   background-repeat: no-repeat;
}
a#tstn2:hover {
   background-position: top right;
   background-repeat: no-repeat;
}


/* --THUMBNAIL-- */

#container .thumbnails {
   float:left;
   width:720px;
   height:190px;
   margin:0 0 0 5px;
}
   
.large_thumb {
   float:left;
   width:64px;
   height:64px;
   padding:0px;
   list-style:none;
}
   
img.large_thumb_image {
   position:absolute;
}
   
.large_thumb_smork {
   width:54px;
   height:54px;
   background:url('images/interface/shine.png');
   position:absolute;
   background-position:-22px ;
   background-repeat:no-repeat;
   list-style:none;
}
   
#largephoto {
   width:500px;
   height:330px;
   float:left;
   margin: 0px;
}
   
.large_image {
   display:none;
   list-style:none;
}

#largecaption {
   text-align:center;
   height:50px;
   width:100%;
   background-color:#333;
   position:absolute;
   width:500px;
   margin-top:280px;
   color:#fff;
   font-size:15px;
   font-family:Helvetica,Arial;
   line-height: 50px;
   letter-spacing:1px;
   font-weight:bold;
   display:none;
}
