@charset "utf-8";

html {
background: #242424 url(img/page-back.png) repeat-y center;
}

body {
background:url(img/page-back-bottom.png) repeat-x left bottom;
font-size: 75%;
width: 900px;
margin: 0 auto;
padding: 0;
color: #CCC;
}

a {
color: #CCC;
}

#header {
background: #181818 url(img/main-img.jpg) no-repeat center bottom;
height: 308px;
padding: 0 0 0 0;
}

#header h1 {
width: 262px;
margin: 0 auto 0 auto;
padding: 150px 0 0 0;
}
#header h1 a {
display:block;
height: 90px;
margin: 0 auto;
padding:0;
text-indent: -9999px;
overflow: hidden;
}

#header ul {
margin: -225px 30px 0 0;
padding:0;
}
#header ul li {
margin: 0;
padding:0;
float:right;
border-left: 1px solid #666;
list-style:none;
}
#header ul li a {
display:block;
width: 80px;
height: 25px;
background:no-repeat center bottom;
text-indent: -9999px;
overflow: hidden;
}
#header ul li a#h-contact {
background-image: url(img/navi-contact.gif);
}
#header ul li a#h-sitemap {
background-image: url(img/navi-sitemap.gif);
}
#header p {
clear:both;
text-align:right;
margin: 50px 45px 0 0;
color:#FFFFFF;
font-size: 80%;
}
#header p a {
color:#FFFFFF;
text-decoration: none;
}


#contents {
width: 562px;
margin: 0 0 60px 75px;
float:left;
}
* html #contents {
display:inline;
}


#contents h2 {
background: url(img/midashi.png) no-repeat;
height: 36px;
margin:0;
text-indent: -9999px;
}
* html #contents h2 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/midashi.png');
background: none;
}

#contents p {
line-height: 200%;
overflow:visible;
padding: 0 10px;
}
#contents p img {
float:left;
margin: 0 10px 10px 0;
}

#contents hr {
clear:both;
border: 1px solid #242424;
border-top: 1px solid #999;
margin: 25px 10px;
}

#contents h3 {
background: url(img/midashi-dl.gif) no-repeat;
height: 19px;
margin:0 0 0 10px;
text-indent: -9999px;
}
#contents #dl-list {

}
#contents #dl-list li {
margin: 0 0 0.5em 0;
}

#menu {
width:158px;
float:left;
margin: 0 0 0 35px;
padding: 0;
}
#menu li {
list-style:none;
margin:0;
padding:0;
}
#menu li a {
display: block;
text-indent: -9999px;
overflow: hidden;
height:37px;
background: no-repeat;
}
#menu li a#m1 {
background: url(img/m1.png);
}
* html #menu li a#m1 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/m1.png');
background: none;
}
#menu li a#m2 {
background: url(img/m2.png);
}
* html #menu li a#m2 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/m2.png');
background: none;
}
#menu li a#m3 {
background: url(img/m3.png);
}
* html #menu li a#m3 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/m3.png');
background: none;
}
#menu li a#m4 {
background: url(img/m4.png);
}
* html #menu li a#m4 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/m4.png');
background: none;
}
#menu li a#m5 {
background: url(img/m5.png);
}
* html #menu li a#m5 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/m5.png');
background: none;
}
#menu li a#m6 {
background: url(img/m6.png);
}
* html #menu li a#m6 {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/m6.png');
background: none;
}


p#copyright {
clear:both;
margin: 0;
padding: 0;
background: url(img/footer.jpg) no-repeat;
height: 113px;
text-indent: -9999px;
}


/*リンクのユニークな見せ方:サンプル*/
/*-----------------------------------------------*/
/*親要素から指定した書き方をすることによって、
アイコンが表示される範囲を限定しています。*/
/*-----------------------------------------------*/
#contents a {
padding:1px 15px 1px 0;
margin: 0 3px 0 0;
background:no-repeat right center;
}

#contents a[href$=".zip"] {
background-image:url(img/i-zip.gif);
}
* html #contents a.zip {
background-image:url(img/i-zip.gif);
}

#contents a[href$=".xls"] {
background-image:url(img/i-xls.gif);
}
* html #contents a.xls {
background-image:url(img/i-xls.gif);
}

#contents a[href$=".doc"] {
background-image:url(img/i-doc.gif);
}
* html #contents a.doc {
background-image:url(img/i-doc.gif);
}

#contents a[href$=".pdf"] {
background-image:url(img/i-pdf.gif);
}
* html #contents a.pdf {
background-image:url(img/i-pdf.gif);
}

#contents a[href^="http"] {
background-image:url(img/i-outsite.gif);
}
* html #contents a.outsite {
background-image:url(img/i-outsite.gif);
}

#contents a[href^="mailto"] {
background-image:url(img/i-mail.gif);
}
* html #contents a.mailto {
background-image:url(img/i-mail.gif);
}

#contents a[href^="http://www.rasen-d.net"] {
/*実際に使用する場合は「http://www.rasen-d.net」の記述を
使用サイトのURLにあわせてください*/
background-image: none;
padding: 0;
margin: 0;
}
* html #contents a.mysite {
background-image: none;
padding: 0;
margin: 0;
}

* html #contents a{
behavior: expression(
this.className += this.getAttribute("href").match(/^http.*/) && (!this.getAttribute("href").match("rasen-d.net")) ? " outsite" : "",
this.className += (this.getAttribute("href").match("^http://www.rasen-d.net")) ? " mysite" : "",
this.className += this.getAttribute("href").match(/\.zip$/) ? " zip" : '',
this.className += this.getAttribute("href").match(/\.xls$/) ? " xls" : '',
this.className += this.getAttribute("href").match(/\.doc$/) ? " doc" : '',
this.className += this.getAttribute("href").match(/\.pdf$/) ? " pdf" : '',
this.className += this.getAttribute("href").match(/^mailto:*/) ? " mailto" : "",
this.style.behavior = "none");
}
