/*
  auther:f7
  date:2016.1
*/
 html, body, a, img { -webkit-user-select: none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-touch-callout: none; -moz-touch-callout: none; -ms-touch-callout: none; touch-callout: none; -webkit-tap-highlight-color: rgba(0,0,0,0); -moz-tap-highlight-color: rgba(0,0,0,0); -ms-tap-highlight-color: rgba(0,0,0,0); tap-highlight-color: rgba(0,0,0,0); -webkit-user-drag: none; -moz-user-drag: none; -ms-user-drag: none; user-drag: none;}


html{ font-family: "Lato", sans-serif;/* 1 */ -ms-text-size-adjust:100%;/* 2 */ -webkit-text-size-adjust:100%;/* 2 */}
html,
body,
.main { width:100%; height:100%;}
html,
body { overflow:hidden; -webkit-overflow-scrolling:auto;}
body { background:#000; font-family:"Microsoft YaHei";}
body { max-width:640px; margin:auto; position:relative;}
.scene { width:100%; height:100%; position:absolute; top:0; left:0; max-width:600px; max-height:100%;}

/**/
.sharelogo { width:100%; height:100%; position:absolute; top:200%; left:200%;}

body.landscape { min-height:0; max-width:100%;}
/*body.landscape div,
body.landscape a { display:none !important;}*/
body.landscape .landscape { display:block !important; width:100%; height:100%; background:#000 url("../img/block.jpg") no-repeat center center; position:fixed; top:0; left:0; z-index: 999;}

p { margin:0;}
#js-global-size { position:fixed; top:0; left:0; max-width:100%; max-height:100%; visibility:hidden;}


.scene-hide { display:none !important;}

.scene-scale .scene-con { opacity:0; -webkit-transform-origin: 50% 100%; -webkit-transform: translateY(20%) perspective(600px) rotateX(90deg); transform: translateY(20%) perspective(600px) rotateX(90deg);}

.main,
.scene { -webkit-transition-duration:600ms; -moz-transition-duration:600ms; transition-duration:600ms;}
.scene-con { width:100%; height:100%; opacity:1; -webkit-transform:scale(1) translate(0, 0) perspective(0) rotateX(0deg); transform:scale(1) translate(0, 0) perspective(0) rotateX(0deg);}
.scene img { display:block; margin:auto; max-width:100%; max-height:100%;}

body .scene-middle {
  display:-webkit-box;
  -webkit-box-orient:horizontal;
  -webkit-box-pack:center;
  -webkit-box-align:center;
  
  display:-moz-box;
  -moz-box-orient:horizontal;
  -moz-box-pack:center;
  -moz-box-align:center;
  
  display:-o-box;
  -o-box-orient:horizontal;
  -o-box-pack:center;
  -o-box-align:center;
  
  display:-ms-box;
  -ms-box-orient:horizontal;
  -ms-box-pack:center;
  -ms-box-align:center;
  
  display:box;
  box-orient:horizontal;
  box-pack:center;
  box-align:center;
}


/**/
.loading { width:100%; height:100%; background:#000; position:fixed; top:0; left:0; z-index:9999;}
.loading img { width:28%; margin:0 0 15%;}

.loading .percent { padding-top:30%; text-align:center; line-height:2.6em; font-size:1.4em; color:#fff;}
.loading .percent em { display:block; font-style:normal;}

.loading .schedule { width:70%; margin:auto;}
.loading .filler { background-color:#ff5300;}
.schedule { height:20px; background:#ddd; overflow:hidden; border-radius:16px; -webkit-border-radius:16px; box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);}

.filler { -webkit-animation:progress-bar-stripes 2s linear infinite; background-image:linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size:40px 40px; background-color:#5bc0de; float:left; height:100%; color:#fff; box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15); -webkit-box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15); transition:width 0.6s ease;}

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}


/**/
.music-but { position:absolute; top:3%; right:5%; z-index:11; width:15%; display:none;}
.scene .music-but { display:block;}
.music-play,
.music-pause { display:none;}


/**/
.page { position:absolute; left:0; bottom:8%; width:100%; z-index:100; display:block;}
.pageBut { width:12%; position:absolute; left:44%; bottom:26%;}
.pageIco { width:25%; position:absolute; right:9%; bottom:9%;}

.pageButIphone { 
  margin:7px auto; 
  height:50px;
  line-height:50px; 
  text-align:center; 
  font-size:24px; 
  color:#fff;
  -webkit-background-clip: text; 
  -webkit-text-fill-color: transparent;
  background-color:#fff;
  background-image: -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.6) 30%, #666 50%, rgba(0, 0, 0, 0.6) 70%);   
  background-blend-mode: hard-light; 
  background-size: 200%;
  -webkit-animation: shine 4s infinite;
}

@-webkit-keyframes shine {
  from {background-position: 100%;}
  to {background-position: 0;}
}

.upBtnAnimate{
    -webkit-animation:upBtnAnimate 1.5s ease-in-out infinite;
    -moz-animation:upBtnAnimate 1.5s ease-in-out infinite;
    animation:upBtnAnimate 1.5s ease-in-out infinite;
}

@-webkit-keyframes upBtnAnimate {
    0% {opacity: 0;}
    50% {opacity: 0.8;}
    100% {opacity: 0;-webkit-transform: translate3d(0px, -15px, 0px);-moz-transform: translate3d(0px, -15px, 0px);transform: translate3d(0px, -15px, 0px);}
}
@-moz-keyframes upBtnAnimate {
    0% {opacity: 0;}
    50% {opacity: 0.8;}
    100% {opacity: 0;-webkit-transform: translate3d(0px, -15px, 0px);-moz-transform: translate3d(0px, -15px, 0px);transform: translate3d(0px, -15px, 0px);}
}
@keyframes upBtnAnimate {
    0% {opacity: 0;}
    50% {opacity: 0.8;}
    100% {opacity: 0;-webkit-transform: translate3d(0px, -15px, 0px);-moz-transform: translate3d(0px, -15px, 0px);transform: translate3d(0px, -15px, 0px);}
}

.placeholder { filter:alpha(opacity=0); opacity:0;}


/**/
.cover { position:absolute; width:100%; height:100%; top:0; left:0;}
.cover-shade,
.cover-font01,
.cover-font02,
.cover-font03 { width:100%; height:100%; position:absolute; top:0; left:0;}


/**/
.weixin-list { position:relative; height:100%;}
.weixin-list-bg,
.weixin-list-mask { width:100%; height:100%; position:absolute; top:0; left:0;}
.weixin-list-hand { width:25%; position:absolute; top:0; left:35%; top:5%;}

/**/
.weixin-mess { position:relative; height:100%;}
.weixin-mess-bg,
.weixin-mess-con { width:100%; height:100%; position:absolute; top:0; left:0;}
.weixin-mess-footer { width:100%; position:fixed; left:0px; bottom:0px; z-index:990;}

.mess-time { margin:2% 0 0; text-align:center;}
.mess-time span { display:inline-block; padding:5px 10px; font-size:12px; border-radius:2px; background-color:#d4d4d4; line-height:140%; color:#fff;}

.mess-mod { position:relative; margin:20px 0 20px 10px; overflow:hidden;}
.mess-mod .logo { background: url("../img/touxiang-zl.jpg") no-repeat; background-size:50px; width:50px; height:50px;}
.mess-mod .content { position:relative; margin-left:15px; padding:4% 5% 6%; border-radius:6px; font-size:1em; max-width:65%; border:1px solid #d0d0d0;}
.mess-mod .content p { margin:0px; line-height:140%;}

.mess-mod-left .logo,
.mess-mod-left .content { float:left; background-color:#fff;}
.mess-mod-left { position:relative;}
.mess-mod-left .ico-bubl { display:block; background:url("../img/ico-bubl.png") no-repeat; background-size:11px; position: absolute; width:11px; height:17px; left:-11px; top:19px; z-index:991;}
.mess-mod-left .ico-bubl-red { display:block; background:url("../img/ico-bubl-red.png") no-repeat; background-size:9px; position: absolute; width:9px; height:14px; left:-8px; top:19px; z-index:991;}

.mess-mod-hongbao .content { padding:0; width:51%; border-radius:0; border:0; background-color:none;}

#introduce { margin-top:2%;}

.hb-dialog { display:none; width:100%; height:100%; position:absolute; top:0; left:0; z-index:992;}
.hb-dialog img { display:block; margin:auto; max-width:100%; max-height:100%;}
.hb-dialog-tit { width:100%; position:absolute; bottom:36%; left:0; text-align:center; font-size:16px; color:#f3b8b5;}
.hb-dialog-tit strong { display:block; padding-top:12px; font-size:22px; color:#fff;}
.hb-dialog-btn { display:block; width:28%; position:absolute; left:36%; bottom:14%;}
.hb-dialog-tx { width:36%; position:absolute; left:32%; top:18%; }

.hb-dialog-bg div { width:100%; height:100%; position:absolute; top:0; left:0;}
.hb-dialog-bg .bg-top { background:url("../img/hb_bg_top.png") left top no-repeat; background-size:100%;}
.hb-dialog-bg .bg-bot { background:url("../img/hb_bg_bot.png") left bottom no-repeat; background-size:100%;}


/**/
.result { width:100%; height:100%; position:absolute; left:0; top:0; background-color:#ebebeb;}
.result-text { display:none; width:80%; position:absolute; left:10%; top:32%;}
.result-text p { text-indent:2em; line-height:160%; font-weight:bold; color:#333;}

/**/
.result-list { display:none; width:100%; border-top:1px solid #F3F3F3; position:absolute; left:0; top:31.5%;}
.result-list li { display:table; width:92%; padding:4%; border-bottom:1px solid #F3F3F3; overflow:hidden;}
.result-list li i { display:table-cell; width:40px; line-height:40px; font-style:normal; font-weight:bold; text-align:center; border-radius:100%; background-color:#d55645; color:#fff;}
.result-list li span { display:table-cell; vertical-align:middle; font-weight:bold;}
.result-list li span.rl-th { width:40px; padding-right:10px;}

.hb-btn-chai { width:40%; position:absolute; left:9%; bottom:4%;}
.hb-btn-khysq { width:40%; position:absolute; left:52%; bottom:4%;}

/**/
.share-but { width:18%; max-width:114px; position:absolute; right:4%; top:4%;}
.goback-but { width:18%; max-width:114px; position:absolute; left:4%; top:4%;}

.fllow-but-hqzx { width:28%; position:absolute; left:16%; top:40%; display:none;}
.fllow-but-zhw { width:28%; position:absolute; /*right:16%;*/ top:40%; right:36%;}

.fengdi .hb-btn-chai,
.fengdi .hb-btn-khysq { bottom:27%; }

/**/
.shouqi-text,
.shouqi-list { width:100%; position:absolute; left:0; top:0;}

.shouqi-title { width:100%; position:absolute; left:0; top:27.5%; font-weight:normal; text-align:center; font-weight:bold; color:#d65847;}

.shouqi-list { width:100%; position:absolute; left:0; top:37%;}
.shouqi-list p { width:100%; height:100%; position:absolute; left:0; top:0; }
.shouqi-list a { display:block; height:16.6%; text-indent:-9999em; overflow:hidden;}

.cover-time { width:100%; position:absolute; left:0; top:3.5%; font-size:5em; color:#fff; text-align:center;}
.cover-date { width:100%; position:absolute; left:0; top:19.6%; font-size:1em; color:#fff; text-align:center;}

@media screen and (max-height:480px) {/* 高度小于480时 */
  .mess-mod .content p,
  .result-list li span { font-size:14px;}
  .pageBut { bottom:18%;}
  .pageIco { bottom:4%;}
  .shouqi-title { top:26.5%;}
  .result-text p { font-size:1.3em;}
}

@media screen and (min-height:550px) {/* 高度大于550时 */
  .result-text p { font-size:1.3em;}
}

@media screen and (min-height:600px) {/* 高度大于600时 */
  .result-text p { font-size:1.5em;}
  .hb-btn-chai,
  .hb-btn-khysq { bottom:6%;}
}



.page-share { background:rgba(255,255,255,.8); box-shadow:0 2px 4px #666; position:absolute; top:0; left:0; width:100%; padding:1rem; display:none; z-index:121;}
.bshare-custom { width:100%; overflow:hidden;}
.page-share .bshare-custom.icon-medium-plus a { float:left; margin:3% 7%; width:50px; height:50px; padding-left:0;}
.page-share .bshare-custom a.bshare-qzone { background:url("../img/qzone.gif") no-repeat;}
.page-share .bshare-custom a.bshare-sinaminiblog { background:url("../img/sinaminiblog.gif") no-repeat;}
.page-share .bshare-custom a.bshare-douban { background:url("../img/douban.gif") no-repeat;}
.page-share .bshare-custom a.bshare-renren { background:url("../img/renren.gif") no-repeat;}
.page-share .bshare-custom a.bshare-qqmb { background:url("../img/qqmb.gif") no-repeat;}
.page-share .bshare-custom a.bshare-neteasemb { background:url("../img/neteasemb.gif") no-repeat;}

.bdsharebuttonbox { width:100%; overflow:hidden;}
.page-share .bdsharebuttonbox a { float:left; margin:3% 7%; width:50px; height:50px; padding-left:0;}
.page-share .bdsharebuttonbox a.bds_qzone { background:url("../img/qzone.gif") no-repeat;}
.page-share .bdsharebuttonbox a.bds_tsina { background:url("../img/sinaminiblog.gif") no-repeat;}
.page-share .bdsharebuttonbox a.bds_douban { background:url("../img/douban.gif") no-repeat;}
.page-share .bdsharebuttonbox a.bds_renren { background:url("../img/renren.gif") no-repeat;}
.page-share .bdsharebuttonbox a.bds_tqq { background:url("../img/qqmb.gif") no-repeat;}
.page-share .bdsharebuttonbox a.bds_h163 { background:url("../img/neteasemb.gif") no-repeat;}

/**/
.page-share-wx { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.7) url("../img/share-wx.png") no-repeat center 20px; background-size:60% auto; z-index:10; display:none;}


/**/
.fadeIn { -webkit-animation-duration: 1s;
  animation-duration: 1s;}
.fadeInLeft { -webkit-animation-duration: .6s;
  animation-duration: .6s;}
.animated.bounceIn { -webkit-animation-duration: .7s;
  animation-duration: .7s;}
.rollInRight,
.rollInLeft { -webkit-animation-duration: 1s;
  animation-duration: 1s;}