*{
  margin:0px;  padding:0px;
 }

BODY{
  margin:0px;
  padding:0px;
  color:#232323;
  font-size:12px;
  font-family:"MS PGothic","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
  text-align:center;
  background:url(gazou/kabeE01cb.gif);
}

A:link {
  text-decoration:none;
  color:#ffffff;
}
A:hover {
  text-decoration:underline;
  color:#FFFF00;
}




/* ＨＰ全体のボックスレイアウト設定 */
#index {
  width:700px;
  height:100%;
  margin:0px auto 10px auto;
  border-left:1px dotted #232323;
  border-right:0px dotted #232323;
  text-align:center;
  -webkit-box-shadow: 3px 3px 5px 0px #777; /* Safari, Chrome用 */
  -moz-box-shadow: 3px 3px 5px 0px #777; /* Firefox用 */
  box-shadow: 3px 3px 5px 0px #777; /* CSS3 */
  background:url(gazou/kabeE01cb.gif);
  behavior: url(shadow/PIE.html); /* IE6,7,8用 */

 }
/* ＩＥで下記の表示をした場合、文字までシャドウがでるのでカット
  filter:progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=145, Color='#2B3C45'); zoom:1;
 */

/* 画像と大きなメニューの表示ボックス設定と　画像の位置設定 */
#title{
  position:relative;
  height:285px;
  width:700px;
  margin:0px;
  border-under:1px dotted #232323;
  border-right:0px dotted #232323;
  background:url(TL/Title_gazou2.gif) no-repeat 0% 75px;
  text-align:left;
}

/* タイトルボックス「孫の会」の設定 */
#header{
  width:700px;
  height:75px;
  color:#ffffff;
  background:url(gazou/rogo.gif);
 } 

/* background:#282828; background:url(/syougi_mago/gazou/rogo11.gif);
 タイトルバックの色を取る場合 */

/* タイトルボックス内のフォント、位置、設定と
　影を付けているshadow:横px 下px ぼかし度合px 色の設定 効果無し */
#header H1{
  float:left;
  font-size:35px;
  font-weight:;
  font-family:"HG明朝B","Century Gothic", "ヒラギノ明朝 Pro W3", "ＭＳ Ｐ明朝", serif;
  text-shadow:2px 2px 1px #000000;
  line-height:1em;
  margin:20px 10px 0px 20px;
}

/* サブタイトル・未来に繋げよう　表示設定 */
#header h2{
  font-size:14px;
  font-weight:normal;
  line-height:1.5em;
  padding:5px 5px 0px 430px;
}

/* サブタイトル・問合せ、住所などの表示設定 */
#toiawase{
  font-style:normal;
  font-size:13px;
  padding:13px 0px 0px 490px;
}

/* 発足に、会則など右上のメニューのボックス、文字、リンク設定 */
#menu{
  width:250px;
  height:190px;
  font-weight:bold;
  font-size:15px;
  font-family:"Century Gothic",Geneva, Arial, Helvetica, sans-serif;
  margin:0px;
  padding:15px 0px 0px 0px;
  border-top:1px dotted #232323;
  float:right;
}
#menu LI{
  list-style:none;
  display:inline;
}
#menu A{
  display:block;
  color:#191919;
  text-align:center;
  text-decoration:none;
  background:url(gazou/kabeE01cb.gif);
  margin:auto;
  line-height:30px;
  -webkit-transition:0.3s ease-out;
}
#menu A:hover{
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  background:url(gazou/kabeE01cb.gif);
}

/* タイトル文字、メニュー画像下の全体のボックス　インラインホ゛ックスも　設定 */
#content{
  position:relative;
  width:700px;
  height:auto;
  margin:0px;
  display:inline-block;
  border-top:1px dotted #232323;
  border-right:0px dotted #232323;
  text-align:left;
  line-height:1.5em;
}

/* コンテンツの左サイドのメッセージ、おすすめサイト、リンク先の設定 */
#content .message,
#content .site{
  margin:0px 0px 0px 0px;
  padding:10px;
}

/* コンテンツの左サイドの　将棋連盟などリンク表示の設定 */
#content .site A:link {
  text-decoration:none;
  color:#ffffff;
}
#content .site A:hover{
  text-decoration:underline;
  color:#FFFF00;
}
/* コンテンツ左サイドのメニュー、おすすめ、リンク先のボックス設定 */
#box1{
  position:absolute;
  width:190px;
  min-height:100%;
  height:100% !important;
  height:100%;
  background:#3300cc;
  float:left;
  border-top:0px dotted #232323;
  border-left:15px solid #3300cc;
}
#box1 *{
  color:#ffffff;
}
#box1 .message
#box1 .site{
  padding:20px 0px 10px 10px;
}
#box1 .site LI{
  list-style:circle;
  margin:0em 0em 0em 1.5em;
}
#box1 H2{
  border-top:1px solid #3300cc;
  border-bottom:1px solid #3300cc;
  font-size:100%;
  line-height:2.5em;
  margin-left:-15px;
  padding:0px 0px 0px 15px;
}

#irasut {
  height:91px;
  width:180px;
  margin:650px 0 0 0;
  background:url(gazou/img-sm.jpg) no-repeat center bottom;
  text-align:center;
}




