#left {
  width: 900px;
  float: left
}

#right {
  width: 280px;
  float: right
}

.mt10 {
  margin-top: 10px
}

.mb10 {
  margin-bottom: 10px
}

.act-openD {
  z-index: 1000;
  height: 360px;
  position: fixed;
  bottom: 0;
  right: 0;
  width: 100%;
  _display: none!important;
  -webkit-transition: all ease-in 1s;
  -o-transition: all ease-in 1s;
  transition: all ease-in 1s;
  -webkit-transform-origin: right bottom;
  -ms-transform-origin: right bottom;
  transform-origin: right bottom
}

.act-openD .trig-link {
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  margin-left: 0;
  bottom: 0;
  z-index: 20
}

.act-openD .trig-link a {
  cursor: pointer;
  display: block;
  width: 100%;
  height: 100%
}

.act-openD .extramove,.act-openD .mainbg,.act-openD-big.act-openD .mainbg {
  position: absolute;
  left: 50%;
  bottom: -300px;
  width: 1920px;
  height: 300px;
  margin-left: -960px;
  background-repeat: no-repeat
}

.act-openD .mainbg {
  background: url(../images/mainbg.png) 50% 100% no-repeat
}

.act-openD .extrabg {
  width: 100%;
  height: 100%;
  background: url(../images/extrabg.png) 50% 100% no-repeat;
  opacity: 0
}

@-webkit-keyframes openD-start {
  100% {
      bottom: 0
  }
}

@keyframes openD-start {
  100% {
      bottom: 0
  }
}

.act-openD .btnmove {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 450px;
  height: 310px;
  margin-left: -225px
}

.act-openD .btnbg {
  width: 100%;
  height: 100%;
  background: url(../images/btnbg.png) 50% 50% no-repeat;
  -webkit-animation: move 1s 1.3s linear infinite;
  animation: move 1s 1.3s linear infinite
}

@-webkit-keyframes openD-start {
  100% {
      bottom: 0
  }
}

@keyframes openD-start {
  100% {
      bottom: 0
  }
}

@-webkit-keyframes move {
  0% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }

  50% {
      -webkit-transform: scale(1.07);
      transform: scale(1.07)
  }

  100% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }
}

@keyframes move {
  0% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }

  50% {
      -webkit-transform: scale(1.07);
      transform: scale(1.07)
  }

  100% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }
}

@-webkit-keyframes upDownMove {
  50% {
      -webkit-transform: translateY(10px) translateZ(0);
      transform: translateY(10px) translateZ(0)
  }

  to {
      -webkit-transform: translateY(0) translateZ(0);
      transform: translateY(0) translateZ(0)
  }
}

@keyframes upDownMove {
  50% {
      -webkit-transform: translateY(10px) translateZ(0);
      transform: translateY(10px) translateZ(0)
  }

  to {
      -webkit-transform: translateY(0) translateZ(0);
      transform: translateY(0) translateZ(0)
  }
}

.act-openD-going .mainbg {
  -webkit-animation: openD-start .4s .4s ease-in forwards;
  animation: openD-start .4s .4s ease-in forwards
}

.act-openD-going .extramove {
  -webkit-animation: openD-start .4s .7s ease-in forwards;
  animation: openD-start .4s .7s ease-in forwards
}

.act-openD-going .extrabg-scale {
  opacity: 1;
  -webkit-animation: move 1s 1.3s linear infinite;
  animation: move 1s 1.3s linear infinite
}

.act-openD-going .extrabg-up {
  opacity: 1;
  -webkit-animation: upDownMove 1.4s 1s linear infinite;
  animation: upDownMove 1.4s 1s linear infinite
}

.act-openD .close {
  position: absolute;
  top: 20px;
  left: 50%;
  width: 90px;
  height: 46px;
  margin-left: 510px;
  z-index: 501;
  display: block!important;
  -webkit-animation: close-show 2.5s forwards;
  animation: close-show 2.5s forwards;
  opacity: 0
}

.act-openD .close .btn {
  position: relative;
  z-index: 4;
  height: 30px;
  width: 30px;
  border: 1px solid #f9c5c5;
  line-height: 30px;
  background-color: #f94b53;
  border-radius: 50%;
  text-align: center;
  font-size: 30px;
  color: #fff;
  font-family: 'Times New Roman';
  cursor: pointer
}

