HPBスタイルシートとレイアウト

コード表記

main_2Ga_2c.css

#hpb-skip /*ページの先頭に戻るための先頭部分*/
{
/* ヘッダースキップの非表示 */
height: 1px; /**/
margin: 0;
padding: 0;
overflow: hidden; /*はみ出し部分は非表示にする*/
text-align: left;
text-indent: -9999px; /*大幅な字下げを行う*/
}

/* ページ全体の領域確保 */

container_2Ga_2c_top.css

#hpb-container
{
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
position: relative;
color: #333333;
background-image : url(../images/bg_inner_2Ga.png); /*ページ全体の木目と紙の画像*/
background-repeat: repeat-y; /*縦方向だけのくり返し*/
background-position: 0px 120px;
width: 1000px; /*ページの幅を1000pxに設定している*/
border-left-width: 1px;
border-left-color: #d8c89b;
border-left-style: solid;
border-right-width: 1px;
border-right-color: #d8c89b;
border-right-style: solid;
}

/* ヘッダーの領域確保 */

container_2Ga_2c_top.css

#hpb-header
{
background-image : url(../images/bg_header_2Ga.png);
background-repeat: no-repeat;
background-position: center top;
width: 1000px; /*幅を1000pxに設定している*/
height: 156px; /*高さを156pxに設定している*/
overflow: hidden;
margin-top: -1px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
padding-top: 0px;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
position: relative;
}

main_2Ga_2c.css
container_2Ga_2c_top.css

#hpb-headerMain
{
height: 20px;
overflow: hidden;
padding-top: 76px;
margin-left: 90px;
}

main_2Ga_2c.css
container_2Ga_2c_top.css

#hpb-headerLogo
{
width: 400px;
position: absolute;
left: 90px;
top: 46px;
}

/* ヘッダー内の電話と住所を記録(非表示) */

main_2Ga_2c.css

#hpb-headerExtra1
{
display: none;
}

container_2Ga_2c_top.css

/* フッターのスタイル */
#hpb-footer
{
clear: both;
width: 100%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0px;
z-index: 1;
position: relative;
background-image : url(../images/bg_footer_2Ga.png);
background-repeat: no-repeat;
background-position: center bottom;
height: 126px;
}

container_2Ga_2c_top.css

/* 本文+サイドの合体領域スタイル */
#hpb-inner
{
width: 1000px;
margin-right: auto;
margin-left: auto;
margin-top: 0px;
background-image : url(../images/bg_nav_2Ga.png);
background-repeat: no-repeat;
background-position: 100px 20px;
}

container_2Ga_2c_top.css

container_2Ga_2c_top.css
/* 本文領域スタイル */
#hpb-wrapper
{
width: 600px;
padding-top: 40px;
padding-right: 72px;
float: right;
}

container_2Ga_2c_top.css

#hpb-main
{
width: 570px;
}

container_2Ga_2c_top.css

#hpb-aside
{
width: 200px;
padding-top: 40px;
float: left;
padding-left: 100px;
}