﻿body {
    background-color:black;
    color: #3A2C27;
    font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
    margin: 0;
}
 
#container {
   background-color:#CCFFCC;
   width: 700px; /* 幅(px指定) */
   height:auto;
   margin: auto;  /* 余白の大きさ 中央寄せ(センタリング)) */
   text-align: left;
}
 
header {
    background-image:url('head-1.jpg');
    background-repeat: no-repeat;
   width: 700px;
    height:220px;     
}

aside {
    background-color:;
    width: 40%;  /* 幅(％指定) */
    height: 35px;  /* 高さ */
   font-family: "Times New Roman", Times, serif;
    color:  bisque; 
    text-align: center;
    font-size:12px;
    padding: 0px;
margin-top:-30px;

}
/* -----------ナビゲーション-----------------*/
#nav_bar { background-color: orange ;
    width: 100%; /* 幅(％指定) */
    height: 28px;
margin-top:-98px;
}



main {
   background-color:#C1F2D3 ;
   width: 680px; /* 幅(％指定) */
   height:auto;
   margin-top: 40px;
   font-size: 13px;
padding: 10px;
}

#screen {
   background-color:palegreen  ;
   width: 700px; /* 幅(％指定) */
   height:500px;
   margin-top: 40px;
 
}

#mainimg {
width: 700px;
height:500px;

}

#text{
margin-left:0px;
margin-top:-140px;
font-size:13px;
color:white;
text-align: center;
text-transform: uppercase;
font-weight: 500;

}


#bgm{ 
width: 100%; /* 幅(％指定) */
height:40px;  /* 高さ */  
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	text-align: center;
background-color:gainsboro ;
margin-top: auto; 
padding-top: 15px;
 
}

.btn-a {
  background:  #2C7CFF;
  color: #fff;
  padding: 2px 6px;
  font-size: 12px;
  border-left: solid 3px #ff7c5c;/*左線*/

}

.btn-b {
  background: #2C7CFF;
  color: #fff;
  padding: 2px 4px;
  font-size: 12px;
  border-left: solid 3px #ff7c5c;/*左線*/
}



footer {
  background-color:gray;
     width:100%;
  
   height:40px;
}

address {
	font-family: "Times New Roman", Times, serif;
	font-size: 11px;
	font-style: italicl;
	text-align: center;
padding-top:15px ;
}
/* -------- nav-popup--------*/ 

/* --------1段目-----------*/ 
ul.menu {
list-style: none; /* 先頭記号を消す */
margin-top:-40px; 

}

ul.menu li {
  position: relative;  /*z-indexの指定や子要素の基準とするために指定*/
  z-index: 1;  /*ドロップダウンしたメニューが隠れないように*/
  float: left;  /*親メニューは横1列に並べる*/
  padding-right: 20px;  /*メニュー項目の間隔を指定*/
margin-top:0px; 
}

ul.menu li a{ 
  display: block;   /*要素の幅いっぱいにするために指定*/
  width: 80px;
 height: 18px; 
 border: 1px solid #eee;
  color: blue;
text-align: center;
  font-size: 11.5px; 
  text-decoration: none;
padding-top: 1px;
}

ul.menu li.home a:hover {
  background-color: #EEE;    /*マウスオーバー時に背景色を変える*/
color: red;
}

ul.menu li a:hover {
 
}

/* --------2段目-----------*/ 

ul.menu ul {
list-style: none; /* 2段目の先頭記号を消す */
padding-left: 0px; /* 2段目の左位置を1段目に揃える */
}

ul.menu ul {
  display: none;  /*サブメニューは最初は非表示にしておく*/
  position: absolute;  /*絶対配置にしておかないとうまくいかない*/
 top: 20px;  /*位置の指定*/
  left:0px;
}

ul.menu  ul li{
  float: none;  /*サブメニューはフロートさせないので解除*/
  padding: 0;  /*親メニューのパディングを解除。これをしないとボーダーがはみ出る*/

}
ul.menu  ul li:first-child{
  border-top: 1px solid #eee;  /*最初の要素のみボーダートップを指定*/

}
ul.menu  ul li a {
  border: 1px solid #eee;  /*ボーダーの指定*/
  border-top: none;  /*ボーダートップは重なって太くなるので解除*/
  padding: 5px;  /*ボーダーとの間にパディングを入れる*/
  background-color: #FFF;  /*背景色を白に指定*/
width: 70px;
height:20px;
  color: #666; font-size: 11px;
}
 

ul.menu li:hover ul {
  display: block;    /*マウスオーバー時にサブメニューを表示する*/
 
}


ul.menu  ul li a:hover  {
  background-color: #EEE;  /*マウスオーバー時に背景色を変える*/
  display: block;  color: red;

}

/* ----------------------*/
ul.menu ul li span{
	display: none; /* 通常は表示しない */
}

ul.menu  ul li:hover span{
    display: block; /* マウスが乗ったら表示する */
    width: 250px;
    height:auto;
    border: dotted 2px #666666;
    border-radius: 4px 4px 4px 4px; /*タブに丸みをつける */
    background: grey;

margin-top: -10px;
margin-left:85px ;

    text-align: left;
    font-family: Times New Roman,Times;
    color: white;
    font-size: 0.9em;
 clear: both; 	
}
/* ----------------------*/

ul.menu ul.menu_2 li span{
	display: none; /* 通常は表示しない */
}

ul.menu ul.menu_2 li:hover span{
    display: block; /* マウスが乗ったら表示する */
    width: 250px;
    height:auto;
    border: dotted 2px #666666;
    border-radius: 4px 4px 4px 4px; /*タブに丸みをつける */
    background: grey;

margin-top: -10px;
margin-left:-270px ;

    text-align: left;
    font-family: Times New Roman,Times;
    color: white;
    font-size: 0.9em;
	
}

/* -------- nav-popup--------*/ 
/* ------------------hタグ---------------------*/

h1.fade {
    padding-left: 20px;
    margin: 0px;
    font-style:italic;
    font-family: "Times New Roman", Times, serif;
    font-size: 26px;
    color:#dc143c;
}

h2.banner {
   font-style:italic;
   font-family: "Times New Roman", Times, serif;
   font-size: 20px;
   text-align:right;
   color:white;
margin-top:50px;

}

h3 {
　  width:500px;
    top: 200px;
	font-family: "ＭＳ Ｐ明朝", "細明朝体",serif;
	color: #0080C0;
	font-size: 130%;
	margin:1em 0px;
	padding-top:3px ;
	background-color:#E7FAEE;
	border-top:double 3px #01A252;
	border-bottom:double 3px #01A252;
	text-align: center;
	margin-right:35px ;
	margin-left: 35px;
}

#photog h3 {
　  margin-right:10px ;	
    width:540px;
    top: 200px;
	font-family: "Times New Roman", Times, serif,"ＭＳ Ｐ明朝",serif;
	font-size: 150%;
	margin:1em 0px;
	padding-top:2px ;
	border-top:double 3px #01A252;
	border-bottom:double 3px #01A252;
	text-align: center;
	margin-top:0px ;
	background-color:#003333 ;
	border-right:solid 1px #FFFFCC ;
	border-left:solid 1px #FFFFCC ;
margin-left:70px; 
margin-right:70px;

}

h4 {
　  width:500px;
    top: 0px;
	font-family: "ＭＳ Ｐ明朝", "細明朝体",serif;
	font-size: 15px;
color:blue ;
text-align: center;
}

