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.

220 lines
3.7 KiB

3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
  1. .game2Index {
  2. width: 100%;
  3. height: 100%;
  4. }
  5. .game2Index p.bgm img{
  6. width: 100%;
  7. height: 100%;
  8. }
  9. .game2Index .imgList li{
  10. width: 1.21rem;
  11. height: 1.2rem;
  12. background: url(../img/game1/kuang.png) no-repeat;
  13. background-size: 100% 100%;
  14. position: absolute;
  15. right: 0;
  16. top: 0;
  17. }
  18. .game2Index .imgList li img{
  19. position: absolute;
  20. z-index: 9999;
  21. top: 50%;
  22. left: 50%;
  23. transform: translate(-50%,-50%);
  24. }
  25. .game2Index .imgList li:nth-child(1){
  26. right: 21%;
  27. }
  28. .game2Index .imgList li:nth-child(2){
  29. right: 11%;
  30. }
  31. .game2Index .imgList li:nth-child(3){
  32. right: 1%;
  33. }
  34. .game2Index .clickIcon li{
  35. width: 1rem;
  36. height: 1rem;
  37. position: absolute;
  38. right: 0;
  39. top: 0;
  40. }
  41. .game2Index .clickIcon li.click1{
  42. top: 6%;
  43. right: 52%;
  44. background-size: 100% 100%;
  45. }
  46. .game2Index .clickIcon li img{
  47. width: .92rem;
  48. display: none;
  49. }
  50. .game2Index .clickIcon li.click2{
  51. top: 9%;
  52. right:67%;
  53. background-size: 100% 100%;
  54. }
  55. .game2Index .clickIcon li.click3{
  56. top: 78%;
  57. right: 67%;
  58. /*background: #000000;
  59. opacity: .5;*/
  60. width: 4rem;
  61. }
  62. .game2Index .clickIcon li.click3 img{
  63. width: .9rem;
  64. position: absolute;
  65. right: 7%;
  66. top: 11%;
  67. }
  68. /*书*/
  69. .game2Index .maskBgm{
  70. display: none;
  71. width: 100%;
  72. height: 100%;
  73. position: absolute;
  74. left: 0;
  75. top: 0;
  76. background: url(../img/game2/successBgm.png) no-repeat;
  77. background-size: 100% 100%;
  78. z-index: 99;
  79. }
  80. .game2Index .maskBgm:after {
  81. content: "";
  82. width: 100%;
  83. height: 100%;
  84. position: absolute;
  85. left: 0;
  86. top: 0;
  87. background: inherit;
  88. filter: blur(10px);
  89. z-index: 2;
  90. }
  91. .game2Index .book_box{
  92. display: none;
  93. width: 100%;
  94. height: 100%;
  95. position: absolute;
  96. left: 0;
  97. top: 0;
  98. z-index: 999;
  99. }
  100. .game2Index div.line{
  101. position: absolute;
  102. left: 0;
  103. top: 50%;
  104. transform: translateY(-50%);
  105. background: rgba(61, 117, 122,.5);
  106. width: 100%;
  107. height: 1.66rem;
  108. z-index:-1 ;
  109. display: flex;
  110. justify-content: space-between;
  111. align-items: center;
  112. }
  113. .game2Index div.line div{
  114. margin: 0 auto;
  115. width: 11rem;
  116. height: 100%;
  117. display: flex;
  118. justify-content: space-between;
  119. align-items: center;
  120. }
  121. .game2Index div.line p{
  122. box-sizing: border-box;
  123. font-size: .44rem;
  124. font-weight: 400;
  125. color: #C9C6BA;
  126. }
  127. .game2Index div.closeIcon{
  128. display: flex;
  129. justify-content: flex-end;
  130. margin-right: 1.2rem;
  131. margin-top: .55rem;
  132. }
  133. .game2Index div.closeIcon img{
  134. width: .546rem;
  135. height: .546rem;
  136. }
  137. .game2Index .bookCont{
  138. width: 9.93rem;
  139. height: 5.89rem;
  140. background: url(../img/bookBgm.png) no-repeat;
  141. background-size: 100% 100%;
  142. margin: 0 auto;
  143. z-index: 999;
  144. display: flex;
  145. }
  146. .game2Index .leftImg {
  147. width: 3.58rem;
  148. margin-left: .9rem;
  149. }
  150. .game2Index .leftImg .titleTip{
  151. display: flex;
  152. justify-content: space-between;
  153. align-items: center;
  154. margin-top: .42rem;
  155. }
  156. .game2Index .leftImg .titleTip p{
  157. color: #1F444B;
  158. font-size: .22rem;
  159. }
  160. .game2Index .leftImg .img{
  161. width: 1.18rem;
  162. height: .91rem;
  163. }
  164. .game2Index .leftImg .imgList{
  165. width: 3.58rem;
  166. height: 4.14rem;
  167. margin-top: .1rem;
  168. }
  169. .game2Index .leftImg img{
  170. width: 100%;
  171. height: 100%;
  172. }
  173. .game2Index .rightCont{
  174. width: 3.8rem;
  175. margin-left: 1.05rem;
  176. position: relative;
  177. }
  178. .game2Index .rightCont .titleTip{
  179. display: flex;
  180. margin-top: .7rem;
  181. justify-content: space-between;
  182. }
  183. .game2Index .rightCont .titleTip h2,
  184. .game2Index .rightCont .titleTip h5{
  185. color: #1F444B;
  186. font-size: .3rem;
  187. }
  188. .game2Index .rightCont .titleTip h5{
  189. font-weight: normal;
  190. font-size: .22rem;
  191. }
  192. .game2Index .rightCont ul{
  193. margin-top: .12rem;
  194. }
  195. .game2Index .rightCont li{
  196. font-size:.2rem ;
  197. color: #1F444B;
  198. line-height: .36rem;
  199. }
  200. .game2Index .rightCont .pageNum{
  201. position: absolute;
  202. bottom:5%;
  203. left: 40%;
  204. transform: translateX(-50%);
  205. text-align: center;
  206. font-size: .2rem;
  207. color: #1F444B;
  208. }