@charset "utf-8";

/* CSS Document */



body {margin:0px; width:100%;}

a {text-decoration: none;}

.index {height:auto; background:#fff;}

/* index top image*/

.index .top {min-height:50px; position:relative;}

.index .top img {height:auto; width:100%; display:block;}

.index .top .rule {margin:10px; position:absolute; top:0px; right:0px; z-index:2; font-size:16px; color:#fff;}
.index .top .erweima {margin:10px; position:absolute; top:0px; left:0px; z-index:2; font-size:16px; color:#fff;}

/* index member */

.index .member {height:auto; background:#fff; padding:30px 0px 2px; position:relative;}

.index .member .head {height:70px; width:70px; background:#fff; padding:2px; margin-left:-36px; position:absolute; top:-40px; left:50%; border-radius:36px; box-shadow:1px 1px 1px rgba(153,153,153,0.3);}

.index .member .head img {height:70px; width:70px; border-radius:70px;}

.index .member .nickname {height:40px; line-height:40px; text-align:center; color:#777; font-size:16px;  }

.index .member .submit {height:26px; width:180px; margin:0px auto 10px; margin-bottom:10px; text-align:center; line-height:26px; font-size:14px; color:#fff; border-radius:20px;}

/* index title */

.index .title1 {height:20px; font-size:10px; line-height:20px; background:#f9f9f9; padding:0px 20px; border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; color:#999;}

.index .title1 a {color:#fc3; text-decoration:none;}

.index .title2 {height:30px; background:#f9f9f9; padding:0px 20px; border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; font-size:14px; color:#999; line-height:30px;}

/* index adert */

.index .advert {height:44px; background:#fff; padding:6px 20px;}

.index .advert .info {height:44px; padding-right:10px;}

.index .advert .info .icon {height:44px; width:44px; background:#999; float:left;}

.index .advert .info .icon img {height:44px; width:44px; border:0px;}

.index .advert .info .big {height:44px; padding-left:54px;}

.index .advert .info .big .slogan {height:22px; line-height:22px; color:#888; font-size:14px; word-break:break-all; overflow:hidden; }

.index .advert .jump {height:44px; width:10px; float:right; line-height:44px; font-size:30px; color:#999; text-align:right;}

/* index record */

.index .record {height:auto; padding:0px 10px;}

.index .record .line {height:40px; padding:10px; border-top:1px solid #e5e5e5;}

.index .record .line:first-child {border:0px;}

.index .record .line .head {height:40px; width:40px; border-radius:40px; float:left;}

.index .record .line .head img {height:40px; width:40px; border-radius:40px;}

.index .record .line .right {height:40px; padding-left:50px;}

.index .record .line .right .info {height:40px; word-break:break-all;}

.index .record .line .right .info .user {height:22px; width:100%;}

.index .record .line .right .info .user .big {height:22px; padding-right:80px;}

.index .record .line .right .info .user .big .nickname {height:22px; font-size:14px; color:#666; line-height:24px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; content:"..."}

.index .record .line .right .info .user .date {height:22px; width:90px; float:right; font-size:12px; color:#aaa; line-height:26px; text-align:center;}

.index .record .line .right .info .slogan {height:18px; font-size:12px; color:#999; line-height:16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; content:"..."}

.index .showmore {height:30px; line-height:40px; color:#777; text-align:center; font-size:14px;}

.index .footer {height:60px; line-height:60px; color:#999; text-align:center; font-size:12px;}

/* 写代码的幸好不是我的员工，不然我开除他100次 */

/* 浮层 */

.layer {height:100%; width:100%; background:rgba(0,0,0,0.8); position:fixed; z-index:10; display: none;}

.layer-rule {height:280px; width:240px; background:rgba(0,0,0,0.6); padding:10px; margin:-150px -130px; position:fixed; top:50%; left:50%; z-index:11; border-radius:6px; color:#eee; display:none;}

.layer-rule .con {height:280px; width:240px; overflow-y:auto; font-size:14px; line-height:18px;}

.layer-rule .close {height:25px; width:25px; background:rgba(0,0,0,0.6); position:absolute; top:-12px; right:-12px; border-radius:25px; line-height:27px; text-align:center; font-size:16px; color:#ccc;}



.layer-city {height:210px; width:280px; background:#fff; border-radius:10px; position:fixed; top:50%; left:50%; margin:-105px -140px; z-index:999; display: none;}

.layer-city .close {height:25px; width:25px; background:rgba(255,91,53,1); position:absolute; top:-12px; right:-12px; border-radius:25px; line-height:27px; text-align:center; font-size:16px; color:#ccc;}

.layer-city .ico {height:100px; width:100px; background:#fff; padding:5px; border-radius:100px; position:absolute; top:-50px; left:50%; margin-left:-50px; z-index:9999; box-shadow:1px 1px 1px rgba(153,153,153,0.3);}

.layer-city .ico img {height:100px; width:100px; border-radius:100px;}

.layer-city h1 {font-size:20px; text-align:center; margin-top:65px;font-weight:100; color:#333;}

.layer-city h2 {font-size:14px; text-align:center; font-weight:100; line-height:16px;  padding:0px; margin:0px; color:#666;}

.layer-city h3 {font-size:14px; color:#666; text-align:center; color:#444;}

.layer-city .nav {height:25px;  width:255px; background:#ff5b35; margin:auto; border-radius:10px; color:#fff; font-size:13px; line-height:25px; text-align:center;}



.layer-share {height: 360px; width:300px; background:url(share.png) no-repeat; background-size: 300px 360px; margin: -240px -150px; position: fixed; top: 50%; left: 50%; z-index: 15; display: none;}

.layer-share .close {height:30px ; width:30px ; position: absolute; top: 55px; left: -1px; z-index: 16;}

.layer-share .num1 {height: 20px; width:20px; position: absolute; bottom: 41px; left: 79px; text-align: center; line-height: 20px; color: #fff; font-size: 17px;}

.layer-share .num2 {height: 20px; width:20px; position: absolute; bottom: 41px; right: 53px; text-align: center; line-height: 20px; color: #fff; font-size: 17px;}



.tips {height: 120px; width: 250px; background: #fff; position: fixed; top: 50%; left: 50%; z-index: 2; margin: -100px -146px; display: none; border-radius:3px; border:1px solid rgba(255,255,255,0.6); padding:20px 20px 10px 20px; z-index:10;}

.tips .title {height:90px; width:250px; font-size:16px; color:#676767;}

.tips .sub {height:30px; width:250px;}

.tips .sub nav {height:30px; width:auto; padding:0px 10px; margin:0px 2px; font-size:16px; line-height:30px; float:right; color:#5e7199;}

.tips .sub nav:hover {background:#eee; border-radius:3px;}



.layer-red {height:370px; width:290px; background:url(hb.png) no-repeat; background-size:290px 410px; padding:40px 0px; margin:-205px -145px; position:fixed; top:50%; left:50%; z-index: 13; display:none;}

.layer-red .close {height:18px; width:18px; position:absolute; top:20px; right:20px; line-height:27px; text-align:center; font-size:16px; color:#ccc;}

.layer-red .head {height:70px; width:70px; background: #fff; margin:auto; border-radius:70px;}

.layer-red .head img {height: 70px; width: 70px; border-radius: 70px;}

.layer-red .nickname {font-size: 14px; color: #f9f9f9; text-align:center; line-height: 35px;}

.layer-red .text {height:30px; width:110px;  position: absolute; bottom:100px; left: 90px; font-size: 20px; line-height: 20px; text-align: center; color: #fff; display:none;}

@-webkit-keyframes square-spin {

	100% {-webkit-transform: perspective(100px) rotateX(0) rotateY(180deg); transform: perspective(100px) rotateX(0) rotateY(180deg); } 



}

.square-spin > div {width: 100px; height: 100px; font-size:80px;  color:#fff; text-align:center; line-height:100px; border-radius:100px; background:#f90; position: absolute; bottom: 100px; left: 95px;}

.reversal { -webkit-animation: square-spin 1.5s linear 0s infinite;}