@charset "utf-8";
/**
* Description: Base style
* By: Shenqi
**/

/*display*/
.block { display: block;}
.inline-block { display: inline-block;}
.flex { display: flex;}
.inline-flex { display: inline-flex;}
.table { display: table;}
.table-cell { display: table-cell;}

/*clearfix */
.clearfix:after{content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix{display: inline-block;}
* html .clearfix{height: 1%;}
.clearfix{display: block;}
i,em{font-style: normal;}




/*Float*/
.fl {float: left;}
.fr {float: right;}
.tr {text-align: right;}
.tl {text-align: left;}
.tc {text-align: center;}
.position-r,.relative {position: relative;}
.position-a,.absolute {position: absolute;}
.position-f,.fixed {position: fixed;}
.va{vertical-align: middle;}


.col1{color: #238efa}
.col2{color: #333}
.col3{color: #fff}
.col4{color: #3671f3;}
.col5{color: #999}


/*padding*/
.p0 {padding: 0;}
.p5 {padding: 5px;}
.p10 {padding: 10px;}
.p15 {padding: 15px;}
.p20 {padding: 20px;}
.p25 {padding: 25px;}
.p30 {padding: 30px;}

.pl0 {padding-left: 0;}
.pl5 {padding-left: 5px;}
.pl10 {padding-left: 10px;}
.pl15 {padding-left: 15px;}
.pl20 {padding-left: 20px;}
.pl25 {padding-left: 25px;}
.pl30 {padding-left: 30px;}
.pl35 {padding-left: 35px;}
.pl40 {padding-left: 34px;}
.pl45 {padding-left: 45px;}
.pl50 {padding-left: 50px;}

.pr0 {padding-right: 0;}
.pr5 {padding-right: 5px;}
.pr10 {padding-right: 10px;}
.pr15 {padding-right: 15px;}
.pr20 {padding-right: 20px;}
.pr25 {padding-right: 25px;}
.pr30 {padding-right: 30px;}
.pr35 {padding-right: 35px;}
.pr40 {padding-right: 40px;}
.pr45 {padding-right: 45px;}
.pr50 {padding-right: 50px;}

.pt0 {padding-top: 0;}
.pt2 {padding-top: 2px;}
.pt5 {padding-top: 5px;}
.pt10 {padding-top: 10px;}
.pt15 {padding-top: 15px;}
.pt20 {padding-top: 20px;}
.pt25 {padding-top: 25px;}
.pt30 {padding-top: 30px;}
.pt35 {padding-top: 35px;}
.pt40 {padding-top: 40px;}
.pt45 {padding-top: 45px;}
.pt50 {padding-top: 50px;}

.pb0 {padding-bottom: 0;}
.pb5 {padding-bottom: 5px;}
.pb10 {padding-bottom: 10px;}
.pb15 {padding-bottom: 15px;}
.pb20 {padding-bottom: 20px;}
.pb25 {padding-bottom: 25px;}
.pb30 {padding-bottom: 30px;}
.pb35 {padding-bottom: 35px;}
.pb40 {padding-bottom: 40px;}
.pb45 {padding-bottom: 45px;}
.pb50 {padding-bottom: 50px;}

.p0.important {padding: 0 !important;}
.pt4.important {padding-top: 4px !important;}
.p5.important {padding: 5px !important;}
.p10.important {padding: 10px !important;}
.p15.important {padding: 15px !important;}
.p20.important {padding: 20px !important;}
.p25.important {padding: 25px !important;}
.p30.important {padding: 30px !important;}

.pl0.important {padding-left: 0 !important;}
.pl5.important {padding-left: 5px !important;}
.pl10.important {padding-left: 10px !important;}
.pl15.important {padding-left: 15px !important;}
.pl20.important {padding-left: 20px !important;}
.pl25.important {padding-left: 25px !important;}
.pl30.important {padding-left: 30px !important;}

.pr0.important {padding-right: 0 !important;}
.pr5.important {padding-right: 5px !important;}
.pr10.important {padding-right: 10px !important;}
.pr15.important {padding-right: 15px !important;}
.pr20.important {padding-right: 20px !important;}
.pr25.important {padding-right: 25px !important;}
.pr30.important {padding-right: 30px !important;}

.pt0.important {padding-top: 0 !important;}
.pt5.important {padding-top: 5px !important;}
.pt10.important {padding-top: 10px !important;}
.pt15.important {padding-top: 15px !important;}
.pt20.important {padding-top: 20px !important;}
.pt25.important {padding-top: 25px !important;}
.pt30.important {padding-top: 30px !important;}

.pb0.important {padding-bottom: 0 !important;}
.pb5.important {padding-bottom: 5px !important;}
.pb10.important {padding-bottom: 10px !important;}
.pb15.important {padding-bottom: 15px !important;}
.pb20.important {padding-bottom: 20px !important;}
.pb25.important {padding-bottom: 25px !important;}
.pb30.important {padding-bottom: 30px !important;}

/*margin*/
.margin-auto {margin: auto;}
.margin-auto.important {margin: auto !important;}
.bottom-zero {bottom: 0px}


.m0 {margin: 0;}
.m5 {margin: 5px;}
.m10 {margin: 10px;}
.m15 {margin: 15px;}
.m20 {margin: 20px;}
.m25 {margin: 25px;}
.m30 {margin: 30px;}
.m40 {margin: 40px;}

.ml0 {margin-left: 0;}
.ml5 {margin-left: 5px;}
.ml10 {margin-left: 10px;}
.ml15 {margin-left: 15px;}
.ml20 {margin-left: 20px;}
.ml25 {margin-left: 25px;}
.ml30 {margin-left: 30px;}
.ml40 {margin-left: 40px;}


.mr0 {margin-right: 0;}
.mr5 {margin-right: 5px;}
.mr10 {margin-right: 10px;}
.mr15 {margin-right: 15px;}
.mr20 {margin-right: 20px;}
.mr25 {margin-right: 25px;}
.mr30 {margin-right: 30px;}
.mr40 {margin-right: 40px;}

.mt0 {margin-top: 0;}
.mt5 {margin-top: 5px;}
.mt10 {margin-top: 10px;}
.mt15 {margin-top: 15px;}
.mt20 {margin-top: 20px;}
.mt25 {margin-top: 25px;}
.mt30 {margin-top: 30px;}
.mt35 {margin-top: 35px;}
.mt40 {margin-top: 40px;}
.mt60 {margin-top: 60px;}

.mb0 {margin-bottom: 0;}
.mb5 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px;}
.mb20 {margin-bottom: 20px;}
.mb25 {margin-bottom: 25px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}

.m0.important {margin: 0 !important;}
.m5.important {margin: 5px !important;}
.m10.important {margin: 10px !important;}
.m15.important {margin: 15px !important;}
.m20.important {margin: 20px !important;}
.m25.important {margin: 25px !important;}
.m30.important {margin: 30px !important;}
.m40.important {margin: 40px !important;}

.ml0.important {margin-left: 0 !important;}
.ml5.important {margin-left: 5px !important;}
.ml10.important {margin-left: 10px !important;}
.ml15.important {margin-left: 15px !important;}
.ml20.important {margin-left: 20px !important;}
.ml25.important {margin-left: 25px !important;}
.ml30.important {margin-left: 30px !important;}
.ml40.important {margin-left: 40px !important;}

.mr0.important {margin-right: 0 !important;}
.mr5.important {margin-right: 5px !important;}
.mr10.important {margin-right: 10px !important;}
.mr15.important {margin-right: 15px !important;}
.mr20.important {margin-right: 20px !important;}
.mr25.important {margin-right: 25px !important;}
.mr30.important {margin-right: 30px !important;}
.mr40.important {margin-right: 40px !important;}

.mt0.important {margin-top: 0 !important;}
.mt5.important {margin-top: 5px !important;}
.mt10.important {margin-top: 10px !important;}
.mt15.important {margin-top: 15px !important;}
.mt20.important {margin-top: 20px !important;}
.mt25.important {margin-top: 25px !important;}
.mt30.important {margin-top: 30px !important;}
.mt40.important {margin-top: 40px !important;}

.mb0.important {margin-bottom: 0 !important;}
.mb5.important {margin-bottom: 5px !important;}
.mb10.important {margin-bottom: 10px !important;}
.mb15.important {margin-bottom: 15px !important;}
.mb20.important {margin-bottom: 20px !important;}
.mb25.important {margin-bottom: 25px !important;}
.mb30.important {margin-bottom: 30px !important;}
.mb40.important {margin-bottom: 40px !important;}

/*color*/



/*barground*/
.bg-primary {background: #ff385c;}
.bg-white {background: #fff;}
.bg-black {background: black;}
.bg-error {background: #b61528;}
.bg-ochre {background: #fac572;}
.bg-lightgray {background: #f6f6f6;}
.bg-gray{color: #B5B5B6}
.bg-none {background: none;}
.bg-none .important {background: none !important;}

/*boder*/
.bd {border: solid #f2f2f2 1px;}
.bd-top {border-top: solid #f2f2f2 1px;}
.bd-right {border-right: solid #f2f2f2 1px;}
.bd-bottom {border-bottom: solid #f2f2f2 1px;}
.bd-left {border-left: solid #f2f2f2 1px;}

.bd.important {border: solid #f2f2f2 1px !important;}
.bd-top.important {border-top: solid #f2f2f2 1px !important;}
.bd-right.important {border-right: solid #f2f2f2 1px !important;}
.bd-bottom.important {border-bottom: solid #f2f2f2 1px !important;}
.bd-left.important {border-left: solid #f2f2f2 1px !important;}

.bd-none {border: none;}
.bd-top-none {border-top: none;}
.bd-right-none {border-right: none;}
.bd-bottom-none {border-bottom: none;}
.bd-left-none {border-left: none;}

.bd-none.important {border: none !important;}
.bd-top-none.important {border-top: none !important;}
.bd-right-none.important {border-right: none !important;}
.bd-bottom-none.important {border-bottom: none !important;}
.bd-left-none.important {border-left: none !important;}

/*font*/
.fz-10 {font-size: 10px;}
.fz-11 {font-size: 11px;}
.fz-12 {font-size: 12px;}
.fz-13 {font-size: 13px;}
.fz-14 {font-size: 14px;}
.fz-16 {font-size: 16px;}
.fz-18 {font-size: 18px;}
.fz-20 {font-size: 20px;}
.fz-22 {font-size: 22px;}
.fz-24 {font-size: 24px;}
.fz-26 {font-size: 26px;}
.fz-28 {font-size: 28px;}


.fz-10.important {font-size: 10px !important;}
.fz-11.important {font-size: 11px !important;}
.fz-12.important {font-size: 12px !important;}
.fz-13.important {font-size: 13px !important;}
.fz-14.important {font-size: 14px !important;}
.fz-16.important {font-size: 16px !important;}
.fz-18.important {font-size: 18px !important;}
.fz-20.important {font-size: 20px !important;}
.fz-22.important {font-size: 22px !important;}
.fz-24.important {font-size: 24px !important;}
.fz-26.important {font-size: 26px !important;}
.fz-28.important {font-size: 28px !important;}

.fw-3.important {font-weight: 300 !important;}
.fw-4.important {font-weight: 400 !important;}
.fw-5.important {font-weight: 500 !important;}
.fw-6.important {font-weight: 600 !important;}
.fw-7.important {font-weight: 700 !important;}
.fb{font-weight: bold;}

/*width*/
.col-5 {-webkit-box-flex: 0; -webkit-flex: 0 0 5%; -moz-box-flex: 0; -moz-flex: 0 0 5%; -ms-flex: 0 0 5%; flex: 0 0 5%; max-width: 5%;}
/* .col-10 {-webkit-box-flex: 0; -webkit-flex: 0 0 10%; -moz-box-flex: 0; -moz-flex: 0 0 10%; -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%;} */
.col-15 {-webkit-box-flex: 0; -webkit-flex: 0 0 15%; -moz-box-flex: 0; -moz-flex: 0 0 15%; -ms-flex: 0 0 15%; flex: 0 0 15%; max-width: 15%;}
.col-20 {-webkit-box-flex: 0; -webkit-flex: 0 0 20%; -moz-box-flex: 0; -moz-flex: 0 0 20%; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-25 {-webkit-box-flex: 0; -webkit-flex: 0 0 25%; -moz-box-flex: 0; -moz-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-28 {-webkit-box-flex: 0; -webkit-flex: 0 0 28%; -moz-box-flex: 0; -moz-flex: 0 0 28%; -ms-flex: 0 0 28%; flex: 0 0 28%; max-width: 28%;}
.col-30 {-webkit-box-flex: 0; -webkit-flex: 0 0 30%; -moz-box-flex: 0; -moz-flex: 0 0 30%; -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%;}
.col-33 {-webkit-box-flex: 0; -webkit-flex: 0 0 33%; -moz-box-flex: 0; -moz-flex: 0 0 33%; -ms-flex: 0 0 33%; flex: 0 0 33%; max-width: 33%;}
.col-35 {-webkit-box-flex: 0; -webkit-flex: 0 0 35%; -moz-box-flex: 0; -moz-flex: 0 0 35%; -ms-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%;}
.col-40 {-webkit-box-flex: 0; -webkit-flex: 0 0 40%; -moz-box-flex: 0; -moz-flex: 0 0 40%; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
.col-45 {-webkit-box-flex: 0; -webkit-flex: 0 0 45%; -moz-box-flex: 0; -moz-flex: 0 0 45%; -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%;}
.col-49 {-webkit-box-flex: 0; -webkit-flex: 0 0 49%; -moz-box-flex: 0; -moz-flex: 0 0 49%; -ms-flex: 0 0 49%; flex: 0 0 49%; max-width: 49%;}
.col-50 {-webkit-box-flex: 0; -webkit-flex: 0 0 50%; -moz-box-flex: 0; -moz-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-55 {-webkit-box-flex: 0; -webkit-flex: 0 0 55%; -moz-box-flex: 0; -moz-flex: 0 0 55%; -ms-flex: 0 0 55%; flex: 0 0 55%; max-width: 55%;}
.col-60 {-webkit-box-flex: 0; -webkit-flex: 0 0 60%; -moz-box-flex: 0; -moz-flex: 0 0 60%; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%;}
.col-65 {-webkit-box-flex: 0; -webkit-flex: 0 0 65%; -moz-box-flex: 0; -moz-flex: 0 0 65%; -ms-flex: 0 0 65%; flex: 0 0 65%; max-width: 65%;}
.col-70 {-webkit-box-flex: 0; -webkit-flex: 0 0 70%; -moz-box-flex: 0; -moz-flex: 0 0 70%; -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%;}
.col-72 {-webkit-box-flex: 0; -webkit-flex: 0 0 72%; -moz-box-flex: 0; -moz-flex: 0 0 72%; -ms-flex: 0 0 72%; flex: 0 0 72%; max-width: 72%;}
.col-85 {-webkit-box-flex: 0; -webkit-flex: 0 0 85%; -moz-box-flex: 0; -moz-flex: 0 0 85%; -ms-flex: 0 0 85%; flex: 0 0 85%; max-width: 85%;}
.col-90 {-webkit-box-flex: 0; -webkit-flex: 0 0 90%; -moz-box-flex: 0; -moz-flex: 0 0 90%; -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%;}
.col-95 {-webkit-box-flex: 0; -webkit-flex: 0 0 95%; -moz-box-flex: 0; -moz-flex: 0 0 95%; -ms-flex: 0 0 95%; flex: 0 0 95%; max-width: 95%;}
.col-100 {-webkit-box-flex: 0; -webkit-flex: 0 0 100%; -moz-box-flex: 0; -moz-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}


.w100{width: 100%;}
.h100{height: 100%;}
.lh25{line-height:25px;}
.wp{letter-spacing:1px;}