.act-openD .close .text {
  position: absolute;
  top: 3px;
  right: 0;
  height: 24px;
  line-height: 24px;
  width: 51px;
  background: rgba(255,255,255,.6);
  border-radius: 12px;
  text-align: center;
  font-size: 12px;
  font-family: \5FAE\8F6F\96C5\9ED1;
  border: 1px solid #f9c5c5;
  padding: 0 5px 0 21px;
  font-weight: 700;
  color: #f94b53
}

.act-openD-end {
  opacity: 0
}

.act-openD2-end {
  -webkit-animation: openD-end 1s forwards;
  animation: openD-end 1s forwards
}

@-webkit-keyframes openD-end {
  100% {
      opacity: 0
  }
}

@keyframes openD-end {
  100% {
      opacity: 0
  }
}

@-webkit-keyframes close-show {
  100% {
      opacity: 1
  }
}

@keyframes close-show {
  100% {
      opacity: 1
  }
}

.act-openD14 .mainbg {
  background: url(../images/mainbg2.png) 50% 100% no-repeat
}

.act-openD14 .extrabg {
  background: url(../images/extrabg2.png) 50% 100% no-repeat
}

.act-openD14 .btnmove {
  width: 320px;
  height: 300px;
  margin-left: -160px
}

.act-openD14 .btnbg {
  background: url(../images/btnbg2.png) 50% 50% no-repeat;
  -webkit-animation-duration: 1.8s;
  animation-duration: 1.8s
}

.act-openD14.act-openD-going .extrabg {
  -webkit-animation: move 1s 1.3s linear infinite;
  animation: move 1s 1.3s linear infinite
}

.lt-sign {
  position: absolute;
  left: 0;
  top: 50%;
  width: 120px;
  height: 32px;
  margin-top: -16px;
  opacity: 0;
  -webkit-animation: activityTrigShow .7s forwards;
  animation: activityTrigShow .7s forwards
}

@-webkit-keyframes activityTrigShow {
  20%,40%,60%,80%,from,to {
      -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
      animation-timing-function: cubic-bezier(.215,.61,.355,1)
  }

  0% {
      opacity: 0;
      -webkit-transform: scale3d(.3,.3,.3);
      transform: scale3d(.3,.3,.3)
  }

  20% {
      -webkit-transform: scale3d(1.1,1.1,1.1);
      transform: scale3d(1.1,1.1,1.1)
  }

  40% {
      -webkit-transform: scale3d(.9,.9,.9);
      transform: scale3d(.9,.9,.9)
  }

  60% {
      opacity: 1;
      -webkit-transform: scale3d(1.03,1.03,1.03);
      transform: scale3d(1.03,1.03,1.03)
  }

  80% {
      -webkit-transform: scale3d(.97,.97,.97);
      transform: scale3d(.97,.97,.97)
  }

  to {
      opacity: 1;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1)
  }
}

@keyframes activityTrigShow {
  20%,40%,60%,80%,from,to {
      -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
      animation-timing-function: cubic-bezier(.215,.61,.355,1)
  }

  0% {
      opacity: 0;
      -webkit-transform: scale3d(.3,.3,.3);
      transform: scale3d(.3,.3,.3)
  }

  20% {
      -webkit-transform: scale3d(1.1,1.1,1.1);
      transform: scale3d(1.1,1.1,1.1)
  }

  40% {
      -webkit-transform: scale3d(.9,.9,.9);
      transform: scale3d(.9,.9,.9)
  }

  60% {
      opacity: 1;
      -webkit-transform: scale3d(1.03,1.03,1.03);
      transform: scale3d(1.03,1.03,1.03)
  }

  80% {
      -webkit-transform: scale3d(.97,.97,.97);
      transform: scale3d(.97,.97,.97)
  }

  to {
      opacity: 1;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1)
  }
}

.ie9 .mod-fixNav .activity-trig-show {
  opacity: 1
}

