::-webkit-scrollbar {width: 4px;height: 4px;}
::-webkit-scrollbar-button {display: none;}
::-webkit-scrollbar-track {background-color: #ddd;border-radius: 4px;}
::-webkit-scrollbar-track-piece {background-color: transparent;}
::-webkit-scrollbar-thumb {border-radius: 4px; background-color: #aaa !important;}
:root{
	/* theme */
	/*--theme-color: #1385d3;*/
	--theme-color: #FEAB1B;
	/* menu */
	--menu-width: 200px;
	--menu-outdent-width: 200px;
	--menu-indent-width: 52px;
	/* main */
	--main-header-height: 60px;
}
*{padding: 0;margin: 0;font-family: 'Hiragino Sans GB', 'Microsoft Yahei', "WenQuanYi Micro Hei", SimSun, Tahoma, Arial, Helvetica, 'STHeiti', serif;}
html, body{height: 100%;background-color: #f5f6fa;scrollbar-width: none;-ms-overflow-style: none;}
ul, ol, li{list-style: none;}
a{text-decoration: none;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none;}
input[type="number"]{-moz-appearance: textfield;}
select{background-color: #fff;appearance: none;-moz-appearance: none;-webkit-appearance: none;}
.data-null{text-align: center;font-size: 13px;font-weight: normal;color: #888;background-color: #fcfcfc;padding: 60px 30px;}
img{object-fit: cover;}

body{scrollbar-arrow-color: red;scrollbar-face-color: var(--theme-color);scrollbar-3dlight-color: blue;scrollbar-highlight-color: #aaa;scrollbar-shadow-color: var(--theme-color);scrollbar-darkshadow-color: green;scrollbar-track-color: #aaa;scrollbar-base-color: black;scrollbar-width: none;-ms-overflow-style: none;}

@keyframes mainFadeInAnimation {0%{opacity: 0;left: -200px;}100%{opacity: 1;left: 0;}}
@keyframes msxMenuTextAnimation {0%{opacity: 0;}100%{opacity: 1;}}

.msx-container{display: flex;height: 100%;}
.msx-container .msx-aside{flex: 1;width: var(--menu-outdent-width);background-color: var(--theme-color);transition: width .5s;box-sizing: border-box;}
.msx-container.msx-indent .msx-aside{flex: 1 1 var(--menu-indent-width);width: var(--menu-indent-width);background-color: var(--theme-color);box-sizing: border-box;}
.msx-container .msx-aside::before{content: '';display: block;width: inherit;height: 100%;}
.msx-container .msx-aside .msx-aside-layout{position: fixed;top: 0;right: 0;left: 0;bottom: 0;z-index: 99999;background-color: var(--theme-color);width: inherit;box-shadow: 2px 0 8px 0 rgba(29, 35, 41, .05);display: flex;flex-direction: column;user-select: none;}
.msx-container .msx-aside .msx-aside-layout .msx-logo{display: flex;align-items: center;justify-content: center;height: 80px;color: #fff;font-size: 18px;}
.msx-container .msx-aside .msx-aside-layout .msx-logo a{color: inherit;display: flex;align-items: center;text-overflow: ellipsis;white-space: nowrap;}
.msx-container .msx-aside .msx-aside-layout .msx-logo .msx-logo-text{display: none;}
.msx-container .msx-aside .msx-aside-layout .msx-logo .msx-logo-text .msx-logo-block{display: flex;justify-items: center;}
.msx-container .msx-aside .msx-aside-layout .msx-logo .msx-logo-text .msx-logo-block .icon{width: 40px;height: 40px;}
.msx-container .msx-aside .msx-aside-layout .msx-logo .msx-logo-text .msx-logo-block .title{height: 40px;line-height: 40px;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-logo .msx-indent-logo,
.msx-container.msx-outdent .msx-aside .msx-aside-layout .msx-logo .msx-outdent-logo{display: block;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout{flex: 1 1 0;overflow-y: auto;box-sizing: border-box;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout::-webkit-scrollbar{display: none;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout{flex: 1 1 0;overflow-y: initial;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu{font-size: 14px;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item{position: relative;margin: 0 0 4px 0;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-tips{color: #fff;background-color: #ea4e75;padding: 1px 5px;border-radius: 2px;font-size: 12px;position: absolute;top: auto;right: 0;height: 18px;display: flex;align-items: center;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title{color: rgba(255, 255, 255, .7);height: 42px;padding: 0 20px;transition: width 1s;overflow: hidden;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title{padding: 0;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title .msx-menu-tips{top: 10px;right: 32px;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title .msx-menu-tips{width: 10px;height: 10px;color: transparent;padding: 0;border-radius: 50%;top: 10px;right: 10px;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title .msx-menu-item-title-angle{width: 32px;height: 42px;position: absolute;top: 0;right: 0;display: flex;align-items: center;justify-content: center;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-submenu-open .msx-menu-item-title .msx-menu-item-title-angle{transform: rotate(90deg);}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item-active .msx-menu-item-title{color: #fff;border-left: 2px solid #fff;background-color: rgba(0, 0, 0, .2);}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title .msx-menu-item-title-icon{font-size: 16px;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title .msx-menu-item-title-text{display: none;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title:hover{color: rgba(255, 255, 255, 1);background-color: rgba(0, 0, 0, .2);}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title>a{display: block;color: inherit;height: inherit;line-height: 3;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title>a{display: flex;align-items: center;justify-content: center;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-item-title>a>.msx-menu-item-title-angle{display: none;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item-active .msx-menu-item-title>a{color: #fff;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item:hover .msx-menu-item-title>a{color: inherit;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu{background-color: rgba(0, 0, 0, .05);overflow: hidden;transition: all .3s;max-height: 0;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu{position: absolute;top: 0;right: -150px;background-color: rgba(0, 0, 0, .7);width: 150px;border-radius: 2px;z-index: 999;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu-active{max-height: 800px;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu-item a{padding: 10px 40px;position: relative;display: block;}
.msx-container.msx-indent .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu-item a{padding: 10px 20px;}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu-item .msx-menu-submenu-item-text{font-size: 13px;color: rgba(255, 255, 255, .7);}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu-item:hover .msx-menu-submenu-item-text{color: rgba(255, 255, 255, 1);}
.msx-container .msx-aside .msx-aside-layout .msx-menu-layout .msx-menu .msx-menu-item .msx-menu-submenu-item .msx-menu-tips{top: 10px;right: 20px;}

.msx-container .msx-section{flex: 1 1 calc(100% - var(--menu-width));position: relative;box-sizing: border-box;transition: all .5s;}
.msx-container.msx-indent .msx-section{flex: 1 1 calc(100% - var(--menu-indent-width));position: relative;box-sizing: border-box;transition: all .5s;}
/* header start */
.msx-container .msx-section .msx-header{width: 100%;height: var(--main-header-height);position: relative;background-color: #fff;}
.msx-container .msx-section .msx-header::before{height: inherit;}
.msx-container .msx-section .msx-header .msx-header-layout{display: flex;align-items: center;justify-content: space-between;height: 60px;position: fixed;top: 0;right: 0;left: var(--menu-width);z-index: 99996;font-size: 14px;background-color: #fff;color: #333;box-shadow: 0 1px 4px rgba(0, 21, 41, .08);}
.msx-container.msx-indent .msx-section .msx-header .msx-header-layout{left: var(--menu-indent-width);}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links{position: relative;display: flex;align-items: center;color: inherit;height: inherit;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links>a{padding: 0 10px;height: inherit;line-height: 60px;color: inherit;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control{font-size: 18px;cursor: pointer;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control-indent{display: none;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control-outdent{display: block;}
.msx-container.msx-indent .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control-indent{display: block;}
.msx-container.msx-indent .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control-outdent{display: none;}
.msx-container.msx-outdent .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control-indent{display: none;}
.msx-container.msx-outdent .msx-section .msx-header .msx-header-layout .msx-header-links .msx-header-menu-control-outdent{display: block;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement{padding: 0;position: relative;height: inherit;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement:hover{background-color: rgba(0, 0, 0, .01);}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement>a{color: inherit;display: flex;align-items: center;height: inherit;padding: 0 10px;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement a i{transition: all .5s;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement:hover>a i:last-child{transform: rotate(-180deg);}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement ol{position: absolute;color: #444;box-shadow: 0 2px 5px #eee;background-color: #fff;border-radius: 0 0 2px 2px;top: 60px;right: 0;left: 0;z-index: 8;display: none;box-sizing: border-box;overflow: hidden;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement:hover ol{display: block;animation: abonementFadeInAnimation .3s;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement ol li{height: 45px;line-height: 45px;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement ol li:hover{background-color: #fafafa;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement ol li:last-child{border-top: 1px solid #f5f5f5;}
.msx-container .msx-section .msx-header .msx-header-layout .msx-header-links .abonement ol li a{height: inherit;line-height: inherit;padding: 0 20px;color: inherit;}
/* header end */

/* main start */
.msx-container .msx-section .msx-main{box-sizing: border-box;animation: mainFadeInAnimation .5s;position: relative;}
.msx-container .msx-section .msx-main .msx-main-top{padding: 20px;background-color: #fff;border-bottom: 1px solid #fcfcfc;position: sticky;top: var(--main-header-height);z-index: 9990;}
.msx-container .msx-section .msx-main .msx-main-header{display: flex;align-items: center;justify-content: space-between;}
.msx-container .msx-section .msx-main .msx-main-header .msx-main-header-body{font-size: inherit;}
.msx-container .msx-section .msx-main .msx-main-header .msx-main-header-body .msx-main-header-title{font-size: 15px;}
.msx-container .msx-section .msx-main .msx-main-header .msx-main-header-body .msx-main-header-explain{font-size: 12px;margin-top: 5px;color: #666;}
/* main end */

/* footer start */
.msx-container .msx-section .msx-footer{user-select: none;}
.msx-container .msx-section .msx-footer .footer{text-align: center;font-size: 12px;color: #aaa;padding: 30px 0;}
.msx-container .msx-section .msx-footer .footer a{color: inherit;}
/* footer end */

.chunk{display: flex;align-items: stretch;justify-content: space-between;}
.chunk .chunk-item{width: 50%;}
.chunk .chunk-item:first-child{margin: 0 5px 0 0;}
.chunk .chunk-item:last-child{margin: 0 0 0 5px;}
.section{padding: 0;}
.section-white{background-color: #fff;}
.section h4{padding: 18px 20px;color: #666;font-size: 15px;font-weight: normal;border-bottom: 1px solid #eee;display: flex;align-items: center;justify-content: flex-start;}
.section h4::before{content: '';display: inline-block;width: 4px;height: 15px;background-color: #2ba3f6;border-radius: 4px;position: relative;left: -5px;}

.search{display: flex;align-items: center;justify-content: flex-start;flex-wrap: wrap;margin: 10px 0 0 0;}
.search .search-item{display: flex;align-items: center;font-size: 12px;}
.search .search-item .item-title{text-align: right;color: #666;}
.search .search-item .item-input{height: 32px;box-sizing: border-box;display: flex;align-items: center;margin-right: 4px;}
.search input{height: inherit;width: 100%;min-width: 200px;outline: none;padding: 0 5px;border: 1px solid #ddd;transition: all .2s;border-radius: 2px;box-sizing: border-box;}
.search input:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.search select{height: inherit;width: 100%;min-width: 120px;box-sizing: border-box;outline: none;padding: 0 5px;border: 1px solid #ddd;transition: all .2s;border-radius: 2px;}
.search select:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}

.table{background-color: #fff;padding: 20px;margin: 10px 10px 0 10px;}
.table .table-header{font-size: 15px;color: #333;padding: 10px 0;display: flex;align-items: center;justify-content: space-between;}
.table .table-explain{padding: 15px;background-color: rgba(0, 153, 255, .05);font-size: 13px;color: #e64340;}
.table .table-search{display: flex;align-items: center;justify-content: flex-start;flex-wrap: wrap;padding: 10px;background-color: rgba(0, 153, 0, .0);}
.table .table-search .search-item{margin: 5px;display: flex;align-items: center;font-size: 13px;}
.table .table-search .search-item .item-title{text-align: inherit;}
.table .table-search .search-item .item-input{height: 32px;box-sizing: border-box;min-width: 200px;display: flex;align-items: center;}
.table .table-search input{height: inherit;width: 100%;outline: none;padding: 0 1em;border: 1px solid #ddd;transition: all .2s;border-radius: 2px;box-sizing: border-box;margin: 2px;}
.table .table-search input:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.table .table-search select{height: inherit;width: 100%;box-sizing: border-box;outline: none;padding: 0 1em;border: 1px solid #ddd;transition: all .2s;border-radius: 2px;margin: 2px;}
.table .table-search select:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.table table.table-main{width: 100%;border-collapse:collapse;color: #4d5259;box-sizing: border-box;}
.table table.table-main tr th, .table table.table-main tr td{text-align: center;border: 1px solid #eee;border-left: 1px solid #fafafa;border-right: 1px solid #fafafa;}
.table table.table-main tr th{font-size: 14px;padding: 10px 10px;border: 1px solid #f5f5f5;border-bottom: 1px solid #eee;box-sizing: border-box;background-color: #fefefe;white-space: nowrap;}
.table table.table-main tr td{font-size: 13px;padding: 2px 10px;box-sizing: border-box;height: 35px;}
.table table.table-main tr .td-left{text-align: left;}
.table table.table-main tr td.table-data-null{padding: 100px 0;text-align: center;}
/*.table table.table-main tr:nth-child(odd) td{background-color: #fdfdfd;}*/
.table table.table-main tr:hover td{background-color: #fdfdfd;}
.table table.table-main input[type=number],
.table table.table-main input[type=text]{border: none;text-align: center;outline: none;}
.table table.table-main input[type=checkbox]{position: relative;}
.table table.table-main input[type=checkbox]::before{content: '';display: block;width: 16px;height: 16px;border: 2px solid #ddd;position: relative;top: -.1em;left: -.1em;box-sizing: border-box;background-color: #fff;border-radius: 2px;}
.table table.table-main input[type=checkbox]:checked::before{content: '';display: block;width: 16px;height: 16px;border: 2px solid #48b0f7;position: relative;top: -.1em;left: -.1em;box-sizing: border-box;background-color: #48b0f7;z-index: 8;}
.table table.table-main input[type=checkbox]:checked::after{content: '';display: block;width: 10px;height: 5px;border-left: 2px solid #fff;border-bottom: 2px solid #fff;position: absolute;top: 2px;left: 1px;z-index: 9;transform: rotate(-45deg);border-radius: 2px;}
.table table.table-main input[control=sort]{min-width: 40px; max-width: 60px; width: 100%; box-sizing: border-box; height: 30px; text-align: center; border-radius: 2px; overflow: hidden; outline: none; font-size: 14px; color: #666;border: 1px solid transparent;background-color: transparent;}
.table table.table-main input[control=sort]:focus{border: none;}
.table table.table-main input[control=input]{width: 100%;outline: none; font-size: 14px; color: #666;border: 1px solid transparent;background-color: transparent;}
.table table.table-main input[control=input]:focus{border: none;}
.table .table-scroll{overflow-x: auto;}
.table .table-scroll table.table-main{min-width: 100%;}
.table .table-pager{padding: 40px 0 20px 0;text-align: center;font-size: 14px;}
.table .table-pager a{border: 1px solid #dee2e6;width: 30px;height: 30px;display: flex;align-items: center;justify-content: center;margin: 0 2px;color: #6c757d;border-radius: 2px;}
.table .table-pager a.active{background-color: rgba(76, 172, 247, .15);border-color: #48b0f7;color: #48b0f7;}
.table .table-pager .pager-text{color: #666;padding: 20px 0;}
.table .table-pager .pager-list{display: flex;align-items: center;justify-content: center;}
.table .table-pager .pager-list .pager-first{width: auto;padding: 0 10px;}
.table .table-pager .pager-list .pager-last{width: auto;padding: 0 10px;}

/* status start */
@keyframes statusTwinkleAnimation {0%{opacity: .3;}50%{opacity: .3;}100%{opacity: .1;}}
.status{color: #888;padding: 0 0 0 15px;font-size: 12px;border-radius: 2px;line-height: 18px;white-space: nowrap;display: inline-flex;align-items: center;position: relative;user-select: none;}
.status::before{content: '';width: 10px;height: 10px;border-radius: 10px;background-color: #888;animation: statusTwinkleAnimation 1.5s infinite alternate;position: absolute;left: 0;}
.status::after{content: '';width: 6px;height: 6px;border-radius: 6px;background-color: #888;position: absolute;left: 2px;}
.status.status-default{color: #888;}
.status.status-defa::before, .status.status-defa::after{background-color: #888;}
.status.status-primary{color: #33cabb;}
.status.status-primary::before, .status.status-primary::after{background-color: #33cabb;}
.status.status-success{color: #15c377;}
.status.status-success::before, .status.status-success::after{background-color: #15c377;}
.status.status-info{color: #48b0f7;}
.status.status-info::before, .status.status-info::after{background-color: #48b0f7;}
.status.status-warning{color: #faa64b;}
.status.status-warning::before, .status.status-warning::after{background-color: #faa64b;}
.status.status-danger{color: #f96868;}
.status.status-danger::before, .status.status-danger::after{background-color: #f96868;}
.status.status-secondary{color: #4d5259;}
.status.status-secondary::before, .status.status-secondary::after{background-color: #4d5259;}
.status.status-dark{color: #465161;}
.status.status-dark::before, .status.status-dark::after{background-color: #465161;}
.status.status-purple{color: #926dde;}
.status.status-purple::before, .status.status-purple::after{background-color: #926dde;}
.status.status-pink{color: #f96197;}
.status.status-pink::before, .status.status-pink::after{background-color: #f96197;}
.status.status-cyan{color: #57c7d4;}
.status.status-cyan::before, .status.status-cyan::after{background-color: #57c7d4;}
.status.status-yellow{color: #fcc525;}
.status.status-yellow::before, .status.status-yellow::after{background-color: #fcc525;}
.status.status-brown{color: #8d6658;}
.status.status-brown::before, .status.status-brown::after{background-color: #8d6658;}
.status.status-link{color: #48b0f7;}
.status.status-link::before, .status.status-link::after{background-color: #48b0f7;}
.status.status-1x{font-size: 12px;line-height: 18px;padding: 0 0 0 15px;}
.status.status-2x{font-size: 13px;line-height: 20px;padding: 0 0 0 15px;}
.status.status-3x{font-size: 14px;line-height: 22px;padding: 0 0 0 15px;}
.status.status-4x{font-size: 15px;line-height: 24px;padding: 0 0 0 15px;}
.status.status-5x{font-size: 16px;line-height: 28px;padding: 0 0 0 15px;}
/* status end */

.btn{display: inline-block;color: #888;border: 1px solid #ddd;font-size: 13px;border-radius: 2px;line-height: 20px;background-color: #fff;outline: none;cursor: pointer;padding: 5px 10px;overflow: hidden; white-space: nowrap;vertical-align: middle;margin: 2px;}
.btn.disabled{cursor: no-drop;}
.btn.btn-default{color: #888;}
.btn.btn-default:hover,
.btn.btn-default:focus{background-color: #fafafa;}
.btn.btn-default:active{background-color: #f5f5f5;}

.btn.btn-weight.btn-primary{color: #fff;border-color: #33cabb;background-color: #33cabb;}
.btn.btn-weight.btn-primary:hover,
.btn.btn-weight.btn-primary:focus{background-color: #52d3c7;border-color: #52d3c7;}
.btn.btn-weight.btn-primary:active{background-color: #2ba99d;border-color: #2ba99d;}
.btn.btn-primary{color: #2ba99d;border-color: rgba(43, 169, 157, .12);background-color: rgba(43, 169, 157, .1);}
.btn.btn-primary:hover,
.btn.btn-primary:focus{background-color: rgba(43, 169, 157, .15);border-color: rgba(43, 169, 157, .18);}
.btn.btn-primary:active{background-color: rgba(43, 169, 157, .2);border-color: rgba(43, 169, 157, .25);}

.btn.btn-weight.btn-success{color: #fff;border-color: #15c377;background-color: #15c377;}
.btn.btn-weight.btn-success:hover,
.btn.btn-weight.btn-success:focus{background-color: #16d17f;border-color: #16d17f;}
.btn.btn-weight.btn-success:active{background-color: #14b56f;border-color: #14b56f;}
.btn.btn-success{color: #14b56f;border-color: rgba(20, 181, 111, .12);background-color: rgba(20, 181, 111, .1);}
.btn.btn-success:hover,
.btn.btn-success:focus{background-color: rgba(20, 181, 111, .15);border-color: rgba(20, 181, 111, .18);}
.btn.btn-success:active{background-color: rgba(20, 181, 111, .2);border-color: rgba(20, 181, 111, .25);}

.btn.btn-weight.btn-info{color: #fff;border-color: #48b0f7;background-color: #48b0f7;}
.btn.btn-weight.btn-info:hover,
.btn.btn-weight.btn-info:focus{background-color: #65bdf8;border-color: #65bdf8;}
.btn.btn-weight.btn-info:active{background-color: #2ba3f6;border-color: #2ba3f6;}
.btn.btn-info{color: #2ba3f6;border-color: rgba(43, 163, 246, .12);background-color: rgba(43, 163, 246, .1);}
.btn.btn-info:hover,
.btn.btn-info:focus{background-color: rgba(43, 163, 246, .15);border-color: rgba(43, 163, 246, .18);}
.btn.btn-info:active{background-color: rgba(43, 163, 246, .2);border-color: rgba(43, 163, 246, .25);}

.btn.btn-weight.btn-warning{color: #fff;border-color: #faa64b;background-color: #faa64b;}
.btn.btn-weight.btn-warning:hover,
.btn.btn-weight.btn-warning:focus{background-color: #fbb264;border-color: #fbb264;}
.btn.btn-weight.btn-warning:active{background-color: #f99a32;border-color: #f99a32;}
.btn.btn-warning{color: #f99a32;border-color: rgba(249, 154, 50, .12);background-color: rgba(249, 154, 50, .1);}
.btn.btn-warning:hover,
.btn.btn-warning:focus{background-color: rgba(249, 154, 50, .15);border-color: rgba(249, 154, 50, .18);}
.btn.btn-warning:active{background-color: rgba(249, 154, 50, .2);border-color: rgba(249, 154, 50, .25);}

.btn.btn-weight.btn-danger{color: #fff;border-color: #f96868;background-color: #f96868;}
.btn.btn-weight.btn-danger:hover,
.btn.btn-weight.btn-danger:focus{background-color: #fa8181;border-color: #fa8181;}
.btn.btn-weight.btn-danger:active{background-color: #f84f4f;border-color: #f84f4f;}
.btn.btn-danger{color: #f84f4f;border-color: rgba(248, 79, 79, .12);background-color: rgba(248, 79, 79, .1);}
.btn.btn-danger:hover,
.btn.btn-danger:focus{background-color: rgba(248, 79, 79, .15);border-color: rgba(248, 79, 79, .18);}
.btn.btn-danger:active{background-color: rgba(248, 79, 79, .2);border-color: rgba(248, 79, 79, .25);}

.btn.btn-secondary{color: #4d5259;border-color: #e4e7ea;background-color: #e4e7ea;}
.btn.btn-secondary:hover,
.btn.btn-secondary:focus{background-color: #edeff1;border-color: #edeff1;}
.btn.btn-secondary:active{background-color: #dbdfe3;border-color: #dbdfe3;}

.btn.btn-weight.btn-dark{color: #fff;border-color: #465161;background-color: #465161;}
.btn.btn-weight.btn-dark:hover,
.btn.btn-weight.btn-dark:focus{background-color: #515d70;border-color: #515d70;}
.btn.btn-weight.btn-dark:active{background-color: #3b4552;border-color: #3b4552;}
.btn.btn-dark{color: #3b4552;border-color: rgba(59, 69, 82, .12);background-color: rgba(59, 69, 82, .1);}
.btn.btn-dark:hover,
.btn.btn-dark:focus{background-color: rgba(59, 69, 82, .15);border-color: rgba(59, 69, 82, .18);}
.btn.btn-dark:active{background-color: rgba(59, 69, 82, .2);border-color: rgba(59, 69, 82, .25);}

.btn.btn-weight.btn-purple{color: #fff;border-color: #926dde;background-color: #926dde;}
.btn.btn-weight.btn-purple:hover,
.btn.btn-weight.btn-purple:focus{background-color: #a282e3;border-color: #a282e3;}
.btn.btn-weight.btn-purple:active{background-color: #8258d9;border-color: #8258d9;}
.btn.btn-purple{color: #8258d9;border-color: rgba(130, 88, 217, .12);background-color: rgba(130, 88, 217, .1);}
.btn.btn-purple:hover,
.btn.btn-purple:focus{background-color: rgba(130, 88, 217, .15);border-color: rgba(130, 88, 217, .18);}
.btn.btn-purple:active{background-color: rgba(130, 88, 217, .2);border-color: rgba(130, 88, 217, .25);}

.btn.btn-weight.btn-pink{color: #fff;border-color: #f96197;background-color: #f96197;}
.btn.btn-weight.btn-pink:hover,
.btn.btn-weight.btn-pink:focus{background-color: #fa75a4;border-color: #fa75a4;}
.btn.btn-weight.btn-pink:active{background-color: #f84d8a;border-color: #f84d8a;}
.btn.btn-pink{color: #f84d8a;border-color: rgba(248, 77, 138, .12);background-color: rgba(248, 77, 138, .1);}
.btn.btn-pink:hover,
.btn.btn-pink:focus{background-color: rgba(248, 77, 138, .15);border-color: rgba(248, 77, 138, .18);}
.btn.btn-pink:active{background-color: rgba(248, 77, 138, .2);border-color: rgba(248, 77, 138, .25);}

.btn.btn-weight.btn-cyan{color: #fff;border-color: #57c7d4;background-color: #57c7d4;}
.btn.btn-weight.btn-cyan:hover,
.btn.btn-weight.btn-cyan:focus{background-color: #77d2dc;border-color: #77d2dc;}
.btn.btn-weight.btn-cyan:active{background-color: #37bccc;border-color: #37bccc;}
.btn.btn-cyan{color: #37bccc;border-color: rgba(55, 188, 204, .12);background-color: rgba(55, 188, 204, .1);}
.btn.btn-cyan:hover,
.btn.btn-cyan:focus{background-color: rgba(55, 188, 204, .15);border-color: rgba(55, 188, 204, .18);}
.btn.btn-cyan:active{background-color: rgba(55, 188, 204, .2);border-color: rgba(55, 188, 204, .25);}

.btn.btn-weight.btn-yellow{color: #fff;border-color: #fcc525;background-color: #fcc525;}
.btn.btn-weight.btn-yellow:hover,
.btn.btn-weight.btn-yellow:focus{background-color: #fdd04d;border-color: #fdd04d;}
.btn.btn-weight.btn-yellow:active{background-color: #f5b703;border-color: #f5b703;}
.btn.btn-yellow{color: #f5b703;border-color: rgba(245, 183, 3, .12);background-color: rgba(245, 183, 3, .1);}
.btn.btn-yellow:hover,
.btn.btn-yellow:focus{background-color: rgba(245, 183, 3, .15);border-color: rgba(245, 183, 3, .18);}
.btn.btn-yellow:active{background-color: rgba(245, 183, 3, .2);border-color: rgba(245, 183, 3, .25);}

.btn.btn-weight.btn-brown{color: #fff;border-color: #8d6658;background-color: #8d6658;}
.btn.btn-weight.btn-brown:hover,
.btn.btn-weight.btn-brown:focus{background-color: #9d7162;border-color: #9d7162;}
.btn.btn-weight.btn-brown:active{background-color: #7d5b4e;border-color: #7d5b4e;}
.btn.btn-brown{color: #7d5b4e;border-color: rgba(125, 91, 78, .12);background-color: rgba(125, 91, 78, .1);}
.btn.btn-brown:hover,
.btn.btn-brown:focus{background-color: rgba(125, 91, 78, .15);border-color: rgba(125, 91, 78, .18);}
.btn.btn-brown:active{background-color: rgba(125, 91, 78, .2);border-color: rgba(125, 91, 78, .25);}

.btn.btn-link{color: #48b0f7;border-color: transparent;background-color: transparent;}
.btn.btn-link:hover,
.btn.btn-link:focus{background-color: transparent;border-color: transparent;}
.btn.btn-link:active{background-color: transparent;border-color: transparent;}

.btn.btn-1x{font-size: 12px;line-height: 18px;padding: 2px 5px;}
.btn.btn-2x{font-size: 13px;line-height: 20px;padding: 5px 10px;}
.btn.btn-3x{font-size: 14px;line-height: 22px;padding: 8px 15px;}
.btn.btn-4x{font-size: 15px;line-height: 24px;padding: 10px 20px;}
.btn.btn-5x{font-size: 16px;line-height: 28px;padding: 12px 24px;}

.form{background-color: #fff;padding: 30px 0;margin: 10px 10px 0 10px;}
.form .form-header{border-bottom: 1px solid #ddd;display: flex;align-items: center;justify-content: space-between;padding: 20px;}
.form .form-header .header-title{font-size: 17px;color: #4d5259;}
.form .form-item{padding: 0 40px;}
.form .form-item .item-tips{font-size: 12px;color: red;}
.form .form-item:last-child{margin-bottom: 0;}
.form .form-item .item-title{font-size: 14px;padding: 5px 0;color: #444;display: flex;align-items: center;position: relative;height: 40px;}
.form .form-item .item-title.item-must::before{content: '*';color: #e64340;font-size: inherit;font-weight: bold;height: inherit; padding-right: 3px; transform: translateY(calc(50% - 7px));}
.form .form-item .item-stratum{padding: 5px 0;font-size: 14px;}
.form .form-item .item-stratum input[type=text]{padding: 0 1em;border: 1px solid #ebebeb;height: 40px;box-sizing: border-box;outline: none;width: 100%;border-radius: 2px;transition: all .2s;}
.form .form-item .item-stratum input[type=number]{padding: 0 1em;border: 1px solid #ebebeb;height: 40px;box-sizing: border-box;outline: none;width: 100%;border-radius: 2px;transition: all .2s;}
.form .form-item .item-stratum input[type=file]{padding: 8px 1em;border: 1px solid #ebebeb;height: 40px;box-sizing: border-box;outline: none;width: 100%;border-radius: 2px;transition: all .2s;}
.form .form-item .item-stratum .focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.form .form-item .item-stratum input[type=text]:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.form .form-item .item-stratum input[type=number]:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.form .form-item .item-stratum .explain{font-size: 12px;color: #888;padding: 5px 0;}
.form .form-item .item-stratum textarea{padding: 1em;border: 1px solid #ebebeb;box-sizing: border-box;outline: none;width: 100%;resize: none;border-radius: 2px;font-size: 13px;}
.form .form-item .item-stratum textarea:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.form .form-item .item-stratum .words{height: 40px;display: flex;align-items: center;justify-content: flex-start;font-size: 14px;}
.form .form-item .item-stratum .inp label{padding-right: 10px;}
.form .form-item .item-stratum .inp input[type=radio]{position: relative;margin-right: 10px;}
.form .form-item .item-stratum .inp input[type=radio]::before{content: '';display: block;width: 18px;height: 18px;border-radius: 50%;background-color: #fff;border: 2px solid #ddd;position: relative;top: -2px;left: -2px;box-sizing: border-box;}
.form .form-item .item-stratum .inp input[type=radio]:checked::before{content: '';display: block;width: 18px;height: 18px;border-radius: 50%;background-color: #fff;border: 5px solid #48b0f7;position: relative;top: -2px;left: -2px;box-sizing: border-box;}
.form .form-item .item-stratum .inp input[type=checkbox]{position: relative;margin-right: 10px;}
.form .form-item .item-stratum .inp input[type=checkbox]::before{content: '';display: block;width: 18px;height: 18px;border-radius: 2px;background-color: #fff;border: 2px solid #ddd;position: relative;top: -2px;left: -2px;box-sizing: border-box;}
.form .form-item .item-stratum .inp input[type=checkbox]:checked::before{content: '';display: block;width: 18px;height: 18px;border-radius: 2px;background-color: #fff;border: 2px solid #48b0f7;position: relative;top: -2px;left: -2px;box-sizing: border-box;}
.form .form-item .item-stratum .inp input[type=checkbox]:checked::after{content: '';display: block;width: 10px;height: 6px;border-left: 2px solid #48b0f7;border-bottom: 2px solid #48b0f7;position: absolute;top: 3px;left: 2px;box-sizing: border-box;transform: rotate(-45deg);}
.form .form-item .item-stratum .inp-inline{display: flex;align-items: center;justify-content: flex-start;}
.form .form-item .item-stratum select{padding: 0 1em;border: 1px solid #ebebeb;box-sizing: border-box;outline: none;width: 100%;resize: none;border-radius: 2px;height: 40px;transition: all .2s;}
.form .form-item .item-stratum select:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.form .form-item .form-table{width: 100%;border-collapse: collapse;}
.form .form-item .form-table tr th{padding: 15px 10px;background-color: #fcfcfc;border: 1px solid #f2f2f2;border-bottom: 1px solid #ddd;font-size: 13px;color: #333;text-align: center;white-space:nowrap;}
.form .form-item .form-table tr td{padding: 8px 10px;background-color: #fff;border: 1px solid #f5f5f5;text-align: center;font-size: 13px;color: #333;}
.form .form-item .form-table tr td.data-null{padding: 20px;text-align: center;color: #888;}
.form .form-item .form-table input[type=number],
.form .form-item .form-table input[type=text]{width: 100%;height: 24px;background-color: transparent;border: none;text-align: center;outline: none;}
.form .form-item .form-table input[type=date]{width: 100%;height: 24px;background-color: transparent;border: none;text-align: center;outline: none;}
.form .form-item .form-table select{width: auto;height: 24px;background-color: transparent;border: none;text-align: center;outline: none;}

.form .form-item .tags-select{display: flex;align-items: center;align-content: flex-start;margin: -10px -20px 0 0;}
.form .form-item .tags-select .tags-item{margin: 10px 20px 0 0;position: relative;display: flex;align-items: center;align-content: flex-start;}
.form .form-item .tags-select .tags-item .insert-delete-btn{position: relative;right: -2px;width: 15px;height: 15px;cursor: pointer;display: flex;align-items: center;justify-content: center;transform: rotate(45deg);}
.form .form-item .tags-select .tags-item .insert-delete-btn::before{content: '';position: absolute;width: 12px;height: 2px;background-color: #e64340;cursor: pointer;border-radius: 2px;}
.form .form-item .tags-select .tags-item .insert-delete-btn::after{content: '';position: absolute;width: 2px;height: 12px;background-color: #e64340;cursor: pointer;border-radius: 2px;}
.form .form-item .tags-select .tags-item .insert-plus-btn{color: #ccc;}

.form.form-grid .form-items{display: flex;justify-content: flex-start;flex-wrap: wrap;padding: 40px 40px 40px 40px;border-top: 1px solid #eee;}
.form.form-grid .form-items:first-child{border-top: none;}
.form.form-grid .form-items .form-item{display: flex;align-items: center;padding: 5px 20px;box-sizing: border-box;}
.form.form-grid .form-items .form-item .item-title{justify-content: flex-end;}
.form.form-grid .form-items .form-item .item-title.item-must::before{content: '*';color: #e64340;font-size: inherit;}
.form.form-grid .form-items .form-item:last-child{margin-bottom: 15px;}
.form.form-grid .form-items .form-item.form-col-1x{width: 8.333333333333333%;}
.form.form-grid .form-items .form-item.form-col-2x{width: 16.66666666666667%;}
.form.form-grid .form-items .form-item.form-col-3x{width: 25%;}
.form.form-grid .form-items .form-item.form-col-4x{width: 33.33333333333333%;}
.form.form-grid .form-items .form-item.form-col-5x{width: 41.66666666666667%;}
.form.form-grid .form-items .form-item.form-col-6x{width: 50%;}
.form.form-grid .form-items .form-item.form-col-7x{width: 58.33333333333333%;}
.form.form-grid .form-items .form-item.form-col-8x{width: 66.66666666666667%;}
.form.form-grid .form-items .form-item.form-col-9x{width: 75%;}
.form.form-grid .form-items .form-item.form-col-10x{width: 83.33333333333333%;}
.form.form-grid .form-items .form-item.form-col-11x{width: 91.66666666666667%;}
.form.form-grid .form-items .form-item.form-col-12x{width: 100%;}
.form.form-grid .form-items .form-item.form-item-column{flex-direction: column;}
.form.form-grid .form-items .form-item .item-title{width: 100px;box-sizing: border-box;padding: 0 15px;}
.form.form-grid .form-items .form-item .item-stratum{flex: 1;padding: 0;}
.form.form-grid .form-items .form-item.form-item-column .item-title,
.form.form-grid .form-items .form-item.form-item-column .item-stratum {width: 100%;}

.tags-element-layer{border: 1px solid #ebebeb;height: 40px;display: flex;align-items: center;padding: 0 1em;}
.tags-element-layer .tags-list-layer{display: flex;align-items: center;}
.tags-element-layer .tags-list-layer .tags-item{background-color: #48b0f7;color: #fff;padding: 2px 10px;margin-right: 10px;border-radius: 2px;cursor: pointer;}
.tags-element-layer .tags-list-layer .tags-item i{font-style: normal;padding: 0 0 0 10px;}
.tags-element-layer .tags-input{border: none;outline: none;height: 40px;}

.image-list-layer{padding: 0;display: flex;align-items: center;flex-wrap: wrap;margin: 0 -10px -10px 0;}
.image-list-layer .image-layer{border: 1px dashed #48b0f7;min-width: 100px;max-width: none;height: 100px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;cursor: pointer;position: relative;top: 0;margin: 0 10px 10px 0;box-shadow: 0 0 5px rgba(204, 181, 247, .2);overflow: hidden;transition: all .2s;}
.image-list-layer .image-layer:hover{box-shadow: 0 0 5px rgba(204, 181, 247, .8);}
.image-list-layer .image-layer[image-status=icon]{border-color: #48b0f7;}
.image-list-layer .image-layer[image-status=image]{border-color: #48b0f7;}
.image-list-layer .image-layer[image-status=image]:hover{top: -5px;box-shadow: 0 5px 10px rgba(204, 181, 247, .2);}
.image-list-layer .image-layer::before{content: '+';display: inline-block;font-size: 30px;color: #48b0f7;}
.image-list-layer .image-layer[image-status=icon]::before{display: block;}
.image-list-layer .image-layer[image-status=image]::before{display: none;}
.image-list-layer .image-layer .image-show{display: flex;align-items: center;justify-content: center;background-color: #fff;height: 100px;}
.image-list-layer .image-layer .image-show img{max-width: 100%;max-height: 100%;}
.image-list-layer .image-layer .image-delete{position: absolute;top: 0;right: 10px;width: 20px;height: 20px;background-color: #e64340;border-radius: 50%;line-height: 20px;text-align: center;color: #fff;box-shadow: 0 0 5px #888;font-size: 12px;}

.region-layer{width: 900px;height: 400px;border: 1px solid #eee;display: flex;justify-content: flex-start;position: relative;top: 10px;}
.region-layer .region-item{width: 300px;height: inherit;border-right: 1px solid #eee; display: flex; flex-direction: column;}
.region-layer .region-item:last-child{border-right: none;}
.region-layer .region-item .item-title{background-color: #fafafa;text-align: center;font-size: 15px;padding: 10px 0;border-bottom: 1px solid #eee;}
.region-layer .region-item .lists{padding: 0;box-sizing: border-box;overflow-y: scroll; flex: 1;}
.region-layer .region-item .lists .list-item{padding: 10px 20px;font-size: 15px;color: #333;cursor: pointer;border-bottom: 1px solid #fafafa;}
.region-layer .region-item .lists .list-item:hover{background-color: rgba(0, 153, 255, .1);}
.region-layer .region-item .lists .list-item.active{background-color: rgba(0, 153, 255, .1);}

/* record details style start */
.msx-details{background-color: #fff;padding: 0 0 30px 0;}
.msx-details .msx-details-header{border-bottom: 1px solid #ddd;display: flex;align-items: center;justify-content: space-between;padding: 20px;}
.msx-details .msx-details-header .header-title{font-size: 17px;color: #4d5259;}
.msx-details .msx-details-main{padding: 30px;}
.msx-details .msx-details-main .details-lists{display: flex;align-items: center;justify-content: flex-start;flex-wrap: wrap;}
.msx-details .msx-details-main .details-lists .details-lists-item{width: auto;font-size: 15px;padding: 10px;color: #333;box-sizing: border-box;display: flex;align-items: center;justify-content: flex-start;}
.msx-details .msx-details-main .details-lists .details-lists-item .item-title{font-size: 13px;color: #888;}
.msx-details .msx-details-main .details-lists .details-lists-item .item-value{font-size: 14px;color: #333;padding: 0 1rem;}
.msx-details .msx-details-main .details-lists .item-col-1x{width: 8.333333333333333%;}
.msx-details .msx-details-main .details-lists .item-col-2x{width: 16.66666666666667%;}
.msx-details .msx-details-main .details-lists .item-col-3x{width: 25%;}
.msx-details .msx-details-main .details-lists .item-col-4x{width: 33.33333333333333%;}
.msx-details .msx-details-main .details-lists .item-col-5x{width: 41.66666666666667%;}
.msx-details .msx-details-main .details-lists .item-col-6x{width: 50%;}
.msx-details .msx-details-main .details-lists .item-col-7x{width: 58.33333333333333%;}
.msx-details .msx-details-main .details-lists .item-col-8x{width: 66.66666666666667%;}
.msx-details .msx-details-main .details-lists .item-col-9x{width: 75%;}
.msx-details .msx-details-main .details-lists .item-col-10x{width: 83.33333333333333%;}
.msx-details .msx-details-main .details-lists .item-col-11x{width: 91.66666666666667%;}
.msx-details .msx-details-main .details-lists .item-col-12x{width: 100%;}
.msx-details .msx-details-main .details-table{padding: 20px 0;}
.msx-details .msx-details-main .details-table table{width: 100%;border-top: 1px solid #eee;border-collapse: collapse;}
.msx-details .msx-details-main .details-table table tr th,
.msx-details .msx-details-main .details-table table tr td{border: 1px solid #fafafa;text-align: center;}
.msx-details .msx-details-main .details-table table tr th{border-bottom: 1px solid #eee;padding: 15px;color: #666;font-size: 14px;}
.msx-details .msx-details-main .details-table table tr td{font-size: 13px;padding: 10px;}
.msx-details .msx-details-main .details-table table tr td input[type=text],
.msx-details .msx-details-main .details-table table tr td input[type=number]{outline: none;width: 100%;height: 24px;vertical-align: top;padding: 0 10px;box-sizing: border-box;text-align: center;border: none;}
.msx-details .msx-details-main .details-search{display: flex;align-items: center;justify-content: flex-start;flex-wrap: wrap;padding: 10px;background-color: rgba(0, 153, 0, .02);}
.msx-details .msx-details-main .details-search .search-item{margin: 5px;display: flex;align-items: center;font-size: 13px;}
.msx-details .msx-details-main .details-search .search-item .item-title{width: 70px; text-align: right;}
.msx-details .msx-details-main .details-search .search-item .item-input{height: 32px;box-sizing: border-box;min-width: 240px;}
.msx-details .msx-details-main .details-search .search-item .item-input input{height: inherit;width: 100%;outline: none;padding: 0 1em;border: 1px solid #ddd;transition: all .2s;border-radius: 2px;box-sizing: border-box;}
.msx-details .msx-details-main .details-search .search-item .item-input input:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}
.msx-details .msx-details-main .details-search .search-item .item-input select{height: inherit;width: 100%;box-sizing: border-box;outline: none;padding: 0 1em;border: 1px solid #ddd;transition: all .2s;border-radius: 2px;}
.msx-details .msx-details-main .details-search .search-item .item-input select:focus{border-color: #48b0f7;box-shadow: 0 0 5px #48b0f7;}

/* record details style end */

[msx=msx-popup]{position: fixed;top: 0;right: 0;bottom: 0;left: 0;z-index: 999999;display: none;align-items: center;justify-content: center;}
[msx=msx-popup].show{display: flex;}
[msx=msx-popup].show .msx-popup-layer{-webkit-animation: animationPopIn .4s;animation: animationPopIn .4s;}
[msx=msx-popup] .msx-popup-mask{position: fixed;top: 0;right: 0;bottom: 0;left: 0;z-index: 8;background-color: rgba(0, 0, 0, .2);}
[msx=msx-popup] .msx-popup-layer{width: 900px;height: 600px;background-color: #ffff;position: relative;z-index: 9;border-radius: 5px;overflow: hidden;display: flex;flex-direction: column;}
[msx=msx-popup] .msx-popup-layer .popup-layer-header{background-color: #fafafa;height: 50px;display: flex;align-items: center;padding: 0 15px;border-bottom: 1px solid #eee;box-sizing: border-box;}
[msx=msx-popup] .msx-popup-layer .popup-layer-header .popup-layer-header-title{color: #333;font-size: 14px;}
[msx=msx-popup] .msx-popup-layer .popup-layer-header .popup-layer-header-close{width: 50px;height: 50px;position: absolute;top: 0;right: 0;display: flex;align-items: center;justify-content: center;cursor: pointer;}
[msx=msx-popup] .msx-popup-layer .popup-layer-header .popup-layer-header-close::before{content: '';width: 18px;height: 2px;display: block;position: absolute;background-color: #666;transform: rotate(45deg);border-radius: 10px;}
[msx=msx-popup] .msx-popup-layer .popup-layer-header .popup-layer-header-close::after{content: '';width: 18px;height: 2px;display: block;position: absolute;background-color: #666;transform: rotate(135deg);border-radius: 10px;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main{flex: 1;overflow-y: auto;padding: 10px;box-sizing: border-box;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-table{width: 100%;border-collapse:collapse;color: #4d5259;box-sizing: border-box;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-table tr th,
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-table tr td{text-align: center;border: 1px solid #fafafa;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-table tr th{font-size: 13px;padding: 12px 1em;border-bottom: 1px solid #eee;box-sizing: border-box;background-color: #fdfdfd;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-table tr td{font-size: 13px;padding: 10px 1em;box-sizing: border-box;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-layer-input input{width: 100%;height: 40px;box-sizing: border-box;border: 1px solid #eee;border-radius: 2px;padding: 0 1em;outline: none;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-layer-input textarea{width: 100%;height: 200px;box-sizing: border-box;border: 1px solid #eee;border-radius: 2px;padding: 1em;outline: none;}
[msx=msx-popup] .msx-popup-layer .popup-layer-main .popup-layer-button{padding: 10px 0 0 0;}

[msx=msx-file]{width: 60px;height: 60px;border: 1px solid #eee;border-radius: 2px;display: flex;align-items: center;justify-content: center;color: #ccc;cursor: pointer;}
[msx=msx-file]::before{content: "+";position: absolute;z-index: 1;}
[msx=msx-file] img{width: inherit;height: inherit;object-fit: cover;position: relative;z-index: 9;}

[msx=tabs] .tabs{display: inline-flex;border-radius: 5px;overflow: hidden;}
[msx=tabs] .tabs .tab-item{background-color: #fafafa;padding: 10px 20px;font-size: 15px;color: #666;}
[msx=tabs] .tabs .tab-item a{color: inherit;}
[msx=tabs] .tabs .tab-item.active{background-color: #2ba3f6;color: #fff;font-weight: bold;}
[msx=tabs] .tabs-main{padding: 12px 0 0 0;}
[msx=tabs] .tabs-main .tabs-main-item{display: none;width: 100%;}
[msx=tabs] .tabs-main .tabs-main-item.active{display: block;}

@keyframes animationPopIn { 0% {-webkit-transform: scale3d(0, 0, 0);transform: scale3d(0.5, 0.5, 0.5);opacity: 0;} 50% {-webkit-animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);} 100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);-webkit-animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);opacity: 1;} }