@charset "utf-8";

/**
 * CSS Document
 * 
 * 各プロパティの順序は、mozilla.orgに従って記述し
 * ております。
 * http://mozilla.org/contribute/writing/markup
 * 
 *   1.display
 *   2.list-style
 *   3.position
 *   4.float
 *   5.clear
 *   6.width
 *   7.height
 *   8.margin
 *   9.padding
 *  10.border
 *  11.background
 *  12.color
 *  13.font
 *  14.text-decoration
 *  15.text-align
 *  16.vertical-align
 *  17.white-space
 *  18.other text
 *  19.content
 * 
 * @date    2010/05
 * @author  Junichi Sawada <sawada@juntech.jp>
 * @encord  utf-8
 * 

/********************************************************

ページ共通・初期化

*********************************************************/
/* マージンの初期化 */
* {
  margin:               0;
  padding:              0;
}

/* 基本 */
body {
  color:                #666666;
  font-size:            12px;
  font-family:          "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  text-align:           center; /* IE 5.5以下用対策 */
}

#cn {
  background-color:     #221816;
  color:                #666666;
  font-size:            12px;
  font-family:          "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  text-align:           center; /* IE 5.5以下用対策 */
}

/* フロートの解除 */
.clear_float {
  height:               0;
  font-size:            1px;
  line-height:          0px;
  clear:                both;
}

/* 画像枠の初期化 */
img {
  border-style:         none;
}

/* リンク */
a {
  color:                #666666;
  text-decoration:      underline;
}

/* リンクオーバー */
a:hover {
  color:                #e96591;
  text-decoration:      none;
}

/* H1 */
h1 {
  float:                left;
  width:                437px;
  height:               65px;
}

/********************************************************

基本領域レイアウト設定

*********************************************************/
/* BODY領域 */
#wrapper {
  width:                992px;
  margin-right:         auto;
  margin-left:          auto;
  text-align:           left;
}

/* ヘッダ */
#wrapper #header {
}

/* H1 */
h1 {
  float:                left;
  width:                300px;
  height:               97px;
}

/* H2 */
h2 {
  color:                #e7669c;
  font-size:            22px;
  border-bottom:        solid 1px #e7669c;
}

/* メイン */
#wrapper #main {
}

/* フッタ */
#wrapper #footer {
  height:               70px;
  margin-top:           35px;
}

/********************************************************

ヘッダナビゲーション

*********************************************************/
#wrapper #header #h_inner #navi_header {
  float:                left;
  width:                688px;
}

#wrapper #header #h_inner #navi_header ul li {
  display:              inline;
  list-style-type:      none;
  float:                left;
}

#wrapper #header #h_inner #navi_header ul li a {
  display:              block;
  background-repeat:    no-repeat;
  text-indent:          -9999px;
  outline:              0;
}

/* GioielloSacraとは */
#wrapper #header #h_inner #navi_header ul li#navi_header_01 a {
  width:                75px;
  height:               27px;
  background-image:     url(../images/navi_header_01.gif);
}

/* ご利用ガイド */
#wrapper #header #h_inner #navi_header ul li#navi_header_02 a {
  width:                183px;
  height:               27px;
  background-image:     url(../images/navi_header_02.gif);
}

/* お支払い方法・送料 */
#wrapper #header #h_inner #navi_header ul li#navi_header_03 a {
  width:                86px;
  height:               27px;
  background-image:     url(../images/navi_header_03.gif);
}

/* サイトマップ */
#wrapper #header #h_inner #navi_header ul li#navi_header_04 a {
  width:                101px;
  height:               27px;
  margin-left:          140px;
  background-image:     url(../images/navi_header_04.gif);
}

/* お問い合わせ  */
#wrapper #header #h_inner #navi_header ul li#navi_header_05 a {
  width:                103px;
  height:               27px;
  background-image:     url(../images/navi_header_05.gif);
}


#wrapper #header #h_inner #navi_header_online_shop {
  text-align:           right;
}


