/*
 * desc：公共样式，
 * author：zcc
 * date：20210908
 */

 .h100{ height:100%; }
 ul,ol{padding-left:0; list-style-type:none; }
 a img{border:0;}

 /* Backgrounds */
 .bg-navy { background-color: #001f3f; }
 .bg-blue { background-color: #0074d9; }
 .bg-aqua { background-color: #7fdbff; }
 .bg-teal { background-color: #39cccc; }
 .bg-olive { background-color: #3d9970; }
 .bg-green { background-color: #2ecc40; }
 .bg-lime { background-color: #01ff70; }
 .bg-yellow { background-color: #ffdc00; }
 .bg-orange { background-color: #ff851b; }
 .bg-red { background-color: #ff4136; }
 .bg-fuchsia { background-color: #f012be; }
 .bg-purple { background-color: #b10dc9; }
 .bg-maroon { background-color: #85144b; }
 .bg-white { background-color: #ffffff; }
 .bg-gray { background-color: #aaaaaa; }
 .bg-silver { background-color: #dddddd; }
 .bg-black { background-color: #111111; }


 /* Colors */
 .navy { color: #001f3f; }
 .blue { color: #0074d9; }
 .aqua { color: #7fdbff; }
 .teal { color: #39cccc; }
 .olive { color: #3d9970; }
 .green { color: #2ecc40; }
 .lime { color: #01ff70; }
 .yellow { color: #ffdc00; }
 .orange { color: #ff851b; }
 .red { color: #C30D23; }
 .fuchsia { color: #f012be; }
 .purple { color: #b10dc9; }
 .maroon { color: #85144b; }
 .white { color: #ffffff; }
 .silver { color: #dddddd; }
 .gray { color: #aaaaaa; }
 .black { color: #111111; }

 /*!
 * by zhangxinxu(.com) 2010-?
 * base on [https://github.com/zhangxinxu/zxx.lib.css]
 */

 /* ---------------------single CSS----------------------- */
 /* display */
 .dn { display: none; }
 .di { display: inline; }
 .db { display: block; }
 .df { display: flex; }
 .dib { display: inline-block; } /* if the element is block level(eg. div, li), using 'inline-any' instead */
 .df {display: flex;}
 .flex-row{flex-direction: row}
 .flex-row-reverse{flex-direction: row-reverse}
 .flex-column{flex-direction: column}
 .flex-column-reverse{flex-direction: column-reverse}

 .justify-start{justify-content: flex-start}
 .justify-end{justify-content: flex-end}
 .justify-center{justify-content: center}
 .justify-space-between{justify-content: space-between}
 .justify-space-around{justify-content: space-around}

 .align-start{ align-items: flex-start}
 .align-end{ align-items: flex-end}
 .align-center{align-items: center}
 .align-baseline{align-items: baseline}
 .align-stretch{align-items: stretch}

 .align-content-start{ align-content: flex-start}
 .align-content-end{ align-content: flex-end}
 .align-content-center{align-content: center}
 .align-content-sb{align-content: space-between;}
 .align-content-sa{align-content: space-around;}
 .align-content-stretch{align-content: stretch}

 .flex-nowrap{flex-wrap: nowrap}
 .flex-wrap{flex-wrap: wrap}
 .flex-wrap-reverse{flex-wrap: wrap-reverse}

 /* percent width value */
 .pct10 { width: 10%; }
 .pct15 { width: 15%; }
 .pct20 { width: 20%; }
 .pct25 { width: 25%; }
 .pct30 { width: 30%; }
 .pct33 { width: 33.3%; }
 .pct40 { width: 40%; }
 .pct50 { width: 50%; }
 .pct60 { width: 60%; }
 .pct66 { width: 66.6%; }
 .pct70 { width: 70%; }
 .pct75 { width: 75%; }
 .pct80 { width: 80%; }
 .pct85 { width: 85%; }
 .pct90 { width: 90%; }
 .pct95 { width: 95%; }
 .pct100 { width: 100%; }
 /* line-height */
 .lh0 { line-height:0; }
 .lh14 { line-height: 14px; }
 .lh16 { line-height: 16px; }
 .lh18 { line-height: 18px; }
 .lh20 { line-height: 20px; }
 .lh22 { line-height: 22px; }
 .lh24 { line-height: 24px; }
 /* margin */
 .m0 { margin: 0; }
 .ml1 { margin-left: 1px; }
 .ml2 { margin-left: 2px; }
 .ml5 { margin-left: 5px; }
 .ml10 { margin-left: 10px; }
 .ml15 { margin-left: 15px; }
 .ml20 { margin-left: 20px; }
 .ml30 { margin-left: 30px; }
 .ml40{margin-left: 40px;}
 .mr1 { margin-right: 1px; }
 .mr2 { margin-right: 2px; }
 .mr5 { margin-right: 5px; }
 .mr10 { margin-right: 10px; }
 .mr15 { margin-right: 15px; }
 .mr20 { margin-right: 20px; }
 .mr30 { margin-right: 30px; }
 .mr40 { margin-right: 40px; }
 .mr45 { margin-right: 45px; }
 .mr50 { margin-right: 50px; }
 .mt1 { margin-top: 1px; }
 .mt2 { margin-top: 2px; }
 .mt5 { margin-top: 5px; }
 .mt10 { margin-top: 10px; }
 .mt15 { margin-top: 15px; }
 .mt20 { margin-top: 20px; }
 .mt30 { margin-top: 30px; }
 .mb1 { margin-bottom: 1px; }
 .mb2 { margin-bottom: 2px; }
 .mb5 { margin-bottom: 5px; }
 .mb10 { margin-bottom: 10px; }
 .mb15 { margin-bottom: 15px; }
 .mb20 { margin-bottom: 20px; }
 .mb30 { margin-bottom: 30px; }
 /* margin negative */
 .ml-1 { margin-left: -1px; }
 .mr-1 { margin-right: -1px; }
 .mt-1 { margin-top: -1px; }
 .mb-1 { margin-bottom: -1px; }
 .ml-3 { margin-left: -3px; }
 .mr-3 { margin-right: -3px; }
 .mt-3 { margin-top: -3px; }
 .mb-3 { margin-bottom: -3px; }
 .ml-20 { margin-left: -20px; }
 .mr-20 { margin-right: -20px; }
 .mt-20 { margin-top: -20px; }
 .mb-20 { margin-bottom: -20px; }
 /* padding */
 .p0 { padding: 0; }
 .p1 { padding: 1px; }
 .pl1 { padding-left: 1px; }
 .pt1 { padding-top: 1px; }
 .pr1 { padding-right: 1px; }
 .pb1 { padding-bottom: 1px; }
 .p2 { padding: 2px; }
 .pl2 { padding-left: 2px; }
 .pt2 { padding-top: 2px; }
 .pr2 { padding-right: 2px; }
 .pb2 { padding-bottom: 2px; }
 .pl5 { padding-left: 5px; }
 .p5 { padding: 5px; }
 .pt5 { padding-top: 5px; }
 .pr5 { padding-right: 5px; }
 .pb5 { padding-bottom: 5px; }
 .p10 { padding: 10px; }
 .pl10 { padding-left: 10px; }
 .pt10 { padding-top: 10px; }
 .pr10 { padding-right: 10px; }
 .pb10 { padding-bottom: 10px; }
 .p15 { padding: 15px; }
 .pl15 { padding-left: 15px; }
 .pt15 { padding-top: 15px; }
 .pr15 { padding-right: 15px; }
 .pb15 { padding-bottom: 15px; }
 .p20 { padding: 20px; }
 .pl20 { padding-left: 20px; }
 .pt20 { padding-top: 20px; }
 .pr20 { padding-right: 20px; }
 .pb20 { padding-bottom: 20px; }
 .p25 { padding: 25px; }
 .pl25 { padding-left: 25px; }
 .pt25 { padding-top: 25px; }
 .pr25 { padding-right: 25px; }
 .pb25 { padding-bottom: 25px; }
 .p30 { padding: 30px; }
 .pl30 { padding-left: 30px; }
 .pt30 { padding-top: 30px; }
 .pr30 { padding-right: 30px; }
 .pb30 { padding-bottom: 30px; }
 /* border-color name rule:  border(b)-position(l/r/t/b/d)-width(null/2)-style(null/sh)-color(first one letter/first two letter) |-> All colors are safe color*/
 .bdc { border: 1px solid #ccc; }
 .blc { border-left: 1px solid #ccc; }
 .brc { border-right: 1px solid #ccc; }
 .btc { border-top: 1px solid #ccc; }
 .bbc { border-bottom: 1px solid #ccc; }
 .bdd { border: 1px solid #ddd; }
 .bld { border-left: 1px solid #ddd; }
 .brd { border-right: 1px solid #ddd; }
 .btd { border-top: 1px solid #ddd; }
 .bbd { border-bottom: 1px solid #ddd; }
 .bde { border: 1px solid #eee; }
 .ble { border-left: 1px solid #eee; }
 .bre { border-right: 1px solid #eee; }
 .bte { border-top: 1px solid #eee; }
 .bbe { border-bottom: 1px solid #eee; }
 /* background-color name rule:  bg - (key word/Hex color) |-> All colors are safe color */
 .bgfb { background-color: #fbfbfb; }
 .bgf5 {/* background-color: #f5f5f5; */}
 .bgf0 { background-color: #f0f0f0; }
 .bgeb { background-color: #ebebeb; }
 .bge0 { background-color: #e0e0e0; }
 /* safe color */
 .g0 { color: #000; }
 .g3 { color: #333; }
 .g6 { color: #666; }
 .g9 { color: #999; }
 .gc { color: #ccc; }
 /* font-size */
 .f0 { font-size: 0; }
 .f10 { font-size: 10px; }
 .f12 { font-size: 12px; }
 .f13 { font-size: 13px; }
 .f14 { font-size: 14px; }
 .f16 { font-size: 16px; }
 .f15 { font-size: 15px; }
 .f18 { font-size: 18px; }
 .f20 { font-size: 20px; }
 .f22 { font-size: 22px; }
 .f24 { font-size: 24px; }
 .f28 { font-size: 28px; }
 .f30 { font-size: 30px; }
 .f32 { font-size: 32px; }
 .f34 { font-size: 34px; }
 .f36 { font-size: 36px; }


 /*m fonts, add extra .inf class to parent to enlarge without limits*/

 .f050{font-size:50%}
 .f055{font-size:55%}
 .f060{font-size:60%;}
 .f065{font-size:65%}
 .f070{font-size:70%}
 .f075{font-size:75%}
 .f080{font-size:80%}
 .f085{font-size:85%}
 .f090{font-size:90%}
 .f100{font-size:100% !important}
 .f110{font-size:110%}
 .f120{font-size:120%}
 .f130{font-size:130%}
 .f140{font-size:140%}
 .f150{font-size:150%}
 .f175{font-size:175%}
 .f200{font-size:200%}
 /* font-style */
 .n { font-weight: normal; font-style: normal; }
 .b { font-weight: bold; }
 .i { font-style: italic; }
 /* text-align */
 .tc { text-align: center; }
 .tr { text-align: right; }
 .tl { text-align: left; }
 .tj { text-align: justify; }
 /* text-decoration */
 .tdl { text-decoration: underline; }
 .tdn, .tdn:hover, .tdn a:hover, a.tdl:hover { text-decoration: none; }
 /* letter-spacing */
 .lt-1 { letter-spacing: -1px; }
 .lt0 { letter-spacing: 0; }
 .lt1 { letter-spacing: 1px; }
 /* white-space */
 .nowrap { white-space: nowrap; }
 /* word-wrap */
 .bk { word-wrap: break-word; }
 /* vertical-align */
 .vm { vertical-align: middle; }
 .vtb { vertical-align: text-bottom; }
 .vb { vertical-align: bottom; }
 .vt { vertical-align: top; }
 .vn { vertical-align: -2px; }
 /* float */
 .l { float: left; }
 .r { float: right; }
 /* clear */
 .cl { clear: both; }
 .clPar:before{
   content:"";
   display: table;
 }
 .clPar:after{
   content:"";
   display: block;
   clear: both;
 }
 /* position */
 .rel { position: relative; }
 .abs { position: absolute; }
 /*z-index*/
 .zx1 { z-index: 1; }
 .zx2 { z-index: 2; }
 /* cursor */
 .poi { cursor: pointer; }
 .def { cursor: default; }
 /* overflow */
 .ovh { overflow: hidden; }
 .ova { overflow: auto; }
 /* visibility */
 .vh { visibility: hidden; }
 .vv { visibility: visible; }
 /* zoom */
 .z { *zoom: 1; }

 /* ------------------- multiply CSS ------------------ */
 /* 块状元素水平居中 */
 .auto { margin-left: auto; margin-right: auto; }

 /*倒角*/
 .radio-2{ border-radius:2px; }
 .radio-3{ border-radius:3px; }
 .radio-4{ border-radius:4px; }
 .radio-5{ border-radius:5px; }
 .radio-6{ border-radius:6px; }
 .radio-7{ border-radius:7px; }
 .radio-8{ border-radius:8px; }
 .radio-9{ border-radius:9px; }
 .radio-10{ border-radius:10px; }
 .radio-11{ border-radius:11px; }
 .radio-12{ border-radius:12px; }
 .radio-13{ border-radius:13px; }
 .radio-14{ border-radius:14px; }
 .radio-15{ border-radius:15px; }
 .radio-20{ border-radius:20px; }
 .radio-half{ border-radius:50%; }
 .radio-o{ border-radius:100%; }

 .divider{
  width: 100%;
  height: 1px;
  background: #D4D4D4;
  margin: 24px 0;
 }
 .divider.vertical{
  width: 1px;
  height: 100%;
  background: #D4D4D4;
  margin: 0 24px;
 }