@charset "utf-8";
/*全局样式*/
body{padding: 0;margin: 0;background-color: #fff;font-family: 'PingFang SC','Source Han Sans CN','Microsoft YaHei';font-size: 14px;color: #333;}
/*控制body分辨率小于900zoom 设置0.8*/
/*@media screen and (max-height: 900px){
	body{zoom: 0.8;}
}*/
div,img,ul,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,p{padding: 0;margin: 0;border: 0;}
ul{list-style: none;}
a{text-decoration: none;color: #333;}
i,em{font-style: normal;}
img{display: inline-block;vertical-align: top;max-width: 100%;height: auto;}
/*去掉 input 默认边框*/
input{padding: 0;border: 0;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;color: #333;}
input[type="submit"]{cursor: pointer;}
/*去掉 textarea 默认边框*/
textarea{padding: 0;border: 0;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;color: #333;}
/*去掉 button 默认边框*/
button{border: 0;padding: 0;font-family: 'PingFang SC','Microsoft YaHei';font-size: 14px;color: #333;cursor: pointer;}
/*清除浮动*/
.clearfix:after{content: '';display: table;clear: both;}
.clearfix{*zoom: 1;/*IE6识别*/}
/*解决chrome浏览器 input,textarea 获得焦点时会有一个边框的问题*/
input,textarea{outline: none;}
/*清除ios端 input,textarea 默认内阴影 默认圆角,radio和checkbox需要还原值为radio和checkbox*/
input,textarea{appearance: none;-webkit-appearance: none;border-radius: 0;}
/*自定义 input,textarea 的placeholder文字样式*/
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color: #aaa;}
/*滚动条*/
/**::-webkit-scrollbar{width: 6px;height: 16px;background: #eee;border-radius: 3px;}
*::-webkit-scrollbar-thumb{background: #aaa;border-radius: 3px;}
*::-webkit-scrollbar-thumb:hover{background: #888;}*/

/*页面框架*/
.page-container{position: relative;}
/*左侧菜单*/
.page-menu-box{position: fixed;left: 0;top: 0;bottom: 0;width: 176px;padding: 10px 0 0;background: #355964 left bottom no-repeat;transition: 0.4s ease-out;}
.page-menu-box .user-info{display: flex;align-items: center;padding: 5px;margin: 10px;background-color: rgba(255,255,255,.1);border-radius: 10px;transition: 0.4s ease-out;}
.page-menu-box .user-info .avatar{overflow: hidden;transition: 0.3s;}
.page-menu-box .user-info .avatar:hover{border-color: #0067C0;}
.page-menu-box .user-info .info{width: 100%;color: #fff;white-space: nowrap;transition: 0.4s ease-out;display: flex;flex-direction: column;margin-left: 7px;}
.page-menu-box .user-info .info .name{max-width: 6em;overflow: hidden;text-overflow: ellipsis;}
.page-menu-box .user-info .info .txt{opacity: .8;}
.page-menu-box .menu-list{}
.page-menu-box .menu-list li{margin-top: 10px;}
.page-menu-box .menu-list li:first-child{margin-top: 0;}
.page-menu-box .menu-list li a{position: relative;display: flex;align-items: center;padding: 7px 15px 7px 20px;color: #fff;transition: 0.4s ease-out;}
.page-menu-box .menu-list li .icon{width: 20px;height: 20px;margin-right: 15px;/*opacity: .6;*/transition: 0.4s ease-out;}
.page-menu-box .menu-list li .name{position: relative;display: block;width: 100%;line-height: 30px;color: rgba(255,255,255);white-space: nowrap;transition: 0.4s ease-out;font-size: 0.8em;}
.page-menu-box .menu-list li .num{position: absolute;left: 30px;top: 0;width: 16px;height: 16px;background-color: #fb4b1c;border-radius: 50%;font-size: 12px;text-align: center;line-height: 16px;color: #fff;}
.page-menu-box .menu-list li:hover a{background-color: rgb(38 65 222 / 98%);}
.page-menu-box .menu-list li:hover .icon{opacity: 1;}
.page-menu-box .menu-list li:hover .name{color: #fff;}
.page-menu-box .menu-list li.on a{background-color: rgb(38 65 222 / 98%);}
.page-menu-box .menu-list li.on .icon{opacity: 1;}
.page-menu-box .menu-list li.on .name{color: #fff;}
.page-menu-box .app-title{position: relative;padding: 20px 20px 10px;margin-top: 10px;color: #fff;white-space: nowrap;transition: 0.4s ease-out;}
.page-menu-box .app-title::before{content: '';position: absolute;left: 20px;right: 20px;top: 0;height: 1px;background-color: rgba(255,255,255,.3);}
.page-menu-box .app-list{max-height: 430px;overflow-x: hidden;}
.page-menu-box .signout-btn{display: flex;align-items: center;color: #fff;cursor: pointer;transition: 0.4s ease-out;width: 45%;position: absolute;bottom: 20px;}
.page-menu-box .signout-btn .icon{width: 20px;height: 20px;margin-right: 15px;opacity: .6;transition: 0.4s ease-out;}
.page-menu-box .signout-btn .name{position: relative;display: block;width: 100%;line-height: 30px;color: rgba(255,255,255,.6);white-space: nowrap;transition: 0.4s ease-out;}
.page-menu-box .signout-btn:hover{background-color: rgba(255,255,255,.1);}
.page-menu-box .signout-btn:hover .icon{opacity: 1;}
.page-menu-box .signout-btn:hover .name{color: #fff;}
/*右侧主体*/
.page-body-box{position: relative;height: 100vh;box-sizing: border-box;padding: 0 0 40px;margin-left: 200px;transition: 0.4s ease-out;}
#page-body{display: block;width: 100%;height: 100%;}
#page-footer{position: fixed;margin-left: 18vh;left: 0;right: 0;bottom: 0;display: flex;justify-content: space-between;padding: 0 20px;font-size: 13px;line-height: 4vh;color: #666;box-shadow: 0 -2px 8px rgba(0,0,0,.1);background-color: #f3eeee;}
/*左侧菜单折叠时*/
.page-container.menu-fold .page-menu-box{width: 8.5vh;}
.page-container.menu-fold .page-menu-box .user-info{margin: 0;background-color: rgba(255,255,255,0);}
.page-container.menu-fold .page-menu-box .user-info .avatar{margin-right: 0;}
.page-container.menu-fold .page-menu-box .user-info .info{visibility: hidden;opacity: 0;transform: translateX(20px);}
.page-container.menu-fold .page-menu-box .menu-list li a{flex-wrap: wrap;padding: 7px 0;}
.page-container.menu-fold .page-menu-box .menu-list li .icon{margin: 0 auto;}
.page-container.menu-fold .page-menu-box .menu-list li .name{text-align: center;}
.page-container.menu-fold .page-menu-box .app-title{width: 2em;padding: 20px 0 10px;margin: 0 auto;overflow: hidden;}
.page-container.menu-fold .page-menu-box .app-title::before{left: 5px;right: 5px;}
.page-container.menu-fold .page-menu-box .app-list{max-height: 380px;overflow: hidden;}
.page-container.menu-fold .page-menu-box .app-list li a{flex-wrap: nowrap;padding: 7px 15px 7px 20px;}
.page-container.menu-fold .page-menu-box .app-list li .icon{margin: 0 15px 0 0;}
.page-container.menu-fold .page-menu-box .app-list li .name{opacity: 0;}
.page-container.menu-fold .page-menu-box .signout-btn .name{opacity: 0;}
.page-container.menu-fold .page-body-box{margin-left: 20.9vh;}
@media screen and (max-height: 900px){
    .page-container.menu-fold .page-body-box{margin-left: 23.5vh;}
}

/*页面内容*/
.page-content{position: relative;min-height: 94vh;box-sizing: border-box;padding-top: 60px;}
.page-content.home{padding-top: 56px;}
.page-content.home > .content-wrap{background-color: #ffffff;border: 0;}
/*页面头部*/
.page-content > .header{position: absolute;left: 0;right: 0;top: 0;}
.page-content > .content-wrap{min-height: 92vh;box-sizing: border-box;padding: 20px;background-color: #fff;border: 20px solid #F5F5F5;}
/*头部-首页*/
.header.home{display: flex;align-items: center;height: 56px;transition: 0.5s;background-size: contain, auto;}
.header.home .sys-logo{display: inline-block;vertical-align: top;}
.header.home .sys-logo > img{max-height: 44px;}
.header.home .sys-title{position: relative;display: inline-block;vertical-align: top;padding-left: 20px;}
.header.home .sys-title::before{content: "";display: block;position: absolute;top: 50%;left: 0;width: 1px;height: 36px;margin-top: -18px;background-color: #ddd;}
.header.home .sys-title .sys-title-zh{font-size: 18px;line-height: 26px;color: #0067C0;font-weight: 600;letter-spacing: 5px;}
.header.home .sys-title .sys-title-en{font-size: 14px;color: #999;line-height: 22px;}
/*头部-内页*/
.header.inpage{display: flex;align-items: center;height: 60px;box-sizing: border-box;padding: 10px 20px;background-color: #fff;border-bottom: 1px solid #ddd;}
.header.inpage .icon{width: 40px;height: 40px;}
.header.inpage .name{margin: 0 15px;font-size: 20px;line-height: 20px;color: #333;}
.header.inpage .txt{font-size: 14px;line-height: 30px;color: #999;}

/*头部信息区*/
.top-info-box{display: flex;justify-content: space-between;margin-bottom: 20px;}
.top-info-box *{box-sizing: border-box;}

.todo-block-container {
    /*display: flex;
    justify-content: space-between;
    width: calc(49%);
    height: 80px;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #ddd;
    box-shadow: 0 7px 12px 0px rgba(0, 103, 192, 0.06);*/
    /** 使用display: contents;它的作用是使得元素的子元素盒子模型内容不被当前元素的边框、内边距或者外边距所包含。换句话说，子元素会忽略它们父元素的样式属性 */
    display: contents;
}
.todo-block-container .todo-block-item{display: flex;justify-content: space-between;align-items: center;height: 60px;border-radius: 10px;white-space: nowrap;margin-top: 10px;}
.todo-block-container .todo-block-item .icon{flex: 0 0 30px;height: 40px;line-height: 40px;margin: 10px;}
.todo-block-container .todo-block-item .icon > img{vertical-align: middle;}
.todo-block-container .todo-block-item .title{width: 100%;height: 40px;line-height: 40px;color: #666;}
.todo-block-container .todo-block-item .number{height: 40px;line-height: 40px;font-size: 24px;font-weight: bold;padding-right: 10px;padding-left: 10px;}
.todo-block-container .todo-block-item.color-orange{background: rgba(248, 157, 8, 0.1) url(../images/number_block_bg_orange.png) 92% 8px no-repeat;transition: 0.3s;}
.todo-block-container .todo-block-item.color-orange:hover{background-color: rgba(248, 157, 8, .3);}
.todo-block-container .todo-block-item.color-orange .number{color: #f89d08;}
.todo-block-container .todo-block-item.color-blue{background: rgba(0, 103, 192, 0.1) url(../images/number_block_bg_blue.png) 95% 14px no-repeat;transition: 0.3s;}
.todo-block-container .todo-block-item.color-blue:hover{background-color: rgba(0, 103, 192, .3);}
.todo-block-container .todo-block-item.color-blue .number{color: #0067C0;}
.info-block-container{display: flex;justify-content: space-between;height: 80px;padding: 15px;border-radius: 10px;border: 1px solid #9dbdd7;/*background: url(../images/user_base_info_bg.png) no-repeat;*/background-color: #417ae3;background-size: cover;box-shadow: 0 4px 14px 4px rgba(0, 103, 192, 0.09);}
/*.info-block-container{display: flex;justify-content: space-between;width: calc(40.2%);height: 80px;padding: 15px;border-radius: 10px;border: 1px solid #9dbdd7;background: url(../images/user_base_info_bg.png) no-repeat;background-size: cover;box-shadow: 0 4px 14px 4px rgba(0, 103, 192, 0.09);}*/
.info-block-container .user-pic-box{display: block;flex: 50px 0 0;height: 50px;margin-right: 20px;border: 3px solid transparent;border-radius: 50%;overflow: hidden;transition: 0.3s;}
.info-block-container .user-pic-box:hover{border-color: #0067C0;}
.info-block-container .user-base-info{height: 50px;margin-right: 20px;white-space: nowrap;}
.info-block-container .user-base-info .user-info-box{line-height: 22px;margin: 0 0 5px;}
.info-block-container .user-base-info .user-info-box .name-box{display: inline-block;vertical-align: top;font-size: 18px;color: #0067C0;max-width: 6em;overflow: hidden;text-overflow: ellipsis;}
.info-block-container .user-base-info .user-info-box .number-box{color: #476985;}
.info-block-container .user-base-info .unit-box{color: #476985;line-height: 22px;max-width: 12em;overflow: hidden;text-overflow: ellipsis;}
.info-block-container .user-contact-info{height: 50px;width: calc(100% - 495px);padding: 0 10px 0 20px;border-left: 1px solid #a8cbf5;}
.info-block-container .user-contact-info .user-contact-row{width: 100%;margin: 0 0 5px;line-height: 22px;}
.info-block-container .user-contact-info .user-contact-row .contact-title{color: #476985;}
.info-block-container .user-contact-info .user-contact-row .contact-text{display: inline-block;vertical-align: top;color: #476985;overflow: hidden;text-overflow: ellipsis;}
.info-block-container .user-contact-info .user-contact-row:last-child{margin: 0;}
.info-block-container .user-card-info{display: flex;justify-content: space-between;align-items: center;height: 50px;width: 320px;padding: 10px 10px 10px 47px;background: rgba(0, 103, 192, 0.1) url(../images/icon_user_id.png) 10px center no-repeat;border-radius: 10px;font-size: 16px;line-height: 30px;color: #0067C0;white-space: nowrap;}
.info-block-container .user-card-info .user-id-title{}
.info-block-container .user-card-info .user-id-number{color: #0067C0;font-weight: bold;}

/*首页app面板*/
.home-app-panel{/*padding: 20px 20px 0;*/background-color: #fff;height: 75vh;}
/*选项卡标题*/
.tab-box{display: flex;margin-bottom: 20px;border-bottom: 1px solid rgba(153, 153, 153, 0.2);}
.tab-box .item{padding-bottom: 10px;margin-left: 40px;border-bottom: 4px solid transparent;line-height: 32px;color: #666;cursor: pointer;transition: 0.3s;}
.tab-box .item:first-child{margin-left: 0;}
.tab-box .item .icon{position: relative;display: inline-block;vertical-align: middle;width: 32px;height: 32px;margin-right: 10px;background-color: rgba(102, 102, 102, 0.3);border-radius: 10px;transition: 0.3s;}
.tab-box .item .icon img{position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 66%;height: 66%;margin: auto;}
.tab-box .item:hover{border-bottom-color: #0067C0;color: #0067C0;}
.tab-box .item:hover .icon{background-color: #0067C0;}
.tab-box .item.on{border-bottom-color: #0067C0;color: #0067C0;}
.tab-box .item.on .icon{background-color: #0067C0;}
.layui-tab-title{height: auto;}
.layui-tab-title .name{display: inline-block;vertical-align: top;font-size: 14px;line-height: 40px;}
/*.layui-tab-title li{padding: 0 0 10px;margin-left: 40px;}*/
.layui-tab-title li:first-child{margin-left: 0;}
.layui-tab-title li .icon{position: relative;display: inline-block;vertical-align: middle;width: 32px;height: 32px;margin-right: 10px;background-color: rgba(102, 102, 102, 0.3);border-radius: 10px;transition: 0.3s;font-size: 20px;line-height: 31px;}
.layui-tab-title li .icon img{position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 66%;height: 66%;margin: auto;}
.layui-tab-title .layui-this:after{top: auto;bottom: 0;height: 4px;background-color: #0067C0;border: 0!important;}
.layui-tab-brief>.layui-tab-title .layui-this{color: #0067C0;}
.layui-tab-brief>.layui-tab-title .layui-this .icon{background-color: #0067C0;color: #fff;}

/*工作app区*/
.work-app-box{}
.work-app-box > .section{}
.work-app-box > .section > .title{margin-bottom: 30px;border-bottom: 1px solid rgba(0, 103, 192, 0.3);}
.work-app-box > .section > .title .name{display: inline-block;vertical-align: top;padding: 0 10px;background-color: #0067C0;border-radius: 6px 6px 0 0;font-size: 14px;line-height: 28px;color: #fff;}
/*工作app列表*/
.work-app-list{font-size: 0;}
.work-app-list li{position: relative;display: inline-block;vertical-align: top;width: 12.5%;padding: 0 10px 20px;font-size: 14px;text-align: center;cursor: pointer;top: 10px;}
.work-app-list li a{display: block;}
/*.work-app-list li .icon{display: inline-block;vertical-align: top;max-width: 60px;transition: 0.3s;}*/
.work-app-list li .icon{
    display: inline-block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    transition: 0.3s;
    font-size: 40px;
    background-color: #1e9fff;
    box-shadow: -2px -2px 8px 2px rgba(.1,.1,.1,.5);
    color: #fff;
    border-radius: 10px;
}

.work-app-list li .name{height: 40px;margin-top: 20px;font-size: 14px;color: #666;line-height: 20px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;transition: 0.3s;}
.work-app-list li:hover .icon{transform: translateY(-5px);}
.work-app-list li:hover .name{color: #0067C0;}

/*带菜单栏的页面*/
.page-menu{display: flex;justify-content: space-between;min-height: calc(100vh - 60px);padding: 0;border: 0;}
.page-menu > .con-l{flex: 0 0 180px;background-color: #fff;}
.page-menu > .con-r{width: 100%;padding: 15px;background-color: #fff;border: 15px solid #F5F5F5;overflow: hidden;}

/*菜单*/
.menu-list{}
.menu-list li{}
.menu-list li > a{display: block;padding: 10px 20px;border-right: 3px solid transparent;font-size: 14px;line-height: 24px;color: #666;cursor: pointer;transition: 0.3s;}
.menu-list li:hover > a{background-color: rgba(0, 103, 192, 0.1);border-right-color: #3d7384;color: #3d7384;}
.menu-list li.on > a{background-color: rgba(0, 103, 192, 0.1);border-right-color: #3d7384;color: #3d7384;}
/*内页标题*/
.inpage-title{margin-bottom: 15px;}
.inpage-title .name{display: inline-block;vertical-align: top;font-size: 20px;line-height: 30px;}

/*二级菜单*/
.menu-list2{}
.menu-list2 li{}
.menu-list2 li > a{display: block;padding: 10px 20px;border-right: 3px solid transparent;font-size: 14px;line-height: 24px;color: #666;cursor: pointer;transition: 0.3s;}
.menu-list2 li:hover > a{}
.menu-list2 li:hover > a >span{color: burlywood;}
.menu-list2 li.on > a{background-color: rgba(0, 103, 192, 0.1);border-right-color: #3d7384;color: #3d7384;}

/*搜索区*/
.search-box{padding: 15px 10px;border: 1px solid #F0F0F0;background-color: #F5F5F5;}
.search-box .layui-form-label{width: auto;padding: 5px 0 5px 20px;}
.search-box .layui-btn{margin-left: 10px;}

/*表单副标题*/
.form-subtitle{padding: 0 10px;margin-bottom: 20px;line-height: 20px;}
.form-subtitle .name{display: inline-block;vertical-align: top;margin-right: 15px;}
.form-subtitle .name .fa{vertical-align: middle;margin: -0.25em 0.4em 0 0;}
.form-subtitle .tip{display: inline-block;vertical-align: top;margin-right: 15px;color: #999;}

/*自定义layui默认样式*/
.layui-input-block{margin-left: 100px;min-height: 30px;}
.layui-form-item{margin-bottom: 10px;}
.layui-form-label{padding: 5px 10px;}
.layui-form-label.auto-width{width: auto;}
.layui-form-label i{position: absolute;margin-left: -.6em;color: #fc4f54;}
.layui-input, .layui-textarea, .layui-select{height: 30px;border-radius: 4px;}
.layui-form-radioed, .layui-form-radioed > i, .layui-form-radio:hover *{color: #0067C0;}
.layui-form-onswitch{border-color: #0067C0;background-color: #0067C0;}
.layui-form-radio > i:hover, .layui-form-radioed > i{color: #0067C0;}
.layui-form-checked i, .layui-form-checked:hover i{color: #0067C0;}
.layui-form-checked[lay-skin="primary"] i{border-color: #0067C0 !important;background-color: #0067C0;}
.layui-form-checkbox[lay-skin=primary]:hover i{border-color: #0067C0;}
.layui-form-select dl dd.layui-this{background-color: #0067C0;}
body .layui-laydate .layui-this{background-color: #0067C0 !important;}
body .layui-laydate-footer span:hover{color: #0067C0;}
.layui-btn{background-color: #0067C0;border-radius: 4px;}
.layui-btn-primary{background-color: #fff;}
.layui-btn-primary:hover{border-color: inherit;}
.layui-btn .fa{vertical-align: middle;margin: -.25em .4em 0 0;}
.layui-border-red{background-color: transparent!important;color: #fc4f54!important;}
.layui-table-cell{padding: 0 10px;}
.layui-laypage .layui-laypage-curr .layui-laypage-em{background-color: #0067C0;}
.layui-laypage a:hover{color: #0067C0;}
.layui-laypage input:focus, .layui-laypage select:focus{border-color: #0067C0!important;}
.layui-menu li:hover{background-color: #0067C0;color: #fff;}
.layui-laydate-footer span:first-child.layui-laydate-preview{color: #0067C0!important;}

/*场地信息列表*/
.place-info-list{}
.place-info-list li{float: left;width: 21%;margin: 0 2% 4%;}
.place-info-list li .tit{margin-bottom: 20px;font-size: 18px;text-align: center;line-height: 1;font-weight: bold;}
.place-info-list li .pic{position: relative;padding-top: 66%;background-position: center;background-size: cover;background-repeat: no-repeat;border-radius: 4px;overflow: hidden;}
.place-info-list li .pic img{position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: cover;}
.place-info-list li .btns{margin-top: 25px;font-size: 0;text-align: center;}
.place-info-list li .btns .btn{display: inline-block;vertical-align: top;padding: 0 1em;margin: 0 10px;background-color: #0067C0;border-radius: 4px;font-size: 14px;line-height: 36px;color: #fff;cursor: pointer;transition: 0.3s;}
.place-info-list li .btns .btn:hover{opacity: .9;}



/*中屏PC:<=1440px(针对1366*650)*/
@media screen and (max-width: 1440px){
    /*场地信息列表*/
    .place-info-list li{width: 29.33%;}
}

/*小屏PC:>=1025px && <=1300px*/
@media screen and (max-width: 1300px){
}

/*pad横屏:1024px*/
@media screen and (max-width: 1024px){
    /*场地信息列表*/
    .place-info-list li{float: none;width: 100%;margin: 0 0 30px;}
    .place-info-list li .tit{margin-bottom: 15px;font-size: 16px;}
    .place-info-list li .btns{margin-top: 15px;}
    .place-info-list li .btns .btn{margin: 0 6px;font-size: 12px;line-height: 30px;}
}

/*phone:<=768px*/
@media screen and (max-width: 768px){

}