source: branches/version-2_12-dev/html/user_data/packages/sphone/css/contents.css @ 21619

Revision 21619, 12.5 KB checked in by Seasoft, 12 years ago (diff)

#1613 (typo修正・ソース整形・ソースコメントの改善)
  • Property svn:mime-type set to text/plain
Line 
1@charset "utf-8";
2/* ===================================================================
3CSS information
4file name  :contents.css
5style info :下層コンテンツ用(#undercolumn)
6=================================================================== */
7/* -----------------------------------------------
8#undercolumn 汎用
9----------------------------------------------- */
10#undercolumn {
11    padding-bottom: 35px;
12}
13/**イントロダクション*/
14.information {
15    font-weight: bold;
16    padding: 5px 10px;
17    line-height: 1.3;
18    border-bottom: #CCC solid 1px;
19}
20.information p:first-child {
21    font-size: 14px;
22    margin-bottom: 0.5em;
23}
24/*フォーム枠*/
25.form_area {
26    padding: 10px;
27}
28.form_area p:first-child {
29    margin-bottom: 0.5em;
30}
31.formBox {
32    margin-bottom: 20px;
33    border: #A9ABAD solid 1px;
34    border-radius: 7px;
35    -moz-border-radius: 7px;
36    -webkit-border-radius: 7px;
37}
38.innerBox {
39    padding: 10px;
40    border-bottom: #CCC solid 1px;
41}
42.arrowBox {
43    padding: 10px 25px 10px 10px;
44    background: url(../img/common/ico_arrowR.png) 95% center no-repeat;
45    border-bottom: #CCC solid 1px;
46    clear: both;
47}
48@media only screen and (-webkit-min-device-pixel-ratio: 2) {
49    .arrowBox {
50        background: url(../img/common/ico_arrowR2.png) 95% center no-repeat;
51        -webkit-background-size: 10px 15px;
52        background-size: 10px 15px;
53    }
54}
55.box_header {
56    font-size: 16px;
57    font-weight: bold;
58    background: #EEE;
59    padding: 10px;
60    border-radius: 7px 7px 0 0;
61    -moz-border-radius: 7px 7px 0 0;
62    -webkit-border-radius: 7px 7px 0 0;
63    border-bottom: #CCC solid 1px;
64}
65/*合計(フォーム下)*/
66.total_area,
67.result_area {
68    padding: 10px;
69    text-align: right;
70    background: #F7F5F0;
71    border-top: #FFF solid 1px;
72    border-bottom: #A9ABAD solid 1px;
73}
74.formBox .btn_area_btm {
75    padding: 10px;
76    background: #F7F5F0;
77    border-top: #FFF solid 1px;
78    border-bottom: none;
79    border-radius: 0 0 7px 7px;
80    -moz-border-radius: 0 0 7px 7px;
81    -webkit-border-radius: 0 0 7px 7px;
82}
83.formBox div:first-child {
84    border-radius: 7px 7px 0 0;
85    -moz-border-radius: 7px 7px 0 0;
86    -webkit-border-radius: 7px 7px 0 0;
87}
88.formBox div:last-child {
89    border-radius: 0 0 7px 7px;
90    -moz-border-radius: 0 0 7px 7px;
91    -webkit-border-radius: 0 0 7px 7px;
92    border-bottom: none;
93}
94.form_area div:after {
95    content: ".";
96    display: block;
97    clear: both;
98    height: 0;
99    visibility: hidden;
100}
101
102/* -----------------------------------------------
103カートボックス
104----------------------------------------------- */
105
106/*カゴの中の商品*/
107.cartinarea {
108    padding: 10px;
109    border-bottom: #CCC solid 1px;
110}
111.cartitemBox {
112    padding: 10px 0;
113    border-bottom: #CCC solid 1px;
114    clear: both;
115}
116.cartinarea .cartitemBox:last-child {
117    border-bottom: none;
118}
119.cartinarea .photoL {
120    width: 80px;
121}
122.cartinarea .cartinContents {
123    width: 68%;
124    float: right;
125    display: block;
126    position: relative;
127}
128.cartinarea .cartinContents p {
129    line-height: 1.2;
130}
131.cartinContents div {
132    min-height: 50px;
133}
134/* -----------------------------------------------
135ふきだしボックス
136----------------------------------------------- */
137.bubbleBox {
138    width: 90%;
139    font-weight: bold;
140    margin: 10px auto 20px auto;
141    padding: 10px 15px;
142    position: relative;
143    background-color: #F6F6F6;
144    border: 1px solid #C5C4C0;
145    -moz-border-radius: 7px;
146    -webkit-border-radius: 7px;
147    -moz-box-shadow: inset 1px 1px 1px #FFF;
148    -webkit-box-shadow: inset 1px 1px 1px #FFF;
149    cursor: pointer;
150}
151.bubble_arrow_line {
152    width: 0;
153    height: 0;
154    border-color: #C5C4C0 transparent transparent transparent;
155    border-style: solid;
156    border-width: 10px;
157    position: absolute;
158    bottom: -21px;
159    left: 50%;
160}
161.bubble_arrow {
162    width: 0;
163    height: 0;
164    border-color: #F6F6F6 transparent transparent transparent;
165    border-style: solid;
166    border-width: 10px;
167    position: absolute;
168    bottom: -19px;
169    left: 50%;
170}
171.bubble_announce {
172    height: 2.5em;
173    background: url(../img/common/ico_arrowR.png)  right center no-repeat;
174    clear: both;
175    vertical-align: middle;
176    margin-bottom: 5px;
177}
178@media only screen and (-webkit-min-device-pixel-ratio: 2) {
179    .bubble_announce {
180        background: url(../img/common/ico_arrowR2.png) right center no-repeat;
181        -webkit-background-size: 10px 15px;
182        background-size: 10px 15px;
183    }
184}
185.bubbleBox p.fb {
186    line-height: 2.5em;
187}
188.deliv_announce p {
189    width: 80%;
190}
191.bubbleBox a:link,
192.bubbleBox a:visited {
193    color: #333;
194}
195/* -----------------------------------------------
196カートの中ページ
197----------------------------------------------- */
198.totalmoney_area {
199    font-size: 14px;
200    font-weight: bold;
201    padding: 10px;
202    border-bottom: #CCC solid 1px;
203}
204.point_announce {
205    font-size: 12px;
206    font-weight: bold;
207    margin-bottom: 5px;
208}
209.cartinContents .btn_delete {
210    padding: 2px;
211    right: 0;
212    float: right;
213    position: absolute;
214    top: 0;
215    cursor: pointer;
216}
217.cartinContents ul {
218    float: right;
219    clear: both;
220    line-height: 1.1;
221}
222.cartinContents ul li {
223    display: inline;
224    float: left;
225}
226.cartinContents ul li.quantity {
227    padding-left: 0.5em;
228    padding-top: 1em;
229    vertical-align: bottom;
230}
231.cartinContents ul li.quantity_btn {
232    padding-left: 0.5em;
233    padding-top: 0.8em;
234    vertical-align: bottom;
235}
236.cartinContents ul li.result {
237    padding-left: 1.5em;
238    padding-top: 1em;
239    vertical-align: bottom;
240}
241
242.cartinContents p {
243    margin-right: 25px;
244}
245
246.cartinContents p.btn_delete {
247    margin-right: 0;
248}
249
250/* -----------------------------------------------
251お届け先指定
252----------------------------------------------- */
253.deliv_check {
254    clear: both;
255}
256.deliv_check dt {
257    font-size: 14px;
258    font-weight: bold;
259    padding: 10px 10px 5px 10px;
260    background: #EEE;
261    border-top: #FFF solid 1px;
262    vertical-align: middle;
263    position: relative;
264    display: block;
265}
266.deliv_check dt p {
267    vertical-align: middle;
268}
269.deliv_check dd {
270    font-size: 12px;
271    padding: 10px;
272    border-bottom: #CCC solid 1px;
273    display: block;
274}
275.deliv_check dd.end {
276    border-bottom: none;
277}
278.deliv_check dd p {
279    display: inline;
280    float: left;
281}
282.deliv_check ul.edit {
283    float: right;
284    clear: right;
285    display: inline;
286    line-height: 1.1;
287    position: absolute;
288    right: 10px;
289    top: 12px;
290}
291.deliv_check dt.first {
292    border-top: none;
293    border-radius: 7px 7px 0 0;
294    -moz-border-radius: 7px 7px 0 0;
295    -webkit-border-radius: 7px 7px 0 0;
296}
297
298/* -----------------------------------------------
299お届け先指定(複数)
300----------------------------------------------- */
301.delivitemBox {
302    padding: 10px;
303    border-bottom: #CCC solid 1px;
304    clear: both;
305    position: relative;
306}
307.delivitemBox .photoL {
308    width: 80px;
309}
310.delivitemBox .delivContents {
311    width: 67%;
312    float: right;
313    display: block;
314    position: relative;
315}
316
317.delivContents p {
318    float: left;
319    line-height: 1.2;
320    margin-bottom: 5px;
321    margin-right: 40px;
322}
323.delivContents ul {
324    width: 3em;
325    float: right;
326    right: 7px;
327    position: absolute;
328}
329.delivContents ul li {
330    text-align: center;
331    clear: both;
332}
333
334.delivContents ul li:first-child {
335    line-height: 1.2;
336    vertical-align: bottom;
337}
338
339/* -----------------------------------------------
340お支払方法・お届け時間等の指定
341----------------------------------------------- */
342.pay_area ul {
343    padding: 10px;
344    margin-bottom: 10px;
345    font-weight: bold;
346}
347.pay_area ul li {
348    line-height: 1.5;
349    margin-bottom: 6px;
350}
351.pay_area .attention,
352.pay_area2 .attention {
353    margin-left: 10px;
354}
355.pay_area02 select:first-child {
356    margin-bottom: 12px;
357}
358p.check_point {
359    font-size: 12px;
360    padding-left: 1em;
361    font-weight: normal;
362}
363p.check_point .box_point {
364    margin-right: 0.5em;
365}
366.contact_area p {
367    line-height: 1.3;
368    font-weight: bold;
369    margin-bottom: 10px;
370}
371
372.contact_area .textarea {
373    width: 95%;
374}
375.non-select-msg {
376    margin: 20px 0;
377    border: none;
378}
379.time_select {
380    margin-top: 5px;
381    margin-bottom: 15px;
382}
383/* -----------------------------------------------
384ご注文内容のご確認
385----------------------------------------------- */
386.cartcartconfirmarea {
387    padding: 0 10px;
388    border-bottom: #CCC solid 1px;
389}
390.cartconfirmBox {
391    padding: 10px 0;
392    border-bottom: #CCC solid 1px;
393    clear: both;
394    position: relative;
395}
396.cartconfirmBox:last-child {
397    border-bottom: none;
398}
399.cartconfirmBox .photoL {
400    width: 80px;
401    float: left;
402}
403.cartconfirmContents {
404    width: 67%;
405    float: right;
406    display: block;
407    position: relative;
408    line-height: 1.3;
409}
410.cartconfirmContents div {
411    min-height: 62px;
412    line-height: 1.3;
413}
414.cartconfirmBox ul {
415    float: right;
416    clear: both;
417    line-height: 1.1;
418}
419.cartconfirmBox ul li {
420    display: inline;
421    font-weight: bold;
422}
423.cartconfirmBox ul li.result {
424    padding-left: 1em;
425    vertical-align: bottom;
426}
427.result_area {
428    font-size: 14px;
429    font-weight: bold;
430}
431.result_area dl {
432    text-align: right;
433    float: right;
434    display: block;
435}
436.result_area dt,
437.result_area dd {
438    text-align: right;
439}
440.result_area dt {
441    font-size: 11px;
442    clear: left;
443    float: right;
444}
445dl.point dl {
446    display: block;
447}
448.point_confifrm dl {
449    font-weight: bold;
450    border-bottom: #CCC solid 1px;
451}
452.point_confifrm dl:last-child {
453    border-bottom: none;
454}
455.point_confifrm dt {
456    width: 60%;
457    padding: 10px 0 10px 10px;
458    float: left;
459    display: block;
460}
461.point_confifrm dd {
462    width: 30%;
463    padding: 10px 10px 10px 0;
464    float: right;
465    text-align: right;
466}
467.deliv_confirm dt {
468    font-size: 14px;
469    font-weight: bold;
470    padding: 10px;
471    background: #EEE;
472    border-top: #FFF solid 1px;
473    border-radius: 7px 7px 0 0;
474    -moz-border-radius: 7px 7px 0 0;
475    -webkit-border-radius: 7px 7px 0 0;
476    line-height: 1.2;
477    vertical-align: middle;
478    position: relative;
479    display: block;
480}
481.deliv_confirm dd {
482    font-size: 12px;
483    padding: 10px;
484    border-bottom: #CCC solid 1px;
485    display: block;
486    line-height: 1.3;
487}
488
489.deliv_confirm dd:last-child {
490    border-bottom: none;
491}
492
493.deliv_confirm dd p.deliv_name {
494    margin-bottom: 3px;
495    font-size: 14px;
496    line-height: 1.3;
497}
498
499.date_confirm li {
500    padding-right: 1em;
501    display: inline;
502}
503/* -----------------------------------------------
504入力フォーム/確認画面共通
505----------------------------------------------- */
506dl.form_entry {
507    width: 100%;
508    margin: 0 0 15px 0;
509    padding: 0;
510    border-top: #999 solid 1px;
511    border-bottom: #999 solid 1px;
512    position: relative;
513}
514dl.form_entry dt {
515    font-weight: bold;
516    padding: 10px 12px 0;
517}
518dl.form_entry dd {
519    padding: 0 12px 10px;
520    border-bottom: #CCC solid 1px;
521    line-height: 1.2;
522}
523dl.form_entry dd:last-child {
524    border-bottom: 0;
525}
526dl.form_entry .selectdate {
527    margin-top: 12px;
528    padding: 5px 6px 5px 4px;
529    font-size: 12px;
530    vertical-align: bottom;
531}
532dl.form_entry li {
533    margin-bottom: 0.3em;
534    vertical-align: middle;
535}
536dl.form_entry .bg_head {
537    padding-bottom: 10px;
538}
539/* -----------------------------------------------
540完了画面
541----------------------------------------------- */
542.thankstext {
543    font-size: 16px;
544    color: #FF6633;
545    font-weight: bold;
546    padding: 10px;
547    margin-bottom: 10px;
548    line-height: 1.3;
549}
550#completetext p {
551    line-height: 1.3;
552}
553
554#completetext,
555.shopInformation {
556    font-size: 14px;
557    padding: 10px;
558    clear: both;
559}
560#completetext p,
561.shopInformation p {
562    margin-bottom: 0.5em;
563    line-height: 1.3;
564}
565/* -----------------------------------------------
566特定商/当サイトについて
567----------------------------------------------- */
568dl.form_info {
569    width: 100%;
570    margin: 10px 0 15px 0;
571    padding: 0;
572    border-bottom: #999 solid 1px;
573    position: relative;
574}
575dl.form_info dt {
576    font-weight: bold;
577    padding: 10px 10px 0;
578}
579dl.form_info dd {
580    padding: 0 10px 10px;
581    border-bottom: #CCC solid 1px;
582}
583dl.form_info dd:last-child {
584    border-bottom: 0;
585}
586
587#maps {
588    width: 88%!important;
589    margin: 10px auto!important;
590}
591/* -----------------------------------------------
592規約
593----------------------------------------------- */
594#kiyaku_text {
595    padding: 10px 20px;
596    border-bottom: #999 solid 1px;
597    border-top: #999 solid 1px;
598    overflow: hidden;
599    text-overflow: ellipsis;
600    line-height: 1.3;
601}
602/*-------------------------------------------------
603error
604----------------------------------------*/
605#errorBox {
606    text-align: left;
607    padding: 20px;
608}
609
610
Note: See TracBrowser for help on using the repository browser.