.ie6 .act-openD-going .btnmove,.ie6 .act-openD-going .extramove,.ie6 .act-openD-going .mainbg,.ie7 .act-openD-going .btnmove,.ie7 .act-openD-going .extramove,.ie7 .act-openD-going .mainbg,.ie8 .act-openD-going .btnmove,.ie8 .act-openD-going .extramove,.ie8 .act-openD-going .mainbg,.ie9 .act-openD-going .btnmove,.ie9 .act-openD-going .extramove,.ie9 .act-openD-going .mainbg {
  bottom: 0
}

.ie6 .act-openD-end,.ie7 .act-openD-end,.ie8 .act-openD-end,.ie9 .act-openD-end {
  display: none!important
}

.ie6 .close,.ie6 .lt-sign,.ie7 .close,.ie7 .lt-sign,.ie8 .close,.ie8 .lt-sign,.ie9 .close,.ie9 .lt-sign {
  opacity: 1
}

.act-openD2-packet-small {
  position: fixed;
  display: none;
  right: 0;
  bottom: -115px;
  width: 200px;
  height: 115px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto;
  z-index: 999
}

.act-openD2-packet-small a {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%
}

.act-openD2-packet-small .close {
  position: absolute;
  right: 6px;
  top: 6px;
  width: 12px;
  height: 12px;
  line-height: 12px;
  color: #fff;
  font-size: 12px;
  cursor: pointer;
  font-family: 'Times New Roman'
}

.act-openD-big.act-openD {
  z-index: 99;
  height: 500px;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: url(../images/bg.png) 50% 50% repeat;
  _display: none!important;
  -webkit-transition: all ease-in 1s;
  -o-transition: all ease-in 1s;
  transition: all ease-in 1s
}

.act-openD-big.act-openD .trig-link {
  height: 100%;
  width: 1200px;
  position: absolute;
  left: 50%;
  margin-left: -600px;
  bottom: 0;
  z-index: 20
}

.act-openD-big.act-openD .trig-link a {
  cursor: pointer;
  display: block;
  width: 100%;
  height: 100%
}

.act-openD-big.act-openD .extramove,.act-openD-big.act-openD .mainbg {
  position: absolute;
  left: 50%;
  bottom: -500px;
  width: 1920px;
  height: 500px;
  margin-left: -960px;
  background-repeat: no-repeat
}

.act-openD-big.act-openD .mainbg {
  background: url(../images/mainbg.png) 50% 100% no-repeat
}

.act-openD-big.act-openD .extramove {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 1920px;
  height: 500px;
  margin-left: -960px;
  background-repeat: no-repeat;
  -webkit-transform: scale(.1);
  -ms-transform: scale(.1);
  transform: scale(.1);
  -webkit-animation: scalcBg-big .4s 1.7s ease-in forwards;
  animation: scalcBg-big .4s 1.7s ease-in forwards
}

.act-openD-big.act-openD .extrabg {
  width: 100%;
  height: 100%;
  background: url(../images/extrabg.png) 50% 100% no-repeat;
  opacity: 0;
  -webkit-animation: move1-big 1s 1.1s linear infinite;
  animation: move1-big 1s 1.1s linear infinite
}

.act-openD-big.act-openD .btnmove {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 280px;
  height: 500px;
  margin-left: -135px
}

.act-openD-big.act-openD .btnbg {
  width: 100%;
  height: 100%;
  background: url(../images/btnbg.png) 50% 50% no-repeat,url(../images/activity/20200618/widget/open/d4/btnbg.png) 50% 50% no-repeat;
  -webkit-animation: move-big 1s 1.1s linear infinite;
  animation: move-big 1s 1.1s linear infinite
}

@-webkit-keyframes openD-start-big {
  100% {
      -webkit-transform: translateY(0) translateZ(0)
  }
}

@keyframes openD-start-big {
  100% {
      -webkit-transform: translateY(0) translateZ(0);
      transform: translateY(0) translateZ(0)
  }
}

@-webkit-keyframes scalcBg-big {
  to {
      -webkit-transform: scale(1);
      transform: scale(1)
  }
}

@keyframes scalcBg-big {
  to {
      -webkit-transform: scale(1);
      transform: scale(1)
  }
}

@-webkit-keyframes bounceInUp-big {
  60%,75%,90%,from,to {
      -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
      animation-timing-function: cubic-bezier(.215,.61,.355,1)
  }

  from {
      opacity: 0;
      bottom: -600px
  }

  60% {
      opacity: 1;
      bottom: 20px
  }

  75% {
      bottom: -10px
  }

  90% {
      bottom: 5px
  }

  to {
      bottom: 0
  }
}

