lottery.scss 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. @import "../../../sass/base/mixins";
  2. .lottery-wrap {
  3. background: url(./../../img/act/lottery/bg-lottery-wrap.png) center top no-repeat;
  4. background-size: auto px2rem(125);
  5. padding-top: px2rem(16);
  6. .tip-lottery{
  7. color: #7a3800;
  8. font-size: px2rem(30);
  9. display: flex;
  10. justify-content: space-between;
  11. align-items: center;
  12. padding: 0 px2rem(66);
  13. height: px2rem(64);
  14. em{
  15. color: #fff45c;
  16. }
  17. .btn-award{
  18. display: block;
  19. width: px2rem(190);
  20. text-align: center;
  21. line-height: px2rem(64);
  22. color: #FFFFFF;
  23. border-radius: px2rem(5);
  24. @include gradient(#fe2c2c,#be1f1f);
  25. }
  26. }
  27. .lottery-cot {
  28. width: px2rem(726);
  29. height: px2rem(729);
  30. padding: px2rem(84) 0 0 px2rem(96);
  31. background: url(./../../img/act/lottery/bg-lottery.png) no-repeat center;
  32. background-size: 100% auto;
  33. @include clearfix;
  34. margin: 0 auto;
  35. }
  36. .lottery-item {
  37. float: left;
  38. display: flex;
  39. align-items: center;
  40. text-align: center;
  41. font-size: px2rem(36);
  42. line-height: px2rem(50);
  43. color: #000000;
  44. width: px2rem(175);
  45. height: px2rem(175);
  46. vertical-align: top;
  47. margin: 0 px2rem(5) px2rem(5) 0;
  48. background: url(./../../img/act/lottery/bg-lot-item.png) no-repeat;
  49. background-size: 100%;
  50. &.active{
  51. background: url(./../../img/act/lottery/bg-lot-item2.png) no-repeat;
  52. background-size: 100%;
  53. }
  54. &:nth-child(3n) {
  55. margin-right: 0;
  56. }
  57. p{
  58. flex: 1;
  59. }
  60. &.btn-lottery {
  61. border: none;
  62. background: url(./../../img/act/lottery/btn-lottery.png) no-repeat;
  63. background-size: 100% 100%;
  64. &.clicked {
  65. background: url(./../../img/act/lottery/btn-lottery2.png) no-repeat;
  66. background-size: 100% 100%;
  67. }
  68. &.disabled {
  69. background: url(./../../img/act/lottery/btn-lottery3.png) no-repeat;
  70. background-size: 100% 100%;
  71. }
  72. }
  73. }
  74. }
  75. .dialog-wzry-lotmsg{
  76. font-size: px2rem(30);
  77. color: #171717;
  78. p{
  79. line-height: px2rem(42);
  80. }
  81. .list-process{
  82. margin: 0 0 px2rem(30) 0;
  83. li{
  84. display: flex;
  85. font-size: px2rem(28);
  86. line-height: px2rem(40);
  87. }
  88. label{
  89. display: block;
  90. width: px2rem(140);
  91. text-align: right;
  92. }
  93. p{
  94. text-align: left;
  95. flex: 1;
  96. color: #666666;
  97. line-height: px2rem(40);
  98. }
  99. }
  100. }