@charset "UTF-8";
@import url(../style/reset.css);
/*  
* Theme Name: 4399坦克射击测试服邀请
* Description:
* Author:lisaYang
* Update: 2015-12-30
* Author URI: http://weibo.com/yangliping137
*Update By who: 
*/
img { max-width: 100%; display: block; }

.green { color: #67dd25; }

html { font-size: 75%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; *text-overflow: ellipsis; }

html, body { position: relative; width: 100%; height: 100%; /*overflow: hidden;*/ }

body { margin: auto; background-color: #000; color: #fff67a; font: 100%/1.5 "Helvetica Neue",Helvetica,Arial,\5fae\8f6f\96c5\9ed1,sans-serif; }

.wrapper, .content { width: 100%; height: 100%; }

.slide-page { position: relative; width: 100%; height: 100%;  /*overflow: hidden;*/ }
.slide-page-01 { background: url('../images/bg01.jpg') no-repeat; -webkit-background-size: 100%; background-size: 100%; }
.slide-page-02,.slide-page-03{ background: url('../images/bg02.jpg') no-repeat; -webkit-background-size: 100%; background-size: 100%; }

.hdInfo { position: absolute; width: 90%; height: auto; top: 50%; left: 5%; }
.hdInfo img { position: absolute; left: 0; top: 0; }
.hdInfo p { position: relative; z-index: 10; width: 90%; margin: 0 5%; padding-top: 3%; }

.btn { position: relative; z-index: 10; display: block; width: 43.75%; /*height: 100%;*/ margin: 0 auto; background: url('../images/btn01.png') no-repeat; -webkit-background-size: 100%; background-size: 100%; font: bold 150%/350% "微软雅黑"; text-align: center; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); }
.btn1 { position: absolute; left: 6.5%; top: 80%; }
.btn2 { position: absolute; right: 6.5%; top: 80%; background: url('../images/btn02.png') no-repeat; -webkit-background-size: 100%; background-size: 100%; }

a.arrow-next { position: absolute; right: 2%; bottom: 1%; width: 6.7%; height: auto; -moz-animation: 0.15s ease-in 0s alternate none infinite icoBeat; -webkit-animation: 0.15s ease-in 0s alternate none infinite icoBeat; animation: 0.15s ease-in 0s alternate none infinite icoBeat; }

@-moz-keyframes icoBeat { 0% { -moz-transform: translateY(-4px); opacity: .4; }
  100% { -moz-transform: translateY(4px); opacity: 0; } }
@-webkit-keyframes icoBeat { 0% { -webkit-transform: translateY(-4px); opacity: .4; }
  100% { -webkit-transform: translateY(4px); opacity: 0; } }
@keyframes icoBeat { 0% { transform: translateY(-4px); opacity: .4; }
  100% { transform: translateY(4px); opacity: 0; } }
.slogan { position: relative; width: 87.5%; height: auto; margin: 5% auto; text-align: center; }
.slogan img { position: absolute; left: 0; top: 0; }
.slogan p { position: relative; z-index: 10; padding-top: 30%; font-size: 150%; }

.hdRules { position: absolute; left: 6.7%; bottom: 5%; width: 86.71875%; }
.hdRules img { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; }
.hdRules p { position: relative; padding: 0 5%; line-height: 1.4; }
.hdRules p.time { margin-bottom: 2%; font: 117%/210% "微软雅黑"; }
.hdRules .ico { display: inline-block; width: 8px; height: 8px; margin-right: 5px; background-color: #67dd25; border-radius: 50%; }

.userInfoBox { width: 85%; margin: 0 auto 1%; }
.userInfoBox .tit { height: 30px; margin-top: 10px; font-size: 125%; }
.userInfoBox li { position: relative; width: 100%; height: 42px; margin-bottom: 8px; }
.userInfoBox select { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; }
.userInfoBox .sel, .userInfoBox .sel02 { position: relative; display: block; }
.userInfoBox .selIcon { font-size: 0; width: 0; height: 0; line-height: 0; overflow: hidden; display: inline-block; *display: inline; *zoom: 1; vertical-align: -8px; border: 0 dashed transparent; border-width: 8px; border-top-style: solid; border-top-color: #fff67a; }
.userInfoBox .sel, .userInfoBox .txt { width: 100%; height: 100%; font: 16px "微软雅黑"; background: none; border-image: url('../images/input.png') 16 13 round; -moz-border-image: url('../images/input.png') 16 13 round; -webkit-border-image: url('../images/input.png') 16 13 round; border-width: 13px; box-sizing: border-box; color: #fff67a; text-align: center; }
.userInfoBox .sel02 { width: 100%; height: 100%; background: url('../images/iptBg.png') no-repeat; -webkit-background-size: 100%; background-size: 100%; box-sizing: border-box; font: bold 125%/280% "微软雅黑"; color: #fff67a; text-align: center; }

.getGiftBox { position: relative; width: 87.5%; height: auto; margin: 8% auto 10%; }
.getGiftBox img { position: absolute; left: 0; top: 0; z-index: 0; }
.getGiftBox .s_box { position: relative; width: 83%; margin: 0 auto; padding-top: 5%; text-align: center; }
.getGiftBox .s_box .tit { font-size: 150%; margin-bottom: 5%; }
.getGiftBox .s_box .code { padding: 5px 10px; background-color: #a6331c; }
.getGiftBox .s_box p { margin-top: 5%; }

.shareInfo { position: absolute; left: 6.7%; top: 60%; width: 78%; background: none; border-image: url('../images/input.png') 20 13 round; -moz-border-image: url('../images/input.png') 20 13 round; -webkit-border-image: url('../images/input.png') 20 13 round; border-width: 13px; }
.shareInfo h3.tit { font-size: 130%; line-height: 200%; }

/*弹窗提示*/
#pop { display: none; }

.msg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1000; }
.msg .img { position: absolute; left: 50%; top: 0; display: table; width: 85%; height: 100%; margin-left: -42.5%; text-align: center; z-index: 0; }
.msg .img span { display: table-cell; vertical-align: middle; }
.msg .s_msg { position: relative; display: table; width: 100%; height: 100%; font-size: 150%; text-align: center; }
.msg .s_msg p { display: table-cell; vertical-align: middle; }
.msg .closeBtn { position: absolute; right: 10%; top: 0; display: table; width: 9%; height: 100%; margin-top: -16%; }
.msg .closeBtn span { display: table-cell; vertical-align: middle; }

/*分享提示*/
.shareBox { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-top: 120px; z-index: 1000; text-align: center; font-size: 117%; line-height: 215%; }
.shareBox .share_img { position: absolute; right: 30px; top: 10px; width: 152px; height: 119px; }
.shareBox .hd { font: bold 150%/150% "微软雅黑"; }
.shareBox b { text-decoration: underline; }
.shareBox .icon { display: inline-block; width: 15.625%; margin: 10px 5px; }

.layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 999; background: rgba(0, 0, 0, 0.8) !important; background: #000; filter: Alpha(opacity=80); }

@media screen and (min-width: 330px) { html { font-size: 87.5%; } }
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: portrait) { 
  .btn1, .btn2 { top: 78%; }
  .shareInfo { top: 55%; }
  .userInfoBox { margin-bottom: 5%; }
  .getGiftBox { margin-top: 8% !important; }
  .shareInfo { top: 58% !important; } }
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: portrait) { 
  .btn1, .btn2 { top: 75%; }
  .userInfoBox { margin-bottom: 5%; }
  .userInfoBox li { height: 50px; margin-bottom: 15px; }
  .shareInfo { top: 55%; } }
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: portrait) { 
  .btn1, .btn2 { top: 78%; }
  .userInfoBox { margin-bottom: 5%; }
  .userInfoBox li { height: 50px; margin-bottom: 15px; }
  .getGiftBox { margin-bottom: 12%; }
  .getGiftBox .s_box { padding-top: 8%; }
  .shareInfo { width: 79%; top: 55%; } }
@media only screen and (min-device-width: 320px) and (max-device-height: 480px) and (orientation: portrait) { 
  .btn1, .btn2 { top: 80%; }
  .slogan { margin: 0 auto; }
  .userInfoBox { margin-bottom: 1%; }
  .userInfoBox li { height: 35px; margin-bottom: 5px; }
  .getGiftBox { margin-top: 3%; }
  .shareInfo { top: 63%; } }
/* 横屏提示层 */
.hortips { display: none; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1001; width: 100%; height: 100%; background-color: #222; color: #fff; font-size: 2rem; }

.hortips .tips { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }

@media screen and (orientation: landscape) { .hortips { display: block; } }
 
.scroll{ 
  position: absolute; 
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transform:translateY(0px);
  -ms-transform:translateY(0px);   
  -moz-transform:translateY(0px);  
  -webkit-transform:translateY(0px); 
  -o-transform:translateY(0px);
  transition: all .5s ease-in;
  -moz-transition: all .5s ease-in; 
  -webkit-transition: all .5s ease-in; 
  -o-transition: all .5s ease-in;
}

.has-keyboard{
  transform:translateY(-210px);
  -ms-transform:translateY(-210px);   
  -moz-transform:translateY(-210px);  
  -webkit-transform:translateY(-210px); 
  -o-transform:translateY(-210px);
}

.swiper-slide{overflow: hidden;}