Startseite Erkunden Hilfe
Anmelden
caimei365
/
caimei365-www
3
0
Fork 0
Dateien Issues 0 Pull-Requests 0 Wiki
Struktur: 5b9598387b
Branches Tags
caimei365-www
/
src
/
main
/
resources
/
static
/
css
/
encyclopedia
/
detail.css

detail.css 9.8 KB
Verlauf Originalformat

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394 
  1. @charset "UTF-8";
    2. 

  2. @media screen and (min-width:768px){
    3. 

  3. .flex-between-center,.article .section.description .content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    4. 

  4. .container,.article{width:1200px;margin:0 auto}
    5. 

  5. .article{margin-top:16px;background:#fff}
    6. 

  6. .article .section{padding:24px}
    7. 

  7. .article .section .title h2{font-size:20px;font-weight:bold;color:#4a4f58}
    8. 

  8. .article .section .title .line{width:100%;height:1px;background:#e3e6eb;margin-top:4px}
    9. 

  9. .article .section .title .line::before{content:"";display:block;width:20px;height:1px;background:#e15616}
    10. 

  10. .article .section .content{padding-top:24px;word-break: break-all;}
    11. 

  11. .article .section .content .row{margin:16px 0}
    12. 

  12. .article .section .content p{color:#4a4f58;font-size:14px;line-height:24px}
    13. 

  13. .article .section .content h1,.article .section .content h2,.article .section .content h3,.article .section .content h4,.article .section .content h5,.article .section .content h6{margin:16px 0;font-weight:bold}
    14. 

  14. .article .section.description .content{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}
    15. 

  15. .article .section.description .content .content-left{width:986px}
    16. 

  16. .article .section.description .content .content-left .desc{text-align:justify;font-size:14px;line-height:24px}
    17. 

  17. .article .section.description .content .content-left .names{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    18. 

  18. .article .section.description .content .content-left .alias{color:#93979f;margin-left:40px}
    19. 

  19. .article .section.description .content .cover{width:120px;height:120px;border:1px dashed #93979f;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}
    20. 

  20. .article .section.description .content .cover img{width:120px;height:120px}
    21. 

  21. .article .section.params .tr{width:100%;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;border-left:1px solid #e3e6eb;flex-wrap: wrap;}
    22. 

  22. .article .section.params .tr:first-child{border-top:1px solid;border-left:1px solid;border-color:#e3e6eb}
    23. 

  23. .article .section.params .tr .group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:50%}
    24. 

  24. .article .section.params .tr .th,.article .section.params .tr .td{width:50%;line-height:40px;font-size:14px;height:40px;border-right:1px solid;border-bottom:1px solid;border-color:#e3e6eb;-webkit-box-sizing:border-box;box-sizing:border-box}
    25. 

  25. .article .section.params .tr .th a,.article .section.params .tr .td a{color:#e15616}
    26. 

  26. .article .section.params .tr .th{background:#f4f5f8}
    27. 

  27. .article .section.params .tr .td{background:#ffffff}
    28. 

  28. .article .section.approve .content .name{font-size:14px;line-height:24px}
    29. 

  29. .article .section.approve .content a{color:#e15616}
    30. 

  30. .article .section.approve .content .img-list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    31. 

  31. .article .section.approve .content .img-list img{width:120px;height:120px;border:1px dashed #93979f;-webkit-box-sizing:border-box;box-sizing:border-box;margin:16px 16px 0 0}
    32. 

  32. .article .section.effect .content img{display:block;width:100%}
    33. 

  33. .article .section.question .content .collapse{margin-bottom:12px}
    34. 

  34. .article .section.question .content .collapse dt,.article .section.question .content .collapse dd{position:relative;font-size:14px;line-height:24px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 32px;text-align:justify}
    35. 

  35. .article .section.question .content .collapse dt span,.article .section.question .content .collapse dd span{display:inline-block;width:20px;height:20px;margin-right:8px;text-align:center;line-height:20px;border-radius:2px;color:#fff;font-size:12px;position:absolute;top:2px;left:0}
    36. 

  36. .article .section.question .content .collapse dt{font-weight:bold}
    37. 

  37. .article .section.question .content .collapse dt span{background:#ffa457}
    38. 

  38. .article .section.question .content .collapse dt .icon{position:absolute;right:0;top:2px;cursor:pointer}
    39. 

  39. .article .section.question .content .collapse dd{padding-right:0;margin-top:4px}
    40. 

  40. .article .section.question .content .collapse dd span{background:#34cc8c}
    41. 

  41. .contact-popup{display: none; position:fixed;top: 50%;left: 50%;z-index: 99999; transform: translate(-50%,-50%); width:314px;height:418px;overflow:hidden;background:url(/img/encyclopedia/contact.png) no-repeat center}
    42. 

  42. .contact-popup .close{position:absolute;display:block;width:30px;height:30px;text-align:center;line-height:30px;top:10px;right:20px;font-size:28px;color:#2c3038;cursor:pointer}
    43. 

  43. .contact-popup .content{margin-top:130px}
    44. 

  44. .contact-popup .content p{font-size:16px;text-align:center;line-height:32px;color:#9aa5b5;margin:0}
    45. 

  45. .contact-popup .content p.tel{color:#e15616}
    46. 

  46. .contact-popup .content p.time{color:#2c3038}
    47. 

  47. }
    48. 

  48. @media screen and (max-width:768px){
    49. 

  49. .flex,.flex-start-center,.article .section.approve .img-list,.article .section.params .tr .group,.flex-between-center,.flex-center{display:-webkit-box;display:-ms-flexbox;display:flex}
    50. 

  50. .flex-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    51. 

  51. .flex-between-center{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    52. 

  52. .flex-start-center,.article .section.approve .img-list,.article .section.params .tr .group{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    53. 

  53. body{padding-top:40.3vw}
    54. 

  54. .navigate{display:block;background:#fff;top:29.5vw;position:fixed;-webkit-box-shadow:1vw 0 2vw rgba(0,0,0,0.1);box-shadow:1vw 0 2vw rgba(0,0,0,0.1)}
    55. 

  55. .navigate ul{overflow-x:scroll;width:100vw;height:10.8vw;padding:4vw 4vw 0;-webkit-box-sizing:border-box;box-sizing:border-box;white-space:nowrap}
    56. 

  56. .navigate ul::-webkit-scrollbar{display:none}
    57. 

  57. .navigate ul li{position:relative;display:inline-block;height:6.8vw;margin-right:5.6vw}
    58. 

  58. .navigate ul li:last-child{margin-right:0}
    59. 

  59. .navigate ul li::after{content:"";position:absolute;left:50%;bottom:0.4vw;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);display:block;width:8.8vw;height:0.4vw;background:#fff}
    60. 

  60. .navigate ul li a{display:block;font-size:3.2vw;line-height:5vw;color:#9498a0}
    61. 

  61. .navigate ul li.active a{color:#e15616}
    62. 

  62. .navigate ul li.active::after{background:#e15616}
    63. 

  63. .article{padding:4vw;margin-top:2.4vw;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box}
    64. 

  64. .article .section .title h2{font-size:3.6vw;font-weight:bold}
    65. 

  65. .article .section .title .line{width:100%;height:1px;margin-top:1vw;background:#e3e6eb}
    66. 

  66. .article .section .title .line::before{content:"";display:block;width:3.5vw;height:0.2vw;background:#e15616}
    67. 

  67. .article .section .content{padding:3.2vw 0; word-break: break-all;}
    68. 

  68. .article .section .content h1,.article .section .content h2,.article .section .content h3,.article .section .content h4,.article .section .content h5,.article .section .content h6{font-weight:bold;margin:3.2vw 0}
    69. 

  69. .article .section .content p{font-size:3.2vw;line-height:5.6vw;text-align:justify;margin:1.6vw 0}
    70. 

  70. .article .section.description .names{font-size:3.2vw;line-height:5.6vw}
    71. 

  71. .article .section.description .names .alias{color:#93979f}
    72. 

  72. .article .section.description .desc{text-align:justify;font-size:3.2vw;line-height:5.6vw;margin:3.2vw 0}
    73. 

  73. .article .section.description .cover img{display:block;width:23.6vw;height:23.6vw;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px dashed #e3e6eb}
    74. 

  74. .article .section.params .tr{line-height:5.6vw}
    75. 

  75. .article .section.params .tr .group{font-size:3.2vw;margin:1.6vw 0}
    76. 

  76. .article .section.params .tr .group .th::after{content:"："}
    77. 

  77. .article .section.params .tr .group .td>a{ color: #e15616;}
    78. 

  78. .article .section.approve .name{font-size:3.2vw}
    79. 

  79. .article .section.approve .img-list img{display:block;width:23.6vw;height:23.6vw;border:1px dashed #e3e6eb;-webkit-box-sizing:border-box;box-sizing:border-box;margin-right:2.4vw;margin-top:2.4vw}
    80. 

  80. .article .section.effect img{display:block;max-width:100%}
    81. 

  81. .article .section.question .collapse dt,.article .section.question .collapse dd{font-size:3.2vw}
    82. 

  82. .article .section.question .collapse dt span,.article .section.question .collapse dd span{display:inline-block;vertical-align:middle;width:4vw;height:4vw;border-radius:0.2vw;text-align:center;line-height:4vw;color:#fff;margin-right:2.4vw}
    83. 

  83. .article .section.question .collapse dt{position:relative;padding-right:6.4vw;height:6.4vw;line-height:6.4vw;margin:1.6vw 0}
    84. 

  84. .article .section.question .collapse dt span{background:#ffa457}
    85. 

  85. .article .section.question .collapse dt .icon{position:absolute;right:0;top:0}
    86. 

  86. .article .section.question .collapse dd{line-height:5.6vw;margin:1.6vw 0;text-align:justify}
    87. 

  87. .article .section.question .collapse dd span{background:#34cc8c}
    88. 

  88. .contact-popup{display: none; position:fixed;top: 50%;left: 50%;z-index: 99999; transform: translate(-50%,-50%); width:80vw;height:100vw;overflow:hidden;background:url(/img/contact.png) no-repeat center;background-size:80vw auto}
    89. 

  89. .contact-popup .close{position:absolute;display:block;width:8vw;height:8vw;text-align:center;line-height:8vw;top:0;right:5vw;font-size:8vw;color:#2c3038;cursor:pointer}
    90. 

  90. .contact-popup .content{margin-top:30vw}
    91. 

  91. .contact-popup .content p{font-size:4.2vw;text-align:center;line-height:8vw;color:#9aa5b5;margin:0}
    92. 

  92. .contact-popup .content p.tel{color:#e15616}
    93. 

  93. .contact-popup .content p.time{color:#2c3038}
    94. 

  94. }
    95.