public/stylesheets/front/top.css

   1 @charset "utf-8";\r
   2 \r
   3 /*--トップ・ヘッダーイメージ--*/\r
   4 #top_img {\r
   5   width: 730px;\r
   6   padding: 0 0 10px 10px;\r
   7   margin-left: -10px;\r
   8   zoom: 1;\r
   9   position: relative;\r
  10   background-color: #ffffff;\r
  11 }\r
  12 \r
  13 /*---------共通要素---------*/\r
  14 h2 {\r
  15   height: 50px;\r
  16 }\r
  17 \r
  18 h2.clearfix img {\r
  19   float: left;\r
  20 }\r
  21 \r
  22 h2.clearfix span.more {\r
  23   float: left;\r
  24   display: block;\r
  25   width: 107px;\r
  26   height: 34px;\r
  27   padding-top: 16px;\r
  28   background: url(../../images/top/title_r.gif) no-repeat;\r
  29 }\r
  30 \r
  31 /*-------新着アイテム-------*/\r
  32 #new_item {\r
  33   width: 520px;\r
  34   padding: 0 5px 10px;\r
  35   background: url(../../images/top/top_bg.gif) repeat-y;\r
  36 }\r
  37 \r
  38 #new_item li {\r
  39   float: left;\r
  40   width: 119px;\r
  41   padding: 5px;\r
  42   height: 140px;\r
  43 }\r
  44 \r
  45 * html #new_item li {\r
  46   padding: 4px;\r
  47 }\r
  48 \r
  49 #new_item img {\r
  50   border: 1px solid #aaaaaa;\r
  51 }\r
  52 \r
  53 #new_item p {\r
  54   margin-top: 5px;\r
  55   line-height: 110%;\r
  56 }\r
  57 \r
  58 /*----人気商品ランキング----*/\r
  59 #ranking {\r
  60   width: 509px;\r
  61   padding: 0 11px 10px 10px;\r
  62   background: url(../../images/top/top_bg.gif) repeat-y;\r
  63 }\r
  64 \r
  65 .rank_item {\r
  66   border: 1px solid #aaaaaa;\r
  67   margin-left: 13px;\r
  68 }\r
  69 \r
  70 #ranking li {\r
  71   float: left;\r
  72   width: 147px;\r
  73   margin: 0 11px;\r
  74   padding-top: 10px;\r
  75 }\r
  76 \r
  77 * html #ranking li {\r
  78   margin: 0 9px;\r
  79 }\r
  80 \r
  81 .rank1 {\r
  82   background: url(../../images/top/rank1_bg.gif) repeat-x;\r
  83 }\r
  84 \r
  85 .rank2 {\r
  86   background: url(../../images/top/rank2_bg.gif) repeat-x;\r
  87 }\r
  88 \r
  89 .rank3 {\r
  90   background: url(../../images/top/rank3_bg.gif) repeat-x;\r
  91 }\r
  92 \r
  93 \r
  94 .rank_img {\r
  95   display: inline-block;\r
  96   display: -moz-inline-box;\r
  97   vertical-align: middle;\r
  98   width: 44px;\r
  99   height: 41px;\r
 100 }\r
 101 \r
 102 .rank_t {\r
 103   display: inline-block;\r
 104   display: -moz-inline-box;\r
 105   vertical-align: middle;\r
 106   width: 99px;\r
 107 }\r
 108 \r
 109 * html .rank_img,\r
 110 * html .rank_t {\r
 111   display: inline;\r
 112   zoom: 1;\r
 113 }\r
 114 \r
 115 *:first-child+html .rank_img,\r
 116 *:first-child+html .rank_t {\r
 117   display: inline;\r
 118   zoom: 1;\r
 119 }\r
 120 \r
 121 #ranking p {\r
 122   width: 99px;\r
 123   line-height: 110%;\r
 124   padding: 2px 0 1px;\r
 125 }\r
 126 \r
 127 /*-----おすすめアイテム-----*/\r
 128 #reco_item {\r
 129   width: 510px;\r
 130   padding: 0 10px;\r
 131   background: url(../../images/top/top_bg.gif) repeat-y;\r
 132 }\r
 133 \r
 134 #reco_item li {\r
 135   float: left;\r
 136   width: 235px;\r
 137   min-height: 95px;\r
 138   height: auto !important;\r
 139   height: 95px;\r
 140   padding: 0 10px;\r
 141   margin-bottom: 10px;\r
 142 }\r
 143 \r
 144 * html #reco_item li {\r
 145   width: 235px;\r
 146   padding: 0 10px;\r
 147 }\r
 148 \r
 149 #reco_item li img {\r
 150   float: left;\r
 151   width: 90px;\r
 152   border: 1px solid #aaaaaa;\r
 153 }\r
 154 \r
 155 #reco_item li dl {\r
 156   margin-left: 100px;\r
 157 }\r
 158 \r
 159 #reco_item li dt {\r
 160   padding-top: 2px;\r
 161   margin-bottom: 7px;\r
 162 }\r
 163 \r
 164 #reco_item li dd {\r
 165   line-height: 120%;\r
 166 }\r