css/base.css

   1 @charset "utf-8";\r
   2 \r
   3 /** 基本設定 **/\r
   4 body {\r
   5         margin: 0px;\r
   6         padding: 0px;\r
   7         background-color: #ffffff;\r
   8         color: #1E4080;\r
   9         font-size: 12px;\r
  10         font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;\r
  11         line-height: 18px;\r
  12         -webkit-text-size-adjust: 100%;\r
  13 }\r
  14 \r
  15 a img {\r
  16         border-style: none;\r
  17 }\r
  18 \r
  19 /** メニュー部分 **/\r
  20 div.menu_wrapper {\r
  21         display: table;\r
  22         width: 100%;\r
  23         background-color: #1E4080;\r
  24         border-bottom: 1px solid #8888BE;\r
  25         padding-bottom: 5px;\r
  26         margin-bottom: 10px;\r
  27         vertical-align: bottom;\r
  28         padding-top: 5px;\r
  29 }\r
  30 div.menu {\r
  31         width: 930px;\r
  32         margin-left: auto;\r
  33         margin-right: auto;\r
  34         display: table;\r
  35 }\r
  36 ul.menu {\r
  37         display: block;\r
  38         margin: 0px 0px 0px 0px;\r
  39         padding: 0px 0px 0px 0px;\r
  40         list-style: none;\r
  41 }\r
  42 li.menu_left {\r
  43         display: inline;\r
  44         float: left;\r
  45         width: 138px;\r
  46         border: 1px solid #8888BE;\r
  47         text-align: center;\r
  48         background-color: #ffffff;\r
  49         padding: 10px 18px 10px 18px;\r
  50         margin-right: 5px;\r
  51         margin-left: 5px;\r
  52         margin-top: 3px;\r
  53         margin-bottom: 3px;\r
  54         text-decoration: none;\r
  55         border-radius: 8px;\r
  56         behavior: url("./css/PIE.htc");\r
  57 }\r
  58 a.menu {\r
  59         color: #1E4080;\r
  60         text-decoration: none;\r
  61 }\r
  62 a:hover.menu {\r
  63         color: #67A7CC;\r
  64         text-decoration: none;\r
  65 }\r
  66 \r
  67 /** 見出し設定 **/\r
  68 h1 {\r
  69         font-weight: bold;\r
  70         font-size: 20px;\r
  71         line-height: 26px;\r
  72         margin-top: 0px;\r
  73         margin-bottom: 20px;\r
  74         border-bottom: 1px solid #A5A5BE;\r
  75         text-align: left;\r
  76         padding-top: 14px;\r
  77         padding-bottom: 10px;\r
  78         padding-left: 10px;\r
  79 }\r
  80 h2 {\r
  81         font-weight: normal;\r
  82         font-size: 16px;\r
  83         line-height: 22px;\r
  84         margin-top: 0px;\r
  85         margin-bottom: 16px;\r
  86 }\r
  87 \r
  88 /** その他強調 **/\r
  89 .shadow {\r
  90         box-shadow: 2px 4px 10px #666666;\r
  91         behavior: url("./css/PIE.htc");\r
  92 }\r
  93 .red {\r
  94         color: #ff0000;\r
  95 }\r
  96 .border_red {\r
  97         border-color: #ff0000;\r
  98 }\r
  99 \r
 100 /** コンテンツ用DIV **/\r
 101 div.contents {\r
 102         display: table;\r
 103         width: 920px;\r
 104         margin-left: auto;\r
 105         margin-right: auto;\r
 106         margin-bottom: 20px;\r
 107         border: 1px solid #A5A5BE;\r
 108         box-shadow: 2px 4px 10px #cacaca;\r
 109         background-color: #ffffff;\r
 110         border-radius: 10px;\r
 111         behavior: url("./css/PIE.htc");\r
 112 }\r
 113 div.middlemargin_bottom {\r
 114         margin-bottom: 20px;\r
 115 }\r
 116 div.nomargin_bottom {\r
 117         margin-bottom: 0px;\r
 118 }\r
 119 div.section_header {\r
 120         display: table;\r
 121         width: 920px;\r
 122         height: 20px;\r
 123         background-color: #000000;\r
 124         background-repeat: no-repeat;\r
 125         margin-left: auto;\r
 126         margin-right: auto;\r
 127         margin-bottom: 30px;\r
 128 }\r
 129 div.wrapper {\r
 130         width: 100%;\r
 131         padding-top: 20px;\r
 132         padding-bottom: 20px;\r
 133         margin-bottom: 40px;\r
 134 }\r
 135 div.left {\r
 136         text-align: left;\r
 137 }\r
 138 div.center {\r
 139         text-align: center;\r
 140 }\r
 141 div.right {\r
 142         text-align: right;\r
 143 }\r
 144 div.padding_normal {\r
 145         padding: 5px 3px;\r
 146 }\r
 147 \r
 148 /** コンテンツ（小） **/\r
 149 div.small_contents {\r
 150         display: table;\r
 151         width: 600px;\r
 152         margin-left: auto;\r
 153         margin-right: auto;\r
 154         margin-bottom: 40px;\r
 155         border: 1px solid #A5A5BE;\r
 156         background-color: #ffffff;\r
 157         box-shadow: 2px 4px 10px #cacaca;\r
 158         border-radius: 10px;\r
 159         behavior: url("./css/PIE.htc");\r
 160 }\r
 161 \r
 162 /** 選択中ファイル用 **/\r
 163 div.select_file {\r
 164         display: table;\r
 165         width: 920px;\r
 166         margin-left: auto;\r
 167         margin-right: auto;\r
 168         margin-bottom: 20px;\r
 169         border: 1px solid #A5A5BE;\r
 170         box-shadow: 2px 4px 5px #cacaca;\r
 171         background-color: #ffffff;\r
 172         border-radius: 10px;\r
 173         behavior: url("./css/PIE.htc");\r
 174         padding: 5px 0px;\r
 175 }\r
 176 \r
 177 /** インフォ・エラー用 **/\r
 178 div.info {\r
 179         margin-left: auto;\r
 180         margin-right: auto;\r
 181         font-weight: bold;\r
 182 }\r
 183 div.info_contents {\r
 184         color: #008822;\r
 185         border: 1px solid #008822;\r
 186 }\r
 187 div.info_contens_inner {\r
 188         margin-left: 20px;\r
 189 }\r
 190 h1.info {\r
 191         color: #008822;\r
 192         border-bottom: 1px solid #008822;\r
 193 }\r
 194 div.error {\r
 195         margin-left: auto;\r
 196         margin-right: auto;\r
 197         font-weight: bold;\r
 198         color: #ff0000;\r
 199 }\r
 200 div.error_contents {\r
 201         color: #ff0000;\r
 202         border: 1px solid #ff0000;\r
 203 }\r
 204 div.error_contens_inner {\r
 205         margin-left: 20px;\r
 206 }\r
 207 h1.error {\r
 208         color: #ff0000;\r
 209         border-bottom: 1px solid #ff0000;\r
 210 }\r
 211 \r
 212 /** フッタ用部位 **/\r
 213 div.bottom_area {\r
 214         display: table;\r
 215         width: 920px;\r
 216         margin-left: auto;\r
 217         margin-right: auto;\r
 218         text-align: center;\r
 219         padding-bottom: 40px;\r
 220 }\r
 221 \r
 222 /** デフォルトテーブル構成 **/\r
 223 table {\r
 224         margin-left: auto;\r
 225         margin-right: auto;\r
 226 }\r
 227 \r
 228 th {\r
 229         border: 1px solid #1E4080;\r
 230         background-color: #1E4080;\r
 231         color: #ffffff;\r
 232 }\r
 233 \r
 234 td {\r
 235         border: 1px solid #1E4080;\r
 236 }\r
 237 \r
 238 td.small {\r
 239         width: 350px;\r
 240 }\r
 241 \r
 242 th.small {\r
 243         width: 200px;\r
 244 }\r
 245 \r
 246 td.normal {\r
 247         width: 580px;\r
 248 }\r
 249 \r
 250 th.normal {\r
 251         width: 300px;\r
 252 }\r
 253 \r
 254 td.large {\r
 255         width: 680px;\r
 256 }\r
 257 \r
 258 th.large {\r
 259         width: 530px;\r
 260 }\r
 261 \r
 262 td.maximum {\r
 263         width: 880px;\r
 264 }\r
 265 \r
 266 th.maximum {\r
 267         width: 880px;\r
 268 }\r
 269 \r
 270 td.padding_normal {\r
 271         padding: 5px 3px;\r
 272 }\r
 273 \r
 274 th.padding_normal {\r
 275         padding: 5px 3px;\r
 276 }\r
 277 \r
 278 td.default_word_break {\r
 279         word-break: break-all;\r
 280 }\r
 281 \r
 282 td.hr {\r
 283         height: 1px;\r
 284         background-color: #ffffff;\r
 285         border: none;\r
 286 }\r
 287 \r
 288 /** ファイルリスト一覧 **/\r
 289 table.filelist {\r
 290         width: 96%;\r
 291 }\r
 292 \r
 293 th.filelist {\r
 294         text-align: center;\r
 295         vertical-align: middle;\r
 296         color: #ffffff;\r
 297         border: 1px solid #1E4080;\r
 298         background-color: #1E4080;\r
 299         padding: 4px;\r
 300 }\r
 301 \r
 302 td.filelist {\r
 303         text-align: center;\r
 304         vertical-align: middle;\r
 305         border: 1px solid #1E4080;\r
 306         padding: 4px;\r
 307 }\r
 308 \r
 309 div.filelist {\r
 310         width: 95%;\r
 311         margin-left: auto;\r
 312         margin-right: auto;\r
 313         padding: 5px;\r
 314         border: 1px solid #A5A5BE;\r
 315         box-shadow: 2px 4px 10px #cacaca;\r
 316         background-color: #ffffff;\r
 317         border-radius: 3px;\r
 318         behavior: url("./css/PIE.htc");\r
 319 }\r
 320 \r
 321 /** 共通 **/\r
 322 .left {\r
 323         text-align: left;\r
 324 }\r
 325 \r
 326 .center {\r
 327         text-align: center;\r
 328 }\r
 329 \r
 330 .right {\r
 331         text-align: right;\r
 332 }\r
 333 \r
 334 .top {\r
 335         vertical-align: top;\r
 336 }\r
 337 \r
 338 .middle {\r
 339         vertical-align: middle;\r
 340 }\r
 341 \r
 342 .bottom {\r
 343         vertical-align: bottom;\r
 344 }\r
 345 \r
 346 /** インプット部品 **/\r
 347 input.border {\r
 348         border: 1px solid #A0A0FF;\r
 349 }\r
 350 input.max_width {\r
 351         width: 98%;\r
 352 }\r
 353 input.middle_width {\r
 354         width: 250px;\r
 355 }\r
 356 textarea.border {\r
 357         border: 1px solid #A0A0FF;\r
 358 }\r
 359 textarea.max_width {\r
 360         width: 98%;\r
 361 }\r
 362 \r
 363 /** リンクタグ設定 **/\r
 364 a {\r
 365         color: #67A7CC;\r
 366 }\r
 367 a:hover {\r
 368         color: #A3D8F6;\r
 369 }\r
 370 a:visited {\r
 371 }\r
 372 a:active {\r
 373 }\r
 374 \r
 375 a.button {\r
 376         color: #000000;\r
 377         border: 1px solid #666666;\r
 378         background-color: #ffffff;\r
 379         padding: 16px 22px 15px 22px;\r
 380         text-decoration: none;\r
 381         border-radius: 10px;\r
 382         box-shadow: 2px 4px 10px #cacaca;\r
 383         behavior: url("./css/PIE.htc");\r
 384 }\r
 385 a:hover.button {\r
 386         color: #ffffff;\r
 387         border: 1px solid #000000;\r
 388         background-color: #333333;\r
 389 }\r
 390 \r
 391 /** メディアクエリー用 **/\r
 392 div[name="for_pc"] {\r
 393         display: table;\r
 394 }\r
 395 \r
 396 div[name="for_smartphone"] {\r
 397         display: none;\r
 398 }\r