showWork.css 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198
  1. .banner img {
  2. width: 100%;
  3. }
  4. .information-content {
  5. width: 100%;
  6. display: flex;
  7. flex-wrap: wrap;
  8. /* max-height: 4.5rem; */
  9. }
  10. .information-content-left {
  11. max-height: 4.5rem;
  12. width: 100%;
  13. min-height: 4.5rem;
  14. }
  15. .information-content-right {
  16. width: 100%;
  17. padding: 0.2rem;
  18. }
  19. .information-content-right-title {
  20. margin-top: 0.2rem;
  21. display: flex;
  22. /* flex-wrap: wrap; */
  23. flex-direction: column;
  24. justify-content: space-around;
  25. /* height: 60%; */
  26. }
  27. .information-content-right-title p {
  28. font-size: 0.2rem;
  29. text-align: left;
  30. margin-bottom: 0.1rem;
  31. font-weight: 300;
  32. }
  33. .culture-content {
  34. width: 100%;
  35. display: flex;
  36. justify-content: space-around;
  37. margin-top: 0.5rem;
  38. flex-direction: column;
  39. align-items: center;
  40. }
  41. .culture-content-one {
  42. width: 100%;
  43. }
  44. .culture-all {
  45. margin: auto;
  46. width: 2rem;
  47. height: 2rem;
  48. border-radius: 50%;
  49. border: 3px solid white;
  50. overflow: hidden;
  51. display: flex;
  52. justify-content: center;
  53. align-items: center;
  54. position: relative;
  55. }
  56. .culture-all .share {
  57. position: absolute;
  58. top: 0;
  59. width: 100%;
  60. height: 100%;
  61. background: rgba(0, 0, 0, 0.5);
  62. z-index: 1;
  63. display: flex;
  64. justify-content: center;
  65. align-items: center;
  66. color: #ffffff;
  67. font-size: 0.4rem;
  68. }
  69. .culture-all:hover img {
  70. transform: scale(1.2);
  71. transition: all 0.5s;
  72. }
  73. .culture-all img {
  74. width: 100%;
  75. height: 100%;
  76. }
  77. .culture-one {
  78. margin-top: 0.3rem;
  79. /* margin-left: -0.2rem; */
  80. width: 90%;
  81. height: auto;
  82. background-color: white;
  83. font-size: 0.15rem;
  84. min-height: 1.5rem;
  85. padding: 0.2rem;
  86. display: flex;
  87. align-items: center;
  88. flex-direction: column;
  89. justify-content: center;
  90. }
  91. .culture-xian-left {
  92. height: 1px;
  93. width: 10%;
  94. border: 1px solid black;
  95. position: absolute;
  96. background: black;
  97. left: 28%;
  98. top: 40%;
  99. display: none;
  100. }
  101. .culture-xian {
  102. height: 1px;
  103. width: 10%;
  104. border: 1px solid black;
  105. position: absolute;
  106. background: black;
  107. right: 28%;
  108. top: 40%;
  109. display: none;
  110. }
  111. .culture-one .title {
  112. font-size: 0.2rem;
  113. font-weight: 500;
  114. margin-bottom: 0.1rem;
  115. }
  116. .case-bg-img {
  117. width: 100%;
  118. height: auto;
  119. }
  120. .history-bg-img {
  121. height: 3rem;
  122. }
  123. .section {
  124. color: #fff;
  125. text-align: center;
  126. margin-top: 0.83rem;
  127. }
  128. .section .title .desc {
  129. font-size: 0.3rem;
  130. margin-bottom: 0.22rem;
  131. }
  132. .section .title .info {
  133. font-size: 0.22rem;
  134. margin-bottom: 0.76rem;
  135. }
  136. .section .showlist {
  137. margin-bottom: 0.9rem;
  138. /* margin-top: 0.5rem; */
  139. overflow: hidden;
  140. }
  141. .change-page {
  142. margin-bottom: 0.14rem;
  143. text-align: right;
  144. height: 0.36rem;
  145. }
  146. .change-page .left,
  147. .change-page .right {
  148. width: 0.42rem;
  149. cursor: pointer;
  150. }
  151. .section .showlist .list {
  152. width: 23.75%;
  153. margin-right: 1.6%;
  154. /* background-color:#b6885d; */
  155. float: left;
  156. position: relative;
  157. }
  158. .section .showlist .list .play {
  159. width: 30%;
  160. position: absolute;
  161. top: 50%;
  162. margin-top: -15%;
  163. left: 50%;
  164. margin-left: -15%;
  165. cursor: pointer;
  166. z-index: 3;
  167. }
  168. /* .section .showlist .list:hover{
  169. transform: translateY(-10px);
  170. box-shadow: 0 0 15px rgba(255,255,255,0.85);
  171. } */
  172. .section .showlist .clear-right {
  173. margin-right: 0;
  174. }
  175. .list .video {
  176. width: 100%;
  177. display: block;
  178. }
  179. .list .from {
  180. padding: 0.2rem;
  181. font-size: 0.2rem;
  182. color: #000;
  183. background-color: #fff;
  184. }
  185. .nextPage {
  186. display: none;
  187. }
  188. .beianinfo {
  189. display: inline-block;
  190. margin-left: 0.65rem;
  191. }