Home Explore Project
Register Sign In
linkmedia
/
join.wifi.com
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: b24722463d
Branches Tags
join.wifi.com
/
css
/
base.css

base.css 7.6 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124 
  1. html {font-family: "Microsoft Yahei",arial,helvetica,sans-serif;  word-break : break-word;font-size: 62.5%}
    2. 

  2. html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, a, code, em, img, q, small, strong, dd, dl, dt, li, ol, ul, fieldset, form, label, table, tbody, tr, th, td, input { margin: 0; padding: 0; outline:0;}
    3. 

  3. body{background-color: #f2f2f2;height: 100%;min-width:1200px;}
    4. 

  4. .fr{float: right;}
    5. 

  5. .clear{clear: both;}
    6. 

  6. .header{
    7. 

  7.     height: 92px;width: 100%;min-width:1200px;border-top: #0285f0 4px solid;background-color: #ffffff; 
    8. 

  8. }
    9. 

  9. .header .center{width: 1180px;height: 100%;margin: 0 auto;position: relative;padding: 0 10px;}
    10. 

  10. .logo{width: 387px;height: 42px;margin: 23px 0 23px 10px;}
    11. 

  11. .header .menu{}
    12. 

  12. .header ul{display: inline-block; margin-right: 20px; font-size: 16px; vertical-align: middle;}
    13. 

  13. .header ul a{display: inline-block; float: left; padding: 35px 30px 36px 30px; color: #999999;font-size: 16px;text-decoration: none;}
    14. 

  14. 

  15. .banner{background: url(../images/banner.jpg) no-repeat top center;width: 100%;height: 502px;}
    16. 

  16. [mobile="1"] .banner{background: url(../images/banner_wap.jpg) no-repeat top center;width: 100%;height: 920px;}
    17. 

  17. .jobs{width: 1200px;margin: 0 auto;padding:74px 0 57px 0;}
    18. 

  18. .jobs .content{height: 100%;border:1px #cccccc solid;position: relative;}
    19. 

  19. .jobs .job{margin: 56px 0 58px 0; padding: 0 130px;display: inline-block;vertical-align: top;}
    20. 

  20. .jobs .job1{width: 336px;}
    21. 

  21. [dpr="3"] .jobs .job1{width: 346px;padding: 0 125px;}
    22. 

  22. .jobs .job2{width: 376px;border-left:1px #cccccc solid;padding: 0 110px;}
    23. 

  23. [dpr="3"] .jobs .job2,[dpr="1.5"] .jobs .job2{width: 374px;}
    24. 

  24. .jobs .icon{margin: 0 auto;width: 80px;height: 80px;}
    25. 

  25. .jobs p{text-align: center;color: #666666;}
    26. 

  26. .jobs .job_name{font-size: 23px;line-height: 60px;margin-top: 10px;}
    27. 

  27. .jobs .job_desc{font-size: 16px;line-height: 25px;}
    28. 

  28. [mobile="1"] .jobs .job_name{font-size: 2.3rem;line-height: 6.0rem;margin-top: 1.0rem;}
    29. 

  29. [mobile="1"] .jobs .job_desc{font-size: 1.6rem;line-height: 2.5rem;}
    30. 

  30. [dpr="3"] .jobs .job_desc{line-height: 2.0rem;}
    31. 

  31. .job1 .icon{background: url(../images/icon_m.png) no-repeat top left;}
    32. 

  32. .job2 .icon{background: url(../images/icon_t.png) no-repeat top left;}
    33. 

  33. .jobs .job_url{margin-top: 10px;}
    34. 

  34. .jobs .job_url a{font-size: 18px;color: #54a4e9;}
    35. 

  35. [mobile="1"] .jobs .job_url a{font-size: 1.8rem;}
    36. 

  36. .jobs .btn_resume{width: 242px;height: 72px;position: absolute;background: url(../images/btn_resume.png) no-repeat top center;margin-top: -36px;margin-left: -121px;left: 50%;}
    37. 

  37. 

  38. 

  39. /** detail **/
    40. 

  40. .detail{width: 1200px;margin: 0 auto;padding:0 0 57px 0;}
    41. 

  41. [mobile="1"] .detail{width: 1120px;padding:0 40 57px 40;}
    42. 

  42. .detail .content{height: 100%;margin:0 auto;padding-top:60px;font-size: 0}
    43. 

  43. .detail .icon{margin-bottom: 35px;width: 100%;height: 80px;line-height: 80px;padding-left: 100px;font-size: 24px;color: #666666;}
    44. 

  44. [mobile="1"] .detail .icon{font-size: 2.4rem;}
    45. 

  45. .detail .job{display: inline-block;font-size: 14px;line-height: 24px;padding-right: 68px;width: 532px;vertical-align: top;}
    46. 

  46. [mobile="1"] .detail .job{font-size: 1.4rem;line-height: 2.4rem;}
    47. 

  47. 

  48. [dpr="3"] .detail .job,[dpr="1.5"] .detail .job{width: 485px;font-size: 2.0rem;line-height: 2.4rem}
    49. 

  49. [dpr="2"] .detail .job{width: 465px;font-size: 1.8rem;}
    50. 

  50. .detail .job1{}
    51. 

  51. .detail .job2{}
    52. 

  52. .detail .title{color: #3a94ef;line-height: 34px;}
    53. 

  53. [mobile="1"] .detail .title{line-height: 3.4rem;}
    54. 

  54. .detail .job_desc{color: #666666;background-color: #f2f2f2;width: 100%;}
    55. 

  55. 

  56. 

  57. .border_title{font-size: 29px;color: #0082f3;border-left: 8px #0082f3 solid;margin-bottom: 38px;margin-top: 60px;padding-left: 32px;}
    58. 

  58. [mobile="1"] .border_title{font-size: 2.9rem;border-left: 0.8rem #0082f3 solid;}
    59. 

  59. [dpr="3"] .border_title{font-size: 1.5rem;}
    60. 

  60. .faq{width: 1200px;margin: 0 auto;padding:1px 0 57px 0;}
    61. 

  61. [mobile="1"] .faq{width: 1120px;padding:1px 40 57px 40;}
    62. 

  62. .faq ul{list-style: none;}
    63. 

  63. .last{border-bottom: #cccccc 1px dotted;}
    64. 

  64. .faq ul .q,.faq ul .a{background-color: #f2f2f2;}
    65. 

  65. .faq ul .q{font-size: 18px;color: #0082f3;padding-top: 40px;padding-bottom: 14px;border-top: #cccccc 1px dotted;width: 100%;}
    66. 

  66. .faq ul .a{font-size: 14px;color: #666666;padding-bottom: 40px;padding-top: 14px;}
    67. 

  67. [mobile="1"] .faq ul .q{font-size: 1.8rem;}
    68. 

  68. [mobile="1"] .faq ul .a{font-size: 1.4rem;}
    69. 

  69. [dpr="3"] .faq ul .q{font-size: 1.0rem;}
    70. 

  70. [dpr="3"] .faq ul .a{font-size: 0.9rem;line-height: 1.2rem}
    71. 

  71. [dpr="2"] .faq ul .q{font-size: 2.0rem;}
    72. 

  72. [dpr="2"] .faq ul .a{font-size: 1.6rem;}
    73. 

  73. [dpr="1.5"] .faq ul .q{font-size: 2.2rem;}
    74. 

  74. [dpr="1.5"] .faq ul .a{font-size: 2.0rem;line-height: 2.2rem}
    75. 

  75. [mobile="1"] .faq{padding:1px 40px 57px 40px;width: 1120px;}
    76. 

  76. 

  77. .about{width: 1200px;margin: 0 auto;padding:0 0 180px 0;color: #4e4e4e;}
    78. 

  78. .about .desc1{font-size: 18px;line-height: 30px;background-color: #f2f2f2;width: 100%;}
    79. 

  79. [mobile="1"] .about .desc1{font-size: 1.8rem;line-height: 3rem;}
    80. 

  80. [mobile="1"] .about{padding:1px 40px 180px 40px;width: 1120px;}
    81. 

  81. .about .desc2{font-size: 17px;background-color: #f2f2f2;width: 100%;}
    82. 

  82. [mobile="1"] .about .desc2{font-size: 1.7rem;}
    83. 

  83. [dpr="2"] .about .desc1{font-size: 1.4rem;}
    84. 

  84. [dpr="2"] .about .desc2{font-size: 1.3rem;}
    85. 

  85. [dpr="3"] .about .desc1{font-size: 1.7rem;line-height: 2.2rem;}
    86. 

  86. [dpr="3"] .about .desc2{font-size: 1.6rem;}
    87. 

  87. [dpr="3"] .about .desc2 span{font-size: 0.8rem;}
    88. 

  88. .about .desc2 span{font-size: 15px;}
    89. 

  89. [mobile="1"] .about .desc2 span{font-size: 1.5rem;}
    90. 

  90. .about .bg{background: url(../images/about_bg.png) no-repeat top center;height: 555px;width: 100%;margin-top: -30px;}
    91. 

  91. 

  92. 

  93. .flow{width: 1200px;margin: 0 auto;padding:0px 0 240px 0;color: #4e4e4e;}
    94. 

  94. [mobile="1"] .flow{padding:0px 40px 240px 40px;width: 1120px;}
    95. 

  95. .flow .icons{width: 80px;height: 80px;}
    96. 

  96. .flow ul{list-style: none; margin: 0 auto; display: table; height: 80px}
    97. 

  97. .flow ul li{float: left;}
    98. 

  98. .flow .flow1{background: url(../images/flow1.png) no-repeat top center;}
    99. 

  99. .flow .flow2{background: url(../images/flow2.png) no-repeat top center;}
    100. 

  100. .flow .flow3{background: url(../images/flow3.png) no-repeat top center;}
    101. 

  101. .flow .flow4{background: url(../images/flow4.png) no-repeat top center;}
    102. 

  102. .flow .arrow{background: url(../images/arrow.png) no-repeat center center;width: 14px;height: 80px;padding-right:40px;}
    103. 

  103. .flow ul .text{padding:22px 20px;font-size: 15px;color: #666666;}
    104. 

  104. [mobile="1"] .flow ul .text{font-size: 1.5rem;}
    105. 

  105. .flow .desc{font-size: 18px; line-height: 30px; margin: 10px 0;width:100%;background-color: #f2f2f2;}
    106. 

  106. [mobile="1"] .flow .desc{font-size: 1.8rem; line-height: 3rem; margin: 1rem 0;} 
    107. 

  107. .flow table{width:100%;border-bottom:1px solid #cccccc;border-right:1px solid #cccccc;}
    108. 

  108. .flow table th{font-weight: normal;background-color: #e7e7e7;}
    109. 

  109. .flow table td,.flow table th{border-top:1px solid #cccccc;border-left:1px solid #cccccc; text-align: center;font-size: 16px;color: #4e4e4e;}
    110. 

  110. [mobile="1"] .flow table td,.flow table th{font-size: 1.6rem;}
    111. 

  111. [dpr="3"] .flow table td,[dpr="3"] .flow table th{font-size: 1.45rem;}
    112. 

  112. [dpr="2"] .flow table td,[dpr="2"] .flow table th{font-size: 2rem;}
    113. 

  113. [dpr="1.5"] .flow .notes{font-size: 1.5rem;}
    114. 

  114. .flow .notes{font-size: 14px;color: #999999;line-height: 30px;background-color: #f2f2f2;}
    115. 

  115. [mobile="1"] .flow .notes{font-size: 1.4rem;line-height: 3rem;}
    116. 

  116. .flow .bg{background: url(../images/map.jpg) no-repeat top center;height: 919px;width: 100%;}
    117. 

  117. .flow .position{margin: 0;color: #ffffff;background-color:#465663;width: 425px;height: 100%;filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5;}
    118. 

  118. [dpr="3"] .flow .position,[dpr="1.5"] .flow .position{width: 535px;}
    119. 

  119. .flow .position li{width: 90%;padding-left: 10%}
    120. 

  120. .flow .position .t{font-size: 18px;margin-top: 15px;width: 100%;background-color: #465663;}
    121. 

  121. .flow .position .d{font-size: 14px;line-height:24px;width: 100%;background-color: #465663;}
    122. 

  122. 

  123. [mobile="1"] .flow .position .t{font-size: 1.8rem;margin-top: 1.5rem;}
    124. 

  124. [mobile="1"] .flow .position .d{font-size: 1.4rem;line-height:2.4rem;}
    125.