﻿@charset "utf-8";
  a:link { color: #d0c888; }
  a:visited { color: #c8c8c8; }
  a:hover { color: #454545; }

*{
  padding-top : 0px;
  padding-left : 0px;
  padding-right : 0px;
  padding-bottom : 0px;
  margin-top : 0px;
  margin-left : 0px;
  margin-right : 0px;
  margin-bottom : 0px;
  background-color : black;
  border-bottom-width : 0px;
  border-bottom-style : none;
}

BODY{
  font-size : small;
}

P {
  text-indent : 1em;
}

a:hover img.overwhite{
    cursor:pointer;
    filter: alpha(opacity=60);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=60)";  /* ie 8 */
    -moz-opacity:0.6;                 /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.6;              /* Safari 1.x */
    opacity:0.6;
    zoom:1;
}

#main{
  padding-top : 0px;
  padding-left : 0px;
  padding-right : 0px;
  padding-bottom : 0px;
  margin-top : auto;
  margin-left : auto;
  margin-right : auto;
  margin-bottom : auto;
  width : 900px;
  height : inherit;
  font-family :"リュウミン R-KL","ヒラギノ角ゴPro W3","Hiragino kaku gothic pro","メイリオ", "ＭＳ ゴシック",serif;
  font-size : small;
}

#header{
  width : 690px;
  height : 47px;
  background-color : black;
  background-image : url(cool_works_logo_s.jpg);
  background-repeat : no-repeat;
  background-position : 10px 5px;
  padding-left : 210px;
  padding-top : 20px;
  color : #bbbea0;
}

.logo-link {
  display: block;
  float: left;
  width: 200px;
  height: 57px;        /* 画像の本来の高さ57pxに合わせる */
  margin-left: -210px; /* 左端へ引き戻す */
  margin-top: -10px;   /* 重要：headerのpadding-top(20px)分、上に押し上げる */
  text-decoration: none;
  background-color: transparent;
  transition: background-color 0.3s;
}

.logo-link:hover {
  /* 白を少しだけ被せることで、ロゴが明るく光ったように見せます */
  background-color: rgba(255, 255, 255, 0.2); 
  cursor: pointer;
}

#header H1{
  color : #bbbea0;
  padding-top : 20px;
  padding-left : 210px;
}

#header ul{
  list-style-type : none;
}

#header UL LI{
  vertical-align : top;
  text-align : center;
  color : #bbbea0;
  background-color : black;
  padding-top : 0px;
  padding-left : 0px;
  padding-right : 0px;
  padding-bottom : 0px;
  margin-top : 0px;
  margin-left : 0px;
  margin-right : 5px;
  margin-bottom : 5px;
  border-left-width : 1px;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : #454545;
  border-right-width : 0px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  width : 84px;
  float : right;
}

#header ul li a{
  color : #bbbea0;
  background-color : black;
  text-decoration : none;
  display : block;
}

#header ul li a:hover{
  color : #bbbea0;
  background-color : #454545;
}
#navi{
  padding-left : 40%;
  background-color : black;
  padding-right : 0%;
  float : left;
  color : #bbbea0;
}

#navi UL{
  list-style-type : none;
}

#navi UL LI{
  position : relative;
  vertical-align : middle;
  text-align : center;
  padding-top : 0px;
  padding-left : 0px;
  padding-right : 0px;
  padding-bottom : 0px;
  margin-top : 0px;
  margin-left : 0px;
  margin-right : 5px;
  margin-bottom : 0px;
  width : 84px;
  float : left;
  border-left-width : 1px;
  border-top-width : 1px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  border-bottom-color : #bbbea0;
  border-top-style : solid;
  border-top-color : #454545;
}

#navi UL LI A{
  background-color : black;
  text-decoration : none;
  display : block;
  color : #bbbea0;
  border-left-width : 0px;
}

#navi ul LI a:hover {
  color : #bbbea0;
  background-color : #454545;
}

#navi ul li ul{
  list-style-type : none;
  position : absolute;z-index:10;
  top : 100%;
  padding : 0;
}

#navi ul li ul li{
  overflow : hidden;
  width : 150%;
  height : 0;
  border-left-width : 0px;
  border-top-width : 0px;
}



#navi ul li:hover ul li{
  height : 100%;
  color : #bbbea0;
  margin-left : -1px;
  background-color : #454545;
  border-left: 1px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  border-top: 1px;
  border-top-style : solid;
  border-top-color : #454545;
}

#top{
  padding-left : 30px;
  width : 870px;
  height : 270px;
  clear : both;
  font-size : large;
  padding-top : 30px;
  font-style : italic;
  line-height : 2rem;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : #454545
}


