/*
	CSS重置样式
*/

/*public css*/

/*clear default style*/
body,form,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,p,header,menu,footer,section,video,article,button{margin:0;padding:0;}
li{list-style:none}
body{font-size:14px;background:#fff;font-family:"微软雅黑","Microsoft YaHei","宋体";color:#7f7f7f;}
a{text-decoration:none;color:#7f7f7f;cursor:pointer;outline:0;*star:expression(this.onFocus=this.blur());}
a:active{border:none;}
a:after{border:none;}
a:hover{ color: #00b369; }
img{border:0}
html{height:100%;overflow-y: scroll;}
i{ font-style:normal; }
b{ font-weight: normal; }

/*sidition action*/
.fl{float:left;}
.fr{float:right;}
.clear {clear: both;}
.clearfix::after {clear: both; content: ""; display: block; height: 0;}
.clearfix { zoom: 1;}
.w1200{ width: 1200px; margin: 0 auto; }
.trans{ transition: all 0.2s;-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-o-transition: all 0.2s }

#wrapper{ width: 100%;}
body{ min-width: 1200px;background: url(../images/bg-img.jpg) no-repeat 0 0 ; background-size: cover; }

/*** 头部 ***/
#hearder{ height:80px; background-color: #fff; box-shadow:0 0 10px rgba(0,0,0,0.2)  } 
#hearder .logo{ height:27px; width: 107px; margin-top:27px; }
#hearder .logo a{ display:inline-block; height:36px; width: 140px; background: url(../images/web-logo.png) no-repeat;   }
#hearder .notice-span{ color: #7f7f7f; line-height: 80px;}
#hearder .notice-span a { color: #00b369; }
#hearder .notice-span a:hover{ text-decoration:underline; }
/** 底部固定 **/
.CopyRight-p{ width:100%; height:20px; line-height: 20px; text-align: center; position: absolute; bottom:20px; left: 0; color: #282828; font-size: 12px; }
.CopyRight-p span{ padding: 0 12px; }

#public-box,#no-verify{ width:524px; height:580px; box-shadow: 0 0 20px rgba(0,0,0,0.2); background-color: #fff; border-radius: 2px; }
.margin-top-105{margin:65px auto 0; }
.bg-box{ background:url(../images/bg-img-box.png) no-repeat;height:226px; width: 100%; }
#public-box .ZC-trans{ color: #7f7f7f; height: 20px; line-height: 20px; font-size: 14px; padding:35px 65px; text-align: right;  }

/*** 默认登录 ****/
.circle-login{ width:362px; margin:0 auto; padding-top:145px}
.circle-login .login-way{ width: 362px; margin: 0 auto }
.circle-login  .login-way .qq-way .link-box{ height:144px; width:144px; border-radius: 50%;background: url(../images/public-icon.png) 0 -264px;  box-shadow: 0 5px 20px rgba(100,180,250,0.3)}
.circle-login .login-way .ZH-way .link-box{ height:144px; width: 144px; border-radius: 50%;background: url(../images/public-icon.png) -149px -264px;box-shadow: 0 5px 20px rgba(101,228,155,0.3)}
.circle-login .login-way p{ color: #5d5d5d; font-size: 16px; text-align: center; width: 144px; margin-top:25px }
.circle-login .login-way .link-box:hover{ opacity: 0.8; }
.circle-login .login-way .qq-way:hover p,.circle-login .login-way .ZH-way:hover p{ color: #00b369 }

.circle-login .other-way{ width:338px;margin: 108px auto 0 }
.circle-login .other-way-tilte{ position: relative; font-size:14px; color: #7f7f7f; text-align: center; width: 100%; margin-bottom: 30px; }
.circle-login .other-way-tilte:before,.circle-login .other-way-tilte:after{  content: '';  height: 1px;  width:110px;  background: #e2e2e2;  position: absolute;  top:50%;  }
.circle-login .other-way-tilte:before{left: 0;}
.circle-login .other-way-tilte:after{right: 0;}

/** 第三方登陆  **/
.all-kinds-of a{ display: inline-block; width: 50px; height: 50px;}
.all-kinds-of .margin-left{ margin-left:96px; }
.all-kinds-of a{ opacity: 0.6}
.qq-login{ background: url(../images/public-icon.png) 0px -57px; }
.wx-login{ background: url(../images/public-icon.png) -53px -57px; }
.wb-login{ background: url(../images/public-icon.png) -106px -57px ; }
.phone-login{ background: url(../images/public-icon.png) -159px -57px; }
.all-kinds-of a:hover{ opacity:1 }

/***  账号登陆 ***/
.w-400{ width: 362px; margin:0 auto 0 ; padding-top:50px; overflow: hidden;position:relative;left:0px;top:0px;}
/*.none{ display: none\9; }*/
.login-state{ color: #333; font-size: 18px;}
.login-state a{ display:inline-block; width:181px; height:60px; line-height:60px; text-align: center; cursor: pointer; }
.login-state a:hover{ color: #00b369;  }
.login-state .on{ color: #00b369 }
.title-actline{width: 100%;height: 2px;background: #ccc;position: relative; margin-bottom:22px; overflow: hidden\9;zoom:1;}
.title-actline span{display: block;width: 50%;height: 2px;background:#00b369;position: absolute;top: 0;}


.change{  width:765px; overflow: hidden;  }
.change .opacity{ opacity: 0; filter: alpha(opacity=0); }
.fill-box{ width:362px; overflow: hidden;padding-right: 20px;}
.fill-list{padding: 0 10px 0 15px ; border:#e2e2e2 1px solid; height:48px; margin-bottom:12px; position:relative;  border-radius: 2px;}
.fill-list input{ -webkit-box-shadow: 0 0 0px 30px white inset;border:0; height:24px ; line-height: 24px; padding:11px 0px; color: #1b1b1b;font-family:"Microsoft YaHei";background-color:#fff;outline: none; margin-top: 1px; font-size:14px; width:280px }
/*修改placeholder的默认颜色*/
.fill-box :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #b2b2b2;  }
.fill-list ::-moz-placeholder { /* Mozilla Firefox 19+ */color: #b2b2b2;  }
.fill-box input:-ms-input-placeholder {color: #b2b2b2;}
.fill-box input::-webkit-input-placeholder{color:#b2b2b2;}
.fill-list-none input:-moz-placeholder{color: #b2b2b2;}
.fill-list-none input::-moz-placeholder{color: #b2b2b2;}

.fill-list .type-password{ font-size:15px;}
.fill-list .type-password:-moz-placeholder { /* Mozilla Firefox 4 to 18 */font-size:14px; }
.fill-list .type-password::-moz-placeholder { /* Mozilla Firefox 19+ */font-size:14px; }
.fill-list .type-password:-ms-input-placeholder {font-size:14px;}
.fill-list .type-password::-webkit-input-placeholder{font-size:14px}

.fill-list i{ width: 20px; height: 22px; display: inline-block; background: url(../images/public-icon.png) -218px 0 no-repeat; margin-top:12px; margin-right:14px; }
.fill-list .pasword-icon{ background-position:-243px 0   }
.fill-list .phone-icon{ background-position:-284px 0px; height: 25px}
.fill-list .mail-icon{ background-position:-308px 0px; width: 23px;}
.fill-list-none{ position: relative; margin-bottom:12px;}
.fill-list-none input{border:#e2e2e2 1px solid; height:48px; line-height:48px; width:147px; padding: 0 20px;font-family:"Microsoft YaHei" ; outline:none; font-size:14px; border-radius: 2px; }
.fill-list-none  .but-yzm{height: 44px;line-height: 44px; color: #fff;  width: 125px; outline:none; cursor: pointer; border: none; }
.fill-list-none  .but-yzm-click{ background-color: #00b369 }
.fill-list-none  .but-yzm-click:hover{ background-color: #1abb78 }
.fill-list-none  .yzm-HQ .yzm-HQ-span{ height:50px ; line-height:50px; display: inline-block; border-radius: 2px; background-color: #b2b2b2;color: #fff; cursor: pointer; width: 165px; text-align: center;}
.fill-list-none .w220{ width: 180px; }
.fill-list-none  .JYM-div{ width:130px; height: 50px; position: relative; }
.fill-list-none  .JYM-div .Refresh{ width: 130px; height: 50px;background:#000;filter:alpha(opacity=40);opacity: .1;cursor:pointer;position:absolute; top:0; left: 0; display: none; }
.fill-list-none  .JYM-div .Refresh i{ display:block; height: 29px; width:34px; background: url(../images/public-icon.png) -279px -30px no-repeat; line-height: 50px; text-align: center; margin:10px auto;  cursor: pointer; transition: all 0.6s ease;-webkit-transition: all 0.6s ease ;-moz-transition: all 0.6s ease;}
.fill-list-none  .JYM-div .Refresh .rorate360{ transform: rotate(360deg);-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-o-transform: rotate(360deg); }
.fill-list-none  .JYM-div:hover .Refresh{ display:block; }
.fill-list-none  .JYM-div img{ width: 130px;height: 50px;}

.fill-list-none #phone_code_yzm{cursor:pointer;width: 140px;height: 50px;}

/*提示及错误提示*/
.notice-box{ height: 28px; line-height: 28px; padding: 0 12px; position: absolute; z-index: 2; top:35px; left:25px; background-color: #fef4e5; border: #f6c090 1px solid; color: #dc873b; font-size:12px; display: none;} 
.notice-box i{ display: inline-block; width: 12px; height: 6px; background: url(../images/public-icon.png) -269px 0 ; position: absolute; top:-18px;  left: 20px; }
.posi-box{ height:30px ; line-height:30px; background-color: #ff6633; color: #fff; font-size: 12px; display: inline-block; right:10px; position: absolute; top:10px; padding: 0 10px; border-radius: 2px; display: none;}
.error-border{ border:#ff6633 1px solid }
.fill-list-none .yzm-HQ .gre-btn{ background-color: #00b369; }
.positive{ position:  relative; }

/*** 记住密码 ****/
.Keep-Password{ height:40px; color:#333; line-height:30px; position: relative; cursor: pointer; /*margin-bottom:40px*/}
.Keep-Password .notice-box{ width: 216px }
.Keep-Password:hover .notice-box{ display: block; }
.Keep-Password .jizhu{ display:inline-block; height:19px; width:19px; background:url(../images/public-icon.png) -241px -26px; vertical-align:-4px; margin:0 10px 0 0 }
.Keep-Password-no .jizhu{background:url(../images/public-icon.png) -219px -26px; }

/*** 登录注册按钮 **/
.now-login input{ width:362px; background-color: #00b369;  color:#fff ; font-size: 18px; height:60px; line-height:60px; font-family:"Arial","Microsoft YaHei" ; border: none; outline: none; cursor: pointer; border-radius: 2px}
.now-login input:hover{ background-color: #1abb78 }

/*** 支付的方式  ***/
.posi-r{ position: relative; }
.fixed-way{ height:110px; width:362px; position:absolute; position: absolute; bottom: -10px; left:82px;}
.fixed-way a{ margin-right: 54px;display: inline-block; width: 50px;  height:50px; opacity: 0.6 }
.fixed-way a:hover{ opacity: 1; }
.fixed-way  .center-m{ width:362px; margin:28px auto 0;}
.fixed-way  .center-m .last-margin{ margin-right: 0 }

/**** 弹窗  ***/
.wotu-logo{ width: 140px; height: 74px;background:url(../images/public-icon.png) -351px 0; margin: 0 auto 30px; }
.padding-top{ padding-top: 95px; }
.padding-top .other-way{ margin-top: 55px }
.padding-top .login-way{ margin-bottom:90px }

.member-change{ position: relative; height: 580px; }

/*** 无法收到验证码联系客服及一系列弹窗样式 ****/
#public-mask{position: fixed;left: 0;top: 0; width: 100%; height:100%; z-index:99;}
#public-mask .mask{ background:#000;filter:alpha(opacity=40);opacity: .4;height: 100% ;}
.public-mask-box{ width:455px;height:326px;  background-color:#fff; border-radius: 2px; overflow: hidden; position:fixed; top: 50%; left: 50%; margin-top:-163px; margin-left: -227px;box-shadow: 0px 0px 15px rgba(44,153,255,0.15) inset,0 0 15px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 0px 15px rgba(44,153,255,0.15) inset,0 0 15px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 15px rgba(44,153,255,0.15) inset,0 0 15px rgba(0,0,0,0.2);
-webkit-animation: login-win .4s forwards; animation: login-win .4s forwards;-moz-animation: login-win .4s forwards;
}
.icon-off{ width: 20px; height: 20px; display:inline-block; background: url(../images/public-icon.png ) -220px -88px no-repeat; position: absolute; top: 20px; right: 20px; cursor: pointer;}
.icon-off:hover{ transform: rotate(180deg);-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);}
.contact-p{ color: #000; font-size: 16px; text-align: center; padding-top: 110px; padding-bottom: 45px}
.icon-qq-i{ display: inline-block; width: 22px; height: 24px; background:url(../images/public-icon.png ) -253px -59px no-repeat; margin-right: 10px; vertical-align: -5px;  }
.contact-a{ display: block; height:64px; width: 226px; background-color: #00b369; border-radius: 2px; color: #fff; font-size: 18px; line-height: 64px; margin:0 auto; text-align:center;}
.contact-a:hover{ color: #fff; background-color: #1abb78; }
.mail-p{ color: #000; font-size: 16px; text-align: center;padding-top: 110px; padding-bottom: 45px}
.mail-p span{ color: #00b7ee }
.icon-success,.icon-fail{ width: 65px; margin: 110px auto 40px;  }
.icon-success i{ display:inline-block; width:65px; height: 65px; background:url(../images/public-icon.png ) 0 -430px no-repeat;}
.icon-fail i{display:inline-block; width:65px; height: 65px; background:url(../images/public-icon.png ) -72px -430px no-repeat;}
.success-box p{ color: #000; text-align: center; font-size:20px; }
.notice-box-div p,.mail-box-none p{ color: #1f1f1f; text-align: center; font-size:16px; }


.close-style{-webkit-animation: login-win .4s forwards; animation: login-win .4s forwards;-moz-animation: login-win .4s forwards;}
/*** 弹窗开启动画 ***/
@-webkit-keyframes login-win{
	0% {transform: scale(0.7);-webkit-transform: scale(0.7);}
	45% {transform: scale(1.05);-webkit-transform: scale(1.05);}
	80% {-webkit-transform: scale(0.95);transform: scale(0.95);-webkit-tranform: scale(0.95); }
	100% {transform: scale(1);-webkit-transform: scale(1); } 
}
@keyframes login-win{
	0% {transform: scale(0.7);-webkit-transform: scale(0.7);}
	45% {transform: scale(1.05);-webkit-transform: scale(1.05);}
	80% {-webkit-transform: scale(0.95);transform: scale(0.95);-webkit-tranform: scale(0.95); }
	100% {transform: scale(1);-webkit-transform: scale(1); } 
}
@-moz-keyframes login-win{
	0% {transform: scale(0.7);-webkit-transform: scale(0.7);}
	45% {transform: scale(1.05);-webkit-transform: scale(1.05);}
	80% {-webkit-transform: scale(0.95);transform: scale(0.95);-webkit-tranform: scale(0.95); }
	100% {transform: scale(1);-webkit-transform: scale(1); } 
}

/*验证码弹窗*/
.YZM-box-big{ position: fixed;left: 0;top: 0; width: 100%; height:100%; z-index:99;}
.YZM-box-big .mask{ background:#000;filter:alpha(opacity=40);opacity: .4;height: 100% ;}
.YZM-box{ height: 280px; width: 455px; position:absolute;top:50%;left:50%; z-index: 5;margin:-140px 0 0 -228px; box-shadow: 0 0 5px rgba(0,0,0,0.35) ; background: url(//js.wotucdn.com/2016/user/images/box-bg.png) left top no-repeat #fff;   }
.YZM-box h4{ font-size: 26px; color:#000; font-weight: normal; text-align: center; padding-top: 40px; padding-bottom: 30px  }
.YZM-box .close{ display: inline-block; width: 21px; height:20px; background: url(//js.wotucdn.com/2016/user/images/close-but-icon.png) 0 0; position: absolute; top: 12px; right: 12px; }
.YZM-box .close:hover{ background-position: 0 -31px; }
.YZM-box .fill-list-none{ width: 330px; margin: 0 auto; }
.YZM-box  .input-list-but{ margin-top: 30px; }
.YZM-box  .input-list-but input{ display: block; height:50px;  line-height: 50px; background-color: #06af6c; width:332px; margin: 0 auto;border: none; margin-top: 10px; text-align: center; color: #fff; font-size: 18px; font-family:"Microsoft YaHei" ; cursor: pointer; outline: none;  }
.YZM-box  .input-list-but input:hover{ background-color:#1abb78 }

.about-web{ position: absolute;top:54px;z-index:6; background-color: #fff; right:-1px; border: #e2e2e2 1px solid; width: 368px; padding: 5px 0}
.about-web li{ height: 26px; line-height: 26px; text-indent: 20px;  }
.about-web li:hover{ background-color: #f4f4f4; cursor: default; }

@media screen and (max-height:770px) {
	.margin-top-105{ margin-top: 30px; }
	.CopyRight-p{ position: static; margin:50px 0 20px; }
}

/**** 尚未绑定现在绑定 ****/
#no-verify{ height:520px}
.no-bind p{ font-size: 16px; text-align: center; color: #333; line-height:34px; }
.no-bind p span{ color: #00b7ee; padding:0 5px; }
.no-bind{ padding-top:70px; }
.no-bind  .fill-box{ width: 320px; margin: 60px auto 140px;padding: 0;}
.no-bind .fill-list{ margin-bottom: 30px; }
.no-bind .now-login input{ width: 320px; }
.no-bind .new-login{ text-align: center; font-size:13px; color: #333; }
.no-bind .new-login a{ color: #ff6633; padding: 0 3px;}
.no-bind .new-login a:hover{ text-decoration: underline; }