@charset"utf-8";

* {
    -webkit-overflow-scrolling: touch;
}

body{
    overflow-x: hidden;
    font: 14px/1.6 -apple-system-font,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Hiragino Sans GB,Microsoft YaHei UI,Microsoft YaHei,Arial,sans-serif;
}

.relative{
    position: relative;
}

li{
    list-style-type: none;
}

.fl{
    float: left;
}

.fr{
    float: right;
}

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{*+height:1%;}

.pd1 {
    padding: 1%;
}

.red2{
    color: #17337a!important;
}
.pd2 {
    padding: 2%;
}

.pd3 {
    padding: 3%;
}

.flexwrap{
    flex-wrap:wrap;
}

.pd4 {
    padding: 4%;
}

.pd5 {
    padding: 5%;
}

.pd6 {
    padding: 6%;
}

.pd7 {
    padding: 7%;
}

.pd8 {
    padding: 8%;
}

.pd9 {
    padding: 9%;
}

.pd10 {
    padding: 10%;
}

.pl1 {
    padding-left: 1%;
}

.pl2 {
    padding-left: 2%;
}

.pl3 {
    padding-left: 3%;
}

.pl4 {
    padding-left: 4%;
}

.pl5 {
    padding-left: 5%;
}

.pl6 {
    padding-left: 6%;
}

.pl7 {
    padding-left: 7%;
}

.pl8 {
    padding-left: 8%;
}

.pl9 {
    padding-left: 9%;
}

.pl10 {
    padding-left: 10%;
}

.mt1 {
    margin-top: 1%;
}

.mt0{
    margin-top: 0%;
}

.mt2 {
    margin-top: 2%;
}

.mt3 {
    margin-top: 3%;
}

.mt4 {
    margin-top: 4%;
}

.mt5 {
    margin-top: 5%;
}

.mt6 {
    margin-top: 6%;
}

.mt7 {
    margin-top: 7%;
}

.mt8 {
    margin-top: 8%;
}

.mt9 {
    margin-top: 9%;
}

.mt10 {
    margin-top: 10%;
}

.mt11 {
    margin-top: 11%;
}

.mt12 {
    margin-top: 12%;
}

.ml1 {
    margin-left: 1%;
}

.ml2 {
    margin-left: 2%;
}

.ml3 {
    margin-left: 3%;
}

.ml4 {
    margin-left: 4%;
}

.ml5 {
    margin-left: 5%;
}

.ml6 {
    margin-left: 6%;
}

.ml7 {
    margin-left: 7%;
}

.ml8 {
    margin-left: 8%;
}

.ml9 {
    margin-left: 9%;
}

.ml10 {
    margin-left: 10%;
}


.fs20{
    font-size: .20rem;
}
.fs22 {
    font-size: .22rem;
}

.fs23 {
    font-size: .23rem;
}

.fs24 {
    font-size: .24rem;
}

.fs25 {
    font-size: .25rem;
}

.fs26 {
    font-size: .26rem;
}

.fs27 {
    font-size: .27rem;
}

.fs28 {
    font-size: .28rem;
}

.fs29 {
    font-size: .29rem;
}

.fs30 {
    font-size: .3rem;
}

.fs32 {
    font-size: .32rem;
}

.fs34 {
    font-size: .34rem;
}

.fs35 {
    font-size: .35rem;
}

.fs36 {
    font-size: .36rem;
}

.fs38 {
    font-size: .38rem;
}

.fs40 {
    font-size: .4rem;
}


.bolder {
    font-weight: bolder;
}

.bold {
    font-weight: bold;
}

.normal {
    font-weight: normal;
}

.white {
    color: #fff;
}

.whiteBg {
    background: #fff!important;
}

.noBorder {
    border: none !important;
}

.noBorder:after {
    border: none !important;
}

.noBorder:before {
    border: none !important;
}


.img-block {
    display: block;
    width: 100%;
    height: 100%;
}

.ib {
    display: inline-block;
}

.vm {
    vertical-align: middle;
}

.vt {
    vertical-align: top;
}

/*文字溢出*/

.text-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*多行文字*/
.line-clamp-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.line-clamp-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

img {
    width: 100%;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

/*flex布局*/
.flex {
   	display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.rowb {
	-webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
	justify-content: space-between;
    align-items: center;
}

.rowa {
	display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.rowLeft {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    align-items: center;
}

.rowCenter {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    align-items: center;
}

.rowRight {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    align-items: center;
}

.flexWrap {
    flex-wrap: wrap;
}

.gray{
   color: #969696!important;
}

.black{
    color: #000!important;
}

.two-lines {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/*遮罩层*/

.popui__modal-mask {
    background: black;
    opacity: .6;
    pointer-events: auto;
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 888;
    animation: mask-fadeIn .5s;
}

.popui__modal-panel {
    position: relative;
}

.popui__panel-child {
    background: #fff;
    border-radius: 12px;
    display: inline-block;
    pointer-events: auto;
    font-size: .28rem;
    text-align: left;
    width: 70%;
        z-index: 888;
    position: relative;
}

.popui__panel-child2 {
    border-radius: .07rem;
    display: inline-block;
    pointer-events: auto;
    font-size: .28rem;
    text-align: center;
    position: relative;
}

.popui__panel-child2 .box1 {
    position: absolute;
    top: -34%;
}

.popui__panel-section {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    z-index: 9;
}

.popui__panel-main {
    display: table;
    color: #333;
    pointer-events: none;
    height: 100%;
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 888;
}


#foot_area {
    background-color: #fff;
    overflow: hidden;
}

.footer_menu {
    margin-top: 0.5rem;
    padding: 0.14rem 0;
    background-color: #17337a;
    font-size: 0;
}

.footer_menu a {
    display: inline-block;
    width: 1.25rem;
    color: #fff;
    font-size: .28rem;
    line-height: .48rem;
    text-align: center;
    vertical-align: top;
}

.footer_title {
    position: relative;
    margin: 0.5rem 0;
    font-size: .28rem;
    line-height: .30rem;
    color: #c1c1c1;
    text-align: center;
}

.footer_title em {
    position: relative;
    padding: 0 0.3rem;
    background-color: #fff;
}

.footer_title:before {
    position: absolute;
    left: 0;
    top: 50%;
    content: "";
    background-color: #c8c8c8;
    height: 0.01rem;
    overflow: hidden;
    width: 100%;
}
  


/* iphone 5 */
@media screen and (max-width: 320px) {

}
/* iphoneX */
@media screen and (min-width: 375px) and (-webkit-device-pixel-ratio: 3) {

}
/* iphone6 7 8 plus */
@media screen and (min-width: 414px) {

}
/* ipad */
@media screen and (min-width: 768px) {

}
/* ipad pro */
@media screen and (min-width: 1024px) {

}
/* pc */
@media screen and (min-width: 1100px) {

}
