@charset "utf-8";
/* CSS Document */

body,p,input,h1,h2,h3,h4,h5,h6,ul,li,dl,dt,dd,form{margin:0;padding:0;list-style:none;vertical-align:middle;line-height:1;}
body,html{width:750px;height:100%;position:relative;font-family:Helvetica;background-color:#ffffff;margin:0 auto;overflow: hidden;}
header,section,footer,img,button{display:block;margin:0;padding:0;border:none;}
body {-webkit-tap-highlight-color:rgba(0,0,0,0);}

#loading { position: absolute; width: 100%; height: 100%; z-index: 100000; top: 0; background-color: #ebebeb;}
#loading p { position: absolute; width: 100%; text-align: center; top: 50%; margin-top: -100px; font-size: 22px; color: #333; height: 200px; line-height: 200px;}

.main { position: absolute; width: 100%; height: 100%; top: 0; left: 0; overflow: hidden;}
.section { display: none;
	animation-duration: 0.5s;
	-webkit-animation-duration: 0.5s;
}

#p-index { position: absolute; width: 100%; height: 100%; background-color: #161618;}
#p-index .time { color: #fff; text-align: center; padding-top: 30px;}
#p-index .time strong { display: block; width: 412px; height: 123px; background: url(https://img.alicdn.com/imgextra/i2/169328611/TB2ZJ56epXXXXXlXXXXXXXXXXXX_!!169328611.png) 0 0 no-repeat; margin: 0 auto;}
#p-index .time span { display: block; margin-top: 25px; font-size: 32px;}
#p-index .weixin { margin: 60px 32px 0 32px; border-top: 1px solid #313135; color: #fff; font-size: 32px;}
#p-index .weixin li { padding: 23px 0 23px 64px; border-bottom: 1px solid #313135; background:url(https://img.alicdn.com/imgextra/i3/169328611/TB2PUOPepXXXXcUXXXXXXXXXXXX_!!169328611.png) 0 23px no-repeat; opacity: 0.3; }
#p-index .weixin li.on { opacity: 1;}
#p-index .weixin li p { margin-bottom: 10px;}
#p-index .weixin li p span { font-size: 22px; color: #555555;}
#p-index .slide { position: absolute; bottom: 0; width: 100%; padding: 93px 0 93px 0; background-color: #161618;}
#p-index .slide p { width: 266px; height: 46px; margin: 0 auto; font-size: 44px; line-height: 46px; color: #424243; padding-left: 46px; background: url(http://baidu.hizon.com.cn/20150707/img/arrow-4.png) 0 50% no-repeat;
	-webkit-animation: p-index-slide 2s infinite;
	animation: p-index-slide 2s infinite;
}
@-webkit-keyframes p-index-slide {
	0%   { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
	50%  { -webkit-transform: translate3d(50px, 0, 0); transform: translate3d(50px, 0, 0);}
	100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
}

#p-index .slide .swipTop {width: 266px;height: 91px;margin: 0 auto;font-size: 44px;line-height: 46px; color: #424243; text-align:center;
	-webkit-animation:p-index-slide2 2s infinite;
	animation:p-index-slide2 2s infinite;
}

@-webkit-keyframes p-index-slide2 {
	0%   { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
	50%  { -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0);}
	100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
}

#p-index .bottom { position: absolute; width: 72px; height: 14px; background-color: #646369; border-radius: 7px; left: 339px; bottom: 19px;}
#p-index .camera { position: absolute; width: 54px; height: 42px; background: url(http://baidu.hizon.com.cn/20150707/img/icon-camera.png) 0 0 no-repeat; right: 14px; bottom: 14px;}

