nHeader.css 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. html,
  2. body,
  3. .zskk-box {
  4. width: 100%;
  5. padding: 0;
  6. margin: 0;
  7. background: #f5f5f5;
  8. font-family: "微软雅黑";
  9. overflow-x: hidden;
  10. }
  11. .zskk-box .zskk-header {
  12. height: 40px;
  13. box-sizing: border-box;
  14. padding: 0 15% 0 15%;
  15. display: flex;
  16. align-items: center;
  17. }
  18. .zskk-box .zskk-header .zskk-weixin {
  19. display: flex;
  20. align-items: center;
  21. /*border-right: 1px solid #a5a5a5;*/
  22. box-sizing: border-box;
  23. padding-right: 5px;
  24. }
  25. .zskk-box .zskk-header .zskk-bigweixin {
  26. position: absolute;
  27. top: 40px;
  28. z-index: 50;
  29. box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.5);
  30. border-radius: 5px;
  31. display: none;
  32. }
  33. .zskk-box .zskk-header .zskk-bigweixin img {
  34. height: 150px;
  35. width: 150px;
  36. }
  37. .zskk-box .zskk-header .zskk-weixin span {
  38. margin-left: 5px;
  39. font-size: 12px;
  40. }
  41. .zskk-box .zskk-header .zskk-loginregister {
  42. width: 110px;
  43. display: flex;
  44. justify-content: flex-end;
  45. margin-left: calc(100% - 400px);
  46. font-size: 12px;
  47. border-right: 1px solid #a5a5a5;
  48. padding: 0 10px;
  49. }
  50. .zskk-box .zskk-header .zskk-loginregister span {
  51. margin-left: 5px;
  52. }
  53. .zskk-box .zskk-header .zskk-phone {
  54. box-sizing: border-box;
  55. padding: 15px 10px;
  56. font-size: 12px;
  57. color: #a00f02;
  58. }
  59. .zskk-box .zskk-header .zskk-phone .zskk-label {
  60. background: #a00f02;
  61. color: #fff;
  62. padding: 2px 10px;
  63. border-radius: 15px;
  64. }
  65. .zskk-box .zskk-titleNav {
  66. /*height: 65px;*/
  67. width:270px; margin-top:10px;
  68. background: #fff;
  69. display: flex;
  70. box-sizing: border-box;
  71. padding-left: calc(20% - 20px);
  72. padding-right: 15%;
  73. align-items: center;
  74. justify-content: space-between;
  75. border-bottom: 1px solid #a00f02;
  76. }
  77. .zskk-box .zskk-titleNav .zskk-title img {
  78. height: 60px;
  79. }
  80. .zskk-box .zskk-titleNav .zskk-nav ul {
  81. display: flex;
  82. }
  83. .zskk-box .zskk-titleNav .zskk-nav li {
  84. list-style: none;
  85. padding: 0 20px;
  86. font-size: 12px;
  87. cursor: pointer;
  88. }
  89. .zskk-box .zskk-titleNav .zskk-nav .zskk-active {
  90. color: #a00f02;
  91. }
  92. .zskk-box .zskk-footer {
  93. height: 230px;
  94. border-top: 2px solid #b85a4f;
  95. background: #dcdcdc;
  96. display: flex;
  97. justify-content: center;
  98. padding-top: 30px;
  99. }
  100. .zskk-box .zskk-footer .zskk-content {
  101. height: 100%;
  102. width: 900px;
  103. display: flex;
  104. justify-content: space-between;
  105. }
  106. .zskk-box .zskk-footer .zskk-content .zskk-phoneAddress {
  107. height: 100%;
  108. width: 430px;
  109. box-sizing: border-box;
  110. padding-top: 30px;
  111. }
  112. .zskk-box .zskk-footer .zskk-content .zskk-phoneAddress .zskk-phone {
  113. height: 60px;
  114. width: 430px;
  115. display: flex;
  116. align-items: center;
  117. font-size: 20px;
  118. font-weight: bolder;
  119. color: #852823;
  120. letter-spacing: 3px;
  121. display: flex;
  122. align-items: center;
  123. justify-content: center;
  124. }
  125. .zskk-box .zskk-footer .zskk-content .zskk-phoneAddress .zskk-address1,
  126. .zskk-box .zskk-footer .zskk-content .zskk-phoneAddress .zskk-address2 {
  127. height: 40px;
  128. width: 430px;
  129. font-size: 16px;
  130. display: flex;
  131. align-items: center;
  132. justify-content: center;
  133. font-weight: bolder;
  134. color: #02273a;
  135. }
  136. .zskk-box .zskk-footer .zskk-content .zskk-links {
  137. height: 100%;
  138. width: 200px;
  139. display: flex;
  140. flex-direction: column;
  141. color: #02273a;
  142. }
  143. .zskk-box .zskk-footer .zskk-content .zskk-links .zskk-label {
  144. height: 50px;
  145. width: 200px;
  146. display: flex;
  147. justify-content: center;
  148. letter-spacing: 4px;
  149. font-size: 18px;
  150. font-weight: bolder;
  151. }
  152. .zskk-box .zskk-footer .zskk-content .zskk-links .zskk-value {
  153. height: 35px;
  154. width: 200px;
  155. display: flex;
  156. justify-content: center;
  157. letter-spacing: 2px;
  158. font-family: "幼圆";
  159. font-size: 18px;
  160. }
  161. .zskk-box .zskk-footer .zskk-content .zskk-weixin {
  162. height: 100%;
  163. width: 130px;
  164. display: flex;
  165. flex-direction: column;
  166. align-items: center;
  167. color: #02273a;
  168. }
  169. .zskk-box .zskk-footer .zskk-content .zskk-weixin img {
  170. margin-top: 20px;
  171. width: 110px;
  172. }
  173. .zskk-box .zskk-footer .zskk-content .zskk-weixin .zskk-weixinname img {
  174. width: 130px;
  175. }
  176. ul {
  177. padding: 0;
  178. margin: 0;
  179. }
  180. a {
  181. text-decoration: none;
  182. color: inherit;
  183. }