#menu{
  width : 30%;
  float : left;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : #454545;
  text-align : center;
  visibility : inherit;
  color : #bbbea0;
  background-color : black;
  padding-bottom : 30px;
  padding-right : 3px;
}

#menu_h5{
  font-size : large;
  color : #bbbea0;
  background-color : black;
  border-left-width : 3px;
  border-bottom-width : 1px;
  border-left-style : solid;
  border-bottom-style : solid;
  border-left-color : #bbbea0;
  border-bottom-color : #bbbea0;
  text-align : center;
  background-position : left center;
  margin-top : 30px;
  margin-left : 15%;
  margin-right : 15%;
  margin-bottom : 30px;
}

#menu_h6{
  font-size : large;
  color : #bbbea0;
  background-color : black;
  border-left-width : 3px;
  border-bottom-width : 1px;
  border-left-style : solid;
  border-bottom-style : solid;
  border-left-color : #bbbea0;
  border-bottom-color : #bbbea0;
  text-align : center;
  background-position : left center;
  margin-top : 70px;
  margin-left : 15%;
  margin-right : 15%;
  margin-bottom : 10px;
}
#menu ul{
  list-style-type : none;
}

#menu UL LI{
  position : relative;
  vertical-align : middle;
  text-align : center;
  padding-top : 0px;
  padding-left : 0px;
  padding-right : 0px;
  padding-bottom : 0px;
  margin-top :  0px;
  margin-left : 10px;
  margin-right : 5px;
  margin-bottom : 0px;
  width : 34px;
  float : left;
  border-left-width : 1px;
  border-top-width : 1px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  border-bottom-color : #bbbea0;
  border-top-style : solid;
  border-top-color : #454545;
}

#menu UL LI A{
  background-color : black;
  text-decoration : none;
  display : block;
  color : #bbbea0;
  border-left-width : 0px;
}

#menu ul LI a:hover {
  color : #bbbea0;
  background-color : #454545;
}

#menu ul li ul{
  list-style-type : none;
  position : absolute;z-index:10;
  top : 100%;
  padding : 0;
}

#menu ul li ul li{
  overflow : hidden;
  width : 150%;
  height : 0;
  border-left-width : 0px;
  border-top-width : 0px;
}



#menu ul li:hover ul li{
  height : 100%;
  color : #bbbea0;
  margin-left : -1px;
  background-color : #454545;
  border-left: 1px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  border-top: 1px;
  border-top-style : solid;
  border-top-color : #454545;
}

#menu img{
  img-align : center;
  margin-top : 20px;
  margin-bottom : 20px;
}

.menu_h2{
  margin-top :  30px;
  color : #bbbea0;
  background-color : black;
  text-align : center;
}




#cont{
  background-color : black;
  text-align : left;
  padding-top : 20px;
  padding-left : 30px;
  padding-right : 30px;
  width : 60%;
  color : #bbbea0;
  float : right;
  display : block;
  line-height : 180%;
}


.cont_h3{
  font-size : medium;
  color : #bbbea0;
  background-color : black;
  padding-left : 20px;
  border-left-width : 3px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : #bbbea0;
  margin-top : 10px;
}

.cont_h4{
  font-family:"Ryumin Medium KL","ヒラギノ角ゴPro W3","Hiragino kaku gothic pro","メイリオ", "ＭＳ ゴシック",serif;
  padding-left : 50px;
  overflow : hidden;
  margin-bottom : 20px;
}

#footer{
  padding-top : 10px;
  border-top-style : groove;
  border-top-color : #bbbea0;
  background-color : black;
  border-top-width : 1px;
  clear : both;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : #bbbea0;
  color : #bbbea0;
  padding-left : 10px;
  float : left;
  text-indent : 0em;
  font-size : 75%;
  width : 100%;
}

#footer UL{
  list-style-type : none;
  padding-left : 50%;
}

#footer UL LI{
  text-align : center;
  padding-top : 0px;
  padding-left : 10px;
  padding-right : 0px;
  padding-bottom : 0px;
  margin-right : 5px;
  width : auto;
  float : left;
  color : #bbbea0;
  background-color : black;
  margin-top : 0px;
  margin-left : 0px;
  margin-bottom : 0px;
  border-left-width : 1px;
  border-left-style : solid;
  border-left-color : #bbbea0;
  height : inherit;
  vertical-align : middle;
}

#footer UL LI A{
  color : #bbbea0;
  background-color : black;
  text-decoration : none;
  display : block;
}

#footer UL LI A:hover{
  color : #bbbea0;
  background-color : #454545;
}





