source: branches/comu-ver2/html/user_data/packages/default/css/main.css @ 17518

Revision 17518, 7.5 KB checked in by Seasoft, 16 years ago (diff)

CSS 微調整

Line 
1@charset "utf-8";
2* {
3    margin: 0;
4    padding: 0;
5}
6
7table,img,p {
8    border: 0;
9}
10
11body {
12    font-family: Verdana,Arial,Helvetica,sans-serif;
13    color: #555555;
14    background-color: #ffe9e6;
15    font-size: 72.5%;
16    line-height: 150%;
17    letter-spacing:1px;
18}
19
20li {
21    list-style-type: none;
22}
23
24select {
25    border: solid 1px #ccc;
26}
27
28/*PHOTO*/
29.picture {
30    border: 1px solid #ccc;
31}
32/* フロート回り込み解除
33----------------------------------------------- */
34br.clear {
35    clear: both;
36    display: none;
37    font-size: 0px;
38    line-height: 0%;
39    height: 0px
40}
41/* リンク指定
42----------------------------------------------- */
43a { text-decoration: underline; }
44a:link { color: #3a75af; }
45a:visited { color: #3a75af; }
46a:hover { color: #ff6600; }
47/* フォント
48----------------------------------------------- */
49h1,h2,h3,h4,h5 {
50    font-size: 100%;
51    line-height: 150%;
52}
53.price {
54}
55/* FIXME ポイントがクラス「price」を利用しているようだが、専用のクラスを用意すべき。 */
56.sale_price {
57    color: #ff0000;
58}
59.sale_price .price {
60    font-weight: bold;
61}
62.normal_price {
63}
64.attention { color: #ff0000; }
65.mini { font-size: 90%; }
66em {
67    font-style: normal;
68    color: #ff0000;
69}
70
71/* 見出し
72----------------------------------------------- */
73h2 {
74    padding: 15px 0 0 0;
75}
76h2.title {
77    margin: 0 0 10px 0;
78    border-style: solid;
79    border-width: 2px 1px;
80    border-color: #999 #ccc;
81    background: url("../img/title/title_icon.gif") no-repeat 7px center;
82    padding: 7px 0 7px 30px;
83    font-size: 140%;
84    color: #000;
85}
86
87/* テーブル共通指定
88----------------------------------------------- */
89table  {
90    margin: 15px auto 0 auto;
91    border-top: 1px solid #ccc;
92    border-left: 1px solid #ccc;
93    border-collapse: collapse;
94    text-align: left;
95}
96table th {
97    padding: 8px;
98    border-right: 1px solid #ccc;
99    border-bottom: 1px solid #ccc;
100    background-color: #f0f0f0;
101    font-weight: normal;
102}
103table td {
104    padding: 8px;
105    border-right: 1px solid #ccc;
106    border-bottom: 1px solid #ccc;
107}
108div.tblareabtn {
109    clear: both;
110    margin: 15px 0 0 0;
111    text-align: center;
112}
113.phototd {
114    width: 75px;
115    text-align: center;
116}
117.centertd {
118    text-align: center;
119}
120.pricetd {
121    text-align: right;
122}
123.pricetd em {
124    font-weight: bold;
125}
126div#completetext {
127    width: 470px;
128    margin: 15px auto 0 auto;
129    padding: 15px;
130    border: 5px solid #ccc;
131}
132div#completetext em {
133    font-weight: bold;
134}
135div#completetext p{
136    padding: 20px 0 0 0;
137    text-align: left;
138}
139
140
141/* ヘッダーロゴ
142------------------------------------------------ */
143div#header {
144    background: url("../img/header/bg.gif");
145    width: 780px;
146    height: 95px;
147    margin: 0 auto;
148}
149div#header h1 a {
150    float: left;
151    display: block;
152    margin: 8px 0 0 0;
153    width: 292px;
154    height: 81px;
155    background: url("../img/header/logo.gif") no-repeat;
156}
157div#header em {
158    display: none;
159}
160
161
162/* ヘッダーナビ
163----------------------------------------------- */
164div#information {
165    float: right;
166    padding: 60px 8px 0 0;
167}
168div#information ul li {
169    display: inline;
170}
171div#information ul li a {
172    text-decoration: none;
173}
174/* フレーム
175----------------------------------------------- */
176div#container {
177    width: 764px;
178    margin: 0 auto;
179    padding: 0 8px;
180    background-color: #fff;
181    text-align: left;
182}
183#container:after {/* firefox背景色表示用 */
184    content: "";
185    display: block;
186    clear: both;
187    height: 1px;
188    overflow: hidden;
189}
190
191div#leftcolumn {
192    float: left;
193    width: 166px;
194}
195
196div#rightcolumn {
197    float: left;
198    width: 166px;
199}
200
201/* メインコンテンツ
202----------------------------------------------- */
203/* 3カラム設定 */
204div#three_maincolumn {
205    float: left;
206    width: 432px;
207    padding: 15px 0 0 0;
208}
209
210/* 2カラム設定 */
211div#two_maincolumn {
212    float: left;
213    width: 598px;
214    padding: 15px 0 0 0;
215}
216
217/* 1カラム設定 */
218div#one_maincolumn {
219    padding: 10px 0 0 0;
220}
221
222/* カゴの中
223----------------------------------------------- */
224div#cartarea {
225    width: 144px;
226    padding: 10px;
227    border: solid 1px #ccc;
228}
229
230div#cartarea p {
231    padding: 5px 0 10px 0;
232}
233
234div#cartarea p.item {
235    padding: 0 0 10px 0;
236    background: url("../img/side/line_146.gif") no-repeat bottom;
237}
238
239div#cartarea .btn {
240    padding: 0;
241    text-align: center;
242}
243
244
245/* カテゴリー
246----------------------------------------------- */
247div#categoryarea {
248    width: 144px;
249    padding: 10px;
250    border: solid 1px #ccc;
251    background-color: #fff1e3;
252}
253
254div#categoryarea li {
255    padding: 0 0 0 20px;
256    background: url("../img/common/arrow_blue.gif") 0 3px no-repeat;
257}
258div#categoryarea li.onmark {
259    background: url("../img/common/arrow_red.gif") 0 3px no-repeat;
260}
261div#categoryarea li.level1 {
262    font-weight: bold;
263}
264div#categoryarea li.level1 li {
265    font-weight: normal;
266}
267div#categoryarea li a {
268    display: block;
269    padding: 3px 0;
270}
271
272a.onlink {  text-decoration: underline; }
273a.onlink:link { color: #ff0000; }
274a.onlink:visited { color: #ff0000; }
275a.onlink:hover { color: #ff0000; }
276
277
278/* ガイドリンク
279----------------------------------------------- */
280#guidearea {
281    margin-top: 1em;
282}
283#guidearea li {
284    font-size: 11px;
285    margin: 0;
286    padding: 0;
287}
288#guidearea li a {
289    display: block;
290    padding: 7px 0 7px 15px;
291    text-decoration: none;
292    border: 1px solid;
293    border-color: #ccc #999 #999 #ccc;
294    background: url("../img/bloc/guide/bg.gif") 5px 7px no-repeat;
295    outline: none;
296    margin: 0;
297}
298#guidearea li a:link,
299#guidearea li a:visited {
300    color: #000;
301}
302#guidearea li a:hover ,
303#guidearea li a.selected {
304    color: #ff6600;
305}
306#guidearea li a:active {
307    border-color: #999 #ccc #ccc #999;
308}
309
310/* ログイン
311----------------------------------------------- */
312div#loginarea {
313    width: 144px;
314    padding: 0 10px 10px 10px;
315    border: solid 1px #ccc;
316}
317
318div#loginarea p {
319    padding: 8px 0 0 0;
320}
321
322div#login img {
323    padding: 0 5px 0 0;
324    vertical-align: bottom;
325}
326
327div#loginarea .btn {
328    text-align: center;
329}
330
331#loginarea .box96 {
332    width: 96px;
333    border: solid 1px #ccc;
334}
335
336
337/* 検索
338----------------------------------------------- */
339div#searcharea {
340    width: 144px;
341    padding: 0 10px 10px 10px;
342    border: solid 1px #ccc;
343}
344
345div#searcharea p {
346    padding: 8px 0 0 0;
347}
348
349div#searcharea .btn {
350    text-align: center;
351}
352
353#searcharea .box142 {
354    width: 142px;
355    border: solid 1px #ccc;
356}
357
358
359/* バナー
360----------------------------------------------- */
361ul#banner {
362    padding: 15px 0 0 0;
363}
364
365#banner li {
366    padding: 0 0 10px 0;
367}
368
369/* テキストフィールド
370----------------------------------------------- */
371input[type='text'] {
372    border: solid 1px #ccc;
373}
374
375/* ボタン
376----------------------------------------------- */
377input[type='image'] {
378    border: none;
379}
380
381input[type='image'].box190 {
382    width: 190px;
383    height: 30px;
384}
385
386input[type='image'].box180 {
387    width: 180px;
388    height: 30px;
389}
390
391input[type='image'].box150 {
392    width: 150px;
393    height: 30px;
394}
395
396input[type='image'].box140 {
397    width: 140px;
398    height: 30px;
399}
400
401input[type='image'].box130 {
402    width: 130px;
403    height: 30px;
404}
405
406input[type='image'].box51 {
407    width: 51px;
408    height: 22px;
409}
410
411/* フッター
412----------------------------------------------- */
413#pagetop {
414    width: 764px;
415    margin: 0 auto;
416    padding: 30px 8px 15px 8px;
417    background-color: #fff;
418    text-align: right;
419}
420
421#fotter {
422    width: 764px;
423    margin: 0 auto;
424    padding: 15px 8px;
425    border-top: 1px solid #ff6600;
426    background-color: #ffa85c;
427    font-size: 90%;
428    color: #fff;
429    text-align: left;
430}
Note: See TracBrowser for help on using the repository browser.