html { padding: 0; margin: 0 }
body { position: absolute; width: 100%; height: 100%; padding: 0; margin: 0; /* font-size: 14px; */ overflow: hidden }
input, button, textarea { outline: none }
div::-webkit-scrollbar { width: 10px; height: 10px; }
div::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #ddd; }
div::-webkit-scrollbar-track { border-radius: 10px; background: none; transition: all 0.3s }
div::-webkit-scrollbar-thumb:hover { background-color: #666 }

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar { width: 10px; height: 10px; }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #ddd; }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-track { border-radius: 10px; background: none; transition: all 0.3s }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb:hover { background-color: #666 }

.errorMsg { width: 100%; position: fixed; top: 0; left: 0px; z-index: 99999999999999; text-align: center; height: 100%; background: rgba(0,0,0,0); }
.errorMsg .glyphicon, .successMsg .glyphicon, .warningMsg .glyphicon { font-size: 20px; }
.errorMsg *, .successMsg *, .warningMsg * { font-weight: bold; font-size: 14px; letter-spacing: 1px; }
.errorMsg .msg-body { width: auto; height: auto; background-color: rgba(0,0,0,0.8); display: inline-block; border-radius: 3px; color: #fff; padding: 26px 20px 26px 20px; min-width: 245px; }
.successMsg { width: 100%; position: fixed; top: 0; left: 0px; z-index: 99999999999999; text-align: center; height: 100%; background: rgba(0,0,0,0); }
.successMsg .msg-body { width: auto; height: auto; background-color: rgba(0,0,0,0.8); display: inline-block; border-radius: 3px; color: #fff; padding: 26px 20px 26px 20px; min-width: 245px; }
.warningMsg { width: 100%; position: fixed; top: 0; left: 0px; z-index: 99999999999999; text-align: center; height: 100%; background: rgba(0,0,0,0); }
.warningMsg .msg-body { width: auto; height: auto; background-color: rgba(0,0,0,0.8); display: inline-block; border-radius: 3px; color: #fff; padding: 26px 20px 26px 20px; min-width: 245px; }
.msg-body .fa { display: none; }
.msg-body br { display: none; }
.msg-body .icon { border-radius: 200px; border: 1px solid #fff; margin-bottom: 5px; display: inline-block; width: 37px; height: 37px; font-size: 16px; line-height: 37px; text-align: center; }
.loading { background-color: rgba(0,0,0,0); position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999999999999; display: none; text-align: center; }
.loading .img { width: auto; height: auto; background: url(../img/loading.gif) 50px center no-repeat; background-color: rgba(0,0,0,0.8); background-color: black\9; display: inline-block; border-radius: 3px; color: #fff; padding: 40px 50px 40px 50px; text-indent: 50px; font-weight: bold; }
.uploadLoading { background-color: rgba(0,0,0,0); position: fixed; top: 45%; left: 0; width: 100%; height: 100%; z-index: 999999999999; display: none; text-align: center; }
.uploadLoading .img { width: auto; height: auto; background: url(../img/loading.gif) 50px center no-repeat; background-color: rgba(0,0,0,0.8); background-color: black\9; display: inline-block; border-radius: 3px; color: #fff; padding: 40px 50px 40px 50px; text-indent: 50px; font-weight: bold; }
.redTxt { color: rgba(211,75,57,1); }
.greenTxt { color: rgba(75,160,13,1); }
.orangeTxt { color: orange; }
.yellowTxt { color: yellow; }
.blueTxt { color: blue; }

.modalBox { position: absolute; width: 100%; height: 100%; z-index: 9; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.5); display: none; }
.modalBox .dailog { padding: 15px; max-height: calc(100% - 0px); background: #fff; border-radius: 15px; min-width: 300px; display: none; overflow: hidden; position: relative }
.modalBox .dailog .title { width: 100%; margin-bottom: 10px; position: relative; float: left; }
.modalBox .dailog .title h2 { font-size: 18px; margin: 0; font-weight: normal; width: 100%; float: left; color: #333 }
.modalBox .dailog .title .close { position: absolute; top: -5px; right: -5px; display: block; width: 24px; height: 24px; line-height: 18px; cursor: pointer; border-radius: 100px; border: 2px solid #333; color: #333; text-align: center; font-size: 16px; opacity: 1; }
.modalBox .dailog .title .close .fa { font-size: 14px; }
.modalBox .dailog .title .close:hover { color: rgb(24 73 144); border-color: rgb(24 73 144) }
.modalBox .dailog .content { width: 100%; overflow: auto; }
.modalBox .dailog .content .box { overflow: hidden; margin-top: 10px; }
.modalBox .dailog .footer { overflow: hidden; padding: 15px 0; text-align: center }
.modalBox .dailog .footer button { border-radius: 8px; border: 0; outline: none; padding: 6px 35px; line-height: 25px; transition: all 0.3s; background: rgb(0, 122, 255); color: #fff; margin: 0 10px }
.modalBox .dailog .footer button:hover { background: rgb(24 73 144); color: #fff; }

.modalBox .dailog .footer button.btn-default { background: #ddd; color: #000; transition: all 0.3s }
.modalBox .dailog .footer button.btn-default:hover { background: #666; color: #fff }

.form-item { overflow: hidden; margin: 0px 0 10px 0; }
.form-item label { margin: 0 0 10px 0; display: block; font-weight: normal; color: #333 }
.form-item input[type=text].form-control { width: calc(100%); border: 1px solid #ddd; border-radius: 8px; padding: 10px; outline: none }
.form-item input[type=text].form-control:focus { border-color: #54D3E6; outline: none; box-shadow: none }
.form-item textarea.form-control { width: calc(100%); border: 1px solid #ddd; border-radius: 8px; padding: 10px; outline: none; resize: none; height: 83px }
.form-item textarea.form-control:focus { border-color: #54D3E6; outline: none; box-shadow: none }
.form-item select.form-control { width: 100%; }
.form-item textarea.form-control { width: calc(100%); padding: 5px; outline: none; background: #fff }
.form-item label .redTxt { color: red; margin: 0 5px }

textarea.form-control:focus { border-color: #54D3E6; outline: none; box-shadow: none }
input.form-control:focus { border-color: #54D3E6; outline: none; box-shadow: none }

#modal-seller-edit .box { display: flex; flex-wrap: wrap; }
#modal-seller-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; position: relative }
#modal-seller-edit .form-item .uploadImgBox { width: 100%; float: left; }
#modal-seller-edit .form-item .uploadImgBox:last-child { float: right }
#modal-seller-edit .form-item .uploadImgBox .img { border: 1px solid #ddd; border-radius: 10px; overflow: hidden; background: url(../img/sctp.png) center center no-repeat; background-size: contain; width: 100%; height: 80px; }
#modal-seller-edit .form-item .uploadImgBox .img:hover { border-color: #54D3E6; cursor: pointer }
#modal-seller-edit .tipBox { line-height: 30px; color: red }

#modal-seller-edit .form-item input.validateCode { }
#modal-seller-edit .form-item .validateBtn { width: auto; position: absolute; z-index: 9; top: 25px; right: 5px; background: #fff; transition: all 0.3s; cursor: pointer; display: block; padding: 9px 0; line-height: 25px; height: 43px; font-size: 12px; text-align: center; background: none; border: 0; color: #54D3E6 }
#modal-seller-edit .form-item .validateBtn:hover { color: #2eb3c7 }
#modal-seller-edit .form-item .emailValidated { float: right; color: #54D3E6; display: none }

#modal-company-edit #dwxx .box { display: flex; flex-wrap: wrap; }
#modal-company-edit #dwxx .form-item { flex: 1 0 30%; margin: 5px 10px 10px 10px; }
#modal-company-edit #dwxx .form-item .uploadImgBox { width: 100%; float: left; }
#modal-company-edit #dwxx .form-item .uploadImgBox:last-child { float: right }
#modal-company-edit #dwxx .form-item .uploadImgBox .img { border: 1px solid #ddd; border-radius: 10px; overflow: hidden; background: url(../img/sctp.png) center center no-repeat; background-size: contain; width: 80px; height: 80px; }
#modal-company-edit #dwxx .form-item .uploadImgBox .img:hover { border-color: #54D3E6; cursor: pointer }

#modal-company-edit #jcxx .box { display: flex; flex-wrap: wrap; }
#modal-company-edit #jcxx .form-item { flex: 1 0 30%; margin: 5px 10px 10px 10px; }

#modal-company-code .invitationCodeBox { border: 1px solid #eee; border-radius: 8px; text-align: center; padding: 30px 0; overflow: hidden }
#modal-company-code .invitationCodeBox input { border: 0; text-align: center; width: 120px; font-size: 17px; color: #000; outline: none }
#modal-company-code .invitationCodeBox a { color: #666 }
#modal-company-code .invitationCodeBox a:hover { color: #54D3E6; cursor: pointer }

.table td .fileName { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; }

.table > thead > tr > th { border: 0; vertical-align: middle; font-weight: normal }
.table > tbody > tr > td { border: 0; vertical-align: middle; color: #666; position: relative;word-break:break-all }
.table > tbody > tr > td > div { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.table-hover > tbody > tr.selected { background-color: #eee }
.table > tbody > tr > td > div.singleContent { top: 8px; left: 8px; right: 8px; bottom: 8px; position: absolute; overflow: hidden; -webkit-line-clamp: 1; }
.centerTd { text-align: center }
.table > tbody > tr > td > .actionBtn:hover { cursor: pointer; color: #54D3E6 }
.table > tbody > tr > td > .actionBtn .fa { display: block; margin-left: 5px; width: auto; float: left }
.table > tbody > tr > td > .actionBtn font { display: block; margin-left: 0px; width: auto; float: left }
.table.table-bordered > thead > tr > th, .table.table-bordered > tbody > tr > td { border: 1px solid #ddd; border-top: 0; border-left: 0 }
.table.table-bordered > tbody > tr:last-child > td { border-bottom: 0 }

.dataTables_scrollHead { padding: 0px }
.dataTables_scrollBody { padding: 0px }

.table > tbody > tr > td .status1 { border: 1px solid #54D3E6; color: #54D3E6; background: #f6feff; padding: 3px 7px; border-radius: 2px; line-height: 14px; font-size: 12px; display: inline-block; width: auto;transition:all 0.3s }
.table > tbody > tr > td .status1:hover { background: #54D3E6; color: #fff }
.table > tbody > tr > td .status0 { border: 1px solid #f75039; color: #f75039; background: #fff8f7; padding: 3px 7px; border-radius: 2px; line-height: 14px; font-size: 12px; display: inline-block; width: auto; transition: all 0.3s }
.table > tbody > tr > td .status0:hover { background: #f75039; color: #fff }

.table > tbody > tr > td button.disabled { opacity: 0.5; pointer-events: none }

.table > tbody > tr > td.nameTd { word-break: break-all; }

.dataTables_scrollBody .contextMenuBox { position: absolute; min-width: 110px; height: auto; background: #fff; box-shadow: 0 6px 12px rgb(0 0 0 / 20%); border-radius: 4px; overflow: hidden }
.dataTables_scrollBody .contextMenuBox .item { padding: 6px 10px; }
.dataTables_scrollBody .contextMenuBox .item:last-child { }
.dataTables_scrollBody .contextMenuBox .item span { display: inline-block; width: 30px; text-align: center; line-height: 20px; }
.dataTables_scrollBody .contextMenuBox .item { font-size: 14px }
.dataTables_scrollBody .contextMenuBox .item:hover { font-weight: normal; cursor: pointer; background: #f5f5f5 }
.tableBox { position: relative; visibility: visible }
.tableBox .contextMenuBox { position: absolute; min-width: 110px; border: 0; height: auto; background: #fff; box-shadow: 0 6px 12px rgb(0 0 0 / 20%); border-radius: 4px; overflow: hidden }
.tableBox .contextMenuBox .item { padding: 6px 15px; }
.tableBox .contextMenuBox .item:last-child { }
.tableBox .contextMenuBox .item span { display: inline-block; width: 30px; text-align: center; line-height: 20px; }
.tableBox .contextMenuBox .item { font-size: 14px }
.tableBox .contextMenuBox .item:hover { font-weight: normal; cursor: pointer; background: #f5f5f5 }

.imgTdTable .dataTables_scrollHead { display: none }
.imgTdTable .table { display: block; width: 100%; float: left; }
.imgTdTable .table > tbody { display: block; padding: 0; overflow: hidden; margin: 0 0px 0 0px }
.imgTdTable .table > tbody > tr > td { display: none; height: auto; position: relative; padding: 0 }

.imgTdTable .table > tbody > tr { display: block; float: left; background: none; margin: 17px 0px 0px 17px; border-radius: 5px }
.imgTdTable .table > tbody > tr:hover { background: none }
.imgTdTable .table > tbody > tr > td.dataTables_empty { display: block; }

.imgTdTable .table > tbody > tr > td.thumbnailTd { display: block; }
.imgTdTable .table > tbody > tr > td .thumbnailItem { width: 110px; height: 110px; overflow: hidden; text-align: center; cursor: default; }
.imgTdTable .table > tbody > tr > td .thumbnailItem:hover { background-color: #F7F8FA; border-radius: 3px; }
.imgTdTable .table > tbody > tr > td .thumbnailItem:hover .img { border-color: #54D3E6 }
.imgTdTable .table > tbody > tr > td .thumbnailItem .img { width: 65px; height: 65px; background: center center no-repeat; background-size: 55px auto; /*border: 1px dashed #999;*/ margin: 0px auto 0 auto; position: relative }
.imgTdTable .table > tbody > tr > td .thumbnailItem .img span { position: absolute; bottom: 0; left: 0; width: 100%; color: #fff; padding: 1px 0; font-size: 10px; background-color: rgba(0,0,0,0.5); width: 100% }
.imgTdTable .table > tbody > tr > td .thumbnailItem h3 { font-size: 12px; color: #333; padding: 0; margin: 0; height: 20px; line-height: 20px; overflow: hidden; width: 100%; margin-top: 0px; white-space: nowrap; text-overflow: ellipsis; }
.imgTdTable .table > tbody > tr > td .thumbnailItem p { font-size: 12px; color: #999; padding: 0; margin: 0; height: 20px; line-height: 20px }
.imgTdTable .table > tbody > tr > td .thumbnailItem .checkBtn { display: none; position: absolute; top: 8px; right: 8px; width: 18px; height: 18px; line-height: 18px; border-radius: 100px; padding: 0; font-size: 12px; zoom: 0.8; }
.imgTdTable .table > tbody > tr > td .thumbnailItem .checkBtn:disabled { cursor: pointer; opacity: 1 }
.imgTdTable .table > tbody > tr > td .thumbnailItem .roleFlag { width: auto; height: 17px; position: absolute; left: 0; top: 0; z-index: 9 }
.headerBox .queryBox .item.imgCheckAll .btn { border-radius: 100px; zoom: 0.9; padding: 0; width: 18px; height: 18px; line-height: 17px; font-size: 12px; margin: 9.5px 3px; float: left; }
.headerBox .queryBox .item.imgCheckAll label { line-height: 33px; margin: 0 }

.roleImgTdTable .dataTables_scrollHead { display: none }
.roleImgTdTable .table { display: block; width: 100%; float: left; }
.roleImgTdTable .table > tbody { display: block; padding: 0; overflow: hidden; margin: 0 0px 0 0px }
.roleImgTdTable .table > tbody > tr > td { display: none; height: auto; position: relative; padding: 0 }
.roleImgTdTable .table > tbody > tr > td.dataTables_empty { display: block; }
.roleImgTdTable .table > tbody > tr { display: block; float: left; background: none; margin: 20px 0px 0px 20px; border-radius: 5px }
.roleImgTdTable .table > tbody > tr:hover { background: none }
.roleImgTdTable .table > tbody > tr > td.roleTd { display: block; }
.roleImgTdTable .table > tbody > tr > td .roleItem { width: 150px; height: 185px; overflow: hidden; text-align: center; cursor: default; border-radius: 20px; border: 1px solid #ddd }
.roleImgTdTable .table > tbody > tr > td .roleItem:hover .img { background-color: #fff; }
.roleImgTdTable .table > tbody > tr > td .roleItem .img { width: 150px; height: 95px; background: url(../img/role.png) center bottom no-repeat; background-size: 80px auto; background-color: #fff; }
.roleImgTdTable .table > tbody > tr > td .roleItem h3 { font-size: 14px; color: #333; padding: 0; margin: 0; height: 16px; line-height: 16px; overflow: hidden; width: 100%; margin: 10px 0; white-space: nowrap; text-overflow: ellipsis; }
.roleImgTdTable .table > tbody > tr > td .roleItem p { font-size: 12px; color: #666; padding: 0; margin: 0; height: 12px; line-height: 12px; overflow: hidden; width: 100%; margin: 10px 0; white-space: nowrap; text-overflow: ellipsis; }

.screenImgTdTable .dataTables_scrollHead { display: none }
.screenImgTdTable .table { display: block; width: 100%; float: left; }
.screenImgTdTable .table > tbody { display: block; padding: 0; margin: 0 0px 0 0px }
.screenImgTdTable .table > tbody > tr > td { display: none; height: auto; position: relative; padding: 0 }
.screenImgTdTable .table > tbody > tr > td.dataTables_empty { display: block; }
.screenImgTdTable .table > tbody > tr { display: block; float: left; background: none; margin: 20px 0px 0px 20px; border-radius: 5px }
.screenImgTdTable .table > tbody > tr:hover { }
.screenImgTdTable .table > tbody > tr > td.screenTd { display: block; }
.screenImgTdTable .table > tbody > tr > td .screenItem { width: 170px; transition: all 0.3s; height: 170px; overflow: hidden; text-align: center; cursor: default; border-radius: 5px; background: #F2F6FC }
.screenImgTdTable .table > tbody > tr > td .screenItem:hover { box-shadow: 0 0 20px rgba(0,0,0,0.1) }
.screenImgTdTable .table > tbody > tr > td .screenItem .img { width: 170px; height: 90px; background: url(../img/device.png) center bottom no-repeat; background-size: 50px auto; }
.screenImgTdTable .table > tbody > tr > td .screenItem h3 { font-size: 14px; color: #333; padding: 0; margin: 0; height: 25px; line-height: 25px; overflow: hidden; width: 100%; margin: 10px 0; white-space: nowrap; text-overflow: ellipsis; }
.screenImgTdTable .table > tbody > tr > td .screenItem p { font-size: 12px; margin: 0 }

.screenImgTdTable .dataTables_scrollBody { padding-bottom: 20px; }

.typeImgTdTable .dataTables_scrollHead { display: none }
.typeImgTdTable .table { display: block; width: 100%; float: left; }
.typeImgTdTable .table > tbody { display: block; padding: 0; margin: 0 0px 0 0px }
.typeImgTdTable .table > tbody > tr > td { display: none; height: auto; position: relative; padding: 0 }
.typeImgTdTable .table > tbody > tr > td.dataTables_empty { display: block; }
.typeImgTdTable .table > tbody > tr { display: block; float: left; background: none; margin: 20px 0px 0px 20px; border-radius: 5px }
.typeImgTdTable .table > tbody > tr:hover { }
.typeImgTdTable .table > tbody > tr > td.typeTd { display: block; }
.typeImgTdTable .table > tbody > tr > td .typeItem { width: 170px; transition: all 0.3s; height: 170px; overflow: hidden; text-align: center; cursor: default; border-radius: 5px; background: #F2F6FC }
.typeImgTdTable .table > tbody > tr > td .typeItem:hover { box-shadow: 0 0 20px rgba(0,0,0,0.1) }
.typeImgTdTable .table > tbody > tr > td .typeItem .img { width: 170px; height: 100px; background: url(../img/screentype.png) center bottom no-repeat; background-size: 50px auto; }
.typeImgTdTable .table > tbody > tr > td .typeItem h3 { font-size: 14px; color: #333; padding: 0; margin: 0; height: 25px; line-height: 25px; overflow: hidden; width: 100%; margin: 20px 0; white-space: nowrap; text-overflow: ellipsis; }

td .default { position: absolute; width: 25px; height: 15px; background: url(../img/default.png) center center no-repeat; background-size: cover; right: 0 }

.areaBox { overflow: hidden; padding: 20px 20px 0 20px }
.areaBox a { display: block; float: left; position: relative; background: #F7F8FA; border: 1px solid #EBEEF5; line-height: 34px; height: 35px; text-decoration: none; padding: 0 25px; border-left: 0; color: #909399; cursor: pointer; }

.areaBox a.selected { background: #fff; color: #54D3E6; }
.areaBox a img { display: block; width: 20px; position: absolute; top: 0; right: 0 }
.areaBox a.addBtn i { margin-right: 5px; }
.areaBox a:first-child { border-left: 1px solid #EBEEF5; }
.areaBox a:last-child { border-left: 0; }

.activationCodeBox { overflow: hidden }
.activationCodeBox .title { text-align: center }
.activationCodeBox .activationCode { padding: 20px 0px 0px 0px; overflow: hidden; text-align: center }
.activationCodeBox .activationCode input { width: 9%; margin: 1% 1%; display: inline-block; text-align: center; font-size: 22px; line-height: 40px; height: 40px; border-radius: 5px; border: 1px solid #ddd }

.table .checkBtnTd { text-align: center; }

.table_media_wrapper .table .checkBtnTd { text-align: right; }

.pagination > li > a, .pagination > li:first-child > a, .pagination > li:last-child > a, .pagination > li > span, .pagination > li:first-child > span, .pagination > li:last-child > span { border-radius: 100px; padding: 0; width: 30px; height: 30px; line-height: 28px; margin: 0 2px; text-align: center; outline: none; font-family: serif; font-weight: bold }
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { border-color: rgb(83 211 230); background: rgb(83 211 230); }
div.dataTables_wrapper div.dataTables_length { margin-left: 20px }
div.dataTables_wrapper div.dataTables_paginate { margin-right: 20px; }

.table .checkBtnTd .btn { border-radius: 3px; zoom: 0.9; padding: 0; width: 18px; height: 18px; line-height: 17px; font-size: 12px; }
.checkAllBtn.btn-default i { visibility: hidden; }
.checkAllBtn.btn-check, .checkBtn.btn-check { background: #54D3E6; color: #fff }
.checkAllBtn.btn-check i { visibility: visible; }
.checkBtn.btn-default i { visibility: hidden; }
.checkBtn.btn-check i { visibility: visible; }


.loginLeftBox { width: 45%; left: 0; height: 100%; position: absolute; }
.loginRightBox { width: 55%; right: 0; height: 100%; position: absolute; background: url(../img/loginbg.png) center center no-repeat; background-size: cover; }
#loginBody { display: flex; align-items: center; justify-content: center; background: #fff; position: absolute; width: 100%; height: 100% }
.loginBox { width: 380px; height: auto; }
.loginBox .logo { overflow: hidden; padding: 0 0px 15px 0px }
.loginBox .logo img { max-height: 38px; display: inline-block; vertical-align: middle; }
.loginBox .logo span { font-size: 25px; display: inline-block; line-height: 38px; height: 38px; vertical-align: middle; }

.loginBox .txtBox { overflow: hidden; padding: 0px 0px; color: #999 }
.loginBox .txtBox h3 { font-weight: bold; font-size: 20px; color: #333 }
.loginBox .txtBox p { font-size: 14px; color: #999 }
.loginBox .userPWDLoginBtn { text-align: center; padding: 10px 0px 20px; border-bottom: 1px solid #eee; margin-bottom: 20px }
.loginBox .userPWDLoginBtn a { border: 1px solid #6BEFF4; color: #6BEFF4; border-radius: 8px; display: block; line-height: 42px }
.loginBox .formBox { overflow: hidden; padding: 0 0px; background: #fff; margin: 20px 0 0 0; }
.loginBox .formBox .item { overflow: hidden; margin-bottom: 15px; position: relative }
.loginBox .formBox .item input[type=text], .loginBox .formBox .item input[type=password] { outline: none; background: #F7F8FA; padding: 9px 4%; line-height: 25px; height: 43px; border: 0px; display: block; width: 100%; border-radius: 8px; }
.loginBox .formBox .item input[type=text]:hover, .loginBox .formBox .item input[type=password]:hover, .loginBox .formBox .item input[type=text]:focus, .loginBox .formBox .item input[type=password]:focus { border: 0; background: #eee; }
.loginBox .formBox .item input.validateCode { }
.loginBox .formBox .validateBtn { width: 100px; position: absolute; z-index: 9; top: 0; right: 0; transition: all 0.3s; cursor: pointer; display: block; padding: 9px 0; line-height: 25px; height: 43px; text-align: center; background: none; border: 0; color: #666 }
.loginBox .formBox .validateBtn:hover { color: #000 }
.loginBox .formBox .submitBtn { width: 100%; margin-top: 10px; transition: all 0.3s; cursor: pointer; display: block; padding: 9px 0; line-height: 25px; height: 43px; text-align: center; background: #6BEFF4 linear-gradient(90deg, #69EDF3 0%, #3DC1DD 100%); border: 0; border-radius: 8px; color: #fff }
.loginBox .formBox .submitBtn:hover { background: #6BEFF4 linear-gradient(90deg, #36bdc3 0%, rgb(12 115 163) 100%); }
.loginBox label { color: #666; line-height: 20px; font-weight: normal }
.loginBox a { color: #54D3E6; cursor: pointer; text-decoration: none }
.loginBox a:hover { color: rgba(43,146,195,1) }

.loginBox #numImg { height: 30px; position: absolute; right: 7px; top: 7px; border-radius: 6px; display: block; overflow: hidden; cursor: pointer }


.menuBox .menuItem, .headerBox .navBox .menuItem, .purviewBarBox .menuItem { display: none }
.authItem { pointer-events: none; opacity: 0.5; cursor: not-allowed; }

.footerTxt { text-align: center; position: absolute; bottom: 15px; width: 100%; left: 0; color: #666 }
#main { display: flex; }

.leftBox { width: 220px; background: #F7F8FA; position: relative; min-width: 220px; }
.leftBox .logo { overflow: hidden; text-align: center; width: 100%; float: left; margin: 10px 0 10px 0; }
.leftBox .logo img { max-height: 28px; display: inline-block; vertical-align: middle; }
.leftBox .logo span { font-size: 20px; display: inline-block; line-height: 20px; height: 20px; vertical-align: middle; }
.menuBox { overflow-x: hidden; overflow-y: auto; width: 100%; float: left; padding: 0px 0; }
.menuBox ul { list-style: none; margin: 0px; display: block; padding: 0; padding-inline-start: 0; }
.menuBox li { list-style: none; margin: 0; padding: 0; }

.menuBox > ul > li { margin-bottom: 0px; padding-bottom: 0px; margin: 5px 0 5px 0; }
.menuBox > ul > li > div i { border-radius: 100px; width: 25px; height: 25px; padding: 2px; text-align: center; line-height: 21px; font-size: 12px; background: #ddd; color: #333 }
.menuBox > ul > li > div span { display: inline-block; margin-left: 22px; color: #222 }
.menuBox > ul > li div { display: block; overflow: hidden; }

.menuBox > ul > li.selected { }
.menuBox > ul > li.selected > div { background: #DFFEFF }
.menuBox > ul > li > div a { display: block; cursor: pointer; padding: 10px 20px 10px 20px; }
.menuBox > ul > li > ul > li { margin-bottom: 0px; padding-bottom: 0px; }
.menuBox > ul > li > ul > li > div i { border-radius: 100px; width: 20px; height: 20px; padding: 2px; text-align: center; line-height: 16px; font-size: 10px; background: #ddd; color: #333 }
.menuBox > ul > li > ul > li > div span { display: inline-block; margin-left: 23px; color: #444; font-size: 12px; }
.menuBox > ul > li > ul > li > div { display: block; overflow: hidden; }
.menuBox > ul > li > ul > li > div { display: block }
.menuBox > ul > li.selected > ul > li > div { display: block }
.menuBox > ul > li > ul > li.selected > div { background: #eee; }
.menuBox > ul > li > ul > li > div a { display: block; cursor: pointer; padding: 8px 40px; }

.menuIcon_sy { background: url(../img/menuIcon_sy.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_sy { background-image: url(../img/menuIcon_sy_selected.png) }
.menuIcon_wj { background: url(../img/menuIcon_wj.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_wj { background-image: url(../img/menuIcon_wj_selected.png) }
.menuIcon_fl { background: url(../img/menuIcon_fl.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_fl { background-image: url(../img/menuIcon_fl.png) }
.menuIcon_wjsp { background: url(../img/menuIcon_wjsp.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_wjsp { background-image: url(../img/menuIcon_wjsp.png) }

.menuIcon_dpld { background: url(../img/menuIcon_dpld.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_dpld { background-image: url(../img/menuIcon_dpld.png) }

.menuIcon_jsk {
    background: url(../img/menuIcon_jsk.png) 40px center no-repeat;
    background-size: auto 18px;
}

.menuBox > ul > li > ul > li.selected > div .menuIcon_jsk {
    background-image: url(../img/menuIcon_jsk.png)
}

.menuIcon_ztb { background: url(../img/menuIcon_ztb.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_ztb { background-image: url(../img/menuIcon_ztb.png) }
.menuIcon_pxzy { background: url(../img/menuIcon_pxzy.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_pxzy { background-image: url(../img/menuIcon_pxzy.png) }

.menuIcon_sp { background: url(../img/menuIcon_sp.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_sp { background-image: url(../img/menuIcon_sp.png) }
.menuIcon_cs { background: url(../img/menuIcon_cs.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_cs { background-image: url(../img/menuIcon_cs_selected.png) }
.menuIcon_yh { background: url(../img/menuIcon_yh.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_yh { background-image: url(../img/menuIcon_yh_selected.png) }
.menuIcon_bm { background: url(../img/menuIcon_bm.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_bm { background-image: url(../img/menuIcon_bm.png) }


.menuIcon_task {
    background: url(../img/menuIcon_task_off.png) 20px center no-repeat;
    background-size: auto 18px;
}

.menuBox > ul > li.selected > div .menuIcon_task {
    background-image: url(../img/menuIcon_task_on.png)
}

.menuIcon_attr {
    background: url(../img/menuIcon_attr.png) 40px center no-repeat;
    background-size: auto 18px;
}

.menuIcon_get {
    background: url(../img/menuIcon_get.png) 40px center no-repeat;
    background-size: auto 18px;
}


.menuIcon_ai {
    background: url(../img/menuIcon_ai.png) 20px center no-repeat;
    background-size: auto 18px;
}

.menuIcon_ai_pei {
    background: url(../img/menuIcon_pei.png) 20px center no-repeat;
    background-size: auto 18px;
}

.menuBox > ul > li.selected > div .menuIcon_ai_pei {
    background-image: url(../img/menuIcon_pei_selected.png)
}

.menuBox > ul > li.selected > div .menuIcon_ai {
    background-image: url(../img/menuIcon_ai_selected.png)
}

.menuIcon_ai_file {
    background: url(../img/menuIcon_ai_file.png) 40px center no-repeat;
	background-size: 20px 20px; /* 设置图片的宽度和高度为20px */
}

.menuIcon_tiku {
    background: url(../img/menuIcon_tiku.png) 40px center no-repeat;
    background-size: 20px 20px; /* 设置图片的宽度和高度为20px */
}

.menuBox > ul > li.selected > div .menuIcon_ai_file {
    background-image: url(../img/menuIcon_ai_file.png)
}

.menuIcon_ai_card {
    background: url(../img/menuIcon_ai_card.png) 40px center no-repeat;
}

.menuBox > ul > li.selected > div .menuIcon_ai_card {
    background-image: url(../img/menuIcon_ai_card.png)
}

.menuIcon_js { background: url(../img/menuIcon_js.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_js { background-image: url(../img/menuIcon_js.png) }
.menuIcon_sb { background: url(../img/menuIcon_sb.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_sb { background-image: url(../img/menuIcon_sb_selected.png) }

.menuIcon_dhm { background: url(../img/menuIcon_dhm.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_dhm { background-image: url(../img/menuIcon_dhm_selected.png) }

.menuIcon_fwgm { background: url(../img/menuIcon_fwgm.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_fwgm { background-image: url(../img/menuIcon_fwgm_selected.png) }
.menuIcon_ddgl { background: url(../img/menuIcon_ddgl.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_ddgl { background-image: url(../img/menuIcon_ddgl.png) }

.menuIcon_qy { background: url(../img/menuIcon_qy.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_qy { background-image: url(../img/menuIcon_qy_selected.png) }

.menuIcon_fwgl { background: url(../img/menuIcon_fwgl.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_fwgl { background-image: url(../img/menuIcon_fwgl.png) }

.menuIcon_sbgl { background: url(../img/menuIcon_sbgl.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_sbgl { background-image: url(../img/menuIcon_sbgl_selected.png) }
.menuIcon_sbcsh { background: url(../img/menuIcon_sbcsh.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_sbcsh { background-image: url(../img/menuIcon_sbcsh.png) }
.menuIcon_bbgl { background: url(../img/menuIcon_bbgl.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_bbgl { background-image: url(../img/menuIcon_bbgl.png) }

.menuIcon_mbkgl { background: url(../img/menuIcon_mbkgl.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_mbkgl { background-image: url(../img/menuIcon_mbkgl.png) }

.menuIcon_xxgl { background: url(../img/menuIcon_xxgl.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_xxgl { background-image: url(../img/menuIcon_xxgl_selected.png) }

.menuIcon_xtgl { background: url(../img/menuIcon_xtgl.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_xtgl { background-image: url(../img/menuIcon_xtgl_selected.png) }
.menuIcon_qdjbb { background: url(../img/menuIcon_qdjbb.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_qdjbb { background-image: url(../img/menuIcon_qdjbb.png) }
.menuIcon_fwq { background: url(../img/menuIcon_fwq.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_fwq { background-image: url(../img/menuIcon_fwq.png) }
.menuIcon_cpgl { background: url(../img/menuIcon_cpgl.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_cpgl { background-image: url(../img/menuIcon_cpgl.png) }
.menuIcon_cpfp { background: url(../img/menuIcon_cpfp.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_cpfp { background-image: url(../img/menuIcon_cpfp.png) }
.menuIcon_rzcx { background: url(../img/menuIcon_rzcx.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_rzcx { background-image: url(../img/menuIcon_rzcx.png) }

.menuIcon_jmgl { background: url(../img/menuIcon_jmgl.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_jmgl { background-image: url(../img/menuIcon_jmgl_selected.png) }
.menuIcon_pbmb { background: url(../img/menuIcon_pbmb.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_pbmb { background-image: url(../img/menuIcon_pbmb.png) }
.menuIcon_pb { background: url(../img/menuIcon_pb.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_pb { background-image: url(../img/menuIcon_pb.png) }
.menuIcon_gglbt { background: url(../img/menuIcon_gglbt.png) 40px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li > ul > li.selected > div .menuIcon_gglbt { background-image: url(../img/menuIcon_gglbt.png) }

.menuIcon_sjtj { background: url(../img/menuIcon_sjtj.png) 20px center no-repeat; background-size: auto 18px; }
.menuBox > ul > li.selected > div .menuIcon_sjtj { background-image: url(../img/menuIcon_sjtj_selected.png) }

.menuIcon_ind {
    background: url(../img/menuIcon_ind.png) 40px center no-repeat;
    background-size: auto 18px;
}

.menuBox > ul > li > ul > li.selected > div .menuIcon_ind {
    background-image: url(../img/menuIcon_ind.png)
}

.menuIcon_audi {
    background: url(../img/menuIcon_audi.png) 40px center no-repeat;
    background-size: auto 18px;
}

.menuBox > ul > li > ul > li.selected > div .menuIcon_audi {
    background-image: url(../img/menuIcon_audi.png)
}

.menuIcon_fun {
    background: url(../img/menuIcon_fun.png) 40px center no-repeat;
    background-size: auto 18px;
}

.menuBox > ul > li > ul > li.selected > div .menuIcon_fun {
    background-image: url(../img/menuIcon_fun.png)
}

.footerBox { width: 100%; position: absolute; bottom: 0; }
.totalBox { overflow: hidden; width: 100%; float: left; padding-bottom: 0px; }
.totalBox .item { overflow: hidden; padding: 0 10px; margin-bottom: 10px }
.totalBox .item .txt { overflow: hidden; font-size: 12px; }
.totalBox .item .txt span { float: left; color: #666 }
.totalBox .item .txt label { float: right; font-weight: normal; color: #000; /* font-size: 10px; */ }
.totalBox .item .img { background: #E4E7ED; width: 100%; height: 10px; border-radius: 100px; margin: 5px 0; overflow: hidden }
.totalBox .item .num { width: 0%; float: left; height: 10px; border-radius: 100px; background: #54D3E6; }
.totalBox .item .smallItem { width: 48.5%; float: left }
.totalBox .item .smallItem:last-child { float: right }

.sellerBox { width: 100%; float: left; position: relative; }
.sellerBox > div { margin: -12px 20px 10px 20px; height: 20px; padding-left: 35px; text-align: left; font-size: 12px; line-height: 15px; display: block; overflow: hidden; }
.sellerBox > div:hover { font-weight: bold }
.sellerBox .safe { display: none; width: 15px; position: absolute; top: -10px; right: 47% }
.sellerBox .sellerName { cursor: pointer }

.aiBox {
    overflow: hidden;
    width: 100%;
    border-top: 1px solid #EBEEF5;
    display:flex;
    flex-direction:row;
    height:50px;
    padding-left:16px;
    padding-right:11px;
    align-items:center;
}

.aiBox .left{
    flex:1;
}

    .aiBox .right {
        font-family: PingFangSC, PingFang SC;
        font-weight: 600;
        font-size: 14px;
        color: #725FFF;
        line-height: 20px;
        text-align: left;
        font-style: normal;
        cursor:pointer;
    }

.userBox { overflow: hidden; width: 100%; float: left; border-top: 1px solid #EBEEF5 }
.userBox > div { overflow: hidden; padding: 10px 20px }
.userBox .avatar { width: 30px; height: 30px; float: left; background: url(../img/tx.png) center center no-repeat; border-radius: 100px; background-size: cover; overflow: hidden; }
.userBox .alias { width: 90px; line-height: 30px; text-indent: 5px; overflow: hidden; float: left; font-size: 12px; cursor: pointer }
.userBox .alias:hover { font-weight: bold }
.userBox .icoBox { width: 20px; height: 30px; float: right; margin-right: 0px; cursor: pointer }
.userBox .icoBox img { width: 100%; margin-top: 5px; }


.iframeBox { flex: 1; background: #fff; position: relative; min-width: 800px; }
.iframeBox iframe { border: 0; width: 100%; height: 100%; position: absolute; }

.quicLinkBox { position: absolute; width: 100%; height: 100%; display: flex; align-content: center; align-items: center; justify-content: center }
.quicLinkBox .content { overflow: hidden; display: block; position: relative; display: block; padding: 0px; max-width: 780px; margin: 0 auto }
.quicLinkBox .item { width: 33%; float: left; position: relative }
.quicLinkBox .item a { display: block; border-radius: 8px; width: 200px; height: 200px; text-align: center; margin: 27px auto 28px auto; transition: all 0.3s; background: #eee; }
.quicLinkBox .item a img { height: 100px; display: inline-block; margin-top: 40px }
.quicLinkBox .item a p { font-size: 16px; line-height: 20px; margin: 0; display: block; color: #666; margin-top: 20px }
.quicLinkBox .item a:hover i { color: #333; }
.quicLinkBox .item a:hover p { color: #333 }
.quicLinkBox .item a:hover { box-shadow: 0 0 30px rgba(0,0,0,0.05); cursor: pointer; text-decoration: none }

.quicLinkBox .item .payBtn { display: block; position: absolute; right: 41px; top: 33px; color: #FF6600; width: auto; cursor: pointer; }
.quicLinkBox .item .payBtn span { display: block; font-size: 12px; font-weight: bold; line-height: 15px; width: auto; float: left; }
.quicLinkBox .item .payBtn i { display: block; margin-right: 2px; font-size: 14px; width: auto; float: left; line-height: 15px; margin-top: 0.5px }

.quicLinkBox .item .useDay { display: block; position: absolute; right: 41px; top: 33px; color: #FF6600; width: auto; font-size: 12px; font-weight: bold; line-height: 15px; }

#fileMain { display: block; padding: 0px 0 0 0px; overflow: hidden; width: 100%; height: 100% }
.headerBox { width: 100%; height: auto; border-bottom: 1px solid #ddd; float: left }
.headerBox .navBox { overflow: hidden; width: 100%; height: 40px; text-align: left; margin-top: 20px; background: url(../img/navLine.png) bottom repeat-x; }
.headerBox .navBox a { display: block; color: #333; cursor: pointer; font-size: 16px; padding: 0px 10px; margin-left: 30px; line-height: 39px; height: 40px; text-decoration: none; width: auto; float: left }
.headerBox .navBox a.selected { color: #54D3E6; border-bottom: 2px solid #54D3E6 }
.headerBox .actionBox { float: right; margin-top: -47.5px; margin-right: 15px }
.headerBox .queryBox { padding: 10px 0px 0px 20px; }
.headerBox .queryBox .showType { width: 35px; height: 33px; border: 1px solid #ccc; display: block; text-align: center; line-height: 33px; color: #999; font-size: 18px; font-weight: normal; cursor: pointer; float: left }
.headerBox .queryBox .showType:first-child { border-right: 0; border-radius: 8px 0 0 8px }
.headerBox .queryBox .showType:last-child { border-radius: 0 8px 8px 0; border-left: 0 }
.headerBox .queryBox .showType.selected { color: #fff; background: #54D3E6; border-color: #54D3E6 }
.headerBox .queryBox .item { width: auto; margin-right: 15px; float: left; margin-bottom: 10px; position: relative }
.headerBox .queryBox .item label { line-height: 35px; float: left; display: inline-block; font-weight: normal; }
.headerBox .queryBox .item .contentTypeBox { width: auto; float: left; line-height: 33px; border-radius: 100px; background: #eee; height: 34px; }
.headerBox .queryBox .item .contentTypeBox:hover { background: #ddd; cursor: pointer }
.headerBox .queryBox .item .contentTypeBox input { display: inline-block; margin: 0 10px; min-width: 60px; color: #666; border: 0; margin: 0; background: none; outline: none; cursor: pointer; padding: 0 10px; width: 100px }
.headerBox .queryBox .item .contentTypeBox i { display: inline-block; margin: 0 10px; font-size: 14px; color: #999 }
.headerBox .queryBox .item .select2-selection--single { background: #eee; border-radius: 100px; border: 0; padding-left: 5px; height: 34px; }
.headerBox .queryBox .item .select2-selection--single:hover { background: #ddd }
.headerBox .queryBox .item .select2-container--default .select2-selection--single .select2-selection__rendered { color: #666; line-height: 33px; }


.headerBox .queryBox .item .name { border-radius: 100px; width: 180px; transition: all 0.3s; border: 0; outline: 0; box-shadow: none; background: #eee; line-height: 32px; height: 34px; }
.headerBox .queryBox .item .name:focus { }
.headerBox .queryBox .item .mobile { border-radius: 100px; width: 180px; transition: all 0.3s; border: 0; outline: 0; box-shadow: none; background: #eee; line-height: 32px; height: 34px; }
.headerBox .queryBox .item .mobile:focus { }

.headerBox .queryBox .item .searchInput { border-radius: 100px; width: 180px; transition: all 0.3s; border: 0; outline: 0; box-shadow: none; background: #eee; line-height: 32px; height: 34px; float: left; }
.headerBox .queryBox .item .searchInput:focus { }

.headerBox .queryBox .item .queryBtn { position: absolute; right: 0px; top: 0px; width: 33px; height: 34px; display: block; line-height: 32px; color: #666; border-radius: 100px; text-align: center }
.headerBox .queryBox .item .queryBtn:hover { background: #ccc; cursor: pointer }

.headerBox .queryBox .fileName .name { transition: all 0s; width: 400px; text-align: left; margin-top: -4px; height: 40px; border: 1px solid #ddd; background: #fff }
.headerBox .queryBox .fileName .queryBtn { right: 4px; top: -1px; visibility: visible }
/*.headerBox .queryBox .fileName .name:focus{text-align:left}
.headerBox .queryBox .fileName .name:focus ~ .queryBtn { visibility:visible }*/

.modal .queryBox { overflow: hidden; padding: 0px; }
.modal .queryBox .item { width: auto; margin-right: 15px; float: left; margin-bottom: 10px; position: relative }
.modal .queryBox .item label { line-height: 35px; float: left; display: inline-block; font-weight: normal; }
.modal .queryBox .item .contentTypeBox { width: auto; float: left; line-height: 33px; border-radius: 100px; background: #eee; height: 34px; }
.modal .queryBox .item .contentTypeBox:hover { background: #ddd; cursor: pointer }
.modal .queryBox .item .contentTypeBox input { display: inline-block; margin: 0 10px; min-width: 60px; color: #666; border: 0; margin: 0; background: none; outline: none; cursor: pointer; padding: 0 10px; width: 100px }
.modal .queryBox .item .contentTypeBox i { display: inline-block; margin: 0 10px; font-size: 14px; color: #999 }
.modal .queryBox .item .select2-selection--single { background: #eee; border-radius: 100px; border: 0; padding-left: 5px; height: 34px; }
.modal .queryBox .item .select2-selection--single:hover { background: #ddd }
.modal .queryBox .item .select2-container--default .select2-selection--single .select2-selection__rendered { color: #666; line-height: 33px; }
.modal .queryBox .item .name { border-radius: 100px; width: 180px; transition: all 0.3s; border: 0; outline: 0; box-shadow: none; background: #eee; line-height: 32px; height: 34px; }
.modal .queryBox .item .name:focus { }
.modal .queryBox .item .queryBtn { position: absolute; right: 0px; top: 0px; width: 33px; height: 34px; display: block; line-height: 32px; color: #666; border-radius: 100px; text-align: center }
.modal .queryBox .item .queryBtn:hover { background: #ccc; cursor: pointer }
.headerBox .queryBox .item .nfcId { border-radius: 100px; width: 180px; transition: all 0.3s; border: 0; outline: 0; box-shadow: none; background: #eee; line-height: 32px; height: 34px; }
#modal-nfc-edit .modal-body .form-item { margin-bottom: 5px }
.NFCType .btn { margin-right: 10px }
.NFCType .btn.selected { background: #54D3E6; color: #fff; border-color: #54D3E6 }
#modal-nfc-edit .modal-body .form-item label { width: auto; float: left; line-height: 34px }
#modal-nfc-edit .modal-body .form-item input { width: 300px; float: left }

.contentBox { background: #fff; width: 100%; display: block; height: auto; float: left; }

.btn-black { background: #333; color: #fff; transition: all 0.3s }
.btn-black:hover { background: rgb(24 73 144); color: #fff }
.btn-black:focus { color: #fff }

.btn-blue { background: #54D3E6; color: #fff; transition: all 0.3s; border: 1px solid #54D3E6; }
.btn-blue:hover { background: #3abed2; color: #fff; border: 1px solid #3abed2; }
.btn-blue:focus { color: #fff; background: #3abed2; border: 1px solid #3abed2; }

.btn-blue-border { background: #fff; color: #54D3E6; transition: all 0.3s; border: 1px solid #54D3E6 }
.btn-blue-border:hover, .btn-blue-border:active { background: #f3fdff; color: #54D3E6; box-shadow: none }
.btn-blue-border:focus { background: #f3fdff; color: #54D3E6; box-shadow: none }

.btn-red { background: #fff; color: #fc4121; transition: all 0.3s; border: 1px solid #fc4121 }
.btn-red:hover { background: #fc4121; color: #fff }
.btn-red:focus { background: #fc4121; color: #fff }

.select2-container--default .select2-selection--single { border-color: #ddd; border-radius: 8px; height: 34px; }
.modal-content .close { border: 2px solid #333; border-radius: 100px; width: 22px; height: 22px; padding: 0; line-height: 19px; opacity: 1; color: #333; transition: all 0.2s }
.modal-content .close:hover { border-color: #54D3E6; color: #54D3E6 }
.modal-content .close span { line-height: 19px; display: block; text-align: center; font-size: 20px; font-weight: bold; }
.modal-content { border-radius: 15px; }
.modal-open .modal { overflow-y: hidden }
.modal-body { padding: 0; margin: 10px 15px; }
.modal-header { border: 0 }
.modal-footer { border: 0 }
.modal-footer .btn { font-size: 16px; padding: 6px 30px }
#modal-media-edit .box { display: flex; flex-wrap: wrap; }
#modal-media-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-media-edit .form-item .uploadImgBox { width: 100%; float: left; }
#modal-media-edit .form-item .uploadImgBox:last-child { float: right }
#modal-media-edit .form-item .uploadImgBox .img { border: 1px solid #ddd; border-radius: 10px; overflow: hidden; background: url(../img/sctp.png) center center no-repeat; background-size: contain; width: 100%; height: 83px; }
#modal-media-edit .form-item .uploadImgBox .img:hover { border-color: #54D3E6; cursor: pointer }
#modal-media-edit .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-media-edit .form-item input:read-only { background: #fff }
#modal-media-edit .form-item.linkUrlBox { width: 100%; margin-left: 0; margin-right: 0; padding: 0 10px }

#modal-media-edit .form-item .tagBox .lengthFlag { right: 35px }
#modal-media-edit .form-item .tagBox .tagList {max-height:250px;overflow-y:auto }
#modal-media-edits .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-media-edits .form-item input:read-only { background: #fff; }
#modal-media-edit .modal-footer {
	position:absolute;bottom:0;right:0;}

.contentTypePanel { position: absolute; z-index: 9999; top: 20px; left: 20px; background: #fff; box-shadow: 0 0 10px #999; padding: 15px 15px 15px 15px; display: none; max-height:300px;overflow-y:auto}
.contentTypePanel .item { overflow: hidden; width: 600px; }
.contentTypePanel .item label { display: block; float: left; width: 70px; font-weight: normal; font-size: 14px; margin: 6px 0 6px 0 }
.contentTypePanel .item .content { display: block; float: left; width: 430px; }
.contentTypePanel .item .content a { display: inline-block; font-size: 14px; color: #666; background: #F7F8FA; border: 1px solid #F7F8FA; padding: 3px 6px; border-radius: 4px; text-decoration: none; margin: 5px 10px 5px 0; cursor: pointer; }
.contentTypePanel .item .content a.parentSelected { background: #fff; color: #54D3E6; border: 1px solid #54D3E6; }
.contentTypePanel .item .content a:hover, .contentTypePanel .item .content a.selected { background: #E7FDFF; color: #54D3E6; border: 1px solid #E7FDFF; }
.contentTypePanel .footer { text-align: right; display: none }
.contentTypePanel .footer button { margin-left: 5px }

.modal .exhibitionAreaBox { margin: 10px 0; }
.modal .departmentBox { margin: 10px 0; }

#modal-scenepack-edit .box { display: flex; flex-wrap: wrap; }
#modal-scenepack-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-scenepack-edit .form-item .uploadImgBox { width: 100%; float: left; }
#modal-scenepack-edit .form-item .uploadImgBox:last-child { float: right }
#modal-scenepack-edit .form-item .uploadImgBox .img { border: 1px solid #ddd; border-radius: 10px; overflow: hidden; background: url(../img/sctp.png) center center no-repeat; background-size: contain; width: 100%; height: 113px; }
#modal-scenepack-edit .form-item .uploadImgBox .img:hover { border-color: #54D3E6; cursor: pointer }
#modal-scenepack-edit .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-scenepack-edit .form-item input:read-only { background: #fff }
#modal-scenepack-edit .form-item.linkUrlBox { width: 100%; margin-left: 0; margin-right: 0; padding: 0 10px }

#modal-edit .box { display: flex; flex-wrap: wrap; }
#modal-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }

#modal-nfc-edit { width: 100%; height: 100%; background: #fff }
#modal-nfc-edit .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-nfc-edit .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }

#modal-scenepack-media { width: 100%; height: 100%; background: #fff }
#modal-scenepack-media { width: 100%; height: 100%; background: #fff }
#modal-scenepack-media .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-scenepack-media .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }

#modal-scenepack-set { width: 100%; height: 100%; background: #fff }
#modal-scenepack-set .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-scenepack-set .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }


#modal-board-view { width: 100%; height: 100%; background: #fff }
#modal-board-view .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-board-view .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0; position: absolute; height: 100%; width: 100% }
#modal-board-view .modal-footer { position: absolute; bottom: 0; right: 0 }

#modal-board-set { width: 100%; height: 100%; background: #fff }
#modal-board-set .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-board-set .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0; position: absolute; width: 100%; height: 100% }
#modal-board-set .modal-dialog .modal-content .modal-body { position: absolute; padding: 0; width: 100%; height: 100%; margin: 0 }
#modal-board-set .selectedMediaBox { width: 30%; padding: 20px 15px 15px 15px; overflow: hidden; border-right: 1px solid #eee; position: absolute; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#modal-board-set .addMediaBox { float: right; width: 69%; overflow: hidden }
#modal-board-set .selectedMediaBox .title { line-height: 40px; font-size: 16px; }
#modal-board-set .close { position: absolute; right: 15px; top: 10px; }

#modal-board-set .screenIconBox { overflow: hidden; text-align: center; padding: 30px 0; }
#modal-board-set .screenIconBox .icon { width: 65px; height: 65px; margin: 15px; display: inline-block; cursor: pointer }
#modal-board-set .screenIconBox .icon.selected { width: 85px; height: 85px; margin: 10px }
#modal-board-set .screenIconBox .icon.icon2 { background: url(../img/screen-2.png) no-repeat center center; background-size: contain; }
#modal-board-set .screenIconBox .icon.icon2.selected { background-image: url(../img/screen-2-over.png); }
#modal-board-set .screenIconBox .icon.icon4 { background: url(../img/screen-4.png) no-repeat center center; background-size: contain; }
#modal-board-set .screenIconBox .icon.icon4.selected { background-image: url(../img/screen-4-over.png); }
#modal-board-set .screenNumBox { width: 100%; border-bottom: 1px solid #eee; height: 40px }
#modal-board-set .screenNumBox .num { width: 60px; float: left; line-height: 40px; height: 40px; color: #333; border-bottom: 1px solid #eee; text-align: center; cursor: pointer }
#modal-board-set .screenNumBox .num.selected { border-color: #54D3E6; color: #54D3E6 }
#modal-board-set .selectedMediaBox .dataTables_scrollHeadInner { display: none }
#modal-board-set .mediaTableBox { margin-top: 50px }

#modal-board-view .numBox { overflow: hidden; }
#modal-board-view .numBox2 { width: 500px; overflow: hidden; margin: 0 auto }
#modal-board-view .numBox2 .item { width: 50%; box-sizing: border-box; border: 1px solid #ccc; float: left; text-align: center; border: 1px solid #ccc; }

#modal-board-view .numBox4 { width: 500px; overflow: hidden; margin: 0 auto }
#modal-board-view .numBox4 .item { width: 50%; box-sizing: border-box; border: 1px solid #ccc; float: left; text-align: center; border: 1px solid #ccc; }

#modal-board-view .item .name { background: #F7F8FA; line-height: 35px; border-bottom: 1px solid #ccc; text-overflow: ellipsis; overflow: hidden; white-space: nowrap }
#modal-board-view .item .img { width: 100%; height: 250px; background: no-repeat center center; background-size: contain }


#modal-board-edit .box { display: flex; flex-wrap: wrap; }
#modal-board-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-board-edit .form-item .uploadImgBox { width: 100%; float: left; }
#modal-board-edit .form-item .uploadImgBox:last-child { float: right }
#modal-board-edit .form-item .uploadImgBox .img { border: 1px solid #ddd; border-radius: 10px; overflow: hidden; background: url(../img/sctp.png) center center no-repeat; background-size: contain; width: 100%; height: 83px; }
#modal-board-edit .form-item .uploadImgBox .img:hover { border-color: #54D3E6; cursor: pointer }
#modal-board-edit .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-board-edit .form-item input:read-only { background: #fff }
#modal-board-edit .form-item.linkUrlBox { width: 100%; margin-left: 0; margin-right: 0; padding: 0 10px }

#modal-board-role .actionBox { margin-bottom: 10px; text-align: right }
#modal-board-role .actionBox button { margin-left: 5px; }

.selectedScreenBox { float: left; width: 20%; }
.selectedMediaBox { float: right; width: 79%; }
.selectedScreenBox label, .selectedMediaBox label { width: 100%; margin-bottom: 10px; font-weight: normal }
.selectedScreenBox label a, .selectedMediaBox label a { display: block; float: right; margin-left: 7px; width: 22px; height: 22px; border: 2px solid #444; border-radius: 100px; text-align: center; line-height: 20px; padding: 0; font-size: 12px; font-weight: normal; color: #444; cursor: pointer }
.selectedScreenBox label a:hover, .selectedMediaBox label a:hover { color: rgba(43,146,195,1); border-color: rgba(43,146,195,1) }

#modal-user-edit .box { display: flex; flex-wrap: wrap; }
#modal-user-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-user-edit .form-item .validateCode { width: 160px; float: left; }
#modal-user-edit .form-item .validateBtn { float: right; border-radius: 7px; width: 100px }

#modal-user-edit .selectTreeBox { width: 100%; border-radius: 8px; background: #fff; border: 1px solid #ddd }

#modal-department-edit .box { display: flex; flex-wrap: wrap; }
#modal-department-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-department-edit .form-item > div { position: relative }
#modal-screen-edit .box { display: flex; flex-wrap: wrap; }
#modal-screen-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-screen-edit .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-screen-edit .form-item input:read-only { background: #fff }

#modal-screen-admin .actionBox { margin-bottom: 10px; text-align: right }
#modal-screen-admin .actionBox button { margin-left: 5px; }

#modal-screen-role .actionBox { margin-bottom: 10px; text-align: right }
#modal-screen-role .actionBox button { margin-left: 5px; }

#modal-type-edit .selectTreeBox { width: 100%; border-radius: 8px; background: #fff; border: 1px solid #ddd }

#modal-user-add .queryBox .item .searchInput { border-radius: 100px; width: 180px; transition: all 0.3s; border: 0; outline: 0; box-shadow: none; background: #eee; line-height: 32px; height: 34px; float: left; }
#modal-user-add .queryBox .item .searchInput:focus { }

.cloudBox { overflow: hidden; text-align: center }
.cloudBox .item { background: #F2F6FC; overflow: hidden; display: inline-block; width: 140px; height: 140px; border-radius: 5px; text-align: center; margin: 20px 15px 40px 15px }
.cloudBox .item img { width: 50px; display: inline-block; margin: 35px 30px 10px 30px }
.cloudBox .item:hover { box-shadow: 0 0 20px rgba(0,0,0,0.1); cursor: pointer; }

.queryBox .button-group { width: auto; float: left; margin: 15px 15px 0 0; }
#table_upload td { line-height: 20px; height: 30px; vertical-align: middle; }
#table_upload .status label { }
#table_upload .status.time span { }
#table_upload .status.over span { }
#table_upload .status.upload span { }
#table_upload td.progress { background: none; border: 0; box-shadow: none; -webkit-box-shadow: none; }
#table_upload td { position: relative }
#table_upload td.centerTd { text-align: center }

.autoImgBox, .autoBitrateBox { display: none; float: left }
.autoImgBox label, .autoBitrateBox label { width: auto; float: left }
.autoImgBox input, .autoBitrateBox input { display: inline-block; width: auto; float: left }
#modal-user-info .modal-body { padding: 0 0px }
#modal-user-info .modal-body label { font-weight: normal; width: auto; text-align: right; }

.diskBox { overflow: hidden; text-align: center }
.diskBox .item { display: inline-block; width: auto; height: auto; }
.diskBox .item .nameBox { background: #F2F6FC; overflow: hidden; display: inline-block; width: 140px; height: 140px; border-radius: 5px; text-align: center; margin: 20px 15px 10px 15px }
.diskBox .item .nameBox img { width: 50px; display: inline-block; margin: 35px 30px 10px 30px }
.diskBox .item .nameBox:hover { box-shadow: 0 0 20px rgba(0,0,0,0.1); cursor: pointer; }
.diskBox .sizeBox { margin: 0 15px; overflow: hidden; width: 140px; }
.diskBox .sizeBox .txt { overflow: hidden; font-size: 12px; margin-bottom: 15px; line-height: 25px }
.diskBox .sizeBox .txt span { float: left }
.diskBox .sizeBox .txt label { float: right; }
.diskBox .sizeBox .img { background: #E4E7ED; width: 100%; height: 12px; border-radius: 100px; margin: 0px 0; overflow: hidden }
.diskBox .sizeBox .num { width: 5%; float: left; height: 12px; border-radius: 100px; background: #54D3E6; }

#modal-screen-del .form-item .validateCode { width: 260px; float: left; }
#modal-screen-del .form-item .validateBtn { float: right; border-radius: 7px; width: 100px }

#modal-boxmachine-edit .box { display: flex; flex-wrap: wrap; }
#modal-boxmachine-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }

#modal-service-edit { width: 100%; height: 100%; background: #fff }
#modal-service-edit .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-service-edit .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }
#modal-service-edit .serviceBox { width: 5000px; float: left; }
#modal-service-edit .serviceBox form { display: block; padding: 0 20px; max-width: 1000px; }
#modal-service-edit .serviceBox .product { display: none }
#modal-service-edit .itemBox { margin-bottom: 10px; width: 100%; float: left }
#modal-service-edit .itemBox .item { width: auto; float: left; margin-right: 20px }
#modal-service-edit .itemBox .item label { font-size: 14px; float: left; line-height: 32px; margin-right: 5px }
#modal-service-edit .itemBox .item input[type=text] { float: left; }

#modal-service-edit .itemBox .btn { margin-right: 5px; }
#modal-service-edit .hardBox { width: 1000px; overflow: hidden }
#modal-service-edit .cloudServiceItemBox { width: 100%; float: left; }
#modal-service-edit .cloudServiceItemBox .serviceItem { float: left; margin: 10px 10px 0 0; width: 140px; border: 1px solid #F7F8FA; background: #F7F8FA; text-align: center; border: 1px solid #ccc; border-radius: 10px; cursor: pointer; padding: 5px 10px 10px 10px; }
#modal-service-edit .cloudServiceItemBox .serviceItem .value { font-weight: bold; font-size: 18px; display: block; line-height: 40px; color: #666; }
#modal-service-edit .cloudServiceItemBox .serviceItem .price { background: #fff; border-radius: 100px; padding: 3px 15px; display: inline-block; font-weight: bold; color: #666 }

#modal-service-edit .cloudServiceItemBox .serviceItem.selected { background: #E7FDFF; border-color: #54D3E6; color: #54D3E6 }
#modal-service-edit .cloudServiceItemBox .serviceItem.selected * { color: #54D3E6 }

#modal-service-edit .productType { width: auto; float: left; padding: 0 20px; }
#modal-service-edit .productType label { font-weight: normal; margin-bottom: 0; margin-right: 10px; cursor: pointer; }
#modal-service-edit .cloudServiceType { width: auto; float: left; border-left: 1px solid #ccc; padding-left: 30px; }
#modal-service-edit .cloudServiceType label { font-weight: normal; margin-bottom: 0; margin-right: 10px; cursor: pointer; }
#modal-service-edit .productTypeBox { border: 1px solid #ccc; padding: 20px 0; border-radius: 10px; overflow: hidden; width: 730px; }
#modal-service-edit .imgImg { border: 1px dashed #ccc; background: url(../img/sctp.png) no-repeat center center; background-size: contain; width: 120px; height: 80px; border-radius: 10px; float: left; margin-bottom: 10px; }
#modal-service-edit .tip { color: #999; float: left; margin: 57px 0 0 10px }
#modal-service-edit .cloudServiceProductList { width: 100%; float: left; overflow: hidden; }
#modal-service-edit .cloudServiceProductList > div { border-top: 1px solid #ccc; padding-top: 20px; width: 100%; float: left; /* margin-top: 10px; */ }
#modal-service-edit .cloudServiceProductList > div:first-child { border: 0; padding: 0 }

#modal-service-edit .hardList { width: 100%; float: left }
#modal-service-edit .hardList > div { border-top: 1px solid #ccc; padding-top: 20px; width: 100%; float: left; /* margin-top: 10px; */ }
#modal-service-edit .hardList > div:first-child { border: 0; padding: 0 }

.packageBox .swiper-slide { padding: 10px 10px 10px 50px; height: 450px; }
.packageBox .swiper-slide > div { transition: all 0.1s; text-align: center; height: 384px; margin: 20px 0; border: 0px solid #fff; box-sizing: initial; background: #fff; box-shadow: 0px 0px 9px 3px rgba(0,33,115,0.11); border-radius: 8px; overflow: hidden; position: relative }
.packageBox .swiper-slide > div:hover { height: 420px; margin: 0; border: 2px solid #54D3E6 }
.packageBox .swiper-button-next, .swiper-button-prev { width: 50px; top: initial; bottom: -100px }
.packageBox .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background: url(../img/rightarrow.png) center center no-repeat; background-size: contain; right: 20px; }
.packageBox .swiper-button-prev, .swiper-container-rtl .swiper-button-next { background: url(../img/leftarrow.png) center center no-repeat; background-size: contain; right: 100px }

.packageBox .name { background: #54D3E6; color: #fff; line-height: 35px; text-align: center; width: auto; padding: 0 20px; overflow: hidden; display: inline-block; }
.packageBox .price { text-align: center; font-size: 24px; color: #333; margin: 30px 0 0px 0; font-weight: bold }
.packageBox .unit { text-align: center; color: #666; font-size: 14px; }
.packageBox .list { overflow: hidden; margin: 20px 0 0 0; margin-left: -3px; }
.packageBox .list .productItem { float: left; width: 30%; text-align: center; margin: 0 0 10px 0; position: relative; color: #455667 }
.packageBox .list .productItem .line { height: 10px; width: 1px; background: #DCDFE6; position: absolute; left: 0; top: 20px; }
.packageBox .list .productItem > div:last-child { color: #909399; font-size: 12px }
.packageBox .content { padding: 10px; color: #909399; font-size: 12px; text-align: left }
.packageBox .payBox i { line-height: 40px; font-size: 20px }
.packageBox .payBox { background: #54D3E6; padding: 0 10px; border-radius: 0 0 0px 0px; overflow: hidden; line-height: 40px; text-align: left; color: #fff; position: absolute; bottom: 0px; left: 0px; width: 100%; }
.packageBox .swiper-slide.basic > div:hover { border: 2px solid #00A0FE }
.packageBox .swiper-slide.basic > div .name { background: #00A0FE; }
.packageBox .swiper-slide.basic > div .payBox { background: #00A0FE; }
.packageBox .payBox:hover { cursor: pointer; }

.packageBox .swiper-slide > div .tryPayBox { background: rgba(0,0,0,0.5); position: absolute; width: 100%; height: 100%; display: none; z-index: 888; box-sizing: border-box; }

.packageBox .swiper-slide > div .tryPayBox > div { position: absolute; width: 100%; bottom: 30px; }
.packageBox .swiper-slide > div:hover .tryPayBox { display: block }
.packageBox .swiper-slide > div:hover .payBox { display: none }

.packageBox .swiper-slide > div .tryPayBox .tryBtn { display: block; border-radius: 8px; margin: 20px; background: #54D3E6; color: #fff; padding: 7px 0; cursor: pointer; transition: all 0.3s }
.packageBox .swiper-slide > div .tryPayBox .tryBtn > div { line-height: 15px; font-size: 13px; font-weight: bold }
.packageBox .swiper-slide > div .tryPayBox .tryBtn > p { margin: 0; font-size: 12px; line-height: 13px; }
.packageBox .swiper-slide > div .tryPayBox .tryBtn:hover { background: #24b9cf }

.packageBox .swiper-slide > div .tryPayBox .openBtn { display: block; border-radius: 8px; margin: 20px; background: #E7FDFF; color: #54D3E6; padding: 7px 0; cursor: pointer; transition: all 0.3s }
.packageBox .swiper-slide > div .tryPayBox .openBtn > div { line-height: 15px; font-size: 13px; font-weight: bold }
.packageBox .swiper-slide > div .tryPayBox .openBtn > p { margin: 0; font-size: 12px; line-height: 13px; }
.packageBox .swiper-slide > div .tryPayBox .openBtn:hover { background: #f2feff }

.telBox { position: absolute; left: 20px; bottom: -80px; color: #909399; font-weight: normal }

.contentBox .titleBox { overflow: hidden; padding: 20px; }
.contentBox .titleBox a { display: inline-block; cursor: pointer; line-height: 30px; background: #F7F8FA; padding: 0 15px; border: 1px solid #EBEEF5; color: #909399; text-decoration: none; }
.contentBox .titleBox a:first-child { border-right: 0 }
.contentBox .titleBox a.selected { color: #54D3E6; background: #fff; }
.contentBox .productBox { padding-right: 20px; position: absolute; left: 0; top: 0; overflow-y: auto; width: 100% }
.contentBox .productBox .cloudServiceTip { padding: 0 20px 20px 20px; font-size: 14px; color: #666; text-align: center }
.contentBox .productBox .itemBox { width: 50%; float: left; box-sizing: border-box; padding: 0 0px 0 20px; margin-bottom: 20px; position: relative; }
.contentBox .productBox .itemBox > div { border-radius: 4px; background: url(../img/leftproductbg.png) no-repeat left top; background-size: 100% 100%; overflow: hidden; height: 190px; }
.contentBox .productBox .itemBox .typeTitle { font-size: 12px; padding: 20px 20px 0 25px; font-weight: bold; font-size: 16px }
.contentBox .productBox .itemBox .typeTitle img { cursor: pointer }
.contentBox .productBox .itemBox .list { /* overflow: hidden; */ margin: 15px 20px 0px 20px; /* height: 140px; */ /* padding-bottom: 10px; */ overflow-x: auto; white-space: nowrap; /* height: 110px; */ }
.contentBox .productBox .itemBox img { width: 15px; margin-left: 7px; }
.contentBox .productBox .itemBox .item { width: 100px; cursor: pointer; height: 100px; border: 1.5px solid rgba(255,255,255,0); position: relative; text-align: center; margin: 10px 10px 0px 5px; display: inline-block; }
.contentBox .productBox .itemBox .item .bg { background: linear-gradient(90deg, #69EDF3 0%, #3DC1DD 100%); border-radius: 8px; position: absolute; width: 100px; height: 80px; bottom: 0 }
.contentBox .productBox .itemBox .item .num { background: #fff; background: url(../img/numbg.png) no-repeat top center; width: 90px; margin-top: -20px; margin-left: 5px; height: auto; padding: 15px 0 20px 0; font-size: 22px; font-weight: normal; background-size: contain; text-align: center; color: #54D3E6; overflow: hidden }
.contentBox .productBox .itemBox .item .price { border-radius: 25px; padding: 1px 15px; background: #fff; color: #54D3E6; display: inline-block; width: auto; }

.contentBox .productBox .itemBox:nth-child(even) > div { background-image: url(../img/rightproductbg.png); }
.contentBox .productBox .itemBox:nth-child(even) .item .bg { background: linear-gradient(131deg, #63B2FF 0%, #257BFF 100%); }
.contentBox .productBox .itemBox:nth-child(even) .item .price { color: #63B2FF }
.contentBox .productBox .itemBox:nth-child(even) .item .num { color: #63B2FF }
.contentBox .productBox .itemBox .item.selected .bg { background: none; }
.contentBox .productBox .itemBox .item.selected .num { background: none }
.contentBox .productBox .itemBox .item.selected { border: 1.5px solid #FF6600; background: #E7FDFF; border-radius: 8px }

.contentBox .totalBox { position: absolute; height: 100px; bottom: 0; width: 100%; background: #fff; }
.contentBox .totalBox > div { border-top: 1px solid #ddd; margin: 0 20px; padding: 10px 0 0 0; }
.contentBox .totalBox > div .txt { width: 70%; float: left; font-size: 16px; font-weight: bold }
.contentBox .totalBox > div .submitBox { width: 30%; float: right }
.contentBox .totalBox > div .submitBox .submit { width: 100%; float: left; line-height: 35px; margin-bottom: 5px }
.contentBox .totalBox > div .submitBox .submit span { font-size: 25px; color: #f92e15; font-weight: bold; }
.contentBox .totalBox > div .submitBox .tip { font-size: 12px; color: #999; text-align: right }
.contentBox .totalBox > div .submitBox .tip a { color: #54D3E6 }

#modal-pay .nameBox { text-align: center; font-size: 16px; font-weight: bold }
#modal-pay .moneyBox { text-align: center }
#modal-pay .moneyBox span { font-size: 30px; font-weight: bold; color: #fa4007 }
#modal-pay .tip { text-align: center; line-height: 25px }
#modal-pay .tip a { color: #54D3E6 }

#modal-pay .orderNoBox { text-align: center; color: #999 }
#modal-pay .serviceEndTimeBox { text-align: center; color: #999 }
.contentBox .hardBox { overflow: hidden; padding: 0 10px 0px 0px; }
.contentBox .hardBox .item { width: 240px; height: 250px; float: left; border-radius: 8px; background: #fff; margin: 10px; overflow: hidden; cursor: pointer; box-shadow: 0 0 10px rgba(0,0,0,0.1); }
.contentBox .hardBox .item .img { width: 100%; height: 180px; background: center center no-repeat; background-size: contain; }
.contentBox .hardBox .item:hover { box-shadow: 0 0 15px rgba(0,0,0,0.15); }
.contentBox .hardBox .item .name { padding: 10px 10px; font-size: 14px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-height: 15px; height: 30px; overflow: hidden }
.contentBox .hardBox .item .price { color: #FF5A23; padding: 0 10px 10px 10px }
.contentBox .hardBox .item .price span { font-size: 16px; font-weight: bold; }
.contentBox .hardBox .hardTip { padding: 10px 10px; font-size: 14px; color: #666; overflow: hidden; text-align: center }
.agreeBtn { cursor: pointer }
.contentBox .hardBox .list { padding: 0 10px; overflow: hidden; padding-bottom: 10px }
.footerBox .serviceEndTimeBox { border-top: 1px solid #eee; padding: 10px 10px; font-size: 12px; height: 40px }
.footerBox .serviceEndTimeBox span { line-height: 15px; }
.footerBox .serviceEndTimeBox a { color: #54D3E6; float: right; cursor: pointer; line-height: 15px; }

#modal-redeemcode-edit .box { display: flex; flex-wrap: wrap; }
#modal-redeemcode-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-redeemcode-edit .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-redeemcode-edit .form-item input:read-only { background: #fff }

#modal-pay-next .tipBox .tip { font-size: 12px; color: #999; text-align: right }
#modal-pay-next .tipBox .tip a { color: #54D3E6 }
#modal-pay-next .tipBox { padding: 0 20px 20px 20px }
#modal-pay-next .tipBox .tel { font-size: 12px; color: #666 }
#modal-pay-next .modal-title span { font-size: 12px; color: #999 }
#modal-pay-next .list { overflow: hidden }
#modal-pay-next .list .item { margin-bottom: 15px; overflow: hidden; color: #455667 }
#modal-pay-next .list .item .line { display: block; float: left; width: 3px; height: 10px; margin-top: 2.5px; border-radius: 5px; background-color: #54D3E6; float: left; }
#modal-pay-next .list .item .name { line-height: 18px; font-size: 14px; margin: 0 0 0 5px; float: left; width: 200px; }
#modal-pay-next .list .item .norm { float: right; width: 100px; line-height: 15px; font-size: 14px; text-align: right }
#modal-pay-next .moneyBox { overflow: hidden; margin-top: 10px }
#modal-pay-next .moneyBox .title { font-size: 14px; font-weight: bold; }
#modal-pay-next .moneyBox .money { color: #F74301; font-weight: bold; font-size: 26px; }
#qrcode .wechatLogo { position: absolute; top: 70px; left: 70px; width: 30px; height: 30px; background: url(../img/wechatlogo.png) no-repeat center center; background-size: cover; border-radius: 5px; overflow: hidden }
#qrcode .alipayLogo { position: absolute; top: 70px; left: 70px; width: 30px; height: 30px; background: url(../img/alipaylogo.png) no-repeat center center; background-size: cover; border-radius: 5px; overflow: hidden }

#modal-order-detail .productList { overflow: hidden }
#modal-order-detail .productList .item { width: auto; float: left; margin-bottom: 10px; margin-right: 20px; }
#modal-order-detail .productList .item .img { width: 70px; height: 70px; margin-right: 10px; background: no-repeat center center; background-size: contain; border: 1px dashed #ddd; float: left }
#modal-order-detail .productList .item .txtBox { width: auto; float: left; }
#modal-order-detail .productList .item .txtBox .name { line-height: 20px; font-size: 16px; font-weight: bold; }
#modal-order-detail .productList .item .txtBox .priceBox { line-height: 20px; }
#modal-order-detail .infoBox { overflow: hidden }
#modal-order-detail .infoBox .item { overflow: hidden; margin-bottom: 5px }
#modal-order-detail .infoBox .item label { font-weight: normal; font-size: 14px; width: 90px; }
#modal-order-detail .infoBox .item span { color: #666; font-size: 14px }
#modal-order-detail .infoBox .item span.money { color: #F74301; font-size: 24px; font-weight: bold }

#modal-invoice-detail .form-item > div { text-indent: 2em; color: #999 }
#modal-order-detail .orderCancelTimeBox { color: #999 }
#modal-order-detail .orderCancelTimeBox .orderCancelTime { color: #F74301 }

#qrcode { display: block; margin: 20px auto; text-align: center; width: 170px; height: 170px; position: relative }

#modal-try .tipBox .tip { font-size: 12px; color: #999; text-align: right }
#modal-try .tipBox .tip a { color: #54D3E6 }
#modal-try .tipBox { padding: 0 20px 20px 20px }
#modal-try .tipBox .tel { font-size: 12px; color: #666 }
#modal-try .modal-title span { font-size: 12px; color: #999 }
#modal-try .list { overflow: hidden }
#modal-try .list .item { margin-bottom: 15px; overflow: hidden; color: #455667 }
#modal-try .list .item .line { display: block; float: left; width: 3px; height: 10px; margin-top: 2.5px; border-radius: 5px; background-color: #54D3E6; float: left; }
#modal-try .list .item .name { line-height: 18px; font-size: 14px; margin: 0 0 0 5px; float: left; width: 150px; }
#modal-try .list .item .norm { float: right; width: 200px; line-height: 15px; font-size: 14px; text-align: right }

@media screen and (min-width: 1520px) {
    .quicLinkBox .content { max-width: 980px; }
    .quicLinkBox .item a { width: 250px; height: 250px; }
    .quicLinkBox .item a img { height: 120px; margin-top: 50px }
}

@media screen and (min-width: 1920px) {
    .quicLinkBox .content { max-width: 1080px; }
    .quicLinkBox .item a { width: 300px; height: 300px; }
    .quicLinkBox .item a img { height: 150px; margin-top: 70px }
}

#modal-group-edit { width: 100%; height: 100%; background: #fff }
#modal-group-edit .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-group-edit .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }

#modal-group-edit .contentBox { overflow: hidden; padding: 0 5px; width: 600px; }
#modal-group-edit .contentBox .tableBox { overflow: hidden; padding: 10px 20px }
#modal-group-edit .contentBox .tableBox table { width: 100%; }
#modal-group-edit .contentBox .tableBox table th { font-weight: normal; color: #666; padding: 10px 0 }
#modal-group-edit .contentBox .tableBox table td { padding: 10px 0 }
#modal-group-edit .contentBox .tableBox table td input { border: 0; outline: none; padding: 5px 0px; width: 80%; }
#modal-group-edit .contentBox .tableBox table td input:focus, #modal-group-edit .contentBox .tableBox table td input:hover { background: #fff }
#modal-group-edit .contentBox .tableBox table td:last-child { text-align: right }
#modal-group-edit .contentBox .tableBox table td a { color: #999; display: inline-block; padding: 5px; cursor: pointer }
#modal-group-edit .contentBox .tableBox table td a:hover { color: #54D3E6 }
#modal-group-edit .contentBox .tableBox table tbody tr:first-child a.up { }
#modal-group-edit .contentBox .tableBox table tbody tr:last-child a.down { }

#modal-group-edit .contentBox .addBtnBox { }
#modal-group-edit .contentBox .addBtnBox button i { display: inline-block; margin-right: 5px; }
#modal-group-edit .contentBox .addBtnBox button { background: none; border: 0; color: #54D3E6; padding: 0 }

#modal-group-edit .modal-footer { position: absolute; bottom: 0; right: 0 }

.templateGroup button { margin-right: 10px; }
.groupBox { display: none; width: 100%; height: 100%; position: absolute; z-index: 999; background: none; }
.groupBox iframe { border: 0; padding: 0; margin: 0; width: 100%; height: 100%; background: none; }

#modal-scenepackgroup-group { width: 100%; height: 100%; background: #fff }
#modal-scenepackgroup-group { width: 100%; height: 100%; background: #fff }
#modal-scenepackgroup-group .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-scenepackgroup-group .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }

.templateGroupItem { background: #F7F8FA; border-radius: 8px; margin: 1%; width: 48%; box-sizing: border-box; border: 1px solid #F7F8FA; padding-bottom: 30px; float: left; cursor: pointer }
.templateGroupItem .title { text-align: center; padding: 20px 0; overflow: hidden; font-weight: bold }
.templateGroupItem .title img { display: inline-block; height: 30px; margin-bottom: 10px; }
.templateGroupItem .list { overflow: hidden; overflow-y: auto; height: 200px; }
.templateGroupItem .list .content { width: 480px; margin: 0 auto; }

.templateGroupItem .list .downBox { text-align: center; width: 100%; overflow: hidden }
.templateGroupItem .list .downBox .downArrow { width: 120px; float: right; }

.templateGroupItem .list .leftDownBox .downArrow { float: left; }

.templateGroupItem .list .downBox img { height: 20px; display: inline-block; margin: 10px 0; }
.templateGroupItem .list .content .itemBox { overflow: hidden }
.templateGroupItem .list .content .itemBox .img { display: inline-block; overflow: hidden; width: 60px; text-align: center; }
.templateGroupItem .list .content .itemBox img { height: 20px; margin: 5px 0px }
.templateGroupItem .list .content .itemBox .name { border-radius: 5px; border: 1px solid #ddd; padding: 5px 0; text-align: center; width: 120px; display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; height: 30px; margin: 0; line-height: normal; }
.templateGroupItem .list .content .leftItemBox { text-align: right }

.templateGroupItem.selected { border: 1px solid #54D3E6; }


#modal-scenepackgroup-edit { width: 100%; height: 100%; background: #fff }
#modal-scenepackgroup-edit { width: 100%; height: 100%; background: #fff }
#modal-scenepackgroup-edit .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-scenepackgroup-edit .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }
#modal-scenepackgroup-edit .groupTemplateBox { width: 45%; float: left }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox { overflow: hidden; padding: 0 5px; width: 100%; }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox { overflow: hidden; padding: 10px 20px }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table { width: 100%; }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table th { font-weight: normal; color: #666; padding: 10px 0 }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table td { padding: 5px 0 }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table td input { border: 0; outline: none; padding: 5px 0px; width: 80%; }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table td input:focus, #modal-scenepackgroup-edit .contentBox .tableBox table td input:hover { background: #fff }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table td:last-child { text-align: center; }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table td a { color: #999; display: inline-block; padding: 5px; cursor: pointer }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table td a:hover { color: #54D3E6 }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table tbody tr:first-child a.up { }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table tbody tr:last-child a.down { }

#modal-scenepackgroup-edit .groupTemplateBox .contentBox .addBtnBox { }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .addBtnBox button i { display: inline-block; margin-right: 5px; }
#modal-scenepackgroup-edit .groupTemplateBox .contentBox .addBtnBox button { background: none; border: 0; color: #54D3E6; padding: 0 }

#modal-scenepackgroup-edit .groupTemplateBox .contentBox .tableBox table tr.selected td a.file { color: #54D3E6 }

#modal-scenepackgroup-edit .fileBox { width: 50%; float: right }
#modal-scenepackgroup-edit .fileBox .contentBox { overflow: hidden; padding: 0 5px; width: 100%; }
#modal-scenepackgroup-edit .fileBox .contentBox .nameBox { }
#modal-scenepackgroup-edit .fileBox .contentBox .nameBox > div { background: #F0F2F5; padding: 8px 20px; border-radius: 5px 5px 0 0; width: auto; float: left; }
#modal-scenepackgroup-edit .fileBox .contentBox .nameBox > div i { font-weight: bold }
#modal-scenepackgroup-edit .fileBox .contentBox .nameBox > div .name { margin-left: 10px; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox { overflow: hidden; width: 100%; float: left }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table { width: 100%; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table th { font-weight: normal; color: #666; padding: 8px 10px; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td { padding: 0px 10px; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td input { border: 0; outline: none; padding: 5px 0px; width: 80%; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td input:focus, #modal-scenepackgroup-edit .contentBox .tableBox table td input:hover { background: #fff }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td:last-child { text-align: right }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td a { color: #999; display: inline-block; padding: 5px; cursor: pointer }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td a:hover { color: #54D3E6 }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table tbody tr:first-child a.up { }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table tbody tr:last-child a.down { }
#modal-scenepackgroup-edit .fileBox .contentBox .addBtnBox { margin: 5px 0 0 0 }
#modal-scenepackgroup-edit .fileBox .contentBox .addBtnBox button i { display: inline-block; margin-right: 5px; }
#modal-scenepackgroup-edit .fileBox .contentBox .addBtnBox button { background: none; border: 0; color: #54D3E6; padding: 0 }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table tr td:first-child div { width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td .playModeBox { }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td .playMode { width: 100px; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td .select2-container--default .select2-selection--single { border: 0; }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td .select2-container--default .select2-selection--single .select2-selection__arrow b { visibility: hidden }
#modal-scenepackgroup-edit .fileBox .contentBox .tableBox table td .select2-container--default .select2-selection--single .select2-selection__arrow { background: url(../img/playMode.png) no-repeat center center; background-size: contain }

#modal-scenepackgroup-view { width: 100%; height: 100%; background: #fff }
#modal-scenepackgroup-view { width: 100%; height: 100%; background: #fff }
#modal-scenepackgroup-view .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-scenepackgroup-view .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }

#modal-scenepackgroup-view .contentBox { overflow: hidden; padding: 0 5px; width: 100%; }
#modal-scenepackgroup-view .contentBox .nameBox { }
#modal-scenepackgroup-view .contentBox .nameBox > div { }
#modal-scenepackgroup-view .contentBox .tableBox { overflow: hidden; width: 100%; float: left }
#modal-scenepackgroup-view .contentBox .tableBox table { width: 100%; }
#modal-scenepackgroup-view .contentBox .tableBox table th { font-weight: normal; color: #666; padding: 8px 10px; background: #f7f8fa; }
#modal-scenepackgroup-view .contentBox .tableBox table td { padding: 0px 10px; }
#modal-scenepackgroup-view .contentBox .tableBox table td input { border: 0; outline: none; padding: 5px 0px; width: 80%; }
#modal-scenepackgroup-view .contentBox .tableBox table td input:focus, #modal-scenepackgroup-edit .contentBox .tableBox table td input:hover { background: #fff }
#modal-scenepackgroup-view .contentBox .tableBox table td:last-child { text-align: right }
#modal-scenepackgroup-view .contentBox .tableBox table td a { color: #999; display: inline-block; padding: 5px; cursor: pointer }
#modal-scenepackgroup-view .contentBox .tableBox table td a:hover { color: #54D3E6 }
#modal-scenepackgroup-view .contentBox .tableBox table tbody tr:first-child a.up { }
#modal-scenepackgroup-view .contentBox .tableBox table tbody tr:last-child a.down { }
#modal-scenepackgroup-view .contentBox .tableBox table tr td:first-child div { width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
#modal-scenepackgroup-view .contentBox .tableBox table td .playModeBox { }
#modal-scenepackgroup-view .contentBox .tableBox table td .playMode { width: 100px; }
#modal-scenepackgroup-view .contentBox .tableBox table td .select2-container--default .select2-selection--single { border: 0; }
#modal-scenepackgroup-view .contentBox .tableBox table td .select2-container--default .select2-selection--single .select2-selection__arrow b { visibility: hidden }
#modal-scenepackgroup-view .contentBox .tableBox table td .select2-container--default .select2-selection--single .select2-selection__arrow { background: url(../img/playMode.png) no-repeat center center; background-size: contain }


.table tr.fileTr:hover { background: #fff }

.fileTable { width: 100%; margin: 0 auto }
.fileTable thead tr { border-top: 1px solid #ddd; }
.fileTable thead tr th { border-bottom: 1px solid #ddd; text-align: center }
.fileTable thead tr th:first-child { text-align: left }
.fileTable th { font-weight: normal; color: #666; padding: 8px 10px; }
.fileTable td { padding: 0px 10px; }
.fileTable td a { color: #999; display: inline-block; padding: 5px; cursor: pointer }
.fileTable td a:hover { color: #54D3E6 }
.fileTable tr td { text-align: center }
.fileTable tr td:first-child { text-align: left }
.fileTable tr td:first-child div { width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.fileTable td .playModeBox { }
.fileTable td .playMode { width: 100px; }
.fileTable td .select2-container--default .select2-selection--single { border: 0; }
.fileTable td .select2-container--default .select2-selection--single .select2-selection__arrow b { visibility: hidden }
.fileTable td .select2-container--default .select2-selection--single .select2-selection__arrow { background: url(../img/playMode.png) no-repeat center center; background-size: contain }


#table_contenttype tbody { display: block; overflow-y: scroll; }
#table_contenttype thead,
#table_contenttype tbody tr { display: table; width: 100%; table-layout: fixed; }
#table_contenttype thead { width: calc( 100% - 1.2em); }

#table_contenttype tbody::-webkit-scrollbar { width: 10px; height: 10px; }
#table_contenttype tbody::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #ddd; }
#table_contenttype tbody::-webkit-scrollbar-track { border-radius: 10px; background: none; transition: all 0.3s }
#table_contenttype tbody::-webkit-scrollbar-thumb:hover { background-color: #666 }

.contentTypeHeader { overflow: hidden; width: 100%; display: flex }
.contentTypeHeader > div { width: 10%; float: left; line-height: 36px; height: 36px; }
.contentTypeHeader > div:last-child { flex-grow: 1 }
.contentTypeHeader div.sortItem { width: 100px; float: left; text-align: center }
.contentTypeHeader div.nameItem { width: 300px; float: left }
.contentTypeBody { width: 100%; float: left; overflow-y: auto }
.contentTypeBody .item { width: 100%; float: left; }
.contentTypeBody .item > div { width: 10%; float: left; line-height: 36px; height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contentTypeBody div.sortItem { width: 100px; float: left; text-align: center }
.contentTypeBody div.sortItem i { cursor: move; color: #999 }
.contentTypeBody div.sortItem i:active { color: #54D3E6 }
.contentTypeBody div.nameItem { width: 300px; float: left; display: block; height: 36px; }
.contentTypeBody div.nameItem > a { width: 20px; display: inline-block; cursor: pointer; color: #999 }
.contentTypeBody div.nameItem > a:hover { color: #54D3E6 }
.contentTypeBody .childrenItem { width: 100%; float: left; display: none; }
.contentTypeBody .childrenItem > div { width: 10%; float: left; line-height: 36px; height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contentTypeBody .childrenItem div.nameItem { width: 300px; float: left; display: block; height: 36px; }
.contentTypeBody .childrenItem div.nameItem > a { width: 20px; display: inline-block; margin: 0; text-indent: 0; }
.contentTypeBody .childrenItem div.nameItem > a.empty { width: 20px; }
.contentTypeBody .childrenItem div.sortItem { width: 100px; float: left; text-align: center; cursor: pointer }
.contentTypeBody .childrenItem div.sortItem i { cursor: move }
.contentTypeBody .list-group { width: 100%; float: left; margin: 0 }
.contentTypeBody .childrenItem > div.list-group { width: 100%; float: left; margin: 0; height: auto }
.contentTypeBody .item > div.list-group { width: 100%; float: left; margin: 0; height: auto }
.contentTypeBody .contextItem .list-group { background: #fff }
.contentTypeBody .contextItem.selected { background: #eee }
.contentTypeBody .contextItem.hovered { background: #eee }
.contentTypeBody .contextItem.hovered .list-group { background: #fff }


.departmentHeader { overflow: hidden; width: 100%; display: flex }
.departmentHeader > div { width: 10%; float: left; line-height: 36px; height: 36px; }
.departmentHeader > div:last-child { flex-grow: 1 }
.departmentHeader div.sortItem { width: 100px; float: left; text-align: center }
.departmentHeader div.nameItem { width: 300px; float: left }
.departmentBody { width: 100%; float: left; overflow-y: auto }
.departmentBody .item { width: 100%; float: left; }
.departmentBody .item > div { width: 10%; float: left; line-height: 36px; height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.departmentBody div.sortItem { width: 100px; float: left; text-align: center }
.departmentBody div.sortItem i { cursor: move; color: #999 }
.departmentBody div.sortItem i:active { color: #54D3E6 }
.departmentBody div.nameItem { width: 300px; float: left; display: block; height: 36px; }
.departmentBody div.nameItem > a { width: 20px; display: inline-block; cursor: pointer; color: #999 }
.departmentBody div.nameItem > a:hover { color: #54D3E6 }
.departmentBody .childrenItem { width: 100%; float: left; display: none; }
.departmentBody .childrenItem > div { width: 10%; float: left; line-height: 36px; height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.departmentBody .childrenItem div.nameItem { width: 300px; float: left; display: block; height: 36px; }
.departmentBody .childrenItem div.nameItem > a { width: 20px; display: inline-block; margin: 0; text-indent: 0; }
.departmentBody .childrenItem div.sortItem { width: 100px; float: left; text-align: center; cursor: pointer }
.departmentBody .childrenItem div.sortItem i { cursor: move }
.departmentBody .list-group { width: 100%; float: left; margin: 0 }
.departmentBody .childrenItem > div.list-group { width: 100%; float: left; margin: 0; height: auto }
.departmentBody .item > div.list-group { width: 100%; float: left; margin: 0; height: auto }
.departmentBody .contextItem .list-group { background: #fff }
.departmentBody .contextItem.selected { background: #eee }
.departmentBody .contextItem.hovered { background: #eee }
.departmentBody .contextItem.hovered .list-group { background: #fff }

#modal-contenttype-edit .selectTreeGroup { overflow: hidden }
#modal-contenttype-edit .selectTreeBox { width: 100%; border-radius: 8px; background: #fff; border: 1px solid #ddd }
#modal-contenttype-edit .box { display: flex; flex-wrap: wrap; }
#modal-contenttype-edit .form-item { flex: 1 0 40%; margin: 5px 10px 10px 10px; }
#modal-contenttype-edit .form-item label > span { float: right; color: #54D3E6; opacity: 1; background: none; cursor: pointer; }
#modal-contenttype-edit .form-item input:read-only { background: #fff; }
#modal-contenttype-edit .form-item .selectTreeBox input:read-only { background: none }
#modal-contenttype-edit .form-item > div { position: relative }
.queryContentTypeBox .list1 { overflow: hidden }
.queryContentTypeBox .list1 a { cursor: pointer; display: inline-block; border: 1px solid #eee; text-align: center; padding: 5px 10px; margin: 0 10px 10px 0; width: auto; border-radius: 8px; text-decoration: none; color: #999 }
.queryContentTypeBox .list2 a { cursor: pointer; display: inline-block; text-align: center; padding: 3px 7px; margin: 0 10px 10px 0; width: auto; border-radius: 3px; background: #F7F8FA; text-decoration: none; color: #999 }
.queryContentTypeBox .list1 a.selected { background: #54D3E6; border-color: #54D3E6; color: #fff }
.queryContentTypeBox .list2 a.selected { background: #E7FDFF; color: #54D3E6 }

.queryContentTypeBox .list3 a { font-size: 12px; cursor: pointer; display: inline-block; text-align: center; padding: 3px 7px; margin: 0 10px 10px 0; width: auto; border-radius: 3px; background: #F7F8FA; text-decoration: none; color: #999 }
.queryContentTypeBox .list3 a.selected { background: #E7FDFF; color: #54D3E6 }

.queryContentTypeBox .list4 a { font-size: 12px; cursor: pointer; display: inline-block; text-align: center; padding: 2px 5px; margin: 0 10px 10px 0; width: auto; border-radius: 3px; background: #F7F8FA; text-decoration: none; color: #999 }
.queryContentTypeBox .list4 a.selected { background: #E7FDFF; color: #54D3E6 }

.queryContentTypeBox .list5 a { font-size: 12px; cursor: pointer; display: inline-block; text-align: center; padding: 2px 5px; margin: 0 10px 10px 0; width: auto; border-radius: 3px; background: #F7F8FA; text-decoration: none; color: #999 }
.queryContentTypeBox .list5 a.selected { background: #E7FDFF; color: #54D3E6 }

#modal-contenttype-role .actionBox { margin-bottom: 10px; text-align: right }
#modal-contenttype-role .actionBox button { margin-left: 5px; }

#modal-notice-edit { width: 100%; height: 100%; background: #fff }
#modal-notice-edit .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-notice-edit .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }
#modal-notice-edit .itemBox { margin-bottom: 10px; width: 100%; float: left }
#modal-notice-edit .itemBox .item { width: auto; float: left; margin-right: 20px; position: relative }
#modal-notice-edit .itemBox .item input:read-only { background: #fff }
#modal-notice-edit .itemBox .item label { font-size: 14px; float: left; line-height: 32px; margin-right: 10px; margin-bottom: 0 }
#modal-notice-edit .itemBox .item input[type=text] { float: left; padding-right: 0px }
#modal-notice-edit .itemBox .roleEditBtn { line-height: 35px; color: #54D3E6; margin-left: 5px; cursor: pointer; }
#modal-notice-edit .itemBox .lcs_wrap { margin-top: 3.5px; zoom: 1.2 }
.lengthFlag { position: absolute; line-height: 34px; bottom: 0; right: 8px; color: #999; font-size: 12px }
.messageList { overflow: hidden }
.messageList .item { background: #F7F8FA; border-radius: 5px; margin: 0 0 10px 0; overflow: hidden; padding: 10px; }
.messageList .item:hover { background: #F7F8FA }
.messageList .item .avatarBox { overflow: hidden }
.messageList .item .avatarBox .avatar { background: url(../img/tx.png) no-repeat center center; background-size: cover; width: 25px; height: 25px; float: left; border-radius: 100px; }
.messageList .item .avatarBox .alias { float: left; width: auto; margin-left: 5px; line-height: 25px; color: #333333 }
.messageList .item .avatarBox .score { float: left; width: auto; margin-left: 5px; line-height: 25px; }
.messageList .item .avatarBox .score img { width: auto; height: 12px; display: block; float: left; margin-top: 6.5px }
.messageList .item .avatarBox .createTime { float: right; width: auto; margin-right: 10px; line-height: 25px; color: #333333 }
.messageList .item .avatarBox .del { float: right; width: auto; line-height: 25px; color: #333333 }
.messageList .item .avatarBox .del:hover { color: #54D3E6; cursor: pointer }
.messageList .item .contentBox { margin: 10px 0 0 0; overflow: hidden; background: none }
.messageList .item .contentBox .content { margin: 0; background: none; color: #333333; font-size: 12px; }



#table_notice tr td { white-space: nowrap; max-width: 200px; text-overflow: ellipsis; overflow: hidden }

#modal-purview-use { width: 100%; height: 100%; background: #fff }
#modal-purview-use .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-purview-use .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }

.purviewBarBox { width: 180px; float: left; }
.purviewBarBox .item { border-top: 1px solid #ddd; color: #000; line-height: 50px; cursor: pointer; text-indent: 0 }
.purviewBarBox .selected { color: #54D3E6 }
.purviewBarBox .item:last-child { border-bottom: 1px solid #ddd; }
.setBox { width: calc(100% - 200px); float: right; }
.setBox > .contentTypeSetBox { width: 300px; float: left; background: #fff; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd }
.setBox > .contentTypeSetBox .item { padding: 0px; display: block; overflow: hidden }

.setBox > .contentTypeSetBox .tdItem:hover { background: #E7FDFF }
.setBox > .contentTypeSetBox .item > div { width: 10%; float: left; line-height: 34px; height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.setBox > .contentTypeSetBox div.nameItem { width: 300px; float: left; display: block; height: 36px; background: #F7F8FA }
.setBox > .contentTypeSetBox div.nameItem > a { width: 20px; display: block; cursor: pointer; color: #999; float: right }
.setBox > .contentTypeSetBox div.nameItem > a:hover { color: #54D3E6 }
.setBox > .contentTypeSetBox .childrenItem { width: 100%; float: left; display: block; }
.setBox > .contentTypeSetBox .childrenItem > div { width: 10%; float: left; line-height: 34px; height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.setBox > .contentTypeSetBox .childrenItem div.nameItem { width: 300px; float: left; display: block; height: 36px; }
.setBox > .contentTypeSetBox .childrenItem div.nameItem > a { width: 20px; display: block; margin: 0; text-indent: 0; float: right }
.setBox > .contentTypeSetBox .childrenItem div.sortItem { width: 100px; float: left; text-align: center; cursor: pointer }
.setBox > .contentTypeSetBox .childrenItem div.sortItem i { cursor: move }
.setBox > .contentTypeSetBox .list-group { width: 100%; float: left; margin: 0 }
.setBox > .contentTypeSetBox .childrenItem > div.list-group { width: 100%; float: left; margin: 0; height: auto }
.setBox > .contentTypeSetBox .item > div.list-group { width: 100%; float: left; margin: 0; height: auto }
.setBox > .contentTypeSetBox .contextItem .list-group div.nameItem { background: #fff }
.setBox > .contentTypeSetBox .contextItem.selected { }
.setBox > .contentTypeSetBox .contextItem.hovered { }
.setBox > .contentTypeSetBox .contextItem.hovered .list-group { background: #fff; }
.setBox > .contentTypeSetBox .item label { font-weight: normal; display: block; float: left; width: auto }
.setBox > .contentTypeSetBox .item button { display: block; margin-top: 8px; margin-right: 5px; float: left; width: 17px; height: 17px; line-height: 15px; font-size: 12px; padding: 0; border-radius: 100px; }
.setBox > .contentTypeSetBox .item button.btn-check { background: #54D3E6; color: #fff; border-color: #54D3E6 }
.setBox > .contentTypeSetBox .item button.btn-check i { visibility: visible }
.setBox > .contentTypeSetBox .item button.btn-default i { visibility: hidden }
.setBox > .contentTypeSetBox .allBtnBox { background: #fff; padding: 0 10px }
.setBox > .contentTypeSetBox .allBtnBox label { margin: 0; line-height: 34px; font-weight: bold }

.scenePackSetBox { width: 100%; float: left; position: relative }
.scenePackSetBox .selectedBox { width: 250px; float: left; border-left: 1px solid #ddd; border-right: 1px solid #ddd; padding: 0 20px; margin-right: 20px }
.scenePackSetBox .unSelectedBox { width: calc(100% - 290px); float: left; }
.scenePackSetBox .actionBox { position: absolute; width: 30px; top: 40%; left: 232px; z-index: 999 }
.scenePackSetBox .actionBox button { margin-bottom: 20px; border-radius: 100px; }

.boardSetBox { width: 100%; float: left; position: relative }
.boardSetBox .selectedBox { width: 250px; float: left; border-left: 1px solid #ddd; border-right: 1px solid #ddd; padding: 0 20px; margin-right: 20px }
.boardSetBox .unSelectedBox { width: calc(100% - 290px); float: left; }
.boardSetBox .actionBox { position: absolute; width: 30px; top: 40%; left: 232px; z-index: 999 }
.boardSetBox .actionBox button { margin-bottom: 20px; border-radius: 100px; }

.screenSetBox { width: 100%; float: left; position: relative }
.screenSetBox .selectedBox { width: 250px; float: left; border-left: 1px solid #ddd; border-right: 1px solid #ddd; padding: 0 20px; margin-right: 20px }
.screenSetBox .unSelectedBox { width: calc(100% - 290px); float: left; }
.screenSetBox .actionBox { position: absolute; width: 30px; top: 40%; left: 232px; z-index: 999 }
.screenSetBox .actionBox button { margin-bottom: 20px; border-radius: 100px; }

#modal-purview-manage { width: 100%; height: 100%; background: #fff }
#modal-purview-manage .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-purview-manage .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }
#modal-purview-manage .item { display: inline-block; float: left; margin: 3px 0; margin-right: 10px; }
#modal-purview-manage .item label { font-weight: normal; display: block; float: left; width: auto; margin-bottom: 0 }
#modal-purview-manage .item button { display: block; margin-top: 1px; margin-right: 5px; float: left; width: 17px; height: 17px; line-height: 15px; font-size: 12px; padding: 0; border-radius: 100px; }
#modal-purview-manage .item button.btn-check { background: #54D3E6; color: #fff; border-color: #54D3E6 }
#modal-purview-manage .item button.btn-check i { visibility: visible }
#modal-purview-manage .item button.btn-default i { visibility: hidden }

#changeSellerBtn { cursor: pointer }
#changeSellerBtn:hover { text-decoration: none }
.keepLoginStateBox { width: auto; float: left; vertical-align: top; }
.keepLoginStateBox label { font-weight: normal; display: inline-block; margin: 0px 0 0 2px; vertical-align: top; }

#table_auth td img { display: block; width: auto; height: 20px; float: left }
#table_auth td p { display: block;  float: left;margin-left:2px;margin-bottom:0 }

#modal-company-auth { width: 100%; height: 100%; background: #fff }
#modal-company-auth { width: 100%; height: 100%; background: #fff }
#modal-company-auth .modal-dialog { width: 100%; height: 100%; top: 0; left: 0 }
#modal-company-auth .modal-dialog .modal-content { border-radius: 0; box-shadow: none; border: 0 }


#modal-first-login .modal-dialog .modal-content .modal-body {
overflow:hidden;
padding: 0;
margin: 0 !important;
}

#modal-first-login .guild_content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding:24px;
    white-space:pre-wrap;
}

    #modal-first-login .guild_content .title_row {
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-bottom:12px;
        justify-content:center;
        width:100%;
    }

        #modal-first-login .guild_content .title_row .title {
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 20px;
            color: #000000;
            line-height: 28px;
            text-align: left;
            flex:1;
        }

#modal-first-login .guild_content .title_row .seq {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 16px;
    color: #999999;
    line-height: 22px;
    text-align: left;
    font-style: normal;
}


.switch_item {
    width: 174px;
    height: 36px;
    border-radius: 18px;
    border: 1px solid #E4E7ED;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
}

    .switch_item span{
         margin-right:6px;
    }

    .switch_item input{
        margin-bottom:3px;
    }

.dialogiframeindex {
    position: absolute;
    z-index: 1051;
    width: 100%;
    height: 100%;
}

.dialogiframefile {
    position: absolute;
    z-index: 1051;
    width: 100%;
    height: 100%;
}