/* フリーヘ゜ーハ゜ー、書籍案内の左メニュー　幅2.5em→3.0emに　設定 */
#menu2{
  margin-left:-15px;
}
#menu2 H2{
  display:none;
}
#menu2 LI{
  list-style:none;
}
#menu2 A{
  display:block;
  color:#ffffff;
  text-decoration:none;
  line-height:3.0em;
  padding:0px 0px 0px 10px;
  background:#3300cc;
  border-left:15px double #ffffff;
  border-bottom:1px solid #3300cc;
  -webkit-transition:0.3s ease-in-out;
  behavior:url(#default#time2);
}
#menu2 A:hover{
  color:#282828;
  background:#ffffff;
  text-decoration:underline;
  border-left:15px double #3300cc;
  border-right:1px solid #3300cc;
}



#box2{
   padding:0px 15px 15px 220px;
}
#box2 .mess{
  padding:10px 0px 0px 0px;
  clear:both;
}
#box2 H2{
  font-size:11px;
  font-weight:normal;
  padding:5px 0px 0px 0px;
  letter-spacing:2px;
  border-bottom:1px dotted #232323;
}

#infobox dl{
  height:110px;
  overflow:auto;
  padding:0px 10px 0px 0px;
}

#syoseki dl{
  height:500px;
  overflow:auto;
  padding:0px 5px 0px 0px;
}

#content dt{
  width:60px;
  color:#ffffff;
  background:#ff6347;
  float:left;
  margin:1px 10px 0px 0px;
  padding:1px 7px 1px 7px;
  clear:both;
}
#content dd{
  padding:1px 5px 1px 10px;
}
#box2 .section FIGURE IMG{
  float:left;
  margin-right:10px;
}
#box2 .section FIGCAPTION{
  font-size:110%;
  line-height:3em;
  text-shadow:1px 1px 1px #999999;
}

/* 週間詰将棋問題掲示 */

#tl1 {
  width:450px;
  height:25px;
  background:#3300cc;
  margin:15px auto 0px 0px;
  padding: ;
  color:#ffffff;
}

/* 週間詰将棋の更新日の表示設定 */
#tl1 h1{
  font-style:normal;
  font-size:15px;
  color:#ffffff;
  padding:5px 0px 0px 15px;
}
#tl1 h2{
  font-style:normal;
  font-size:13px;
  color:#ffffff;
  padding:0px 0px 0px 250px;
}

#gallery {
  width: 450px;
  margin:5px auto 0px 15px;  /*全体をセンタリングしています。*/
  background-color: #ffffff;
}
#gallery img {
  width: ;
  height: ;
  margin: 0px;
  padding: 0px;
  border: 0;  /*サムネイル画像としたときリンク外枠の太さをゼロに。*/
}

#gallery A:link{
  text-decoration:none;
  color:#3300cc;
}


#gallery dl {
  float: left;
  width: 210px;
  margin-right: 1em;
  margin-bottom: 0.5em;
  padding: 0;
  font-size: 12px;　　/*文字サイズは崩れないようにするため固定にします。*/
  background-color: #ffffdd;
  border:1px solid #993333;
}
#gallery dt {
  margin: 0;
  padding: 3px 0 0 10px;
  font-size: 13px;   /*問題タイトル文字サイズ。*/
  font-weight: bold;
  text-align: left;
}
#gallery dd {
  margin: 0px;
  padding: 0px;
  text-align: left;
}
dd.comment {
  height: 1.2em;       /*ヒントの文字の調整。*/
  padding: 0 0 0 10px;
  font-size: 12px;
  line-height: 1.2;
}

dd.comment1 {   /*ご案内の問題解答欄の調整。*/
  padding: 2px;　
  font-size: 12px;
  line-height: 1.3;
}

dd.comment2 {
  height: 1.2em;       /*作者名のサイズで調整。*/
  margin: 0;
  padding: 0 0 0 10px;
  font-size: 12px;
  text-align:left;
  line-height: 1.3;
  background-color: #ffdddd;
}

<!-- 今回日付はカット　 dd.date {
  height: 1.2em;
  margin: 0;
  padding: 0 0.5em;
  font-size: 13px;
  text-align: right;
  background-color: #ffdddd;
} -->



#count {
  width:200px;
  height:;
  text-align:right;
  font-size:12px;
  float:right;
  margin:0px;
  padding:0px 10px 0px 0px;
}

/* コンテンツ最下部　フッター　設定 */
#footer{
  position:relative;
  width:700px;
  margin:0px 0px 0px 0px;
  text-align:center;
  font-size:12px;
  color:#ffffff;
  clear:both;
  padding:7px 0px 7px 0px;
  background:url(gazou/rogoft.gif);
  background:#;
}
#footer *{
  display:inline;
  color:#ffffff;
  text-decoration:none;
}
#footer A:visited{
  color:#ffffff;
}
#footer A:hover{
  color:#FFFF00;
}

/* ボックスのシャドウを設定することが出来る */
/*　1つ目の値：x軸オフセット 2つ目の値：y軸オフセット */ 
/*　3つ目の値：値が大きい程ぼんやりと、値が小さい程くっきりとしたシャドウに */
/*  4つ目の値：シャドウの広がり 5つ目の値：カラー  */

/*  {  ボックス指定の中で、下記の３事項を加えると、シャドウが表示される
	-webkit-box-shadow: 3px 3px 5px 0px #777; /* Safari, Chrome用 */ 
	-moz-box-shadow: 3px 3px 5px 0px #777; /* Firefox用 */
	box-shadow: 3px 3px 5px 0px #777; /* CSS3 */
} 
  */