/*-------------------------------------------------------- TOPページ5枚の画像枠 --------------------------------------------------------*/ #waku{ width:100%; /* 横幅100%にすることで全画面に対応 */ } .waku_2 img{ /* 枠ではなく画像自体の指定(枠は"waku"で指定) */ width : 59.5%; padding-top : 0px; float : left; padding-right : 0.35%; padding-bottom : 4px; } .waku_3 img{ /* 枠ではなく画像自体の指定(枠は"waku"で指定) */ width : 40%; padding-top : 0px; padding-bottom : 4px; } #waku_4{ width : 100%; /* 横幅100%にすることで全画面に対応 */ } .waku_5 img{ /* 枠ではなく画像自体の指定(枠は"waku_4"で指定) */ width : 37.4%; padding-top : 0px; float : left; padding-right : 0.35%; padding-bottom : 15px;" } .waku_6 img{ /* 枠ではなく画像自体の指定(枠は"waku_4"で指定) */ width : 37.4%; padding-top : 0px; float : left; padding-right : 0.35%; padding-bottom : 15px; } .waku_7 img{ /* 枠ではなく画像自体の指定(枠は"waku_4"で指定) */ width : 24.5%; padding-top : 0px; float : left; padding-bottom : 15px; } /*-------------------------------------------------------- ヘッダー部分について --------------------------------------------------------*/ /* メニューバーを含むヘッダー部分の固定 */ #header-fixed{ margin : 0; padding : 0; position : fixed; /* ヘッダーの固定 */ top : 0px; /* 位置(上0px) */ left : 0px; /* 位置(右0px) */ width : 100%; /* 横幅100% */ z-index: 999; background-color: black; background-repeat : no-repeat; } /* ヘッダー上部 */ #header-bk{ margin : 0; padding : 0; height : 65px; /* 縦幅65px(画像の高さ) */ width : 100%; /* 横幅100% */ background-image : url(../img/black1980x65.jpg); background-repeat : no-repeat; background-color : black; } /* 左上「GenCorporation」部分のリンク */ #header-bk a{ /* 通常時 */ color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; font-family : 'HG丸ｺﾞｼｯｸM-PRO','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; } #header-bk a link{ /* 未訪問リンク */ color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; font-family : 'HG丸ｺﾞｼｯｸM-PRO','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; } #header-bk a visited{ /* 訪問済みリンク */ color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; font-family : 'HG丸ｺﾞｼｯｸM-PRO','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; } #header-bk a hover{ /* オンマウス時 */ color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; font-family : 'HG丸ｺﾞｼｯｸM-PRO','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; } #header-bk a active{ /* クリック時 */ color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; font-family : 'HG丸ｺﾞｼｯｸM-PRO','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; } /* ヘッダーのメニューバー部分 */ #header-bk02 ul{ margin : 0; padding : 0; float : left; width : 100%; list-style : none; position : relative; font-size : 17px; background : black; z-index: 999; } #header-bk02 li{ float : left; width : 16.5%; margin : 0; padding : 0; font-family : 'メイリオ', 'HG丸ｺﾞｼｯｸM-PRO', Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; background : black; } #header-bk02 li a{ /* 通常時(メニュー) */ padding : 0px 0px 25px 0px; /* メニュースペースを指定 */ display : block; color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; font-family : 'メイリオ', 'HG丸ｺﾞｼｯｸM-PRO', Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; } #header-bk02 li:hover{ /* オンマウス時(メニュー) */ bakground-color : none; /* 文字の装飾なし */ } #header-bk02 li span{ /* 通常時(子メニュー) */ float : left; padding : 0px; position : absolute; top : 25px; /* 子メニューの表示位置(上から25px) */ left : 0px; display : none; width : 100%; background : none 0% 0% / auto auto repeat scroll padding-box border-box black; color : red; text-align : left; /* 左寄せを指定 */ font-family : 'メイリオ', 'HG丸ｺﾞｼｯｸM-PRO', Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif; font-size : 14px; } #header-bk02 li:hover span{ /* オンマウス時(子メニュー) */ display : block; } #header-bk02 li span a{ /* 通常時(子メニューのa要素) */ display : inline; } #header-bk02 li span a:hover{ /* オンマウス時(子メニューのa要素) */ text-decoration: underline; /* 文字にアンダーバーを表示 */ color : yellow; /* 文字色を黄色に変える */ } /*-------------------------------------------------------- TOPリニューアル後のhtml,body --------------------------------------------------------*/ /* html,bodyタグの設定 */ html, body{ margin : 0; /* 余白の削除 */ padding : 0; /* 余白の削除 */ width : 100%; height : 100%; } /* ボディの定義 */ div#body-bk{ padding : 118px 20px; /* 上下118px、左右20pxの余白を取る */ } /*div#body{ width : 100%; margin : auto; margin : 0; padding : 0; } /*-------------------------------------------------------- フッター設定 --------------------------------------------------------*/ #copy{ width : 100%; background-color : black; clear : both; text-align : center; color : #FFFFFF; margin-bottom : -25px; /* フッター下部に空白を削除する(ネガティブマージンで隙間を削除) ※全画面表示にするとフッターの下に空白が現れる */ } #copy a{ /* 通常時 */ color : white; /* 文字色(白) */ text-decoration : none; /* 文字の装飾なし */ text-align : center; #copy a:visited{ /* 訪問済みリンク */ color: white; /* 文字色(白) */ text-decoration: underline; /* 文字の装飾なし */ text-align : center; } #copy a:hover{ /* オンマウス時 */ color: white; /* 文字色(白) */ text-decoration: underline; /* 文字の装飾なし */ text-align : center; } #copy a:active{ /* クリック時 */ color: white; /* 文字色(白) */ text-decoration: underline; /* 文字の装飾なし */ text-align : center; } /*-------------------------------------------------------- TOPICS設定 --------------------------------------------------------*/ /* --- ボックス --- */ div.section{ width : 100%; /* ボックスの横幅 */ height : 23px; /* ボックスの縦幅 */ overflow : visible; background-color : #ffffff; /* ボックスの背景色(白) */ border : none; /* ボックスの境界線 */ font-size : 100%; /* 文字サイズ */ color : #000000; /* 文字色(黒) */ } /* --- ボックス内の段落 --- */ div.section p{ margin : 1em 10px; /* 段落のマージン（上下、左右） */ text-align : center; } }