service.css 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. .service_main{width: 100%;height: 600px;}
  2. .serve{width:1200px;height:600px;margin:0 auto;}
  3. .serve_title{width:1200px;height:130px;text-align: center;}
  4. .clear_{width:100%;height:1px;}
  5. h2{color:#074d88;margin-top:90px;font-size: 30px;}
  6. .serve_cont{width:1200px;height:470px;position: relative;}
  7. .serve_left{width:470px;height:470px;display: inline-block;}
  8. .serve_left>div{width:100%;height:110px;border-radius: 55px;
  9. position: relative;margin-bottom:20px;border: 2px solid transparent;
  10. }
  11. .serve_left>div a{display: none;}
  12. .serve_left>div span img:first-child+img{display: none;}
  13. .serve_left>div:hover{border: 2px solid #BCBCBC;cursor: pointer;}
  14. .serve_left>div:hover span{background: #fff;}
  15. .serve_left>div:hover span img:first-child{display: none;}
  16. .serve_left>div:hover span img:first-child+img{display: block;}
  17. .serve_left>div:hover span{background: #F8A346;}
  18. .serve_left span{display: inline-block;width:108px;height:108px;text-align: center;line-height:100px;
  19. border-radius: 50%;border: 2px solid #F8A346;position: absolute;top:-1px;left:-2px;background: #ffffff;}
  20. .serve_left>div span img{position: absolute;top: 21px;left: 23px;}
  21. .serve_left h3{display: inline-block;position: absolute;top:5px;left:120px;
  22. color:#f68705;font-size: 16px;font-weight: bold;}
  23. .serve_left p{display: inline-block;position: absolute;top:35px;left:120px;
  24. color:#7a7878;font-family: "simsun";width: 346px;height: 32px;text-overflow: ellipsis; overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
  25. .serve_left a{position:absolute;bottom:10px;right:20px;color:#F8A346;}
  26. .serve_right{width:710px;height:470px;display: inline-block;position: absolute;
  27. right:0;bottom:0;padding-top: 50px;}
  28. .serve_right>div{width:232px;height:283px;position: relative;
  29. display: inline-block;}
  30. .img_top{width:200px;height:123px;position: absolute;
  31. top:10px;left:14px; background: #fff;text-align: center;
  32. line-height: 120px}
  33. .img_top p{font-size: 20px;color:#F8A346;}
  34. .img_bottom{width:200px;height:128px;position: absolute;
  35. bottom:17px;left:14px;background:#fff;text-align: center;
  36. line-height: 120px;}
  37. .img_bottom p{font-size: 1.6rem;color:#707070;}
  38. .Intellectual{width: 100%;background: url(../../img/service_04.png)no-repeat center;height: 640px;text-align: center;}
  39. .Intellectual .container>h3{font-size: 50px;color: #ffffff;width: 200px;margin: 0 auto;line-height: 150px;}
  40. .Intellectual .container{width: 1200px;}
  41. .Intellectual ul li{float: left;width: 360px;height: 450px;margin-left: 44px;}
  42. .Intellectual ul li:first-child{margin-left: 0;}
  43. .Intellectual_left{width: 360px;height: 145px;background: url(../../img/service_1.png);background-size: 100% 100%;}
  44. .Intellectual_left h4{font-weight: normal;height: 90px;font-size: 20px;color: #f68705;margin-left: 56px;padding-top: 32px;text-align: left;}
  45. .Intellectual_left span{margin-top: 10px;font-size: 12px;color: #797979;text-align: left!important;line-height: 18px;display: inline-block;float: left;margin-left: 56px;}
  46. .Intellectual ul li:first-child+li{background: url(../../img/service_2.png) no-repeat;padding-top: 102px;}
  47. .Intellectual ul li:first-child+li+li{background: url(../../img/service_3.png) no-repeat;text-align: center;}
  48. .Intellectual ul li:first-child+li p{font-size: 36px;color: #f68705;text-align: center;width: 332px;}
  49. .Intellectual ul li:first-child+li .time{font-size: 18px;color: #f68705;margin-top: 60px;}
  50. .number_ten{margin-top:16px;margin-bottom: 30px;}
  51. .Intellectual ul li:first-child+li+li{padding-top: 100px;}
  52. .Intellectual ul li:first-child+li+li p{font-size:36px ;color: #f68705;;width: 332px;line-height: 56px;}
  53. .Intellectual ul li:first-child+li+li p span{font-size:60px;color: #f54c49;}
  54. .Intellectual ul li:first-child+li+li a{width: 216px;height: 70px;margin-top: 90px;background: #ffb200;border-radius: 10px;text-align: center;display: inline-block;line-height: 70px;font-size: 24px;color: #ffffff;}
  55. .Intellectual ul li:first-child+li+li a:hover{background: #fdce61;color: #000000;transition: all .5s;}
  56. .Intellectual>.container>a{width: 150px;height: 46px;display:inline-block;background: #ffb200;line-height: 46px;text-align: center;color:#FFFFFF;font-size: 16px; margin-top: 20px;}
  57. .customer_main{width: 400px;margin: 0 auto;}
  58. .customer hr{width: 1200px;margin: 0 auto;}
  59. .customer_main span{font-size: 40px;color: #074d88;width: 180px;text-align: center;line-height: 120px;display: inline-block;margin-top: 50px;}
  60. .that{border-bottom: 2px solid #074d88;}
  61. .customer_company{margin: 80px auto 0;display: none;}
  62. .customer_company:nth-child(1){display: block;}
  63. .customer_company li{float: left;width: 274px;margin-left: 14px;overflow: hidden;height:274px;}
  64. .customer_company li>img{width:274px;height:222px;border:none;}
  65. .customer_company li:first-child{margin-left:0 ;}
  66. .customer_company li p{width: 100%;line-height: 52px;text-align: center;font-size: 16px;color: #383838;background: #ffffff;border: 1px solid #cccccc;
  67. margin-top: -2px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;padding: 0 5px;font-weight: bold;}
  68. .thon p{background: #ffb200!important;color: #FFFFFF!important;border: 1px solid transparent!important;}
  69. .customer_circle{clear: both;width: 85px;margin: 0 auto;overflow: hidden;padding-top: 58px;padding-bottom: 36px;}
  70. .customer_circle li{width: 15px;height: 15px;border-radius: 50%;background: #d5d6d8;float: left;margin-left: 5px;}
  71. .customer_circle li.thonli{background: #909193;}
  72. .change_right{display:none;}
  73. #office{cursor: pointer;}
  74. #custom{cursor: pointer;}
  75. #lawyer{display:none;}
  76. .technology{width: 100%;height:580px;background: url(../../img/service_10.png) no-repeat center;}
  77. .technology h3{margin-left: 700px;font-size: 30px;color: #ffffff;margin-top: 30px;font-weight: normal}
  78. .technology_box{width: 600px;margin-left: 500px;}
  79. .technology_left:first-child{margin-left: 0;}
  80. .technology_left{float: left;width: 290px;text-align: center;margin-left: 20px;}
  81. .technology_left p{font-size: 24px;color: #ffffff;margin-top: 260px;}
  82. .technology_left a{width: 136px;height:60px;text-align: center;font-size: 18px;color: #ffffff;display: inline-block;background: #fcab00;line-height: 60px;margin-top: 112px;float: right;}
  83. .cooperation{width: 100%;background: #f0f0f2;}
  84. .cooperation h4{font-size: 30px;color: #074d88;font-weight:normal;text-align: center;margin-top: 82px;margin-bottom: 22px;}
  85. .cooperation ol{width: 496px;margin: 0 auto;overflow: hidden;margin-bottom: 36px;}
  86. .cooperation ol li{float: left;width: 216px;height: 56px;border: 1px solid #6a6a6a;text-align: center;
  87. line-height: 56px;font-size: 18px;color: #6a6a6a;margin: 0 16px;cursor: pointer;}
  88. .cooperation ol li.check_li{border-top:3px solid #EEA203; }
  89. .cooperation ul{clear: both;overflow: hidden;}
  90. .cooperation ul li{width: 270px;float: left;margin-left: 20px;overflow: hidden;position: relative;z-index: 10;height: 430px;}
  91. .cooperation ul li:first-child{margin-left: 0;}
  92. .cooperation ul li>p{width: 100%;line-height: 100px;text-align: center;background: rgba(251,190,49,.8);font-size: 16px;color: #ffffff;font-weight: bold;}
  93. .cooperation ul li .coop_text{position: absolute;top: 0;left: 0;width: 270px;height:430px;background:rgba(0,0,0,0.5);z-index: 333;text-align: center;display: none;}
  94. .coop_text h6{font-weight: normal;font-size: 16px;color: #ffffff;margin-top: 40px;margin-bottom: 25px;font-weight: bold;}
  95. .coop_text>p{font-size: 16px;color: #ffffff;padding-left: 20px;padding-right: 20px;text-align: left!important;font-family: "simsun";}
  96. .cooperation ul li:hover .coop_text{display: block; cursor: pointer;}
  97. .img_city{width: 100%;height: 300px;margin-top:-150px;background: url(../../img/service_15.png) no-repeat center center;background-size: 100% 100%}
  98. #bottom{margin-top: -20px; height: 280px;background-color: #074D88;}
  99. .bottom{height: 280px;}
  100. .bottom>img{height: 310px;}
  101. .bottom_text{margin-top: -120px;}
  102. .pub_fix{z-index: 999;}