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

Revision 21106, 10.9 KB checked in by 468, 13 years ago (diff)

#1413 スマートフォン版スタイルシート修正対応

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