#p-chat { position: absolute; width: 100%; height: 100%; background-color: #ffffff;}
#p-chat .scroll { position: absolute; width: 100%; height: 100%; overflow-y: scroll;}
#p-chat .time { width: 120px; height: 40px; color:#787878; font-size: 20px; text-align: center; line-height: 40px; margin: 10px auto 25px auto;}
#p-chat .list { margin: 0 20px; padding-bottom: 100px;}
#p-chat.after .list { padding-bottom: 604px;}
#p-chat .list li { margin-bottom: 35px; overflow: hidden; zoom: 1; display: none;
	animation-duration: 0.5s;
	-webkit-animation-duration: 0.5s;
}
#p-chat .list li img { display: block; width: 78px; height: 78px; border: 1px solid #c6c6c6; float: left;}
#p-chat .list li.user img { float: right;}
#p-chat .list li .name { display: block; margin-left: 110px; font-size: 24px; color: #787878;}
#p-chat .list li .detail { margin: 10px 0 0 104px; position: relative;}
#p-chat .list li.user .detail { margin: 0 104px 0 0;}
#p-chat .list li .detail p { background-color: #fff; border: 1px solid #d0d0d0; border-radius: 10px; padding: 20px; float: left; max-width: 420px; font-size: 30px; line-height: 1.2;}
#p-chat .list li .detail p img { float: none; display: inline-block; width: 40px; height: 40px; border: none; vertical-align: middle;}
#p-chat .list li.user .detail p { float: right; background-color: #a0e75a; border-color: #83d45a;}
#p-chat .list li .detail span { display: block; position: absolute; width: 15px; height: 26px; background: url(http://baidu.hizon.com.cn/20150707/img/arrow-1.png) 0 0 no-repeat; left: -14px; top: 26px;}
#p-chat .list li.user .detail span { background: url(http://baidu.hizon.com.cn/20150707/img/arrow-2.png) 0 0 no-repeat; left: auto; right: -14px;}
#p-chat .bar { position: fixed; bottom: 0; width: 100%; height: 99px; border-top: 1px solid #c3c3c5; background-color: #f4f4f6;}
#p-chat.after .bar { bottom: 504px; height: 94px;}
#p-chat .bar span { display: block; width: 56px; height: 56px; float: left; margin-top: 22px;}
#p-chat.after .bar span { margin-top: 18px;}
#p-chat .bar span.icon-1 { background: url(https://img.alicdn.com/imgextra/i2/169328611/TB2c7y0epXXXXbsXXXXXXXXXXXX_!!169328611.jpg) 0 0 no-repeat; margin-left: 9px;}
#p-chat .bar span.icon-2 { background: url(http://baidu.hizon.com.cn/20150707/img/icon-2.png) 0 0 no-repeat; margin-left: 19px;}
#p-chat .bar span.icon-3 { background: url(http://baidu.hizon.com.cn/20150707/img/icon-3.png) 0 0 no-repeat; margin-left: 18px;}
#p-chat .bar .input { width: 540px; height: 62px; border: 1px solid #abadb2; border-radius: 10px; float: left; margin: 14px 0 0 19px; background-color: #fff; padding: 4px 12px; line-height: 40px; font-size: 30px; position: relative;}
#p-chat .bar .input p { display: none; line-height: 56px;}
#p-chat.after .bar .input p { display: block;}
#p-chat .bar .input span { display: block; position: absolute; left: 280px; top: 0; width: 4px; height: 40px; background-color: #426bf2; opacity: 0;
	-webkit-animation: p-chat-input 1s infinite;
	animation: p-chat-input 1s infinite;
}
@-webkit-keyframes p-chat-input {
	0%   { opacity: 0;}
	50%  { opacity: 1;}
	100% { opacity: 0;}
}
@-webkit-keyframes p-chat-input {
	0%   { opacity: 0;}
	50%  { opacity: 1;}
	100% { opacity: 0;}
}
#p-chat.after .bar .input { height: 56px;}
#p-chat .area { position: fixed; width: 100%; height: 504px; bottom: 0; background: url(https://img.alicdn.com/imgextra/i2/169328611/TB2dG9FepXXXXbmXpXXXXXXXXXX_!!169328611.png) 0 100% no-repeat; display: none;}
#p-chat.after .area { display: block;}
#p-chat .area span { display: block; height: 70px; border-top: 1px solid #a9b1bc; border-bottom: 1px solid #aab2bc; background-color: #fdfdfe;}

.dot { position: absolute; width: 168px; height: 168px; background: url(http://baidu.hizon.com.cn/20150707/img/dot.png) 0 0 no-repeat; pointer-events: none;
	-webkit-animation: p-chat-input 2s infinite;
	animation: p-chat-input 2s infinite;
}

#p-weixin-1 { position: absolute; width: 100%; height: 100%; background-color: #ffffff;}
#p-weixin-1 .scroll { position: absolute; width: 100%; height: 100%; }

#p-weixin-2 { position: absolute; width: 100%; height: 100%; background-color: #ffffff;}
#p-weixin-2 .scroll { position: absolute; width: 100%; height: 100%; }

#p-weixin-3 { position: absolute; width: 100%; height: 100%; background-color: #ffffff;}
#p-weixin-3 .scroll { position: absolute; width: 100%; height: 100%; }

#p-weixin-4 { position: absolute; width: 100%; height: 100%; background-color: #ffffff;}
#p-weixin-4 .scroll { position: absolute; width: 100%; height: 100%;}

#p-weixin-5 { position: absolute; width: 100%; height: 100%; background-color: #fdf4e2;}
#p-weixin-5 .scroll { position: absolute; width: 100%; height: 100%; }


#pic { position: absolute; width: 100%; height: 100%; z-index: 1000000; top: 0; left: 0; background: rgba(0,0,0,0.8); display: none;}
#pic div { position: absolute; width: 100%; height: 100%; display: box; display: -webkit-box; box-pack: center -webkit-box-pack: center; box-align: center; -webkit-box-align: center;}
#pic div img {
	animation-duration: 0.5s;
	-webkit-animation-duration: 0.5s;
}