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

Revision 21164, 10.4 KB checked in by nanasess, 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.cartinContents p{
231margin-right:25px;
232}
233
234.cartinContents p.btn_delete{
235margin-right:0;
236}
237
238/* -----------------------------------------------
239お届け先指定
240----------------------------------------------- */
241.deliv_check{
242clear:both;
243}
244.deliv_check dt{
245font-size:14px;
246font-weight:bold;
247padding:10px 10px 5px 10px;
248background:#EEE;
249border-top:#FFF solid 1px;
250vertical-align:middle;
251position:relative;
252display:block;
253}
254.deliv_check dt p{
255vertical-align:middle;
256}
257.deliv_check dd{
258font-size:12px;
259padding:10px;
260border-bottom:#CCC solid 1px;
261display:block;
262}
263.deliv_check dd p{
264display:inline;
265float:left;
266}
267.deliv_check ul.edit{
268float:right;
269clear:right;
270display:inline;
271line-height:1.1;
272position:absolute;
273right:10px;
274top:12px;
275}
276.deliv_check dt.first{
277border-top:none;
278border-radius:7px 7px 0 0;
279-moz-border-radius:7px 7px 0 0;
280-webkit-border-radius:7px 7px 0 0;
281}
282
283/* -----------------------------------------------
284お届け先指定(複数)
285----------------------------------------------- */
286.delivitemBox{
287padding:10px;
288border-bottom:#CCC solid 1px;
289clear:both;
290position:relative;
291}
292.delivitemBox .photoL{
293width:80px;
294}
295.delivitemBox .delivContents{
296width:67%;
297float:right;
298display:block;
299position:relative;
300}
301
302.delivContents p{
303float:left;
304line-height:1.2;
305margin-bottom:5px;
306margin-right:40px;
307}
308.delivContents ul{
309width:3em;
310float:right;
311right:0;
312position:absolute;
313}
314.delivContents ul li{
315text-align:center;
316clear:both;
317}
318
319.delivContents ul li:first-child{
320line-height:1.2;
321vertical-align:bottom;
322
323}
324
325/* -----------------------------------------------
326お支払方法・お届け時間等の指定
327----------------------------------------------- */
328.pay_area ul{
329padding:10px;
330margin-bottom:10px;
331font-weight:bold;
332}
333.pay_area ul li{
334line-height:1.5;
335margin-bottom:6px;
336}
337.pay_area02 select:first-child{
338margin-bottom:12px;
339}
340p.check_point{
341font-size:12px;
342padding-left:1em;
343font-weight:normal;
344}
345p.check_point .box_point{
346margin-right:0.5em;
347}
348.contact_area p{
349line-height:1.3;
350font-weight:bold;
351margin-bottom:10px;
352}
353
354.contact_area .textarea{
355width:95%;
356}
357
358/* -----------------------------------------------
359ご注文内容のご確認
360----------------------------------------------- */
361.cartcartconfirmarea{
362padding:0 10px;
363border-bottom:#CCC solid 1px;
364}
365.cartconfirmBox{
366padding:10px 0;
367border-bottom:#CCC solid 1px;
368clear:both;
369position:relative;
370}
371.cartconfirmBox:last-child{
372border-bottom:none;
373}
374.cartconfirmBox .photoL{
375width:80px;
376float:left;
377}
378.cartconfirmContents{
379width:67%;
380float:right;
381display:block;
382position:relative;
383line-height:1.3;
384}
385.cartconfirmContents div{
386min-height:62px;
387line-height:1.3;
388}
389.cartconfirmBox ul{
390float:right;
391clear:both;
392line-height:1.1;
393}
394.cartconfirmBox ul li{
395display:inline;
396font-weight:bold;
397}
398.cartconfirmBox ul li.result{
399padding-left:1em;
400vertical-align:bottom;
401}
402.result_area{
403font-size:14px;
404font-weight:bold;
405}
406.result_area dl{
407text-align:right;
408float:right;
409display:block;
410}
411.result_area dt,.result_area dd{
412text-align:right;
413}
414.result_area dt{
415font-size:11px;
416clear:left;
417float:right;
418}
419dl.point dl{
420display:block;
421}
422.point_confifrm dl{
423font-weight:bold;
424border-bottom:#CCC solid 1px;
425}
426.point_confifrm dl:last-child{
427border-bottom:none;
428}
429.point_confifrm dt{
430width:60%;
431padding:10px 0 10px 10px;
432float:left;
433display:block;
434}
435.point_confifrm dd{
436width:30%;
437padding:10px 10px 10px 0;
438float:right;
439text-align:right;
440}
441.deliv_confirm dt{
442font-size:14px;
443font-weight:bold;
444padding:10px;
445background:#EEE;
446border-top:#FFF solid 1px;
447border-radius:7px 7px 0 0;
448-moz-border-radius:7px 7px 0 0;
449-webkit-border-radius:7px 7px 0 0;
450line-height:1.2;
451vertical-align:middle;
452position:relative;
453display:block;
454}
455.deliv_confirm dd{
456font-size:12px;
457padding:10px;
458border-bottom:#CCC solid 1px;
459display:block;
460line-height:1.3;
461}
462
463/*
464.deliv_confirm dd:last-child{
465border-bottom:none;
466}*/
467
468.deliv_confirm dd p.deliv_name{
469margin-bottom:3px;
470font-size:14px;
471line-height:1.3;
472}
473 
474.date_confirm li{
475padding-right:1em;
476display:inline;
477}
478/* -----------------------------------------------
479入力フォーム/確認画面共通
480----------------------------------------------- */
481dl.form_entry{
482width:100%;
483margin:0 0 15px 0;
484padding:0;
485border-top:#999 solid 1px;
486border-bottom:#999 solid 1px;
487position:relative;
488}
489dl.form_entry dt{
490font-weight:bold;
491padding:10px 12px 0;
492}
493dl.form_entry dd{
494padding:0 12px 10px;
495border-bottom:#CCC solid 1px;
496line-height:1.2;
497}
498dl.form_entry dd:last-child{
499border-bottom:0;
500}
501dl.form_entry .selectdate{
502margin-top:12px;
503padding:5px 6px 5px 4px;
504font-size:12px;
505vertical-align:bottom;
506}
507dl.form_entry li{
508margin-bottom:0.3em;
509vertical-align:middle;
510}
511dl.form_entry .bg_head{
512padding-bottom:10px;
513}
514/* -----------------------------------------------
515完了画面
516----------------------------------------------- */
517.thankstext{
518font-size:16px;
519color:#FF6633;
520font-weight:bold;
521padding:10px;
522margin-bottom:10px;
523line-height:1.3;
524}
525#completetext p{
526line-height:1.3;
527}
528
529#completetext,.shopInformation{
530font-size:14px;
531padding:10px;
532clear:both;
533}
534#completetext p,.shopInformation p{
535margin-bottom:0.5em;
536line-height:1.3;
537}
538/* -----------------------------------------------
539特定商/当サイトについて
540----------------------------------------------- */
541dl.form_info{
542width:100%;
543margin:10px 0 15px 0;
544padding:0;
545border-bottom:#999 solid 1px;
546position:relative;
547}
548dl.form_info dt{
549font-weight:bold;
550padding:10px 10px 0;
551}
552dl.form_info dd{
553padding:0 10px 10px;
554border-bottom:#CCC solid 1px;
555}
556dl.form_info dd:last-child{
557border-bottom:0;
558}
559
560#maps{
561width:88%!important;
562margin:10px auto!important;
563}
564/* -----------------------------------------------
565規約
566----------------------------------------------- */
567#kiyaku_text{
568padding:10px 20px;
569border-bottom:#999 solid 1px;
570border-top:#999 solid 1px;
571overflow: hidden;
572text-overflow: ellipsis;
573line-height:1.3;
574}
575/*-------------------------------------------------
576error
577----------------------------------------*/
578#errorBox {
579text-align:left;
580padding:20px;
581}
582
583
Note: See TracBrowser for help on using the repository browser.