@charset "utf-8";

/* CSS Document FOR Opera */

/* index==========================

	4.for contents
	5.for footer
	


*/

/* 1.for common style 
===============================================================*/
body {
	background: #fff;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	color: #7d7d7d;
	text-align: center;
	line-height: 1.4;
	margin: 0; padding: 0;
	}

a:link, a:visited {
    text-decoration: underline;
    color: #7d7d7d;
    }
a:hover, a:active {
    text-decoration: underline;
    color: #3802ff;
    }

select, textarea,input{
    font-size: 12px;
    margin-right: 2px;
    }

* html select,textarea,input {
    vertical-align: middle;
    }
    
.alt { display: none; }
.left { float: left; }
.right { float: right; }
.strong { font-weight: bold; }
.normal { font-weight: normal; }

.gray { color: #ccc; }
.orange { color: #eb5c02; }
.red { color: #d03030; }

.txt15 { font-size: 15px; }
.txt10 { font-size: 10px; }

.border1 { border: 1px #7d7d7d solid; }

div#wrapper {
    width: 100%;
    /* height: 670px; */
    margin: 0;
    background: url(../../images/bg2.gif) no-repeat center bottom #fff;
    /* background: url(../../images/bg2.gif) no-repeat center 150px #fff; */
    }

hr {
   border-width: 1px 0px 0px 0px; /* 太さ */
   border-style: solid; /* 線種 */
   border-color: #CCC; /* 線色 */
   height: 1px; /* 高さ */
}

/* 2.for clearFix
===============================================================*/
.cf:after{ 
   display:block;
   height:0;
   visibility:hidden;
   clear:both;
   content:".";
}
/* ǉ MacIE 5  WinIE 7  */
.cf{
   display:inline-block;
}
/*MacIE \*/
* html .cf{
	height:1em;
}
.cf{
	display:block;
}
/*  */


/* 3.for header 
===============================================================*/
div#headerArea {
    width: 100%;
    position: relative;
    height: 100px;
    text-align: left;
    }

div#header {
   width: 715px;
   height: 45px;
   margin: 0 auto;
   position: relative;
   top: 15px;
   background: url(../../images/hd_moon.gif) no-repeat right top;
   }
   
ul#hdNavi {
   margin: 0; padding: 0;
   padding-top: 25px;
   list-style-position:outside;
   list-style-type: none;
   }
   
ul#hdNavi li {
   margin: 0; padding: 0;
   float: left;
   height: 17px;
   margin-right: 20px;
   }
ul#hdNavi li a {
	display: block;
	line-height: 0;
	font-size: 0.1em;
	text-indent: -9999px;
	outline-style: none;
	height: 17px;
	}
	
ul#hdNavi li.about a {
    width: 32px;
    background: url(../../images/hdNavi_about.gif) no-repeat left top;
    }
ul#hdNavi li.topics a {
    width: 37px;
    background: url(../../images/hdNavi_topics.gif) no-repeat left top;
    }
ul#hdNavi li.blog a {
    width: 27px;
    background: url(../../images/hdNavi_blog.gif) no-repeat left top;
    }
ul#hdNavi li.gallery a {
    width: 40px;
    background: url(../../images/hdNavi_gallery.gif) no-repeat left top;
    }
ul#hdNavi li.contact a {
    width: 42px;
    background: url(../../images/hdNavi_contact.gif) no-repeat left top;
    }
ul#hdNavi li a:hover {
    background-position: 0 -27px;
    }

/* 4.for contents
===============================================================*/
div#contentArea {
    width: 100%;
    position: relative;
    }

div#content {
   position: relative;
   width: 715px;
   margin: 0 auto;
   font-size: 12px;
   text-align: left;
   }

/* 5.for gallery
===============================================================*/
div#gallery {
    }

div#gallery ul{
    width: 715px;
    margin: 0; padding: 0;
    margin-bottom: 20px;
    margin-top: 10px;
    list-style-type: none;
    }
    
div#gallery li{
    float: left;
    margin: 0; padding: 0;
    margin-right: 15px;
    margin-bottom: 15px;
    }
div#galleryArea{
    width: 715px;
    margin-bottom: 20px;
    margin-top: 10px;
    }
    
div#galleryArea p{
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
    width: 40px; height: 40px;
    }

/* 4.for contents
===============================================================*/
div#contentArea {
    width: 100%;
    position: relative;
    }
    
/* 5.for footer
===============================================================*/
div#footerArea {
   position: relative;
   height: 180px;
   background: url(../../images/bg3.gif) repeat-x center bottom;
   }
div#footer1, div#footer2{
   width: 715px;
   margin: 0 auto;
   text-align: right;
   }

