@charset "utf-8";
/* CSS Document */
html,body{height:100%;}
*{padding:0;margin:0;outline:0;box-sizing: border-box}
*:before, *:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.clearfix:before, .clearfix:after { display: table!important; content: " "!important;}
.clearfix:after{ clear: both!important;}

label{font-weight: normal;margin: 0;}
ol,ul{list-style:none;}
em,strong,b,i{font-style: normal}
dt{font-weight: normal;}
:focus{outline:0;}
table{border-collapse:collapse;border-spacing:0;}
ul,ol,dl,li,dt,dd{padding:0;margin:0;}
cite{font-style: normal;}

.quote{border: 1px solid #eee;border-left-width: 5px;padding: 10px;}
.quote1{border-left: 5px solid #5FB878;background-color:#FAFAFA;padding: 10px;}

.clear{clear: both!important;}
ul,ol,dl{list-style: none!important;}
a{text-decoration:none!important;}

.h{height: 100%!important;}
.ha{height: auto!important;}
.w{width: 100%!important;}
.wa{width: auto!important;}
.vh {height: 100vh!important;}
.vw {width: 100vw!important;}

.wa{width: auto!important;}
.wfit{display:block!important;width: fit-content!important;}

.w1{width: 1px!important;}
.w2{width: 2px!important;}
.w3{width: 3px!important;}

.w200{width: 200px!important;}
.w250{width: 250px!important;}
.w300{width: 300px!important;}
.w400{width: 400px!important;}
.w450{width: 450px!important;}
.w500{width: 500px!important;}
.w550{width: 550px!important;}
.w600{width: 600px!important;}
.w650{width: 650px!important;}
.w700{width: 700px!important;}
.w750{width: 750px!important;}
.w800{width: 800px!important;}
.w850{width: 850px!important;}
.w900{width: 900px!important;}
.w950{width: 950px!important;}
.w1000{width: 1000px!important;}
.w1200{width: 1200px!important;}


.tl{text-align: left!important;}
.tr{text-align: right!important;}
.tc{text-align: center!important;}

.nowrap{white-space:nowrap!important;}

.ovfh{ overflow: hidden!important;}
.ovfxh{ overflow-x: hidden!important;}
.ovfyh{ overflow-y: hidden!important;}

.ovfa{overflow: auto!important;}
.ovfxa{overflow-x: auto!important;}
.ovfya{overflow-y: auto!important;}

.fz10 {font-size: 10px!important;}
.fz12 {font-size: 12px!important;}
.fz14 {font-size: 14px!important;}
.fz16 {font-size: 16px!important;}
.fz18 {font-size: 18px!important;}
.fz20 {font-size: 20px!important;}
.fz22 {font-size: 22px!important;}
.fz24 {font-size: 24px!important;}
.fz26 {font-size: 26px!important;}
.fz28 {font-size: 28px!important;}
.fz30 {font-size: 30px!important;}
.fz32 {font-size: 32px!important;}

.bold{font-weight: bold!important;}
.ls1{letter-spacing:1px!important;}
.ls2{letter-spacing:2px!important;}
.ls3{letter-spacing:3px!important;}
.ls5{letter-spacing:5px!important;}
.ls7{letter-spacing:7px!important;}
.ls9{letter-spacing:8px!important;}

.h1 {height: 1px!important;}
.h2 {height: 2px!important;}
.h3 {height: 3px!important;}
.h4 {height: 4px!important;}
.h5 {height: 5px!important;}
.h6 {height: 6px!important;}
.h7 {height: 7px!important;}
.h8 {height: 8px!important;}
.h9 {height: 9px!important;}
.h10 {height: 10px!important;}
.h11 {height: 11px!important;}
.h12 {height: 12px!important;}
.h13 {height: 13px!important;}
.h14 {height: 14px!important;}
.h15 {height: 15px!important;}
.h16 {height: 16px!important;}
.h18 {height: 18px!important;}
.h20 {height: 20px!important;}
.h22 {height: 22px!important;}
.h24 {height: 24px!important;}
.h25 {height: 25px!important;}
.h26 {height: 26px!important;}
.h28 {height: 28px!important;}
.h30 {height: 30px!important;}
.h32 {height: 32px!important;}
.h36 {height: 36px!important;}
.h40 {height: 40px!important;}
.h45 {height: 45px!important;}
.h48 {height: 48px!important;}
.h50 {height: 50px!important;}
.h55 {height: 55px!important;}
.h60 {height: 60px!important;}
.h65 {height: 65px!important;}
.h70 {height: 70px!important;}
.h75 {height: 75px!important;}
.h80 {height: 80px!important;}
.h85 {height: 85px!important;}
.h90 {height: 90px!important;}
.h95 {height: 95px!important;}
.h100 {height: 100px!important;}
.h105 {height: 105px!important;}
.h110 {height: 110px!important;}
.h115 {height: 115px!important;}
.h120 {height: 120px!important;}
.h125 {height: 125px!important;}
.h130 {height: 130px!important;}
.h135 {height: 135px!important;}
.h140 {height: 140px!important;}
.h145 {height: 145px!important;}
.h150 {height: 150px!important;}
.h155 {height: 155px!important;}
.h160 {height: 160px!important;}
.h165 {height: 165px!important;}
.h170 {height: 170px!important;}
.h175 {height: 175px!important;}
.h180 {height: 180px!important;}
.h185 {height: 185px!important;}
.h190 {height: 190px!important;}
.h195 {height: 195px!important;}
.h200 {height: 200px!important;}
.h250 {height: 250px!important;}
.h300 {height: 300px!important;}
.h400 {height: 400px!important;}
.h450 {height: 450px!important;}
.h500 {height: 500px!important;}
.h550 {height: 550px!important;}
.h600 {height: 600px!important;}
.h650 {height: 650px!important;}
.h700 {height: 700px!important;}
.h750 {height: 750px!important;}
.h800 {height: 800px!important;}
.h850 {height: 850px!important;}
.h900 {height: 900px!important;}
.h950 {height: 950px!important;}
.h1000 {height: 1000px!important;}
.h1200 {height: 1200px!important;}

.lh14 {line-height: 14px!important;}
.lh16 {line-height: 16px!important;}
.lh18 {line-height: 18px!important;}
.lh20 {line-height: 20px!important;}
.lh22 {line-height: 22px!important;}
.lh24 {line-height: 24px!important;}
.lh25 {line-height: 25px!important;}
.lh26 {line-height: 26px!important;}
.lh28 {line-height: 28px!important;}
.lh30 {line-height: 30px!important;}
.lh32 {line-height: 32px!important;}
.lh36 {line-height: 36px!important;}
.lh40 {line-height: 40px!important;}
.lh45 {line-height: 45px!important;}
.lh48 {line-height: 48px!important;}
.lh50 {line-height: 50px!important;}
.lh55 {line-height: 55px!important;}
.lh60 {line-height: 60px!important;}
.lh65 {line-height: 65px!important;}
.lh70 {line-height: 70px!important;}
.lh75 {line-height: 75px!important;}
.lh80 {line-height: 80px!important;}
.lh85 {line-height: 85px!important;}
.lh90 {line-height: 90px!important;}
.lh95 {line-height: 95px!important;}
.lh100 {line-height: 100px!important;}
.lh105 {line-height: 105px!important;}
.lh110 {line-height: 110px!important;}
.lh115 {line-height: 115px!important;}
.lh120 {line-height: 120px!important;}
.lh125 {line-height: 125px!important;}
.lh130 {line-height: 130px!important;}
.lh135 {line-height: 135px!important;}
.lh140 {line-height: 140px!important;}
.lh145 {line-height: 145px!important;}
.lh150 {line-height: 150px!important;}
.lh155 {line-height: 155px!important;}
.lh160 {line-height: 160px!important;}
.lh165 {line-height: 165px!important;}
.lh170 {line-height: 170px!important;}
.lh175 {line-height: 175px!important;}
.lh180 {line-height: 180px!important;}
.lh185 {line-height: 185px!important;}
.lh190 {line-height: 190px!important;}
.lh195 {line-height: 195px!important;}
.lh200 {line-height: 200px!important;}


.rel{position:relative!important;}
.abs{position:absolute!important;}
.fixed{position: fixed!important;}

.m0{margin: 0!important;}
.m5{margin:5px!important;}
.m10{margin:10px!important;}
.m15{margin:15px!important;}
.m20{margin:20px!important;}
.m25{margin:25px!important;}
.m30{margin:30px!important;}
.m35{margin:35px!important;}
.m40{margin:40px!important;}
.m50{margin:50px!important;}
.m80{margin:80px!important;}
.m100{margin:100px!important;}
.m150{margin:150px!important;}
.m200{margin:200px!important;}
.m250{margin:250px!important;}

.cbox{margin-right: auto!important;margin-left: auto!important;}

.mla{margin-left: auto!important;}
.mra{margin-right: auto!important;}
.mta{margin-top: auto!important;}
.mba{margin-bottom: auto!important;}


.mt0{margin-top:0!important;}
.mt3{margin-top:3px!important;}
.mt5{margin-top:5px!important;}
.mt7{margin-top:7px!important;}
.mt10{margin-top:10px!important;}
.mt15{margin-top:15px!important;}
.mt20{margin-top:20px!important;}
.mt25{margin-top:25px!important;}
.mt30{margin-top:30px!important;}
.mt35{margin-top:35px!important;}
.mt40{margin-top:40px!important;}
.mt50{margin-top:40px!important;}
.mt80{margin-top:80px!important;}
.mt100{margin-top:100px!important;}
.mt150{margin-top:150px!important;}
.mt200{margin-top:200px!important;}
.mt250{margin-top:250px!important;}
.mr0{margin-right:0!important;}
.mr3{margin-right:3px!important;}
.mr5{margin-right:5px!important;}
.mr7{margin-right:7px!important;}
.mr10{margin-right:10px!important;}
.mr15{margin-right:15px!important;}
.mr20{margin-right:20px!important;}
.mr25{margin-right:25px!important;}
.mr30{margin-right:30px!important;}
.mr35{margin-right:35px!important;}
.mr40{margin-right:40px!important;}
.mr50{margin-right:50px!important;}
.mr100{margin-right:100px!important;}
.mr150{margin-right:150px!important;}
.mr200{margin-right:200px!important;}
.mr250{margin-right:250px!important;}
.mb0{margin-bottom:0!important;}
.mb3{margin-bottom:3px!important;}
.mb5{margin-bottom:5px!important;}
.mb7{margin-bottom:7px!important;}
.mb10{margin-bottom:10px!important;}
.mb15{margin-bottom:15px!important;}
.mb20{margin-bottom:20px!important;}
.mb25{margin-bottom:25px!important;}
.mb30{margin-bottom:30px!important;}
.mb35{margin-bottom:35px!important;}
.mb40{margin-bottom:40px!important;}
.mb50{margin-bottom:50px!important;}
.mb80{margin-bottom:80px!important;}
.mb100{margin-bottom:100px!important;}
.mb150{margin-bottom:150px!important;}
.mb200{margin-bottom:200px!important;}
.mb250{margin-bottom:250px!important;}
.ml0{margin-left:0!important;}
.ml3{margin-left:3px!important;}
.ml5{margin-left:5px!important;}
.ml7{margin-left:7px!important;}
.ml10{margin-left:10px!important;}
.ml15{margin-left:15px!important;}
.ml20{margin-left:20px!important;}
.ml25{margin-left:25px!important;}
.ml30{margin-left:30px!important;}
.ml35{margin-left:35px!important;}
.ml40{margin-left:40px!important;}
.ml50{margin-left:50px!important;}
.ml80{margin-left:80px!important;}
.ml100{margin-left:100px!important;}
.ml150{margin-left:150px!important;}
.ml200{margin-left:200px!important;}
.ml250{margin-left:250px!important;}


.p0{padding:0!important;}
.p1{padding:1px!important;}
.p5{padding:5px!important;}
.p10{padding:10px!important;}
.p15{padding:15px!important;}
.p20{padding:20px!important;}
.p25{padding:25px!important;}
.p30{padding:30px!important;}
.p35{padding:35px!important;}
.p40{padding:40px!important;}
.p50{padding:50px!important;}
.p80{padding:80px!important;}
.p100{padding:100px!important;}

.pt0{padding-top:0!important;}
.pt1{padding-top:1px!important;}
.pt5{padding-top:5px!important;}
.pt10{padding-top:10px!important;}
.pt15{padding-top:15px!important;}
.pt20{padding-top:20px!important;}
.pt25{padding-top:25px!important;}
.pt30{padding-top:30px!important;}
.pt35{padding-top:35px!important;}
.pt40{padding-top:40px!important;}
.pt50{padding-top:50px!important;}
.pt80{padding-top:80px!important;}
.pt100{padding-top:100px!important;}
.pr0{padding-right:0!important;}
.pr1{padding-right:1px!important;}
.pr5{padding-right:5px!important;}
.pr10{padding-right:10px!important;}
.pr15{padding-right:15px!important;}
.pr20{padding-right:20px!important;}
.pr25{padding-right:25px!important;}
.pr30{padding-right:30px!important;}
.pr35{padding-right:35px!important;}
.pr40{padding-right:40px!important;}
.pr50{padding-right:50px!important;}
.pr80{padding-right:80px!important;}
.pr100{padding-right:100px!important;}
.pb0{padding-bottom:0!important;}
.pb1{padding-bottom:1px!important;}
.pb5{padding-bottom:5px!important;}
.pb10{padding-bottom:10px!important;}
.pb15{padding-bottom:15px!important;}
.pb20{padding-bottom:20px!important;}
.pb25{padding-bottom:25px!important;}
.pb30{padding-bottom:30px!important;}
.pb35{padding-bottom:35px!important;}
.pb40{padding-bottom:40px!important;}
.pb50{padding-bottom:50px!important;}
.pb80{padding-bottom:80px!important;}
.pb100{padding-bottom:100px!important;}
.pl0{padding-left:0!important;}
.pl1{padding-left:1px!important;}
.pl5{padding-left:5px!important;}
.pl10{padding-left:10px!important;}
.pl15{padding-left:15px!important;}
.pl20{padding-left:20px!important;}
.pl25{padding-left:25px!important;}
.pl30{padding-left:30px!important;}
.pl35{padding-left:35px!important;}
.pl40{padding-left:40px!important;}
.pl50{padding-left:50px!important;}
.pl80{padding-left:80px!important;}
.pl100{padding-left:100px!important;}

/*使父子box边界不粘连*/
.bd1t{border:1px solid transparent!important;}
.bt1t{border-top:1px solid transparent!important;}
.br1t{border-right:1px solid transparent!important;}
.bb1t{border-bottom:1px solid transparent!important;}
.bl1t{border-left:1px solid transparent!important;}

.bd1{border:1px solid #393D49!important;}
.bt1{border-top:1px solid #393D49!important;}
.br1{border-right:1px solid #393D49!important;}
.bb1{border-bottom:1px solid #393D49!important;}
.bl1{border-left:1px solid #393D49!important;}

.bd2{border:2px solid #393D49!important;}
.bt2{border-top:2px solid #393D49!important;}
.br2{border-right:2px solid #393D49!important;}
.bb2{border-bottom:2px solid #393D49!important;}
.bl2{border-left:2px solid #393D49!important;}

.bdra3{border-radius: 3px!important;}
.bdra4{border-radius: 4px!important;}
.bdra5{border-radius: 5px!important;}
.bdra6{border-radius: 6px!important;}
.bdra7{border-radius: 7px!important;}
.bdra8{border-radius: 8px!important;}
.bdra9{border-radius: 9px!important;}
.bdra10{border-radius: 10px!important;}
.bdra15{border-radius: 15px!important;}
.bdra20{border-radius: 20px!important;}
.bdra25{border-radius: 25px!important;}
.bdra30{border-radius: 30px!important;}
.bdra35{border-radius: 35px!important;}
.bdra40{border-radius: 40px!important;}
.bdra45{border-radius: 45px!important;}
.bdra50{border-radius: 50px!important;}
.bdra60{border-radius: 60px!important;}
.bdra65{border-radius: 65px!important;}
.bdra75{border-radius: 70px!important;}
.bdra80{border-radius: 80px!important;}
.bdra85{border-radius: 85px!important;}
.bdra90{border-radius: 90px!important;}
.bdra95{border-radius: 95px!important;}
.bdra100{border-radius: 100px!important;}
.bdra120{border-radius: 120px!important;}


.tl{text-align: left!important;}
.tr{text-align: right!important;}
.tc{text-align: center!important;}

.fl{float:left!important;}
.fr{float:right!important;}

.flex{display: flex!important;align-items: flex-start;}/*默认顶端对齐，如果想让项目高度拉伸至与容器一样高，需要条件1.项目不能设置高度,2.容器加上类fys或项目加上类fsys*/
.flexv{display: flex!important;flex-direction: column;}/*默认项目宽度伸至与弹性盒子一样宽，条件是项目不设置宽度*/
.flex.flexw{flex-wrap: wrap;}
.flex>*,.flexv>*{flex-shrink: 0;}
.flex1{flex:1 0 auto!important;}


.flex.fxc{justify-content: center!important;}
/*flex x方向 space btween缩写*/
.flex.fxsb{justify-content: space-between!important;}
.flex.fxsa{justify-content: space-around!important;}
.flex.fxr{justify-content: flex-end!important;}
.flex.fxl{justify-content: flex-start!important;}

.flex.fyc{align-items: center!important;}
.flex.fyb{align-items: flex-end!important;}
.flex.fyt{align-items: flex-start!important;}
.flex.fys{align-items: stretch!important;}

.flex>.fsyc{align-self: center!important;}
.flex>.fsyb{align-self: flex-end!important;}
.flex>.fsyt{align-self: flex-start!important;}
.flex>.fsys{align-self: stretch!important;}

.flexv.fyc{justify-content: center!important;}
.flexv.fysb{justify-content: space-between!important;}
.flexv.fysa{justify-content: space-around!important;}
.flexv.fyb{justify-content: flex-end!important;}
.flexv.fyt{justify-content: flex-start!important;}

.flexv.fxc{align-items: center!important;}
.flexv.fxr{align-items: flex-end!important;}
.flexv.fxl{align-items: flex-start!important;}
.flexv.fxs{align-items: stretch!important;}

.flexv>.fsxc{align-self: center!important;}
.flexv>.fsxr{align-self: flex-end!important;}
.flexv>.fsxl{align-self: flex-start!important;}
/*弹性盒子侧轴为水平,如果其项目没有宽度,则会拉伸至弹性盒子一样的宽,如果侧轴为垂直,如果其项目没有高度,则会拉伸至弹性弹性盒子一样高*/
.flexv>.fsxs{align-self: stretch!important;}


.block{display: block!important;}
.none{display: none!important;}
.inline{display: inline!important;}
.inlineblock{display: inline-block!important;}

.grayfa{color:#FAFAFA!important;}
.grayf2{color:#F2F2F2!important;}
.graye2{color:#e2e2e2!important;}
.grayd2{color:#d2d2d2!important;}
.grayc2{color:#c2c2c2!important;}
.grayee{color:#eeeeee!important;}
.graydd{color:#dddddd!important;}
.graycc{color:#cccccc!important;}
.gray99{color:#999!important;}
.gray66{color:#666!important;}
.gray33{color:#333!important;}


.bggrayfa{background-color:#FAFAFA!important;}
.bggrayf2{background-color:#F2F2F2!important;}
.bggrayee{background-color:#eee!important;}
.bggraye2{background-color:#e2e2e2!important;}
.bggraydd{background-color:#ddd!important;}
.bggrayd2{background-color:#d2d2d2!important;}
.bggraycc{background-color:#ccc!important;}
.bggrayc2{background-color:#c2c2c2!important;}
.bggray66{background-color:#666!important;}
.bggray99{background-color:#999!important;}
.bggray33{background-color:#333!important;}


.red{color:#FF0000!important;}
.red1{color:#FF5722!important;}
.red2{color:#c40000!important;}
.orange{color:#FFB800!important;}
.green{color:#00ff00!important;}
.green1{color:#009688!important;}
.blue{color:#0000ff!important;}
.blue1{color:#01AAED!important;}
.cyan{color:#2F4056!important;}
.black{color:#000!important;}
.black1{color:#393D49!important;}
.white{color:#ffff!important;}
.white1{color:#fafafa!important;}

.bgred{background-color:#c40000!important;}
.bgred1{background-color:#FF5722!important;}
.bgred2{background-color:#c40000!important;}
.bgorange{background-color:#FFB800!important;}
.bggreen{background-color:#00ff00!important;}
.bggreen1{background-color:#009688!important;}
.bgblue{background-color:#0000ff!important;}
.bgblue1{background-color:#01AAED!important;}
.bgcyan{background-color:#2F4056!important;}
.bgblack{background-color:#000!important;}
.bgblack1{background-color:#393D49!important;}
.bgwhite{background-color:#ffff!important;}
.bgwhite1{background-color:#fafafa!important;}

.pointer{cursor:pointer!important;}
.default{cursor:default!important;}

.ellips{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}

/* font-family */
.ffkt{font-family: 楷体!important;}
.ffht{font-family: 黑体!important;}
.ffyh{font-family: "微软雅黑"!important;}

/**
资料补充：
1.如果flex布局容器没设置固定高度，子元素如何撑满flex布局容器呢？
答：flex布局的子元素默认是stretch的，如果不是stretch那么可以设置成stretch，那就好办了，只要设置设置margin-top,margin-bottom配合stretch就实现的height的设置了，注意千万不要直接设置height百分比属性，会冲突的。
答：也可以在flex布局容器的外面再套一层flex布局，因为flex布局子元素默认是stretch的，所以里面的那层flex容器自然有了高度，从而里面那层flex的子元素可以设置height:100%了
2.如果希望绝对定位的父容器没设置高度，那么绝对定位容器如何高度撑满父容器呢？
答：top:0;bottomL:0;再配合margin进行处理，注意top，bottom，height是根据定位父容器计算的
3.如果使得内框架的高度自适应页面内容？
答：onload=iframeAutoFit(this)
*/
