map2d.css 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. @charset "UTF-8";
  2. main > * {
  3. display: flex;
  4. overflow: hidden; }
  5. main h3 .more {
  6. position: absolute;
  7. right: 2rem;
  8. font-style: italic;
  9. font-size: 1.25rem; }
  10. main .l {
  11. flex: 0 0 66.66%;
  12. padding: 1rem; }
  13. main .l .chart-wrap {
  14. position: relative; }
  15. main .l .chart-wrap .radioGroup {
  16. position: absolute;
  17. right: 2rem;
  18. top: 4rem;
  19. z-index: 1; }
  20. main .l .chart-wrap .radioGroup input {
  21. vertical-align: middle; }
  22. main .l .chart-wrap .chart-box {
  23. flex: 1;
  24. position: absolute;
  25. width: 100%;
  26. bottom: 0; }
  27. main .l .chart-wrap .chart-box .chart {
  28. height: 53.125rem; }
  29. main .chart-wrap {
  30. border: 0.0625rem solid rgba(76, 180, 231, 0.33);
  31. display: flex;
  32. flex: 1;
  33. flex-direction: column; }
  34. main .chart-wrap .chart {
  35. flex: 1;
  36. height: 0; }
  37. main .r {
  38. flex: 0 0 33.33%;
  39. flex-direction: column; }
  40. main .r > div {
  41. display: flex;
  42. flex: 0 0 50%;
  43. padding: 1rem; }
  44. main .r > div .chart-wrap {
  45. position: relative; }
  46. main .r .r-t .chart-wrap .chart:before {
  47. content: '北↑';
  48. position: absolute;
  49. left: 9.75rem;
  50. top: 1rem; }
  51. main .r .r-t .chart-wrap .chart.notebook:before {
  52. left: 7.75rem;
  53. top: .5rem; }
  54. main .r .r-t .chart-wrap .input-group {
  55. margin-left: 1rem; }
  56. main .r .r-t .chart-wrap .text {
  57. position: absolute;
  58. width: 38%;
  59. right: 1rem;
  60. top: 9rem; }
  61. main .r .r-t .chart-wrap .text.notebook {
  62. width: 13rem;
  63. top: 7rem; }
  64. main .r .r-b #c04_bestLocation {
  65. flex: 0;
  66. display: flex; }
  67. main .r .r-b #c04_bestLocation .blocks {
  68. display: flex;
  69. position: relative;
  70. flex-wrap: wrap;
  71. width: 19rem;
  72. top: 2rem;
  73. left: 2rem; }
  74. main .r .r-b #c04_bestLocation .blocks > div {
  75. width: 5rem;
  76. height: 5rem;
  77. text-align: center;
  78. line-height: 4rem;
  79. font-size: 2rem;
  80. background-color: rgba(255, 255, 255, 0.13);
  81. border: 0.125rem solid rgba(255, 255, 255, 0.63);
  82. transition: all .5s; }
  83. main .r .r-b #c04_bestLocation .blocks > div.active {
  84. background: deepskyblue; }
  85. main .r .r-b #c04_bestLocation form {
  86. margin-top: 2rem;
  87. width: 17rem; }
  88. main .r .r-b #c04_bestLocation form .input-group {
  89. margin-bottom: .5rem; }
  90. main .r .r-b #c04_bestLocation form .input-group button {
  91. margin-left: 0; }
  92. main .r .r-b #c04_bestLocation form .input-group #floorNumber {
  93. width: 4rem; }