serviceDetails.css 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. /*
  2. @update:2018/06/20
  3. */
  4. /* 面包削导航 */
  5. .navigation{
  6. width: 100%;
  7. height: 34px;
  8. line-height: 34px;
  9. background: #f9f9f9;
  10. overflow: hidden;
  11. margin-top: 10px;
  12. margin-bottom: 22px;
  13. }
  14. .navigation p{
  15. float: left;
  16. font-size: 14px;
  17. margin-right: 12px;
  18. color: #393939;
  19. }
  20. .navigation ol li {
  21. float: left;
  22. margin-right: 15px;
  23. }
  24. .navigation ol li a{
  25. font-size: 12px;
  26. color: #797979;
  27. }
  28. .navigation ol li a:hover{
  29. color: #1697ea;
  30. }
  31. .navigation ol li.active a{
  32. color: #1697ea;
  33. }
  34. /* 主体内容 */
  35. .serviceDetailsImg{
  36. float: left;
  37. width: 370px;
  38. height: 268px;
  39. position: relative;
  40. padding: 18px;
  41. border: 1px solid #efefef;
  42. }
  43. .serviceDetailsImg img{
  44. width: 100%;
  45. height: 100%
  46. }
  47. .serviceDetailsImg span{
  48. width: 46px;
  49. height: 40px;
  50. display: inline-block;
  51. background: url(../../../img/newMenu/achievmentDetail_7.png) no-repeat;
  52. background-size: 100% 100%;
  53. position: absolute;
  54. top: 0;
  55. left: 0
  56. }
  57. .serviceDetailsTxt{
  58. float: right;
  59. width: 818px;
  60. }
  61. .serviceDetailsTxt .serviceDetailsTitle{
  62. border: 1px solid #efefef;
  63. padding-bottom: 20px;
  64. }
  65. .serviceDetailsTxt .serviceDetailsTitle h4{
  66. font-size: 18px;
  67. line-height: 50px;
  68. height: 50px;
  69. padding-left: 22px;
  70. width: 100%;
  71. background: #f9f9f9;
  72. color: #1f1f1f;
  73. font-weight: 700;
  74. margin-bottom: 12px;
  75. }
  76. .serviceDetailsTxt .serviceDetailsTitle p{
  77. padding-left: 22px;
  78. }
  79. .serviceDetailsTxt .serviceDetailsTitle p{
  80. height: 36px;
  81. line-height: 36px;
  82. font-size: 12px;
  83. }
  84. .serviceDetailsTxt .serviceDetailsTitle p strong{
  85. font-weight: normal;
  86. color: #707070;
  87. width: 110px;
  88. display: inline-block;
  89. }
  90. .serviceDetailsTxt .serviceDetailsTitle p span{
  91. color: #9d9d9d;
  92. font-size: 12px;
  93. }
  94. .serviceDetailsTxt a{
  95. cursor: pointer;
  96. width: 150px;
  97. float: right;
  98. display: inline-block;
  99. height: 54px;
  100. line-height: 54px;
  101. text-align: center;
  102. font-size: 18px;
  103. color: #ffffff;
  104. background: #1697ea;
  105. margin-top: 16px;
  106. }
  107. .serviceDetailsTxt a:hover{
  108. background: #ffff;
  109. border: 1px dashed #1697ea;
  110. color: #1697ea;
  111. }
  112. .collection{
  113. clear: both;
  114. padding-left: 18px;
  115. padding-top: 18px;
  116. }
  117. .collection p span{
  118. vertical-align: top;
  119. color: #ff6a25
  120. }
  121. .collection p img{
  122. margin-right: 12px;
  123. }
  124. .collection .heart{
  125. width: 19px;
  126. height: 18px;
  127. display: inline-block;
  128. background: url(../../../img/newMenu/serviceDetal_03.jpg) no-repeat;
  129. background-size:100% 100%;
  130. margin-right: 12px;
  131. }
  132. .collection p{
  133. cursor: pointer;
  134. float: left;
  135. height: 18px;
  136. line-height: 18px;
  137. font-size: 14px;
  138. margin-right: 40px;
  139. }
  140. .collection .heart.active{
  141. background: url(../../../img/newMenu/serviceDetal_Ok.jpg) no-repeat;
  142. }
  143. /*
  144. 详情
  145. */
  146. .serviceDetailsList{
  147. width: 100%;
  148. clear: both;
  149. }
  150. .serviceDetailsList .introduction,.serviceDetailsList .requirement{
  151. background: #ffffff;
  152. border: 1px solid #eeeeee;
  153. padding-bottom: 28px;
  154. }
  155. .serviceDetailsList>div{
  156. margin-bottom: 38px;
  157. }
  158. .introduction{
  159. margin-top: 40px;
  160. }
  161. .serviceDetailsList .introduction h3,.serviceDetailsList .requirement h3{
  162. width: 100%;
  163. height: 52px;
  164. line-height: 52px;
  165. font-size: 14px;
  166. color: #1f1f1f;
  167. padding-left: 20px;
  168. background: #f8f8f8;
  169. margin-bottom: 20px;
  170. }
  171. .serviceDetailsList .introduction p,.serviceDetailsList .requirement p{
  172. padding:0 20px;
  173. line-height: 24px;
  174. font-size: 12px;
  175. text-align: justify;
  176. color: #707070;
  177. }
  178. .serviceDetailsList .value{
  179. overflow: hidden;
  180. background: #ffffff;
  181. border: 1px solid #eeeeee;
  182. }
  183. .serviceDetailsList .value h4{
  184. height: 100%;
  185. width: 170px;
  186. vertical-align: middle;
  187. font-size: 14px;
  188. text-align: center;
  189. float: left;
  190. background: #f8f8f8;
  191. }
  192. .serviceDetailsList .value div{
  193. padding-top: 10px;
  194. padding-bottom: 10px;
  195. padding-right: 10px;
  196. width: 1028px;
  197. display: inline-block;
  198. float: left;
  199. line-height: 24px;
  200. padding-left: 20px;
  201. font-size: 12px;
  202. color: #707070;
  203. word-wrap:break-word
  204. }