@keyframes bounceInUp-big {
  0% {
      opacity: 0;
      bottom: -600px
  }

  60% {
      opacity: 1;
      bottom: 20px
  }

  75% {
      bottom: -10px
  }

  90% {
      bottom: 5px
  }

  to {
      bottom: 0
  }
}

@-webkit-keyframes openD-shake-big {
  20% {
      -webkit-transform: translateY(0) rotateZ(15deg);
      transform: translateY(0) rotateZ(15deg)
  }

  40% {
      -webkit-transform: translateY(0) rotateZ(-10deg);
      transform: translateY(0) rotateZ(-10deg)
  }

  60% {
      opacity: 1;
      -webkit-transform: translateY(0) rotateZ(5deg);
      transform: translateY(0) rotateZ(5deg)
  }

  80% {
      -webkit-transform: translateY(0) rotateZ(-5deg);
      transform: translateY(0) rotateZ(-5deg)
  }

  to {
      -webkit-transform: translateY(0) rotateZ(0);
      transform: translateY(0) rotateZ(0)
  }
}

@keyframes openD-shake-big {
  20% {
      -webkit-transform: translateY(0) rotateZ(15deg);
      transform: translateY(0) rotateZ(15deg)
  }

  40% {
      -webkit-transform: translateY(0) rotateZ(-10deg);
      transform: translateY(0) rotateZ(-10deg)
  }

  60% {
      opacity: 1;
      -webkit-transform: translateY(0) rotateZ(5deg);
      transform: translateY(0) rotateZ(5deg)
  }

  80% {
      -webkit-transform: translateY(0) rotateZ(-5deg);
      transform: translateY(0) rotateZ(-5deg)
  }

  to {
      -webkit-transform: translateY(0) rotateZ(0);
      transform: translateY(0) rotateZ(0)
  }
}

@-webkit-keyframes move-big {
  0% {
      -webkit-transform: scale(1)
  }

  50% {
      -webkit-transform: scale(.95)
  }

  100% {
      -webkit-transform: scale(1)
  }
}

@keyframes move-big {
  0% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }

  50% {
      -webkit-transform: scale(.95);
      transform: scale(.95)
  }

  100% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }
}

@-webkit-keyframes move1-big {
  0% {
      opacity: 1;
      -webkit-transform: scale(1.04)
  }

  50% {
      opacity: 1;
      -webkit-transform: scale(1)
  }

  100% {
      opacity: 1;
      -webkit-transform: scale(1.04)
  }
}

@keyframes move1-big {
  0% {
      opacity: 1;
      -webkit-transform: scale(1.04);
      transform: scale(1.04)
  }

  50% {
      opacity: 1;
      -webkit-transform: scale(1);
      transform: scale(1)
  }

  100% {
      opacity: 1;
      -webkit-transform: scale(1.04);
      transform: scale(1.04)
  }
}

.act-openD-big.act-openD.act-openD-going .mainbg {
  -webkit-animation: bounceInUp-big .5s .4s ease-in forwards,openD-shake-big .6s 1s ease-in forwards;
  animation: bounceInUp-big .5s .4s ease-in forwards,openD-shake-big .6s 1s ease-in forwards
}

.act-openD-big.act-openD .close {
  position: absolute;
  top: 20px;
  left: 50%;
  width: 90px;
  height: 46px;
  margin-left: 510px;
  z-index: 501;
  cursor: pointer;
  display: block!important
}

.act-openD-big.act-openD .close .btn {
  position: relative;
  z-index: 4;
  height: 30px;
  width: 30px;
  border: 1px solid #f9c5c5;
  line-height: 30px;
  background-color: #f94b53;
  border-radius: 50%;
  text-align: center;
  font-size: 30px;
  color: #fff;
  font-family: 'Times New Roman'
}

