Ignore:
Timestamp:
2011/07/31 15:25:24 (13 years ago)
Author:
Seasoft
Message:

#1294 (ソースを読みやすくする)

File:
1 edited

Legend:

Unmodified
Added
Removed

  • branches/version-2_11-dev/html/user_data/packages/sphone/css/common.css

    r21075 r21081  
    22/* =================================================================== 
    33CSS information 
    4 file name  :common.css 
    54style info :共通 
    65=================================================================== */ 
    … …  
    98----------------------------------------------- */ 
    109body { 
    11 background: #FFF; 
    12 font-family: Helvetica, san-serif; 
    13 line-height: 1.5; 
    14 font-size: 14px; 
    15 margin: 0; 
    16 padding: 0; 
    17 -webkit-user-select: none; 
    18 -webkit-text-size-adjust: none; 
    19 -webkit-touch-callout:none; 
    20 -webkit-tap-highlight-color: rgba(0,0,0,0.50); 
     10    background: #FFF; 
     11    font-family: Helvetica, san-serif; 
     12    line-height: 1.5; 
     13    font-size: 14px; 
     14    margin: 0; 
     15    padding: 0; 
     16    -webkit-user-select: none; 
     17    -webkit-text-size-adjust: none; 
     18    -webkit-touch-callout: none; 
     19    -webkit-tap-highlight-color: rgba(0,0,0,0.50); 
    2120} 
    2221/*----------------------------------------------- 
    2322リンク指定 
    2423----------------------------------------------- */ 
    25 a:link{ 
    26 color:#324E85; 
    27 text-decoration: none; 
     24a:link { 
     25    color: #324E85; 
     26    text-decoration: none; 
    2827} 
    2928a:visited { 
    30 color: #603E7D; 
    31 text-decoration: none; 
    32 } 
    33 a:hover{ 
    34 text-decoration:none; 
    35 cursor:pointer; 
     29    color: #603E7D; 
     30    text-decoration: none; 
     31} 
     32a:hover { 
     33    text-decoration: none; 
     34    cursor: pointer; 
    3635} 
    3736 
    3837/*右矢印リンクテキスト*/ 
    39 .arrowRtxt{ 
    40 display:inline; 
    41 clear:both; 
    42 margin:5px auto; 
    43 padding-right:15px; 
    44 background:url(../img/common/ico_arrowR.png) right center no-repeat; 
     38.arrowRtxt { 
     39    display: inline; 
     40    clear: both; 
     41    margin: 5px auto; 
     42    padding-right: 15px; 
     43    background: url(../img/common/ico_arrowR.png) right center no-repeat; 
    4544} 
    4645@media only screen and (-webkit-min-device-pixel-ratio: 2) { 
    47 .arrowRtxt { 
    48 background: url(../img/common/ico_arrowR2.png) right center no-repeat; 
    49 -webkit-background-size: 10px 15px; 
    50 background-size: 10px 15px; 
    51 } 
    52 } 
    53 div,li,p{ 
     46    .arrowRtxt { 
     47        background: url(../img/common/ico_arrowR2.png) right center no-repeat; 
     48        -webkit-background-size: 10px 15px; 
     49        background-size: 10px 15px; 
     50    } 
     51} 
     52div, li, p { 
    5453-webkit-tap-highlight-color: rgba(0,0,0,0.50);} 
    5554/*----------------------------------------------- 
    … …  
    5756----------------------------------------------- */ 
    5857.clearfix:after { 
    59 content: ".";   
    60 display: block;  
    61 clear: both; 
    62 height: 0; 
    63 visibility: hidden; 
    64 } 
    65 ul:after{ 
    66 content: ".";   
    67 display: block; 
    68 clear: both; 
    69 height: 0; 
    70 visibility: hidden; 
    71 } 
    72 dl:after{ 
    73 content: ".";   
    74 display: block; 
    75 clear: both; 
    76 height: 0; 
    77 visibility: hidden; 
     58    content: ".";   
     59    display: block;  
     60    clear: both; 
     61    height: 0; 
     62    visibility: hidden; 
     63} 
     64ul:after { 
     65    content: ".";   
     66    display: block; 
     67    clear: both; 
     68    height: 0; 
     69    visibility: hidden; 
     70} 
     71dl:after { 
     72    content: ".";   
     73    display: block; 
     74    clear: both; 
     75    height: 0; 
     76    visibility: hidden; 
    7877} 
    7978/*----------------------------------------------- 
    8079汎用 
    8180----------------------------------------------- */ 
    82 .photoL{ 
    83 float:left; 
    84 clear:left; 
    85 } 
    86 .photoR{ 
    87 float:right; 
    88 clear:right; 
    89 } 
    90 .clear{ 
    91 clear:both; 
    92 } 
    93 .inner{ 
    94 padding:10px; 
    95 } 
    96 .intro{ 
    97 padding:5px 10px 10px; 
    98 font-weight:bold; 
     81.photoL { 
     82    float: left; 
     83    clear: left; 
     84} 
     85.photoR { 
     86    float: right; 
     87    clear: right; 
     88} 
     89.clear { 
     90    clear: both; 
     91} 
     92.inner { 
     93    padding: 10px; 
     94} 
     95.intro { 
     96    padding: 5px 10px 10px; 
     97    font-weight: bold; 
    9998} 
    10099.hidden { 
    101 display: none; 
    102 } 
    103 .end{ 
    104 border-bottom:none!important; 
    105 } 
    106 .top{ 
    107 margin-bottom:1em!important; 
    108 } 
    109 .bg_head{ 
    110 background:#EEE; 
     100    display: none; 
     101} 
     102.end { 
     103    border-bottom: none!important; 
     104} 
     105.top { 
     106    margin-bottom: 1em!important; 
     107} 
     108.bg_head { 
     109    background: #EEE; 
    111110} 
    112111/*----------------------------------------------- 
    113112font 
    114113----------------------------------------------- */ 
    115 h2{ 
    116 font-size:20px; 
    117 } 
    118 h3,h4,h5 { 
    119 font-size: 100%; 
    120 font-weight:bold; 
    121 } 
    122 em{ 
    123 font-weight:bold; 
     114h2 { 
     115    font-size: 20px; 
     116} 
     117h3, h4, h5 { 
     118    font-size: 100%; 
     119    font-weight: bold; 
     120} 
     121em { 
     122    font-weight: bold; 
    124123} 
    125124.attention { 
    126 color: #CC0000; } 
     125    color: #CC0000; 
     126} 
    127127.mini { 
    128 font-size: 11px; 
    129 font-weight:normal; } 
    130 .fb{ 
    131 font-size:14px; 
    132 font-weight:bold; 
    133 } 
    134 .price{ 
    135 color:#CC0000; 
    136 font-weight:bold; 
    137 } 
    138 .attentionSt{ 
    139 color:#CC0000; 
    140 font-weight:bold; 
     128    font-size: 11px; 
     129    font-weight: normal; 
     130} 
     131.fb { 
     132    font-size: 14px; 
     133    font-weight: bold; 
     134} 
     135.price { 
     136    color: #CC0000; 
     137    font-weight: bold; 
     138} 
     139.attentionSt { 
     140    color: #CC0000; 
     141    font-weight: bold; 
    141142} 
    142143/*------------------------------------------------- 
    … …  
    144145----------------------------------------------- */ 
    145146.frame_outer { 
    146 overflow: hidden; 
    147 width: 100%; 
    148 background: #FFF; 
    149 } 
    150 #main-content{ 
     147    overflow: hidden; 
     148    width: 100%; 
     149    background: #FFF; 
     150} 
     151#main-content { 
    151152} 
    152153/*----------------------------------------------- 
    … …  
    154155----------------------------------------------- */ 
    155156h2.title { 
    156 color: #FFF; 
    157 font-size:20px; 
    158 font-weight:bold; 
    159 line-height:45px; 
    160 text-align:center; 
    161 text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
    162 margin: 0 0 15px 0; 
    163 padding:0 10px; 
    164 background:#494E57; 
    165 background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494e57 100%); 
    166 background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #6D7481),color-stop(0.8, #505765),color-stop(1, #494e57)); 
    167 border-top:#868D99 1px solid; 
    168 border-bottom:#C6C2C8 1px solid; 
    169 -webkit-box-shadow: 1px 5px 5px #CCC; 
    170 -moz-box-shadow: 1px 5px 5px #CCC; 
    171 vertical-align: middle; 
    172 white-space:nowrap; 
    173 overflow:hidden; 
    174 text-overflow: ellipsis; 
    175 clear:both; 
     157    color: #FFF; 
     158    font-size: 20px; 
     159    font-weight: bold; 
     160    line-height: 45px; 
     161    text-align: center; 
     162    text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
     163    margin: 0 0 15px 0; 
     164    padding: 0 10px; 
     165    background: #494E57; 
     166    background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494e57 100%); 
     167    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #6D7481),color-stop(0.8, #505765),color-stop(1, #494e57)); 
     168    border-top: #868D99 1px solid; 
     169    border-bottom: #C6C2C8 1px solid; 
     170    -webkit-box-shadow: 1px 5px 5px #CCC; 
     171    -moz-box-shadow: 1px 5px 5px #CCC; 
     172    vertical-align: middle; 
     173    white-space: nowrap; 
     174    overflow: hidden; 
     175    text-overflow: ellipsis; 
     176    clear: both; 
    176177} 
    177178/*ボタンで展開するタイトルバー*/ 
    178 .title_box{ 
    179 color: #FFF; 
    180 text-shadow: 0px -1px 1px rgba(0,0,0,0.3); 
    181 line-height:45px; 
    182 padding:0 10px; 
    183 margin: 0 0 15px 0; 
    184 background:#494e57; 
    185 background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494e57 100%); 
    186 background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #6D7481),color-stop(0.8, #505765),color-stop(1, #494e57)); 
    187 border-top: #74828B solid 1px; 
    188 border-bottom:#74828B solid 1px; 
    189 vertical-align: middle; 
    190 clear:both; 
    191 } 
    192 .title_box h2{ 
    193 font-size:20px; 
    194 text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
    195 width:85%; 
    196 float:left; 
    197 clear:left; 
    198 white-space:nowrap; 
    199 overflow:hidden; 
    200 text-overflow: ellipsis; 
    201 line-height:45px; 
    202 vertical-align:middle; 
    203 } 
    204 .title_box h3{ 
    205 width:85%; 
    206 float:left; 
    207 clear:left; 
    208 font-size:18px; 
    209 text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
    210 white-space:nowrap; 
    211 overflow:hidden; 
    212 text-overflow: ellipsis; 
    213 line-height:30px; 
    214 vertical-align:middle; 
     179.title_box { 
     180    color: #FFF; 
     181    text-shadow: 0px -1px 1px rgba(0,0,0,0.3); 
     182    line-height: 45px; 
     183    padding: 0 10px; 
     184    margin: 0 0 15px 0; 
     185    background: #494e57; 
     186    background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494e57 100%); 
     187    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #6D7481),color-stop(0.8, #505765),color-stop(1, #494e57)); 
     188    border-top: #74828B solid 1px; 
     189    border-bottom: #74828B solid 1px; 
     190    vertical-align: middle; 
     191    clear: both; 
     192} 
     193.title_box h2 { 
     194    font-size: 20px; 
     195    text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
     196    width: 85%; 
     197    float: left; 
     198    clear: left; 
     199    white-space: nowrap; 
     200    overflow: hidden; 
     201    text-overflow: ellipsis; 
     202    line-height: 45px; 
     203    vertical-align: middle; 
     204} 
     205.title_box h3 { 
     206    width: 85%; 
     207    float: left; 
     208    clear: left; 
     209    font-size: 18px; 
     210    text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
     211    white-space: nowrap; 
     212    overflow: hidden; 
     213    text-overflow: ellipsis; 
     214    line-height: 30px; 
     215    vertical-align: middle; 
    215216} 
    216217/*サブタイトル*/ 
    217 h3.subtitle{ 
    218 font-size:18px; 
    219 color: #FFF; 
    220 line-height:30px; 
    221 text-shadow: 0px -1px 1px rgba(0,0,0,0.3); 
    222 padding:0 10px; 
    223 margin: 0 0 10px 0; 
    224 background:#84949F; 
    225 background: -moz-linear-gradient(center top, #96A4AF 0%,#84949F 100%); 
    226 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96A4AF),color-stop(1, #84949F)); 
    227 border-top: #74828B solid 1px; 
    228 border-bottom:#74828B solid 1px;vertical-align: middle; 
    229 white-space:nowrap; 
    230 overflow:hidden; 
    231 text-overflow: ellipsis; 
    232 clear:both; 
    233 -webkit-box-shadow: 1px 0px 1px #FFF; 
    234 -moz-box-shadow: 1px 0px 1px #FFF; 
    235 position:relative; 
     218h3.subtitle { 
     219    font-size: 18px; 
     220    color: #FFF; 
     221    line-height: 30px; 
     222    text-shadow: 0px -1px 1px rgba(0,0,0,0.3); 
     223    padding: 0 10px; 
     224    margin: 0 0 10px 0; 
     225    background: #84949F; 
     226    background: -moz-linear-gradient(center top, #96A4AF 0%,#84949F 100%); 
     227    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96A4AF),color-stop(1, #84949F)); 
     228    border-top: #74828B solid 1px; 
     229    border-bottom: #74828B solid 1px;vertical-align: middle; 
     230    white-space: nowrap; 
     231    overflow: hidden; 
     232    text-overflow: ellipsis; 
     233    clear: both; 
     234    -webkit-box-shadow: 1px 0px 1px #FFF; 
     235    -moz-box-shadow: 1px 0px 1px #FFF; 
     236    position: relative; 
    236237} 
    237238/*ボタンで展開するサブタイトルバー*/ 
    238 .title_box_sub{ 
    239 color: #FFF; 
    240 line-height:30px; 
    241 padding:0 10px; 
    242 margin: 0 0 20px 0; 
    243 background:#84949F; 
    244 background: -moz-linear-gradient(center top, #96A4AF 0%,#84949F 100%); 
    245 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96A4AF),color-stop(1, #84949F)); 
    246 border-top: #74828B solid 1px; 
    247 border-bottom:#74828B solid 1px; 
    248 vertical-align: middle; 
    249 clear:both; 
    250 position:relative; 
    251 } 
    252 .title_box_sub h2,.title_box_sub h3{ 
    253 font-size:18px; 
    254 text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
    255 width:85%; 
    256 float:left; 
    257 clear:left; 
    258 white-space:nowrap; 
    259 overflow:hidden; 
    260 text-overflow: ellipsis; 
    261 line-height:30px; 
    262 vertical-align:middle; 
    263 } 
    264 .title_box_sub .b_expand{ 
    265 width:22px; 
    266 height:21px; 
    267 float:right; 
    268 clear:right; 
    269 position:absolute; 
    270 top:-6px; 
    271 right:15px; 
    272 z-index:2; 
    273 padding:2px; 
     239.title_box_sub { 
     240    color: #FFF; 
     241    line-height: 30px; 
     242    padding: 0 10px; 
     243    margin: 0 0 20px 0; 
     244    background: #84949F; 
     245    background: -moz-linear-gradient(center top, #96A4AF 0%,#84949F 100%); 
     246    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96A4AF),color-stop(1, #84949F)); 
     247    border-top: #74828B solid 1px; 
     248    border-bottom: #74828B solid 1px; 
     249    vertical-align: middle; 
     250    clear: both; 
     251    position: relative; 
     252} 
     253.title_box_sub h2, 
     254.title_box_sub h3 { 
     255    font-size: 18px; 
     256    text-shadow: 0px -1px 1px rgba(0,0,0,0.5); 
     257    width: 85%; 
     258    float: left; 
     259    clear: left; 
     260    white-space: nowrap; 
     261    overflow: hidden; 
     262    text-overflow: ellipsis; 
     263    line-height: 30px; 
     264    vertical-align: middle; 
     265} 
     266.title_box_sub .b_expand { 
     267    width: 22px; 
     268    height: 21px; 
     269    float: right; 
     270    clear: right; 
     271    position: absolute; 
     272    top: -6px; 
     273    right: 15px; 
     274    z-index: 2; 
     275    padding: 2px; 
    274276} 
    275277/*---------------------------------------------------- 
    … …  
    277279----------------------------------------------------*/ 
    278280input { 
    279 padding:6px; 
    280 margin:5px 0; 
    281 font-size: 14px; 
    282 } 
    283 input[type="radio"]{ 
    284 vertical-align:top; 
    285 padding:5px; 
    286 margin-right:0.5em; 
    287 } 
    288 .text, .textarea, .dropdown{ 
    289 color: #999; 
    290 padding: 0.5em; 
    291 border:#4C4C4C solid 1px; 
    292 background: #FFF; 
    293 border-radius: 5px; 
    294 -webkit-border-radius: 5px; 
    295 -moz-border-radius: 5px; 
    296 } 
    297 .textarea{ 
    298 width:100%; 
    299 margin:0 0 10px -8px; 
    300 min-height:60px; 
    301 } 
    302 .cartin_quantity,.box_point{ 
    303 width:2em; 
    304 } 
    305 .boxLong{ 
    306 width:96%; 
    307 } 
    308 .boxMedium{ 
    309 width:35%; 
     281    padding: 6px; 
     282    margin: 5px 0; 
     283    font-size: 14px; 
     284} 
     285input[type="radio"] { 
     286    vertical-align: top; 
     287    padding: 5px; 
     288    margin-right: 0.5em; 
     289} 
     290.text, .textarea, .dropdown { 
     291    color: #999; 
     292    padding: 0.5em; 
     293    border: #4C4C4C solid 1px; 
     294    background: #FFF; 
     295    border-radius: 5px; 
     296    -webkit-border-radius: 5px; 
     297    -moz-border-radius: 5px; 
     298} 
     299.textarea { 
     300    width: 100%; 
     301    margin: 0 0 10px -8px; 
     302    min-height: 60px; 
     303} 
     304.cartin_quantity, .box_point { 
     305    width: 2em; 
     306} 
     307.boxLong { 
     308    width: 96%; 
     309} 
     310.boxMedium { 
     311    width: 35%; 
    310312} 
    311313.boxShort { 
    312 width: 20%; 
    313 } 
    314 .boxHarf{ 
    315 width:41%; 
     314    width: 20%; 
     315} 
     316.boxHarf { 
     317    width: 41%; 
    316318} 
    317319/*---------------------------------------------------- 
    … …  
    322324------------------------------------------------ */ 
    323325header { 
    324 background: #FFF; 
    325 margin: 0 auto; 
    326 padding:10px 5px; 
    327 clear:both; 
    328 } 
    329 #site_name{ 
    330 width:47%; 
    331 float:left; 
    332 clear:left; 
    333 position:relative; 
     326    background: #FFF; 
     327    margin: 0 auto; 
     328    padding: 10px 5px; 
     329    clear: both; 
     330} 
     331#site_name { 
     332    width: 47%; 
     333    float: left; 
     334    clear: left; 
     335    position: relative; 
    334336} 
    335337header h1 { 
    336 margin-top:-8px; 
     338    margin-top: -8px; 
    337339} 
    338340 
    339341/* ヘッダーナビ 
    340342------------------------------------------------ */ 
    341 .header_utility{ 
    342 width:50%; 
    343 padding-left:5px; 
    344 float:right; 
    345 display:inline; 
    346 } 
    347 .header_navi{ 
    348 font-size:11px; 
    349 padding-top:5px; 
    350 float:right; 
    351 display:inline; 
    352 text-align:right; 
    353 line-height:1.2; 
    354 } 
    355 .header_navi ul{ 
    356 display:inline; 
    357 float:right; 
    358 } 
    359 .header_navi li{ 
    360 float:left; 
    361 display:block; 
    362 margin:0; 
    363 padding:8px 5px; 
    364 text-align:center; 
    365 border:#A9ABAD solid 1px; 
    366 border-radius: 5px; 
    367 -moz-border-radius: 5px; 
    368 -webkit-border-radius: 5px; 
    369 background:#FDFDfD; 
    370 background: -moz-linear-gradient(center top, #FDFDFD 0%,#D7DDE3 100%); 
    371 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #D7DDE3)); 
    372 } 
    373 .header_navi li a{ 
    374 text-decoration:none; 
    375 } 
    376 .header_navi li:first-child{ 
    377 margin-right:1em; 
    378 } 
    379 .popup_mypage{ 
    380 font-size:small; 
    381 width: 150px; 
    382 padding:10px; 
    383 display: none; 
    384 position: absolute; 
    385 top: 55px; 
    386 z-index: 1; 
    387 background:#FFF; 
    388 background: -moz-linear-gradient(center top, #FDFDFD 0%,#E5E5E5 100%); 
    389 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #E5E5E5)); 
    390 border:#CCC solid 1px; 
    391 border-radius: 5px; 
    392 -webkit-border-radius: 5px; 
    393 -moz-border-radius: 5px; 
    394 } 
    395 .popup_cart{ 
    396 font-size:small; 
    397 width: 180px; 
    398 padding:10px; 
    399 display: none; 
    400 position: absolute; 
    401 top: 55px; 
    402 z-index: 1; 
    403 background:#FFF; 
    404 background: -moz-linear-gradient(center top, #FDFDFD 0%,#E5E5E5 100%); 
    405 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #E5E5E5)); 
    406 border:#CCC solid 1px; 
    407 border-radius: 5px; 
    408 -webkit-border-radius: 5px; 
    409 -moz-border-radius: 5px; 
    410 } 
    411 .popup_mypage a,.popup_cart a{ 
    412 text-decoration:underline; 
    413 } 
    414 .popup_mypage h2,.popup_cart h2{ 
    415 font-size:1.2em; 
    416 } 
    417 .quentity,.money{ 
    418 font-weight:bold; 
    419 } 
    420 .popup_cart hr.dashed:last-child{ 
    421 display:none; 
    422 } 
    423 hr.dashed{ 
    424 display:block; 
    425 height:1px; 
    426 border:0;    
    427 border-top:#CCC dashed 1px; 
    428 margin:0.2em 0; 
    429 padding:0;} 
    430 .free_money{ 
    431 } 
    432 .dl_item{ 
    433 margin-top:5px; 
     343.header_utility { 
     344    width: 50%; 
     345    padding-left: 5px; 
     346    float: right; 
     347    display: inline; 
     348} 
     349.header_navi { 
     350    font-size: 11px; 
     351    padding-top: 5px; 
     352    float: right; 
     353    display: inline; 
     354    text-align: right; 
     355    line-height: 1.2; 
     356} 
     357.header_navi ul { 
     358    display: inline; 
     359    float: right; 
     360} 
     361.header_navi li { 
     362    float: left; 
     363    display: block; 
     364    margin: 0; 
     365    padding: 8px 5px; 
     366    text-align: center; 
     367    border: #A9ABAD solid 1px; 
     368    border-radius: 5px; 
     369    -moz-border-radius: 5px; 
     370    -webkit-border-radius: 5px; 
     371    background: #FDFDfD; 
     372    background: -moz-linear-gradient(center top, #FDFDFD 0%,#D7DDE3 100%); 
     373    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #D7DDE3)); 
     374} 
     375.header_navi li a { 
     376    text-decoration: none; 
     377} 
     378.header_navi li:first-child { 
     379    margin-right: 1em; 
     380} 
     381.popup_mypage { 
     382    font-size: small; 
     383    width: 150px; 
     384    padding: 10px; 
     385    display: none; 
     386    position: absolute; 
     387    top: 55px; 
     388    z-index: 1; 
     389    background: #FFF; 
     390    background: -moz-linear-gradient(center top, #FDFDFD 0%,#E5E5E5 100%); 
     391    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #E5E5E5)); 
     392    border: #CCC solid 1px; 
     393    border-radius: 5px; 
     394    -webkit-border-radius: 5px; 
     395    -moz-border-radius: 5px; 
     396} 
     397.popup_cart { 
     398    font-size: small; 
     399    width: 180px; 
     400    padding: 10px; 
     401    display: none; 
     402    position: absolute; 
     403    top: 55px; 
     404    z-index: 1; 
     405    background: #FFF; 
     406    background: -moz-linear-gradient(center top, #FDFDFD 0%,#E5E5E5 100%); 
     407    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #E5E5E5)); 
     408    border: #CCC solid 1px; 
     409    border-radius: 5px; 
     410    -webkit-border-radius: 5px; 
     411    -moz-border-radius: 5px; 
     412} 
     413.popup_mypage a, 
     414.popup_cart a { 
     415    text-decoration: underline; 
     416} 
     417.popup_mypage h2, 
     418.popup_cart h2 { 
     419    font-size: 1.2em; 
     420} 
     421.quentity, .money { 
     422    font-weight: bold; 
     423} 
     424.popup_cart hr.dashed:last-child { 
     425    display: none; 
     426} 
     427hr.dashed { 
     428    display: block; 
     429    height: 1px; 
     430    border:0;    
     431    border-top: #CCC dashed 1px; 
     432    margin: 0.2em 0; 
     433    padding: 0; 
     434} 
     435.free_money { 
     436} 
     437.dl_item { 
     438    margin-top: 5px; 
    434439} 
    435440 
    436441/*index menu/トップページヘッダー3列ボタン*/ 
    437 .top_menu{ 
    438 width:100%; 
    439 margin-bottom:10px; 
    440 -webkit-box-shadow: 1px 5px 5px #ccc; 
    441 -moz-box-shadow: 1px 5px 5px #ccc; 
    442 background:#494E57; 
    443 background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494E57 100%); 
    444 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6D7481),color-stop(0.8, #505765),color-stop(1, #494E57)); 
    445 } 
    446 .top_menu ul{ 
    447 width:auto; 
    448 margin:0 auto; 
    449 clear:both; 
    450 } 
    451 .top_menu ul li{ 
    452 width:33%; 
    453 float:left; 
    454 text-align:center; 
    455 border-left:#747B83 solid 1px; 
    456 border-right:#3D3D3D solid 1px; 
    457 border-bottom:#141517 solid 1px; 
    458 border-top:#A1A7AF solid 2px; 
    459 } 
    460 .top_menu ul li img{ 
    461 margin:0 auto; 
    462 display:block; 
    463 clear:both; 
    464 } 
    465 .top_menu ul li a:link,.top_menu ul li a:visited{ 
    466 color:#FFF; 
    467 text-shadow: 0px 1px 1px rgba(0,0,0,1); 
    468 padding:9px 0 8px 0; 
    469 display:block; 
    470 background:#494E57; 
    471 background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494E57 100%); 
    472 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6D7481),color-stop(0.8, #505765),color-stop(1, #494E57)); 
    473 -webkit-transition:background-color 0.5s ease-in; 
    474 -moz-transition:background-color 0.5s ease-in; 
    475 } 
    476 .top_menu ul li a:hover{ 
    477 color:#FFF; 
    478 text-shadow: 0px 1px 1px rgba(0,0,0,0.5); 
    479 background:#5393C5; 
    480 background: -moz-linear-gradient(center top, #5393C5 10%,#80B6E2 100%); 
    481 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5393C5),color-stop(1, #80B6E2)); 
    482 text-decoration:none; 
    483 } 
    484 .top_menu li:first-child{ 
    485 border-left:none; 
    486 } 
    487 .top_menu li:last-child{ 
    488 border-right:none; 
     442.top_menu { 
     443    width: 100%; 
     444    margin-bottom: 10px; 
     445    -webkit-box-shadow: 1px 5px 5px #ccc; 
     446    -moz-box-shadow: 1px 5px 5px #ccc; 
     447    background: #494E57; 
     448    background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494E57 100%); 
     449    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6D7481),color-stop(0.8, #505765),color-stop(1, #494E57)); 
     450} 
     451.top_menu ul { 
     452    width: auto; 
     453    margin: 0 auto; 
     454    clear: both; 
     455} 
     456.top_menu ul li { 
     457    width: 33%; 
     458    float: left; 
     459    text-align: center; 
     460    border-left: #747B83 solid 1px; 
     461    border-right: #3D3D3D solid 1px; 
     462    border-bottom: #141517 solid 1px; 
     463    border-top: #A1A7AF solid 2px; 
     464} 
     465.top_menu ul li img { 
     466    margin: 0 auto; 
     467    display: block; 
     468    clear: both; 
     469} 
     470.top_menu ul li a:link, 
     471.top_menu ul li a:visited { 
     472    color: #FFF; 
     473    text-shadow: 0px 1px 1px rgba(0,0,0,1); 
     474    padding: 9px 0 8px 0; 
     475    display: block; 
     476    background: #494E57; 
     477    background: -moz-linear-gradient(center top, #6D7481 10%,#505765 80%,#494E57 100%); 
     478    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6D7481),color-stop(0.8, #505765),color-stop(1, #494E57)); 
     479    -webkit-transition: background-color 0.5s ease-in; 
     480    -moz-transition: background-color 0.5s ease-in; 
     481} 
     482.top_menu ul li a:hover { 
     483    color: #FFF; 
     484    text-shadow: 0px 1px 1px rgba(0,0,0,0.5); 
     485    background: #5393C5; 
     486    background: -moz-linear-gradient(center top, #5393C5 10%,#80B6E2 100%); 
     487    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5393C5),color-stop(1, #80B6E2)); 
     488    text-decoration: none; 
     489} 
     490.top_menu li:first-child { 
     491    border-left: none; 
     492} 
     493.top_menu li:last-child { 
     494    border-right: none; 
    489495} 
    490496/*------------------------------------------------- 
    … …  
    492498----------------------------------------------- */ 
    493499footer.global_footer { 
    494 padding:0 0 10px 0; 
    495 background: #E6E6E6; 
    496 text-align:center; 
    497 } 
    498 .footer_utility{ 
    499 background: #E6E6E6; 
     500    padding: 0 0 10px 0; 
     501    background: #E6E6E6; 
     502    text-align: center; 
     503} 
     504.footer_utility { 
     505    background: #E6E6E6; 
    500506} 
    501507/*フッター4列ボタン*/ 
    502508.footer_navi { 
    503 width:100%; 
    504 display:block; 
    505 clear:both; 
    506 padding:0.5em 0; 
    507 -webkit-box-shadow: 1px 1px 1px #FFF; 
    508 -moz-box-shadow: 1px 1px 1px #FFF; 
    509 background:#272a2b; 
    510 background: -moz-linear-gradient(center top, #808080 0%,#272a2b 100%); 
    511 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #808080),color-stop(1, #272a2b)); 
    512 }  
    513 .footer_navi ul{ 
    514 width:100%; 
    515 display:block; 
     509    width: 100%; 
     510    display: block; 
     511    clear: both; 
     512    padding: 0.5em 0; 
     513    -webkit-box-shadow: 1px 1px 1px #FFF; 
     514    -moz-box-shadow: 1px 1px 1px #FFF; 
     515    background: #272a2b; 
     516    background: -moz-linear-gradient(center top, #808080 0%,#272a2b 100%); 
     517    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #808080),color-stop(1, #272a2b)); 
     518} 
     519.footer_navi ul { 
     520    width: 100%; 
     521    display: block; 
    516522} 
    517523.footer_navi:after { 
    518 content: ".";  
    519 display: block; 
    520 clear: both; 
    521 height:0; 
    522 } 
    523 .footer_navi li{ 
    524 width:23%; 
    525 height:49px; 
    526 display:block; 
    527 margin:0 1%; 
    528 padding:0; 
    529 float:left; 
    530 background:#202223; 
    531 background: -moz-linear-gradient(center top, #282A2A 0%,#202223 100%); 
    532 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #282A2A),color-stop(1, #202223)); 
    533 text-align:center; 
    534 color:#FFF; 
    535 font-size:10px; 
    536 border-radius: 8px; 
    537 -webkit-border-radius: 8px; 
    538 -moz-border-radius: 8px; 
    539 -webkit-box-shadow: 3px 3px 3px 3px rgba(0,0,0,0.2) inset,-3px -3px 3px 3px rgba(0,0,0,0.2) inset; 
    540 -moz-box-shadow: 3px 3px 3px 3px rgba(0,0,0,0.2) inset,-3px -3px 3px 3px rgba(0,0,0,0.2) inset; 
    541 position:relative; 
    542 } 
    543 .footer_status_area{ 
    544 margin:0; 
    545 padding:20px 10px 10px; 
    546 text-align:center; 
    547 background: #E6E6E6; 
    548 } 
    549 .footer_status_area p:last-child{ 
    550 margin:10px auto; 
    551 } 
    552 .guide_area{ 
    553 clear:both; 
    554 margin:0; 
    555 padding:10px 0 0 0; 
    556 text-align:center; 
    557 border-top:#999 solid 1px; 
    558 } 
    559 .guide_area p{ 
    560 font-size:14px; 
    561 font-weight:bold; 
    562 line-height:2.4; 
    563 } 
    564 .guide_area a{ 
    565 padding:0.5em 0.3em; 
    566 margin:0.5em 0.1em; 
     524    content: ".";  
     525    display: block; 
     526    clear: both; 
     527    height: 0; 
     528} 
     529.footer_navi li { 
     530    width: 23%; 
     531    height: 49px; 
     532    display: block; 
     533    margin: 0 1%; 
     534    padding: 0; 
     535    float: left; 
     536    background: #202223; 
     537    background: -moz-linear-gradient(center top, #282A2A 0%,#202223 100%); 
     538    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #282A2A),color-stop(1, #202223)); 
     539    text-align: center; 
     540    color: #FFF; 
     541    font-size: 10px; 
     542    border-radius: 8px; 
     543    -webkit-border-radius: 8px; 
     544    -moz-border-radius: 8px; 
     545    -webkit-box-shadow: 3px 3px 3px 3px rgba(0,0,0,0.2) inset,-3px -3px 3px 3px rgba(0,0,0,0.2) inset; 
     546    -moz-box-shadow: 3px 3px 3px 3px rgba(0,0,0,0.2) inset,-3px -3px 3px 3px rgba(0,0,0,0.2) inset; 
     547    position: relative; 
     548} 
     549.footer_status_area { 
     550    margin: 0; 
     551    padding: 20px 10px 10px; 
     552    text-align: center; 
     553    background: #E6E6E6; 
     554} 
     555.footer_status_area p:last-child { 
     556    margin: 10px auto; 
     557} 
     558.guide_area { 
     559    clear: both; 
     560    margin: 0; 
     561    padding: 10px 0 0 0; 
     562    text-align: center; 
     563    border-top: #999 solid 1px; 
     564} 
     565.guide_area p { 
     566    font-size: 14px; 
     567    font-weight: bold; 
     568    line-height: 2.4; 
     569} 
     570.guide_area a { 
     571    padding: 0.5em 0.3em; 
     572    margin: 0.5em 0.1em; 
    567573} 
    568574@media only screen and (-webkit-min-device-pixel-ratio: 2) { 
    569 .guide_area p{ 
    570 font-size:12px; 
    571 } 
     575    .guide_area p { 
     576        font-size: 12px; 
     577    } 
    572578} 
    573579footer.global_footer p.copyright { 
    574 margin: 0; 
    575 text-align: center; 
    576 padding:10px 0; 
     580    margin: 0; 
     581    text-align: center; 
     582    padding: 10px 0; 
    577583} 
    578584/*------------------------------------------------- 
    … …  
    580586----------------------------------------------- */ 
    581587#search_area { 
    582 padding: 10px; 
    583 background: #E7E8E9; 
    584 clear:both; 
    585 text-align: center; 
     588    padding: 10px; 
     589    background: #E7E8E9; 
     590    clear: both; 
     591    text-align: center; 
    586592} 
    587593/*jqm追記*/ 
    588 #search_area .ui-input-search{ 
    589 border-radius: 20px; 
    590 -webkit-border-radius: 20px; 
    591 -moz-border-radius: 20px; 
    592 } 
     594#search_area .ui-input-search { 
     595    border-radius: 20px; 
     596    -webkit-border-radius: 20px; 
     597    -moz-border-radius: 20px; 
     598} 
Note: See TracChangeset for help on using the changeset viewer.