@charset "utf-8";

/* 基础样式 */

/* reset */
/* * { box-sizing: border-box; -webkit-tap-highlight-color: transparent;} */
* { -webkit-tap-highlight-color: transparent;}
body, p, h1, h2, h3, h4, h5, h6, ul, li, ol, dl, dt, dd { margin: 0; padding: 0; }
body { font: 16px/1.6 normal Helvetica; color: #333; background-color: #fff; }
a { color: #333; text-decoration: none; }
ul, li, ol, li { list-style: none; }
img, a img { border: none; }

/* color & backgroundColor */
.color-default { color: #333 !important; }
.color-white { color: #fff !important; }
.color-black { color: #000 !important; }
.color-gray { color: #8e8e8e !important; }
.color-muted { color: #666 !important; }
.color-red { color: #a63533 !important; }
.color-yellow { color: #f3d636 !important; }
.color-orange { color: #fa6220 !important; }
.color-purple { color: #e322cb !important; }
.color-blue { color: #38ade9 !important; }
.bgc-white { background-color: #fff !important; }
.bgc-black { background-color: #000 !important; }
.bgc-light { background-color: #f8f8f8 !important; }
.bgc-red { background-color: #f6496a !important; }
.bgc-yellow { background-color: #f3d636 !important; }
.bgc-orange { background-color: #fa6220 !important; }
.bgc-purple { background-color: #e322cb !important; }
.bgc-blue { background-color: #38ade9 !important; }
.font-bold{font-weight: bold}
/* border */
.bd-solid { border: 1px solid #eee !important; }
.bdtb-solid { border-top: 1px solid #eee !important; border-bottom: 1px solid #eee !important; }
.bdt-solid { border-top: 1px solid #eee !important; }
.bdr-solid { border-right: 1px solid #eee !important; }
.bdb-solid { border-bottom: 1px solid #eee !important; }
.bdl-solid { border-left: 1px solid #eee !important; }

/* fontSize */
.font-0 { font-size: 0 !important; }
.font-10 { font-size: 10px !important; }
.font-sm { font-size: 12px !important; }
.font-md { font-size: 14px !important; }
.font-15 { font-size: 15px !important; }
.font-16 { font-size: 16px !important; }
.font-big { font-size: 18px !important; }
.font-lg { font-size: 24px !important; }
.font-huge { font-size: 37px !important; }

/* lineheight */
.lh-sm{ line-height: 1 !important; }
.lh-md{ line-height: 1.6 !important; }
.lh-big{ line-height: 2 !important; }
.lh-lg{ line-height: 2.4 !important; }
.lh-huge{ line-height: 2.8 !important; }
.lh-32px{ line-height: 32px !important; }

/* textAlign  & vertical & foat*/
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.ver-top { vertical-align: top !important; }
.ver-middle { vertical-align: middle !important; }
.ver-bottom { vertical-align: bottom !important; }
.float-left { float: left !important; }
.float-right { float: right !important; }
.cf:before, .cf:after,.clearfix:before, .clearfix:after{ content: ""; display: table; clear: both; }

/* others */
.hide { display: none; }
.over-hide { overflow: hidden !important; }
.over-auto { overflow: auto !important; }
.rel { position: relative !important; }
.in-block { display: inline-block !important; }
.block { display: block !important; }
.text-over { overflow: hidden; -ms-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; }
.text-over2 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;text-align: justify;}
.opacity-0 { opacity: 0;}

.radius-15 { -webkit-border-radius: 15px !important; -moz-border-radius: 15px !important; border-radius: 15px !important;}

/* margin */
.mg-0 { margin: 0 !important; }
.mg-sm { margin: 5px !important; }
.mg-md { margin: 10px !important; }
.mg-big { margin: 15px !important; }
.mg-lg { margin: 20px !important; }
.mg-huge { margin: 50px !important; }
.mgt-0 { margin-top: 0 !important; }
.mgt-sm { margin-top: 5px !important; }
.mgt-md { margin-top: 10px !important; }
.mgt-big { margin-top: 15px !important; }
.mgt-lg { margin-top: 20px !important; }
.mgt-huge { margin-top: 50px !important; }
.mgr-0 { margin-right: 0 !important; }
.mgr-sm { margin-right: 5px !important; }
.mgr-md { margin-right: 10px !important; }
.mgr-big { margin-right: 15px !important; }
.mgr-lg { margin-right: 20px !important; }
.mgr-30 { margin-right: 30px !important; }
.mgr-huge { margin-right: 50px !important; }
.mgb-0 { margin-bottom: 0 !important; }
.mgb-sm { margin-bottom: 5px !important; }
.mgb-md { margin-bottom: 10px !important; }
.mgb-big { margin-bottom: 15px !important; }
.mgb-lg { margin-bottom: 20px !important; }
.mgb-30 { margin-bottom: 30px !important; }
.mgb-huge { margin-bottom: 50px !important; }
.mgl-0 { margin-left: 0 !important; }
.mgl-sm { margin-left: 5px !important; }
.mgl-md { margin-left: 10px !important; }
.mgl-big { margin-left: 15px !important; }
.mgl-lg { margin-left: 20px !important; }
.mgl-huge { margin-left: 50px !important; }

/* padding */
.pd-0 { padding: 0 !important; }
.pd-sm { padding: 5px !important; }
.pd-md { padding: 10px !important; }
.pd-big { padding: 15px !important; }
.pd-lg { padding: 20px !important; }
.pd-huge { padding: 50px !important; }
.pdt-0 { padding-top: 0 !important; }
.pdt-sm { padding-top: 5px !important; }
.pdt-md { padding-top: 10px !important; }
.pdt-big { padding-top: 15px !important; }
.pdt-lg { padding-top: 20px !important; }
.pdt-huge { padding-top: 50px !important; }
.pdr-0 { padding-right: 0 !important; }
.pdr-sm { padding-right: 5px !important; }
.pdr-md { padding-right: 10px !important; }
.pdr-big { padding-right: 15px !important; }
.pdr-lg { padding-right: 20px !important; }
.pdr-huge { padding-right: 50px !important; }
.pdb-0 { padding-bottom: 0 !important; }
.pdb-sm { padding-bottom: 5px !important; }
.pdb-md { padding-bottom: 10px !important; }
.pdb-big { padding-bottom: 15px !important; }
.pdb-lg { padding-bottom: 20px !important; }
.pdb-huge { padding-bottom: 50px !important; }
.pdl-0 { padding-left: 0 !important; }
.pdl-sm { padding-left: 5px !important; }
.pdl-md { padding-left: 10px !important; }
.pdl-big { padding-left: 15px !important; }
.pdl-lg { padding-left: 20px !important; }
.pdl-huge { padding-left: 50px !important; }

/*ui-row*/
.pub-row { display: block; }
.pub-row:before, .pub-row:after { content: ""; display: table; clear: both; }
.pub-row>[class^="col-"] { display: block; float: left; min-height: 1px; }
.col-1 { width: 8.33333333%; }
.col-2 { width: 16.66666667%; }
.col-3 { width: 25%; }
.col-4 { width: 33.33333333%; }
.col-5 { width: 41.66666667%; }
.col-6 { width: 50%; }
.col-7 { width: 58.33333333%; }
.col-8 { width: 66.66666667%; }
.col-9 { width: 75%; }
.col-10 { width: 83.33333333%; }
.col-11 { width: 91.66666667%; }
.col-12 { width: 100%; }
/* 设置滚动条的样式 */
::-webkit-scrollbar {
    width: 8px;
    background: #F3F3F3;
    border-radius: 10px;
}

/* 滚动槽 */
::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #D6D6D6;
}