.act-openD-big.act-openD .close .text {
  position: absolute;
  top: 3px;
  right: 0;
  height: 24px;
  line-height: 24px;
  width: 51px;
  background: rgba(255,255,255,.6);
  border-radius: 12px;
  text-align: center;
  font-size: 12px;
  font-family: \5FAE\8F6F\96C5\9ED1;
  border: 1px solid #f9c5c5;
  padding: 0 5px 0 21px;
  font-weight: 700;
  color: #f94b53
}

.act-openD-big.act-openD-end {
  opacity: 0
}

.act-openD-big.act-openD2-end {
  -webkit-animation: openD-end-big 1s forwards;
  animation: openD-end-big 1s forwards
}

@-webkit-keyframes openD-end-big {
  100% {
      opacity: 0
  }
}

@keyframes openD-end-big {
  100% {
      opacity: 0
  }
}

@-webkit-keyframes activityTrigShow-big {
  20%,40%,60%,80%,from,to {
      -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
      animation-timing-function: cubic-bezier(.215,.61,.355,1)
  }

  0% {
      opacity: 0;
      -webkit-transform: scale3d(.3,.3,.3);
      transform: scale3d(.3,.3,.3)
  }

  20% {
      -webkit-transform: scale3d(1.1,1.1,1.1);
      transform: scale3d(1.1,1.1,1.1)
  }

  40% {
      -webkit-transform: scale3d(.9,.9,.9);
      transform: scale3d(.9,.9,.9)
  }

  60% {
      opacity: 1;
      -webkit-transform: scale3d(1.03,1.03,1.03);
      transform: scale3d(1.03,1.03,1.03)
  }

  80% {
      -webkit-transform: scale3d(.97,.97,.97);
      transform: scale3d(.97,.97,.97)
  }

  to {
      opacity: 1;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1)
  }
}

@keyframes activityTrigShow-big {
  20%,40%,60%,80%,from,to {
      -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
      animation-timing-function: cubic-bezier(.215,.61,.355,1)
  }

  0% {
      opacity: 0;
      -webkit-transform: scale3d(.3,.3,.3);
      transform: scale3d(.3,.3,.3)
  }

  20% {
      -webkit-transform: scale3d(1.1,1.1,1.1);
      transform: scale3d(1.1,1.1,1.1)
  }

  40% {
      -webkit-transform: scale3d(.9,.9,.9);
      transform: scale3d(.9,.9,.9)
  }

  60% {
      opacity: 1;
      -webkit-transform: scale3d(1.03,1.03,1.03);
      transform: scale3d(1.03,1.03,1.03)
  }

  80% {
      -webkit-transform: scale3d(.97,.97,.97);
      transform: scale3d(.97,.97,.97)
  }

  to {
      opacity: 1;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1)
  }
}

.ie10 .act-openD-big .mainbg {
  bottom: 0;
  opacity: 1;
  -webkit-animation: none;
  animation: none
}

.ie9 .act-openD-big .mod-fixNav .activity-trig-show {
  opacity: 1
}

.ie9 .act-openD-big.act-openD-going .btnmove,.ie9 .act-openD-big.act-openD-going .extramove,.ie9 .act-openD-big.act-openD-going .mainbg {
  bottom: 0;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0)
}

.ie9 .act-openD-big .extramove {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1)
}

.ie9 .act-openD-big .extramove .extrabg {
  opacity: 1
}

.ie9 .act-openD-big .btnmove {
  bottom: 50px
}

.ie6 .act-openD-big.act-openD-going .btnmove,.ie6 .act-openD-big.act-openD-going .extramove,.ie6 .act-openD-big.act-openD-going .mainbg,.ie7 .act-openD-big.act-openD-going .btnmove,.ie7 .act-openD-big.act-openD-going .extramove,.ie7 .act-openD-big.act-openD-going .mainbg,.ie8 .act-openD-big.act-openD-going .btnmove,.ie8 .act-openD-big.act-openD-going .extramove,.ie8 .act-openD-big.act-openD-going .mainbg,.ie9 .act-openD-big.act-openD-going .btnmove,.ie9 .act-openD-big.act-openD-going .extramove,.ie9 .act-openD-big.act-openD-going .mainbg {
  bottom: 0
}

.ie6 .act-openD-big.act-openD-end,.ie7 .act-openD-big.act-openD-end,.ie8 .act-openD-big.act-openD-end,.ie9 .act-openD-big.act-openD-end {
  display: none!important
}