You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

744 lines
8.3 KiB

6 years ago
5 years ago
  1. html,
  2. body {
  3. /*font-family: 'Open Sans', serif;*/
  4. font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  5. background: #F9F9F9;
  6. }
  7. footer {
  8. background-color: #2a2e2f !important;
  9. padding: 2rem 1.5rem 3rem !important;
  10. }
  11. .footer a {
  12. color: white;
  13. }
  14. .footer h2 {
  15. margin-bottom: 10px;
  16. }
  17. .footer p,
  18. strong {
  19. color: lemonchiffon;
  20. }
  21. .navbar {
  22. background-color: #2a2e2f;
  23. }
  24. .navbar.has-shadow {
  25. box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  26. }
  27. .navbar-item {
  28. color: white;
  29. }
  30. .topNav {
  31. border-top: 5px solid #3498DB;
  32. }
  33. .topNav .container {
  34. border-bottom: 1px solid #E6EAEE;
  35. }
  36. .container .columns {
  37. margin: 2rem 0;
  38. }
  39. aside.menu {
  40. padding-top: 3rem;
  41. }
  42. aside.menu .menu-list {
  43. line-height: 1.5;
  44. }
  45. aside.menu .menu-label {
  46. padding-left: 10px;
  47. font-weight: 700;
  48. }
  49. .button.is-primary.is-alt {
  50. background: #00c6ff;
  51. background: -webkit-linear-gradient(to bottom, #0072ff, #00c6ff);
  52. background: linear-gradient(to bottom, #0072ff, #00c6ff);
  53. font-weight: 700;
  54. font-size: 14px;
  55. height: 3rem;
  56. line-height: 2.8;
  57. }
  58. .media-left img {
  59. border-radius: 50%;
  60. }
  61. .media-content p {
  62. font-size: 14px;
  63. line-height: 2.3;
  64. font-weight: 700;
  65. color: #8F99A3;
  66. }
  67. article.post {
  68. margin: 1rem;
  69. padding-bottom: 1rem;
  70. border-bottom: 1px solid #E6EAEE;
  71. }
  72. article.post:last-child {
  73. padding-bottom: 0;
  74. border-bottom: none;
  75. }
  76. .menu-list li {
  77. padding: 5px;
  78. }
  79. .tag:not(body).is-grey {
  80. background-color: #eee;
  81. color: #666;
  82. }
  83. .button-margin {
  84. width: 5cm; /* Set a width for alignment */
  85. margin-bottom: 15px;
  86. }
  87. p {
  88. font-family: "游ゴシック体", YuGothic, "YuGothic M", sans-serif;
  89. }
  90. .tabs-details {
  91. margin-right: 1px;
  92. }
  93. .project-image {
  94. background-image: url('/static/images/cat.png');
  95. background-size: cover;
  96. background-repeat: no-repeat;
  97. background-position: center center;
  98. }
  99. .is-shady {
  100. animation: flyintoright .4s backwards;
  101. background: #fff;
  102. box-shadow: rgba(0, 0, 0, .1) 0 1px 0;
  103. border-radius: 4px;
  104. /*display: inline-block;*/
  105. /*margin: 10px;*/
  106. position: relative;
  107. transition: all .2s ease-in-out;
  108. }
  109. .is-shady:hover {
  110. box-shadow: 0 10px 16px rgba(0, 0, 0, .13), 0 6px 6px rgba(0, 0, 0, .19);
  111. }
  112. .menu-list a.active {
  113. background-color: #3273dc;
  114. color: #fff;
  115. }
  116. .select-height {
  117. height: 100% !important;
  118. max-height: 200px !important;
  119. }
  120. .pagination-link,
  121. .pagination-next,
  122. .pagination-previous {
  123. background-color: white;
  124. margin-top: 20px;
  125. }
  126. .card-header-title {
  127. padding: 1.5rem;
  128. }
  129. .navbar-link::after {
  130. border-color: white;
  131. }
  132. .navbar-link {
  133. color: white;
  134. }
  135. .navbar-dropdown {
  136. background-color: #2a2e2f;
  137. border-top: 0;
  138. }
  139. .navbar-dropdown .navbar-item {
  140. color: white;
  141. }
  142. .has-background-royalblue {
  143. background-color:royalblue !important;
  144. }
  145. /* Padding Zero */
  146. .p0 {
  147. padding: 0!important
  148. }
  149. /* Padding Top */
  150. .pt10 {
  151. padding-top: 10px!important
  152. }
  153. .pt15 {
  154. padding-top: 15px!important
  155. }
  156. .pt20 {
  157. padding-top: 20px!important
  158. }
  159. .pt30 {
  160. padding-top: 30px!important
  161. }
  162. .pt40 {
  163. padding-top: 40px!important
  164. }
  165. .pt50 {
  166. padding-top: 50px!important
  167. }
  168. .pt60 {
  169. padding-top: 60px!important
  170. }
  171. .pt70 {
  172. padding-top: 70px!important
  173. }
  174. .pt80 {
  175. padding-top: 80px!important
  176. }
  177. .pt90 {
  178. padding-top: 90px!important
  179. }
  180. .pt100 {
  181. padding-top: 100px!important
  182. }
  183. .pt110 {
  184. padding-top: 110px!important
  185. }
  186. .pt120 {
  187. padding-top: 120px!important
  188. }
  189. .pt130 {
  190. padding-top: 130px!important
  191. }
  192. .pt140 {
  193. padding-top: 140px!important
  194. }
  195. /* Padding Bottom */
  196. .pb0 {
  197. padding-bottom: 0px!important
  198. }
  199. .pb10 {
  200. padding-bottom: 10px!important
  201. }
  202. .pb15 {
  203. padding-bottom: 15px!important
  204. }
  205. .pb20 {
  206. padding-bottom: 20px!important
  207. }
  208. .pb30 {
  209. padding-bottom: 30px!important
  210. }
  211. .pb40 {
  212. padding-bottom: 40px!important
  213. }
  214. .pb50 {
  215. padding-bottom: 50px!important
  216. }
  217. .pb60 {
  218. padding-bottom: 60px!important
  219. }
  220. .pb70 {
  221. padding-bottom: 70px!important
  222. }
  223. .pb80 {
  224. padding-bottom: 80px!important
  225. }
  226. .pb90 {
  227. padding-bottom: 90px!important
  228. }
  229. .pb100 {
  230. padding-bottom: 100px!important
  231. }
  232. .pb110 {
  233. padding-bottom: 110px!important
  234. }
  235. .pb120 {
  236. padding-bottom: 120px!important
  237. }
  238. .pb130 {
  239. padding-bottom: 130px!important
  240. }
  241. .pb140 {
  242. padding-bottom: 140px!important
  243. }
  244. /* Padding Left */
  245. .pl0 {
  246. padding-left: 0px!important
  247. }
  248. .pl3 {
  249. padding-left: 3px!important
  250. }
  251. .pl5 {
  252. padding-left: 5px!important
  253. }
  254. .pl10 {
  255. padding-left: 10px!important
  256. }
  257. .pl20 {
  258. padding-left: 20px!important
  259. }
  260. .pl30 {
  261. padding-left: 30px;
  262. }
  263. .pl40 {
  264. padding-left: 40px;
  265. }
  266. .pl50 {
  267. padding-left: 50px;
  268. }
  269. .pl60 {
  270. padding-left: 60px;
  271. }
  272. .pl70 {
  273. padding-left: 70px;
  274. }
  275. .pl80 {
  276. padding-left: 80px;
  277. }
  278. .pl90 {
  279. padding-left: 90px;
  280. }
  281. .pl100 {
  282. padding-left: 100px;
  283. }
  284. .pl15r {
  285. padding-left: 1.5rem !important;
  286. }
  287. /* Padding Right */
  288. .pr0 {
  289. padding-right: 0px!important
  290. }
  291. .pr5 {
  292. padding-right: 5px!important
  293. }
  294. .pr10 {
  295. padding-right: 10px!important
  296. }
  297. .pr20 {
  298. padding-right: 20px!important
  299. }
  300. .pr30 {
  301. padding-right: 30px!important
  302. }
  303. .pr40 {
  304. padding-right: 40px;
  305. }
  306. .pr50 {
  307. padding-right: 50px;
  308. }
  309. .pr60 {
  310. padding-right: 60px;
  311. }
  312. .pr70 {
  313. padding-right: 70px;
  314. }
  315. .pr80 {
  316. padding-right: 80px;
  317. }
  318. .pr90 {
  319. padding-right: 90px;
  320. }
  321. .pr100 {
  322. padding-right: 100px;
  323. }
  324. .pr110 {
  325. padding-right: 110px;
  326. }
  327. .pr120 {
  328. padding-right: 120px;
  329. }
  330. @media (min-width:1200px) {
  331. .pl-lg-50 {
  332. padding-left: 50px;
  333. }
  334. .pl-lg-80 {
  335. padding-left: 80px;
  336. }
  337. }
  338. @media (min-width:992px) {
  339. .pt-md-50 {
  340. padding-top: 50px;
  341. }
  342. }
  343. .pbrem075 {
  344. padding-bottom: 0.75rem;
  345. }
  346. .tweaked-margin {
  347. margin-left: -0.4rem !important;
  348. margin-right: 0.3rem !important;
  349. }
  350. /* Margin Auto */
  351. .mr-auto {
  352. margin: auto;
  353. float: none;
  354. }
  355. /* Margin Top */
  356. .mt0 {
  357. margin-top: 0!important
  358. }
  359. .mt5 {
  360. margin-top: 5px!important
  361. }
  362. .mt10 {
  363. margin-top: 10px!important
  364. }
  365. .mt20 {
  366. margin-top: 20px!important
  367. }
  368. .mt30 {
  369. margin-top: 30px!important
  370. }
  371. .mt40 {
  372. margin-top: 40px!important
  373. }
  374. .mt50 {
  375. margin-top: 50px!important
  376. }
  377. .mt60 {
  378. margin-top: 60px!important
  379. }
  380. .mt70 {
  381. margin-top: 70px!important
  382. }
  383. .mt80 {
  384. margin-top: 80px!important
  385. }
  386. .mt90 {
  387. margin-top: 90px!important
  388. }
  389. .mt100 {
  390. margin-top: 100px!important
  391. }
  392. .mt110 {
  393. margin-top: 110px!important
  394. }
  395. .mt120 {
  396. margin-top: 120px!important
  397. }
  398. /* Margin Bottom */
  399. .mb0 {
  400. margin-bottom: 0!important
  401. }
  402. .mb5 {
  403. margin-bottom: 5px!important
  404. }
  405. .mb10 {
  406. margin-bottom: 10px!important
  407. }
  408. .mb15 {
  409. margin-bottom: 15px!important
  410. }
  411. .mb20 {
  412. margin-bottom: 20px!important
  413. }
  414. .mb30 {
  415. margin-bottom: 30px!important
  416. }
  417. .mb40 {
  418. margin-bottom: 40px!important
  419. }
  420. .mb50 {
  421. margin-bottom: 50px
  422. }
  423. .mb60 {
  424. margin-bottom: 60px
  425. }
  426. .mb70 {
  427. margin-bottom: 70px
  428. }
  429. .mb80 {
  430. margin-bottom: 80px
  431. }
  432. .mb90 {
  433. margin-bottom: 90px
  434. }
  435. .mb100 {
  436. margin-bottom: 100px
  437. }
  438. .mb110 {
  439. margin-bottom: 110px
  440. }
  441. .mb120 {
  442. margin-bottom: 120px
  443. }
  444. /* Margin Left */
  445. .ml0 {
  446. margin-left: 0!important;
  447. }
  448. .ml15 {
  449. margin-left: 5px;
  450. }
  451. .ml10 {
  452. margin-left: 10px;
  453. }
  454. .ml20 {
  455. margin-left: 20px;
  456. }
  457. .ml30 {
  458. margin-left: 30px;
  459. }
  460. .ml40 {
  461. margin-left: 40px;
  462. }
  463. .ml50 {
  464. margin-left: 50px;
  465. }
  466. .ml60 {
  467. margin-left: 60px;
  468. }
  469. .ml70 {
  470. margin-left: 70px;
  471. }
  472. .ml80 {
  473. margin-left: 80px;
  474. }
  475. .ml90 {
  476. margin-left: 90px;
  477. }
  478. .ml100 {
  479. margin-left: 100px;
  480. }
  481. .ml110 {
  482. margin-left: 110px;
  483. }
  484. /* Margin Right */
  485. .mr0 {
  486. margin-right: 0!important
  487. }
  488. .mr5 {
  489. margin-right: 5px!important
  490. }
  491. .mr10 {
  492. margin-right: 10px!important
  493. }
  494. .mr20 {
  495. margin-right: 20px!important
  496. }
  497. .mr30 {
  498. margin-right: 30px!important
  499. }
  500. .mr40 {
  501. margin-right: 40px!important
  502. }
  503. .mr50 {
  504. margin-right: 50px!important
  505. }
  506. .mr60 {
  507. margin-right: 60px!important
  508. }
  509. .mr70 {
  510. margin-right: 70px!important
  511. }
  512. .mr80 {
  513. margin-right: 80px!important
  514. }
  515. .mr90 {
  516. margin-right: 90px!important
  517. }
  518. .mr100 {
  519. margin-right: 100px;
  520. }
  521. .mr110 {
  522. margin-right: 110px;
  523. }
  524. .dataset-item__main {
  525. display: inline-block;
  526. -webkit-box-flex: 2;
  527. -ms-flex: 2 2 66%;
  528. flex: 2 2 66%;
  529. overflow: hidden;
  530. margin: 0 8px 0 8px;
  531. }
  532. .dataset-item__main-title {
  533. font-size: 16px;
  534. font-weight: 500;
  535. line-height: 22px;
  536. }
  537. .dataset-item__main-subtitle {
  538. color: rgba(0,0,0,.55);
  539. font-size: 12px;
  540. font-weight: 400;
  541. line-height: 22px;
  542. overflow: hidden;
  543. text-overflow: ellipsis;
  544. white-space: nowrap;
  545. }
  546. .dataset-item__main-info {
  547. color: rgba(0,0,0,.4);
  548. font-size: 12px;
  549. font-weight: 400;
  550. line-height: 22px;
  551. }
  552. .is-vertical {
  553. vertical-align:middle !important;
  554. }
  555. .project-thumbnail {
  556. border-radius: 4px;
  557. }
  558. .thumbnail-wrapper {
  559. width:66px;
  560. height:66px;
  561. display:inline-block;
  562. }
  563. [v-cloak] { display: none; }