@charset "utf-8";


/* 全体 ------------------------------  */



body{ background:#FFFFFF;
      font-size:80%;
      color:#666666;
	  line-height:150%;
	  margin:0px;}


/* 本体 ------------------------------  */


#main{ width:800px;
       margin:0 auto;
	   padding:0px}

.clearB{clear:both;}

.clearL{clear:left;}

.clearR{clear:right;}


.floatL{float:left;}

/* ヘッダー ------------------------------  */


#header{ width:800px;
         height:60px;}


.logo{ margin:0px;
       padding:15px 0px 0px 0px;}

/* ナビゲーション ------------------------------  */


#naviBox{width:800px; height:50px; padding-bottom:40px}

ul#navi{list-style:none;
        width:800px;
        margin:0px;
        padding:0px;}


ul#navi li{list-style:none;
           float:left;}


ul#navi a{display:block;
          height:50px;
          text-indent:-100px;
          overflow:hidden;}
		  

a.aboutus{background-image:url(../images/common/aboutus.jpg);
          width:130px;}


a:hover.aboutus{background-position:0px -50px;
                width:130px;}


a.service{background-image:url(../images/common/service.jpg);
          width:110px;}


a:hover.service{background-position:0px -50px;
                width:110px;}


a.works{background-image:url(../images/common/works.jpg);
        width:102px;}


a:hover.works{background-position:0px -50px;
              width:102px;}


a.staff{background-image:url(../images/common/staff.jpg);
        width:90px;}


a:hover.staff{background-position:0px -50px;
              width:90px;}


a.recruit{background-image:url(../images/common/recruit.jpg);
          width:108px;}


a:hover.recruit{background-position:0px -50px;
                width:108px;}


a.contact{background-image:url(../images/common/contact.jpg);
          width:111px;}


a:hover.contact{background-position:0px -50px;
                width:111px;}


a.griotgroove{background-image:url(../images/common/griotgroove.jpg);
              width:149px;}


a:hover.griotgroove{background-position:0px -50px;
                    width:149px;}



/* コンテンツ ------------------------------  */


p{padding:0px 0px 30px 0px;
  margin:0px;}


.box{padding-bottom:40px;}  

#top{ text-align:right;
      padding:30px 0px 50px;}

  
/* サイドメニュー ------------------------------  */


#side{ float:left;
       width:185px;}

ul#menu{ list-style:none;
         margin:0px;
         padding:0px;}


li.state{ list-style:none;
           background:#EFF8FF;
		   padding:7px 10px;
		   width:165px;
		   height:0 auto;
		   margin-bottom:1px;
		   border-bottom:#9DDFFF 1px solid;}

a.mLink{ padding:7px 10px;
		 width:165px;
		 height:0 auto;
		 display:block;
		 list-style:none;
         text-decoration:none;
         background:#F2F2F2;
		 margin-bottom:1px;
		 border-bottom:#CCCCCC 1px solid;}

a:hover.mLink{background:#F9F9F9;}


.navibg{ background:url(../images/common/navi_under.gif);
         width:185px;
		 height:16px;
		 vertical-align:top;
		 padding:0px;
		 margin:0px}
		 
		 

/* 本文 ------------------------------  */


#content{ float:right;
          width:550px;}



/* フッター ------------------------------ */


#footer{ width:800px;
         height:20px;
		 padding:3px 0px;
		 background:#EBEBEB;
		 text-align:center;}
		 
		 
		 
/* cleafix ------------------------------ */

.clearfix:after {
   content: ".";
   display: block;
   clear: both;
   height: 0;
   visibility: hidden;
}
.clearfix { display: inline-block; }
/* exlude MacIE5 \*/
* html .clearfix { height: 1% }
.clearfix {display:block;}
/* end MacIE5 */