/********************************************************

サブナビゲーション（左袖）

*********************************************************/
#wrapper #main #inner_1 {
  float:                left;
  width:                284px;
}

#wrapper #main #inner_1 #image_pic {
  margin-top:           7px;
}

#wrapper #main #inner_1 #navi_main {
  width:                284px;
}

#wrapper #main #inner_1 #navi_main ul li {
  display:              inline;
  list-style-type:      none;
}

#wrapper #main #inner_1 #navi_main ul li a {
  display:              block;
  background-repeat:    no-repeat;
  text-indent:          -9999px;
  outline:              0;
}

#wrapper #main #inner_1 #navi_main ul li#navi_main_01 a {
  width:                283px;
  height:               62px;
  background-image:     url(../images/navi_main_01.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_01_active a {
  width:                283px;
  height:               62px;
  background-image:     url(../images/navi_main_01_over.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_01 a:hover {
  width:                283px;
  height:               62px;
  background-image:     url(../images/navi_main_01_over.gif);
}

#wrapper #main #inner_1 #navi_main ul li#navi_main_02 a {
  width:                283px;
  height:               67px;
  background-image:     url(../images/navi_main_02.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_02_active a {
  width:                283px;
  height:               67px;
  background-image:     url(../images/navi_main_02_over.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_02 a:hover {
  width:                283px;
  height:               67px;
  background-image:     url(../images/navi_main_02_over.gif);
}

#wrapper #main #inner_1 #navi_main ul li#navi_main_03 a {
  width:                283px;
  height:               61px;
  background-image:     url(../images/navi_main_03.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_03_active a {
  width:                283px;
  height:               61px;
  background-image:     url(../images/navi_main_03_over.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_03 a:hover {
  width:                283px;
  height:               61px;
  background-image:     url(../images/navi_main_03_over.gif);
}

#wrapper #main #inner_1 #navi_main ul li#navi_main_04 a {
  width:                283px;
  height:               55px;
  background-image:     url(../images/navi_main_04.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_04_active a {
  width:                283px;
  height:               55px;
  background-image:     url(../images/navi_main_04_over.gif);
}
#wrapper #main #inner_1 #navi_main ul li#navi_main_04 a:hover {
  width:                283px;
  height:               55px;
  background-image:     url(../images/navi_main_04_over.gif);
}


/********************************************************

コンテンツ

*********************************************************/
#wrapper #main #inner_2 {
  float:                left;
  width:                688px;
  margin-left:          20px;
}

/* アイテム行 */
#wrapper #main #inner_2 .item_line {
  width:                688px;
  height:               182px;
  background-image:     url(../images/item_line_bg.gif);
  background-repeat:    no-repeat;
}

/* アイテム行サムネイル */
#wrapper #main #inner_2 .item_line .item_thumb {
  float:                left;
  width:                152px;
  height:               182px;
  padding-left:         10px;
  padding-right:        10px;
}

/* アイテム行サムネイル画像 */
#wrapper #main #inner_2 .item_line .item_thumb .item_thumb_pic {
  width:                152px;
  height:               140px;
}

/* アイテム行サムネイル商品名 */
#wrapper #main #inner_2 .item_line .item_thumb p.item_thumb_name {
  height:               27px;
  margin-top:           5px;
  font-size:            11px;
  line-height:          120%;
}

/********************************************************

「PAGE TOP」ナビゲーション

*********************************************************/
#wrapper #main #inner_2 #navi_page_top {
  margin-top:           35px;
  text-align:           right;
}

/********************************************************

コンテンツ下部ナビゲーション

*********************************************************/
#wrapper p#navi_bottom {
  padding-top:          60px;
  padding-bottom:       30px;
  color:                #999999;
  text-align:           center;
  line-height:          150%;
}


/********************************************************

コピーライト

*********************************************************/
#wrapper p#copyright {
  height:               30px;
  padding-top:          30px;
  text-align:           right;
}



