﻿@charset "utf-8";
/* CSS Document */
body, html{overflow:hidden; height:100%}
.wrap{overflow:hidden; position:relative; height:100%; position:relative; width:640px; margin:0 auto}
.content{position:absolute; left:0; top:0; z-index:100; padding-top:275px; background:#cc0000 url(http://www.wanlitong.com/app_images/wanlitong/v40/wap/event/2014/11/swiping/bg_banner.jpg) no-repeat 0 0}
.content{transition:transform .3s; -moz-transition:-moz-transform .3s; -webkit-transition:-webkit-transform .3s}

.point{margin:0 20px 10px}
.point ul{display:none; float:right; position:relative; width:301px; padding:5px; border-radius:0 17px 0 0; background-color:#fff}
.point ul:after{content:"."; display:block; position:absolute; right:3px; top:3px; width:0; height:0; border-bottom:8px solid transparent; border-top:8px solid transparent; border-right:8px solid transparent; border-left:8px solid #dd2f0b; font-size:0px; line-height:0px}
.point ul:after{transform:rotate(135deg); -ms-transform:rotate(135deg); -webkit-transform:rotate(135deg); -o-transform:rotate(135deg); -moz-transform:rotate(135deg)}
.point li{color:#777; font:400 14px/20px Microsoft Yahei}
.point li em{color:#f60; font-weight:700}
.point li span{color:#999; font-size:12px}
.point li i{display:inline-block; width:14px; height:14px; margin-right:5px; background-color:#f60; color:#fff; font:400 14px/14px Arial; text-align:center}
.point li a{color:#999; text-decoration:underline}
.point dl{float:right; margin-right:10px}
.point dt{color:#fff; font:400 14px/28px Microsoft Yahei; text-shadow:1px 1px 1px #333}
.point dd a{display:block; position:relative; width:140px; height:36px; margin:0 auto; border-radius:18px; background-color:#ff0; box-shadow:0 1px 3px #a45217; color:#d61807; font:400 20px/36px Microsoft Yahei; text-align:center}
.point dd a:after{content:"."; display:block; position:absolute; right:15px; top:50%; width:0; height:0; margin-top:-5px; border-bottom:5px solid transparent; border-top:5px solid transparent; border-right:5px solid transparent; border-left:5px solid #d61807; font-size:0px; line-height:0px}

.intro{margin:0 20px 20px; padding:0 0 5px 15px; background:#fff url(/app_images/wanlitong/v40/wap/event/2014/11/swiping/bg_card.jpg) no-repeat 375px 15px}
.intro p{color:#cc0000; font:700 22px/52px Microsoft Yahei}
.intro dl{padding-bottom:10px}
.intro dt{position:relative; padding-left:30px; background:url(/app_images/wanlitong/v40/wap/event/2014/11/swiping/bg_star.jpg) no-repeat 0 center; color:#cc0000; font:700 34px/44px Microsoft Yahei}
.intro dt a{position:absolute; left:265px; top:0}
.intro dd{color:#666; font:400 18px/28px Microsoft Yahei}

.info{position:relative; padding:0 15px 190px; background:url(/app_images/wanlitong/v40/wap/event/2014/11/swiping/bg_exchange.png) no-repeat bottom center}
.info h2{margin-bottom:3px; color:#fff; font:400 26px/40px Microsoft Yahei}
.info dl{padding-bottom:4px}
.info dl.fix{position:absolute; left:400px; top:43px}
.info dt{position:relative; padding-left:20px; color:#fff; font:400 24px/32px Microsoft Yahei}
.info dt:after{content:"."; display:block; position:absolute; left:0; top:50%; width:12px; height:12px; margin-top:-6px; border-radius:12px; background-color:#fff; text-indent:-9999px}
.info dd{padding-left:20px; color:#ffcc00; font:400 24px/32px Microsoft Yahei}
.info a{color:#fff; text-decoration:underline}

.pro .title{padding:7px 0; border-top:1px solid #ff0000; background-color:#920000; text-align:center}
.pro .title dt{color:#ffd000; font:700 48px/58px Impact, Microsoft Yahei}
.pro .title dd{position:relative; color:#fff; font:400 30px/40px Impact, Microsoft Yahei}
.pro .title dd a{position:absolute; right:40px; top:0}
.pro ul{padding:20px}
.pro li{float:left; width:286px; padding-bottom:20px}
.pro li:nth-child(2n){float:right}
.pro li img{display:block; width:286px; height:286px}
.pro h3{overflow:hidden; height:30px; padding-top:2px; color:#fff; font:400 18px/30px Microsoft Yahei; white-space:nowrap; text-overflow:ellipsis}
.pro li dd{position:relative; color:#fff; font:400 14px/26px Microsoft Yahei; text-decoration:line-through}
.pro li dd span{float:right; text-decoration:none}
.pro li dd a{position:absolute; right:0; top:6px; width:90px; height:38px; border-radius:7px; background-color:#fff100; color:#cc0000; font:700 22px/38px Microsoft Yahei; text-align:center; text-decoration:none}
.pro li dd a.unlink{background-color:#555; color:#fff}
.pro li dt{overflow:hidden; height:26px; color:#fff100; font:400 14px/26px Microsoft Yahei}
.pro li dt span{font-size:22px; font-family:Georgia}

.rule{background-color:#e3e3e3}
.rule dl{padding:10px 30px 20px; color:#666}
.rule dt{font:400 24px/44px Microsoft Yahei}
.rule dd{font:400 20px/30px Microsoft Yahei}
.rule dd{transition:height 1s ease; -moz-transition:height 1s ease; -webkit-transition:height 1s ease; -o-transition:height 1s ease}
.rule dd.unfold{height:auto}
.rule a{color:#666; text-decoration:underline}

.btn_next{position:fixed; left:0; bottom:40px; z-index:1000; width:100%; height:35px}
.btn_next:after{content:"."; display:block; position:absolute; left:50%; top:0; cursor:pointer; width:96px; height:35px; margin-left:-48px; background:url(/app_images/wanlitong/v40/wap/event/2014/11/swiping/icon_arrow.png) no-repeat 0 0; text-indent:-9999px; animation:next 1s ease-in infinite;-moz-animation:next 1s ease-in infinite;-webkit-animation:next 1s ease-in infinite}
@-keyframes next{0%{top:0;opacity:0}50%{top:10px;opacity:1}100%{top:20px;opacity:0}}
@-moz-keyframes next{0%{top:0;opacity:0}50%{top:10px;opacity:1}100%{top:20px;opacity:0}}
@-webkit-keyframes next{0%{top:0;opacity:0}50%{top:10px;opacity:1}100%{top:20px;opacity:0}}