.login-register{ background-color: #f4f6f8;padding: 20px 0;}
.login-register .form-content{ float: right;background: #fff; width: 400px;padding: 15px 15px 0;}
.login-register .form-content .layui-tab{ margin: 0;}
.login-register .form-content .layui-tab .layui-tab-title{ padding-left: 10px;}
.login-register .form-content .layui-tab .layui-tab-title li{ font-size: 15px;}
.login-register .form-content .layui-form-pane .layui-form-label{ width: 48px;padding: 8px 0;text-align: center;opacity: 0.8;}
.login-register .form-content .layui-form-pane .layui-input-block{ margin-left: 48px;}
.login-register .form-content .layui-sumbit-bnt{ width: 100%;}
.login-register .form-content .vimg,.user-form .vimg{ position: absolute;right: 0;top: 0;width: 110px;bottom: 0;}
.login-register .form-content .vimg img,.user-form .vimg img{ position: absolute;width: 100%;height: 100%;left: 0;top: 0;cursor: pointer;}
.login-register .form-content .send-code-btn,.user-form .send-code-btn,.user-form .send-email-code-btn,.register-form .send-code-btn{ position: absolute;right: 0;top:0;width: 110px;bottom: 0;}
.login-register .form-content .links{ line-height: 18px;}
.login-register .form-content .links a{ opacity: 0.8;}
.login-register .form-content .login-oauth{ margin-top: 40px;border-top: 1px solid #ddd;position: relative;text-align: center;padding-top: 20px;}
.login-register .form-content .login-oauth p{ position: absolute;height: 24px;line-height: 24px;color: #999;left: 50%;margin-left: -80px;top: -24px;background: #fff;padding: 0 10px;}
.login-register .form-content .login-oauth a{ display: inline-block;margin: 0 10px;}
.login-register .form-content .login-oauth a i{ font-size: 30px;}
.login-register .form-content .login-oauth a img{ width: 30px;height: 30px;}
.user-form{ max-width: 500px;}
.layui-btn i{ font-style: normal;}

.register{ background: #f4f6f8;padding: 40px 0;}
.register .wrap{ background: #fff;box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);border-radius: 2px;}
.register .register-form{ padding:40px 4%;max-width: 600px;margin: 0 auto;}
.register  .layui-tab{ margin: 0;}
.register  .layui-tab .layui-tab-title{ padding-left: 10px;}
.register .layui-sumbit-bnt{ width: 100%;}
.register  .vimg,.user-form .vimg{ position: absolute;right: 0;top: 0;width: 110px;bottom: 0;}
.register .vimg img{ position: absolute;width: 100%;height: 100%;left: 0;top: 0;cursor: pointer;}

#userBase{ background: #f4f6f8;padding: 20px 0;}
#userSiderBar{ width: 22%;float: left;background: #fff;box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);border-radius: 2px;}
#showSiderBar{ display: none;}
#userContainer{ width: 78%;float: right;}
#userContainer>.user-container{ margin-left: 20px;background: #fff;box-shadow: 0 1px 2px 0 rgba(0,0,0,.06);border-radius: 2px;}
#userContainer .user-location{ height: 46px;line-height: 46px;padding: 10px 20px 0;border-bottom: 1px solid #eee;overflow: hidden;}
#userContainer .user-location .path{ float: right;}
#userContainer .user-location h3{ font-size: 18px;color: #5fb878;}
#userContainer .user-location .path{ float: right;}
#userContainer .user-location .path .path_current{ color: #5fb878;}
#userContainer .user-location .path .delimiter{ margin: 0 3px;}
#userContainer .user-insider{ padding:15px;min-height: 464px;}

.user-nav{ padding: 10px 0;}
.user-nav>li{ }
.user-nav>li>a{ display: block;height: 46px;line-height: 46px;padding: 0 5% 0 10%;overflow: hidden;border-bottom: 1px solid #eee;}
.user-nav>li span.woo-circle-icon{ margin-right: 8px;}
.user-nav>li dl{ padding: 10px 0 0;}
.user-nav>li dl dl{ padding: 0;}
.user-nav>li dl dd>a{ display: block;height: 40px;line-height: 40px;padding: 0 5% 0 15%;overflow: hidden;}
.user-nav>li dl dd dd>a{ padding: 0 5% 0 20%;}
.user-nav>li dl dd dd dd>a{ padding: 0 5% 0 25%;}
.user-nav>li a{ border-left: 2px solid #fff;}
.user-nav>li a.current{ background: rgba(245,245,245,0.4);border-color: #5fb878;color: #5fb878;}

@keyframes xz {
    form{ transform: rotate(0);}
    to{ transform:rotate(360deg) }
}
.user-index{ padding-left: 150px;position: relative;min-height: 120px;margin: 20px 20px 0;}
.user-index .user-avatar{ }
.user-index .user-avatar{  position: absolute;left:0;top: 0;width: 120px;height: 120px;overflow: hidden; border-radius: 50%;background: #5fb878;text-align: center;line-height: 80px;font-size: 30px;color: #fff;text-transform: uppercase; }
.user-index .user-avatar:hover img{ animation-play-state:paused;}
.user-index .user-avatar img{ animation: xz 16s linear infinite;position: absolute;left:0;top: 0;width: 100%;height: 100%;border-radius: 50%;}
.user-index .user-avatar .cover{ position: absolute; left: 0; top: 0; width: 100%;height: 100%;background: rgba(0,0,0,0.4); border-radius: 50%;text-align: center;line-height: 120px;color: #eee;opacity: 0; transition: all .5s;font-size: 13px;cursor: pointer;z-index: 111;}
.user-index .user-avatar:hover .cover{ opacity: 1;}
.user-index .user-name{ padding-top: 10px;}
.user-index .nickname{ font-size: 20px;line-height: 40px;}
.user-index .nickname a{ color: #1890ff;}
.user-index .summary{ line-height: 24px;height: 48px;overflow: hidden;margin-top: 10px;}
.user-index .summary a{ color: #999;}

.user-index-number{ padding-top: 30px;}
.user-index-number li{ width: 33.33%;text-align: center;}
.user-index-number li .item{ border-right: 1px solid #eee;padding: 5px 0;}
.user-index-number li:last-child .item{ border-right: 0;}
.user-index-number li h4{ height: 32px;line-height: 32px;font-size: 14px;color: #666;}
.user-index-number li .number{ height: 24px;line-height: 24px;overflow: hidden;color: #1890ff}

.user-index-msg{ padding: 15px 20px 0;margin-top: 30px;border-top:1px solid #eee;}
.user-index-msg li{ width: 50%;line-height: 36px;color: #999;}
.user-index-msg li span{ color: #555;}

.user-index-more{ text-align: center;color: #ddd;padding-top: 30px;}

.woo-form-body{ padding: 0;}
.woo-form-body .layui-card{ border: 0;}


.safe{}
.safe .safe-item{ border: 1px solid #f3f3f3;padding: 20px;border-radius: 2px;}
.safe .safe-item .thumb{ text-align: center;}
.safe .safe-item .thumb img{  display: block;margin: 0 auto;height: 60px;}
.safe .safe-item h3{ text-align: center;font-size: 16px;font-weight: normal;height: 40px;line-height: 40px;overflow: hidden;margin-top: 12px;}
.safe .safe-item h3 i{ font-style: normal;font-size: 12px;color: #FF5722;margin-left: 6px;}
.safe .safe-item p{ margin: 0;height: 36px;line-height: 36px;overflow: hidden;text-align: center;color: rgba(0,0,0,0.5);}
.safe .safe-item .btn{ text-align: center;padding-top: 15px;}

.user-form-return { padding-bottom: 15px;text-align: right;}
.user-form-container .layui-elem-quote{ margin-bottom: 15px;}
.user-table-container .woo-table-body{ padding: 0;}
.user-table-container .woo-table-body>.layui-tab,.user-table-container .layui-table,.user-table-container .layui-table-view{ margin: 0;}

.user-container .woo-form-page .layui-tab{ margin: 0;}
.user-container .woo-form-page .layui-card-body{ padding: 0;}
.user-container .woo-detail{ padding: 0;}
.user-container .woo-detail table{ margin: 0;}

.document-search{ text-align: right;padding-bottom: 15px;}
.document-search .layui-icon{ font-size: 20px;}
.document-search .layui-input{ width: 217px;display: inline-block;position: relative;top:2px;margin: 0 3px 0 12px;}

/*签到*/
#showDate .layui-laydate{ box-shadow: none;border: 0;}
#showDate .layui-laydate-static{ display: block;}
#showDate  .layui-laydate-header{ border-bottom-color: #f2f2f2;}
#showDate .layui-laydate-main,#showDate .layui-laydate-content table{  width: 100%;}
#showDate .layui-laydate-content td,#showDate .layui-laydate-content th{ width:10%;height: 60px;}
#showDate  .laydate-day-mark{ width: 38px;height: 38px;line-height: 38px;left:50%;top: 50%;margin: -19px 0 0 -19px;border-radius: 50%;background: #FF5722;color: #fff;}
#showDate  .laydate-day-mark:after{ background: transparent;}
#showDate .layui-laydate .layui-this, #showDate .layui-laydate-content td:hover{ background: none !important;color: #666 !important;}
#signOrder .layui-badge-dot{ position: relative;top: -5px;left: -4px;}

#signTopLayer.layui-layer-content{ padding: 5px 0;}
#signTopLayer .layui-tab-content{ padding: 0 0 0 0;}
#signTopLayer .layui-tab-content ul { max-height: 320px;overflow: auto;}
#signTopLayer .layui-tab-content li{ border-bottom: 1px dotted #ddd;padding: 5px 0;height: 36px;line-height: 36px;overflow: hidden;margin: 0 10px;}
#signTopLayer .layui-tab-content li:last-child{ border-bottom: 0;}
#signTopLayer .layui-tab-content li .icon{  display: inline-block;width: 36px;height: 36px;overflow: hidden; border-radius: 50%;text-align: center;color: #ffffff;float: left;}
#signTopLayer .layui-tab-content li .icon img{ display: block;width: 100%;height: 100%;}
#signTopLayer .layui-tab-content li .nickname{ margin: 0 10px;color: #1E9FFF;}
#signTopLayer .layui-tab-content li .tip{ color: #999;}
#signTopLayer .layui-tab-content li .tip i{color: #FF5722;font-style: normal;margin: 0 6px;}
#signTopLayer .layui-tab-content li:nth-child(1n) .icon{ background: #5fb878;}
#signTopLayer .layui-tab-content li:nth-child(2n) .icon{ background: #409eff;}
#signTopLayer .layui-tab-content li:nth-child(3n) .icon{ background: #FFB800;}
#signTopLayer .layui-tab-content li:nth-child(4n) .icon{ background: #f56c6c;}
#signTopLayer .layui-tab-content li:nth-child(5n) .icon{ background: #bc8fb8;}
#signTopLayer .layui-tab-content li:nth-child(6n) .icon{ background: #fa6141;}
#signTopLayer .layui-tab-content li:nth-child(7n) .icon{ background: #ec407a;}
#signTopLayer .layui-tab-content li:nth-child(8n) .icon{ background: #ff976a;}



.sign-quote span{ margin:  0 6px;font-weight: bold;color: #FF5722;}
.sign-rule{ text-align: right;padding: 7px 15px 0 0;float: right;}

/*自定义列表*/
.custom-list-1{}
.custom-list-1 li{ position: relative;padding-left: 195px;min-height: 135px;padding-bottom: 15px;border-bottom: 1px solid #f2f2f2;margin-bottom: 15px;}
.custom-list-1 li .thumb{ position: absolute;left:0;top: 0;width: 180px;border-radius: 2px;overflow: hidden;}
.custom-list-1 li .thumb img{ -webkit-transition:all .5s;transition:all .5s;}
.custom-list-1 li .thumb:hover img{ -webkit-transform:scale(1.5);transform:scale(1.5);}
.custom-list-1 li .item{}
.custom-list-1 li .item h2{ line-height: 24px;font-size: 16px;padding-bottom: 6px;}
.custom-list-1 li .item h2 a{ color: #1890ff;}
.custom-list-1 li .info{ line-height: 22px;color: #777;padding: 5px 0;}
.custom-list-1 li .btn{ padding-top: 8px;}
.custom-list-1 li .comment{ padding: 10px; background: #f1f1f1;line-height: 24px;margin: 5px 0;border-radius: 2px;}

.custom-list-2{ margin: -7.5px;}
.custom-list-2 li{ }
.custom-list-2 li .thumb{ border-radius: 2px;overflow: hidden;position: relative;padding-top: 75%;}
.custom-list-2 li .thumb img{ -webkit-transition:all .5s;transition:all .5s;width: 100%;position: absolute;left: 0;height: 100%;top: 0;}
.custom-list-2 li .thumb:hover img{ -webkit-transform:scale(1.2);transform:scale(1.2);}
.custom-list-2 li .item{}
.custom-list-2 li .item h2{ height: 30px; line-height: 30px;font-size: 16px;overflow: hidden;margin-top:6px;}
.custom-list-2 li .item h2 a{ color: #1890ff;}
.custom-list-2 li .info{ line-height: 22px;color: #777;height: 22px;overflow: hidden;margin-top: 5px;}
.custom-list-2 li .info span{ margin-left: 10px;}
.custom-list-2 li .info i{ font-style: normal;color: #FF5722;}
.custom-list-2 li .info i.green{ color: #4ec277;}
.custom-list-2 li .btn{ padding-top: 8px;}
.no-data{ padding-top: 40px;text-align: center;color: #777;}
.no-data img{ margin-bottom: 20px;width: 100px;}

.my-bind-third{ margin-top: 20px;}
.my-bind-third th,.my-bind-third td{ text-align: center !important;}
.my-bind-third th{ background-color: rgba(0,0,0,.02);}

.bind-third{ margin-top: 30px;}
.bind-third-list{ margin-top: 20px;}
.bind-third>h2{ font-size: 16px;color: #333;font-weight: bold;}
.bind-third li{ text-align: center;padding: 0 40px 0 0;}
.bind-third li .thumb{ width: 36px;}
.bind-third li .thumb img{ width: 36px;height: 36px;display: block;}
.bind-third li .title{ height: 30px;line-height: 30px;color: #666;}
.bind-third li:hover .title{ color: #333;}


@media screen and (max-width: 1080px) {
    #userSiderBar{ float: none;display: none; }
    #userSiderBar{ position: fixed;top: 0;left:0;bottom: 0;width: 100%; z-index: 999;background-color:rgba(0,0,0,0.4);border-radius: 0 2px 2px 0;}
    #userSiderBar .user-nav{ background: #fff;max-width: 265px;width: 60%;height: 100%;overflow: auto;}
    #showSiderBar{ display: block; position: fixed;right: 10px;bottom: 60px; width: 50px;height: 50px;background: rgba(0,0,0,0.7);color: #fff;text-align: center;line-height: 50px;z-index: 1000;border-radius: 2px;}
    #showSiderBar i{ font-size: 20px;}
    #userContainer{ width: auto;float: none;}
    #userContainer>.user-container{ margin-left: 0;}
}

@media screen and (max-width: 880px) {
    #userBase{ padding: 4% 0;}
    #userContainer{ width: 92%;margin: 0 auto;}
    .sign-rule{ text-align: right;padding: 0 0 15px 0;float: none;}
}
@media screen and (max-width: 768px) {
    .login-register .form-content{ width: 92%;max-width: 400px;float: none;margin: 0 auto;}
    #userContainer .user-location .path{ display: none;}
    #userContainer .user-insider{ min-height: 200px;}
}
@media screen and (max-width: 468px) {
    .document-search .layui-input{ width: 150px;}
    .custom-list-1 li{ padding-left: 0;}
    .custom-list-1 li .thumb{ position: static;width: 100%;}
    .custom-list-1 li .item{ padding-top: 10px;}

    .user-index{ padding-left: 110px;position: relative;min-height: 90px;}
    .user-index .user-avatar{ }
    .user-index .user-avatar{  width: 90px;height: 90px;line-height: 60px;font-size: 20px;}
    .user-index .user-name{ padding-top: 0px;}
    .user-index .nickname{ font-size: 18px;line-height: 30px;}
    .user-index .summary{ line-height: 24px;height: 48px;margin-top: 10px;}

    .user-index-msg li{ width: 100%;}
}