source: branches/comu-ver2/html/user_data/packages/default/css/products.css @ 17593

Revision 17593, 6.0 KB checked in by Seasoft, 16 years ago (diff)

継承で十分と思われる width 定義を削除。ページ幅の変更を容易にする試み。

Line 
1@charset "utf-8";
2
3
4/* 検索結果
5----------------------------------------------- */
6p.conditionarea {
7    clear: both;
8    width: 566px;
9    margin: 0 auto;
10    padding: 5px;
11    border: solid 1px #333;
12}
13
14
15/* ページ送り
16----------------------------------------------- */
17.pagenumberarea, .pagecondarea {
18    clear: both;
19    margin: 20px 0;
20    padding: 10px;
21    background-color: #f3f3f3;
22}
23
24ul.pagenumberarea {
25    height: 2.5ex;
26}
27
28ul.pagecondarea {
29    border: 1px solid #CCCCCC;
30}
31
32ul.pagenumberarea li {
33    float: left;
34    width: 32.9%;
35}
36
37ul.pagenumberarea li.left {
38    text-align: left;
39    white-space: nowrap;
40}
41
42ul.pagenumberarea li.center {
43    text-align: center;
44    white-space: pre;
45}
46
47ul.pagenumberarea li.right {
48    text-align: right;
49    white-space: nowrap;
50}
51
52.pagenumberarea .pagenumber{
53    color: #ff0000;
54    font-weight: bold;
55}
56
57p.pagenumberarea .number{
58    font-weight: bold;
59}
60
61/* 商品一覧 */
62
63/* タイトル
64----------------------------------------------- */
65.product h2.title {
66    border-color: #f00 #ccc;
67    background: url("../img/products/title_icon.gif") no-repeat left center;
68    background-color: #ffebca;
69}
70
71/* 商品
72----------------------------------------------- */
73div.listarea {
74    clear: both;
75    width: 580px;
76    padding: 20px 0 30px 0;
77    overflow: auto;
78    background: url("../img/common/line_580.gif") no-repeat bottom;
79}
80
81div.listphoto {
82    float: left;
83    width: 130px;
84}
85
86div.listrightblock {
87    float: right;
88    width: 440px;
89}
90
91div.listrightblock li {
92    display: inline;
93    padding: 0 0 10px 0;
94}
95
96div.listrightblock h3 {
97    width: 420px;
98    margin: 5px 0;
99    padding: 5px 10px;
100    border-bottom: 2px solid #ebebd6;
101    background-color: #f9f9ec;
102    font-size: 120%;
103}
104
105div.listrightblock h3 a {
106    font-weight: bold;
107}
108
109div.listrightblock .listcomment {
110    margin: 0 0 10px 0;
111}
112
113div.listrightblock .pricebox {
114    float: left;
115}
116
117div.listrightblock .soldout {
118    clear: both;
119}
120
121div.listrightblock .in_cart {
122    margin: 20px auto 5px 130px;
123    padding: 10px;
124    width: 285px;
125    clear: both;
126    background-color: #ecf5ff;
127    border: 1px solid #CCCCCC;
128}
129
130div.listrightblock .quantity {
131    width: 150px;
132}
133
134div.listrightblock .btnbox {
135    margin: 0 0 10px 0;
136    padding: 1px;
137    float: right;
138}
139
140div.listrightblock dt {
141    width: 75px;
142    float: left;
143    text-align: right;
144    padding: 3px;
145    font-weight: bold;
146}
147
148div.listrightblock dd {
149    padding: 3px;
150}
151
152div.listrightblock .cartbtn {
153    clear: both;
154    text-align: center;
155}
156
157div.listrightblock .cartbtn img {
158    display: block;
159    width: 115px;
160    margin: 5px auto 0 auto;
161}
162
163div.listrightblock .box54 {
164    width: 54px;
165    border: solid 1px #ccc;
166}
167
168/* 商品詳細 */
169
170/* 商品
171----------------------------------------------- */
172div#detailarea {
173    width: 580px;
174    margin: 15px 0 0 0;
175}
176
177div#detailphotoblock {
178    float: left;
179    width: 292px;
180}
181
182div#detailphotoblock p {
183    margin: 5px 0 0 0;
184}
185
186div#detailrightblock {
187    float: right;
188    width: 280px;
189}
190
191div#detailrightblock li {
192    display: inline;
193}
194
195div#detailrightblock h2 {
196    margin: 5px 0;
197    padding: 0;
198    color: #ff6600;
199    font-size: 140%;
200    font-weight: bold;
201}
202
203div#detailrightblock dl {
204    padding: 15px 0 0 0;
205}
206
207div#detailrightblock dt {
208    font-weight: bold;
209    padding: 0 0 0 15px;
210    background: url("../img/common/arrow_gray.gif") no-repeat left center;
211}
212
213div#detailrightblock dd {
214    margin: 0 15px 0 0;
215}
216
217div#detailrightblock .box54 {
218    width: 54px;
219    border: solid 1px #ccc;
220}
221
222div#detailrightblock .btn {
223    clear: both;
224    margin: 15px 0 0 0;
225    padding: 15px 0 0 0;
226    text-align: center;
227    background: url("../img/common/line_280.gif") no-repeat;
228}
229
230/* サブタイトル
231----------------------------------------------- */
232div.subarea {
233    clear: both;
234    width: 580px;
235    padding: 30px 0 0 0;
236}
237
238div.subarea h3 {
239    font-size: 120%;
240    margin: 0 0 10px 0;
241    padding: 5px 10px;
242    background-color: #e4e4e4;
243    clear: both;
244}
245
246div.subtext {
247    float: left;
248    width: 365px;
249}
250
251div.subphotoimg {
252    float: right;
253    width: 202px;
254}
255
256div.subphotoimg p {
257    margin: 5px 0 0 0;
258    text-align:right;
259}
260
261
262/* お客様の声
263----------------------------------------------- */
264div#customervoicearea {
265    clear: both;
266    width: 580px;
267    padding: 35px 0 0 0;
268}
269
270div#customervoicearea h2 {
271    padding: 0 0 10px 0;
272}
273
274div#customervoicearea .voicedate{
275    font-weight: bold;
276    margin: 10px 0 0 0;
277}
278
279div#customervoicearea .voicetitle{
280    padding: 5px 0;
281    font-size: 120%;
282    font-weight: bold;
283}
284
285div#customervoicearea li {
286    padding: 0 0 10px 0;
287    background: url("../img/common/line_580.gif") no-repeat bottom;
288}
289
290/* トラックバック
291----------------------------------------------- */
292div#trackbackarea {
293    clear: both;
294    width: 580px;
295    padding: 35px 0 0 0;
296}
297
298div#trackbackarea h2 {
299    padding: 0 0 10px 0;
300}
301
302div#trackbackarea h3 {
303    font-size: 100%;
304    font-weight: bold;
305    padding: 0 0 10px 0;
306}
307
308div#trackbackarea .box500 {
309    width: 500px;
310    border: solid 1px #ccc;
311}
312
313/* この商品を買った人はこんな商品も買っています
314----------------------------------------------- */
315div#whoboughtarea {
316    clear: both;
317    width: 580px;
318    padding: 35px 0 0 0;
319}
320
321div.whoboughtblock {
322    clear: both;
323    width: 580px;
324    padding: 10px 0;
325    overflow: auto;
326}
327
328div.whoboughtleft {
329    float: left;
330    width: 280px;
331    padding: 10px 0;
332    position: relative;
333    background: url("../img/common/line_578.gif") no-repeat bottom;
334}
335
336div.whoboughtleft img {
337    display: block;
338    float: left;
339    margin: 0 5px 0 0;
340}
341
342div.whoboughtleft p {
343    margin: 0 0 5px 0;
344}
345
346div.whoboughtright {
347    float: right;
348    width: 280px;
349    padding: 10px 0;
350    position: relative;
351    background: url("../img/common/line_578.gif") no-repeat bottom;
352}
353
354div.whoboughtright img {
355    display: block;
356    float: left;
357    margin: 0 5px 0 0;
358}
359
360div.whoboughtright p {
361    margin: 0 0 5px 0;
362}
363
364div.whoboughtleft h3 {
365    font-size: 100%;
366}
367
368div.whoboughtright h3 {
369    font-size: 100%;
370}
Note: See TracBrowser for help on using the repository browser.