@charset "shift_jis"; /* ------------------------------------------------------------- [1] レイアウトに関する指定 [2] ヘッダーブロック内に関する指定 [3] コンテンツブロック内に関する指定 [4] サイドバーブロック内に関する指定 [5] フッターブロック内に関する指定 [6] CSSデザインサンプルリンク指定 ---------------------------------------------------------------- CSSデザインサンプ [ URL ] http://www.css-designsample.com ------------------------------------------------------------- */ /* 一括で全ての要素の余白をゼロに指定 */ * { margin: 0; padding: 0; } /* 全体的なリンク */ a:link, a:visited, a:hover, a:active { text-decoration: underline; } a:link { color: #00f; } a:visited { color: #90f; } a:hover { color: #f00; } a:active { color: #f00; } /* ------------------------------------------------------------- [1] レイアウトに関する指定 */ body { font-size: 90%; text-align: center; padding: 0; margin: 0; } /*-- 全体を囲んでいます --*/ #wrapper { text-align: left; width: 980px; margin: 0 auto; padding: 5px; background: url(img/bg-wrapper.jpg) repeat-y 0 0; background-color: #ffffff; } /*-- ヘッダー部分 --*/ #header { width: 100%; height: 80px; position: relative; background: url(../bunner/title.gif) no-repeat 0 0; } #header-inner { width: 850px; height: 75px; position: relative; top: 40px; left: 40px; } /*-- コンテナー部分 --*/ #container { } /*-- メイン部分 --*/ #main { width: 730px; float: right; } /*-- スライド部分 --*/ #slide { width: 730px; height: 300px; padding: 0; } /*-- コンテンツ部分 --*/ #contents { width: 710px; padding: 0; } /*-- メニュー部分 --*/ #menu { width: 200px; float: left; padding: 0; background-color: #F0FFF0; } /*-- フッター部分 --*/ #footer { width: 100%; height: 70px; } /* ------------------------------------------------------------- [2] ヘッダーブロック内に関する指定 */ /* -- キーワード -- */ h1 { font-size: 100%; font-weight: normal; } /* -- 企業名｜ショップ名｜タイトル -- */ .logo { font-size: 150%; font-weight: bold; } .logo a { text-decoration: none; color: #000; } .logo a:hover { text-decoration: none; color: #f00; } /* -- ページの概要 -- */ .description { padding-bottom: 1em; } /* ------------------------------------------------------------- [3] コンテンツブロック内に関する指定 */ /* 見出し */ h2 { font-size: 100%; margin: 0 0 2em; padding: 1em 0 1em 35px; background: url(img/bg-h2.jpg) no-repeat 0 50%; } h3,h4,h5,h6 { font-size: 100%; margin: 3em 0 1em; padding: 0.5em 0 0.5em 35px; background: url(img/bg-h.jpg) no-repeat 0 50%; border-bottom: 2px solid #ccc; } /* -- 文字 -- */ #contents p { line-height: 1.6em; margin-bottom: 0.5em; } /* ------------------------------------------------------------- [4] サイドバーブロック内に関する指定 */ /* サイドバータイトル */ .side-title { font-weight: normal; margin-bottom: 3px; padding: 0.5em 0 0 30px; background: url(img/bg-h.jpg) no-repeat -10px 100%; } /*----------------------サイドバー内のDIV ボーダーはこの部分に指定してあります。 #sidebarで幅を変更した場合など、ここで メニューなどの幅を指定します。 .localnavi等の幅指定は要りません。 ----------------------------------------*/ #sidebar div { width: 180px; margin-bottom: 2em; padding: 14px 9px; border: 1px solid #ccc; } /* リスト/サイドバーメニュー */ #sidebar .localnavi { list-style-type: none; list-style-position: outside; } #sidebar .localnavi li { display: inline; } #sidebar .localnavi a { font-size: 90%; text-decoration: none; width: 170px; display: block; padding: 4px; border: 1px outset #fff; background-color: #eee; color: #000; } #sidebar .localnavi a:hover { text-decoration: none; border: 1px outset #fff; background-color: #fcf; color: #000; } /* ULリスト */ #sidebar ul, #sidebar ol { list-style-position: inside; } #sidebar li { margin-bottom: 0.5em; } /* DLリスト */ #sidebar dt { margin-bottom: 0.5em; border-bottom: 1px solid #ccc; } #sidebar dd { margin-bottom: 0.5em; } /* ------------------------------------------------------------- [5] フッターブロック内に関する指定 */ #footer { 　background-color: #90EE90; } /* ------------------------------------------------------------- [6] CSSデザインサンプルリンク指定 */ #cds { font-size: 80%; font-family: Geneva, Arial, Helvetica, sans-serif; margin: 0; clear: both; } #cds, #cds a, #cds a:hover { text-decoration: none; color: #ccc; }