@charset "UTF-8";
* {
    margin: 0;
    padding: 0;
}
body{
    position: relative;
    /*width: 7.5rem;*/
    margin: auto;
    background: #f9f2eb;
    font-family: 'PingFang SC', 'Lantinghei SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', STHeitiSC-Light, simsun, 'WenQuanYi Zen Hei', 'WenQuanYi Micro Hei', sans-serif;
    font-size: .28rem;
}
html{
    background: #f9f2eb;
}
.tF{
    text-indent: -999em;
    display: block;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset, img {
    border: 0;
}

address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: normal;
}

ol, ul, li {
    list-style: none;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal;
}

q:before, q:after {
    content: '';
}

textarea, select {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    -webkit-appearance: none;
}

textarea, select {
    *font-size: 100%;
}

a {
    text-decoration: none;
}

a, .answer-list li {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

* {
    outline: none;
    -webkit-touch-callout: none;
}

/*img{display: block;width: 100%;height: auto;}*/
.hide {
    display: none;
}

.g-fl {
    float: left;
}

.g-fr {
    float: right;
}

.flex {
    display: flex;
    flex-flow: row inwrap;
    justify-content: flex-start;
    /*default value*/
}

.flex.spb {
    justify-content: space-between;
}
.flex.center{
    align-items: center;
}
.c:before, .c:after {
    content: "";
    display: table;
}

.c:after {
    clear: both;
}

.c {
    zoom: 1;
}

.head_bg{
    width: 100%;
    height: 107px;
    background: url(https://qm.bumingju.com/assets/img/ds_bg.jpg);
    line-height: 107px;
    box-shadow: 0 5px 5px -5px #2d2d2d;
}

.logo_nav{
    margin: auto;
    padding: 0 30px;
}
.logo_nav > a{
    display: flex;
    align-items: center;
}
.logo_nav a img{
    display: block;
	height: 89px;
}
.hmb_nav{
    display: flex;
}
.hmb_nav a{
    font-size: .6rem;
    color: #333;
    margin-left: 10px;
    padding-right: 28px;
}
.hmb_nav a:last-child{
    border-right: 0;
}
.hmb_banner{
    width: 100%;
    background: #f9f2eb;
    display: block;
    margin: auto;
    overflow: hidden;
}
.hmb_banner img{
    display: block;
    margin: auto;
}
.form_bbqm,.result_name{
    width: 750px;
    border-radius: 10px;
    background: #fff;
    padding: 0.8rem .54rem;
    margin: .55rem auto 0;
    box-sizing: border-box;
    overflow: hidden;
    box-shadow: 2px 3px 10px -1px #e5e5e5;
}

.form_bbqm .item_input{
    border: 1px solid #f6debf;
    height: 1rem;
    background: #fcf9f5;
    margin: 0 0 .3rem 0;
    box-sizing: border-box;
    border-radius: .1rem;
    position: relative;
}
.form_bbqm .item_input.active{
    border: 1px solid #eeaa4f;
}
.form_bbqm .item_input .input_txt{
    font-size: .4rem;
    color: #141616;
    display: block;
    font-style: initial;
    padding-left: .3rem;
}
.form_bbqm .item_input input{
    border: 0;
    color: #b7b8b8;
    background: none;
    font-size: .4rem;
    height: 100%;
    flex: 1;
    box-sizing: border-box;
}

.sex_select {
    position: absolute;
    right: 0.3rem;
    top: 0.33rem;
    font-size: 0;
}
.sex_select span.active {
    background: #a93121;
    color: #ffffff;
}
.sex_select span {
    width: 0.52rem;
    height: 0.52rem;
    display: inline-block;
    background: #e1e1e1;
    font-size: .3rem;
    text-align: center;
    line-height: .52rem;
    margin-left: 0.2rem;
    cursor: pointer;
    color: #666666;
    border-radius: 50%;
}
.item_input .r_jt{
    width: .3rem;
    height: .23rem;
    background: url(../images/sj_img.png) no-repeat center;
    background-size: .3rem auto;
    margin-right: .2rem;
}

.submit_btn button,.submit_btn a{
    flex: 1;
    height: 1rem;
    border-radius: .1rem;
    font-size: .45rem;
    text-align: center;
    line-height: 1rem;
    letter-spacing: 2px;
}
.submit_btn button{
    height: 1rem;
    background: #fdc682;
    color: #a06823;
    border: 0;
    margin-right: .2rem;
    cursor: pointer;
}
.submit_btn a{
    background: #b73422;
    color: #fff;
}
.result_name{
    margin-top: .5rem;
    box-shadow: 2px 3px 10px -1px #e5e5e5;
}

/* 重置地区选择颜色 */
#PoPy{ position: fixed !important; top: 0 !important; left: 0 !important; right: 0; bottom: 0; width: auto !important; background: rgba(0,0,0,.5) !important; }
#PoPy ._citys{ position: absolute; left: 0; right: 0; bottom: 0; width: auto; border: 0; padding: 0; max-width: 750px; margin-left: auto; margin-right: auto; -webkit-overflow-scrolling: touch; background: #ffffff}
#PoPy ._citys span{ font-family: '宋体'; height: .4rem; width: .4rem; line-height: .4rem; font-size: .6rem; color: #5c5c5c !important; border: 0; padding-top: .26rem; position: absolute; left: 0.1rem; top: 0; z-index: 1; }
#PoPy ._citys1 { padding: 0; height: 6.4rem; padding-bottom: 4%; overflow-y: auto; -webkit-display: flex; -moz-display: flex; display: flex; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-content: flex-start; -moz-align-content: flex-start; align-content: flex-start; }
#PoPy ._citys1 a{ border: 1px solid #98989f; border-radius: .04rem; background: #fff; color: #222; font-size: .28rem; text-align: center; height: .6rem; overflow: hidden; line-height: .6rem; margin: 4% 0 0 4%; width: 28%; box-sizing: border-box; }
#PoPy .AreaS{ border-color: #f00!important; color: #f00!important; background: none!important; position: relative; }
#PoPy .AreaS::after,#PoPy .AreaS::before{ content: ''; position: absolute; }
#PoPy .AreaS::before{ width: 0; height: 0; right: -.1rem; bottom: -.1rem; border: .1rem solid transparent; border-left-color: #f00; transform: rotate(45deg); }
#PoPy .AreaS::after{ right: .02rem; bottom: .02rem; width: .02rem; height: .06rem; border: .01rem solid transparent; border-right-color: #fff; border-bottom-color: #fff; transform: rotate(45deg); }
#PoPy ._citys0{ border-bottom: 0 !important; vertical-align: top; font-size: 0; height: auto; padding-top: .78rem; display: flex; text-align: center}
#PoPy ._citys0::after{ content: '选择出生地点'; position: absolute; top: .16rem; left: 0; right: 0; line-height: .4rem; text-align: center; font-size: .36rem; color: #000; }
#PoPy ._citys0 li{ width: 33.333333%; border-bottom: 1px solid #f8f8f8; padding: 1px 0; color: #585c64; font-size: .28rem; line-height: .8rem; }
#PoPy ._citys0 .citySel { border-bottom: 2px solid #b73422 !important; color: #b73422 !important; background: none !important; padding-bottom: 0 !important; }

.result_name h3{
    font-size: .6rem;
    text-align: center;
}

.word_explain_info{
    margin-top: .33rem;
}
.word_explain_info .word_fx{
    width: 1.33rem;
    height: 1.33rem;
    font-size: 1rem;
    color: #424040;
    background: url(../images/big_tian.png) no-repeat center;
    background-size: 1.32rem auto;
    text-align: center;
    line-height: 1.33rem;
    overflow: hidden;
    font-family: '楷体';
}
.user_info{
    margin-left: .2rem;
}
.user_info p {
    color: #9f9191;
    margin: 0.03rem 0;
}
.user_info p em{
    margin-right: .2rem;
    color: #424040;
}
.tips_result{
    width: 100%;
    /*height: .6rem;*/
    line-height: .5rem;
    background: #fdf5f4;
    color: #f16351;
    padding: .1rem .9rem;
    font-size: .3rem;
    text-align: center;
    margin-top: .3rem;
    box-sizing: border-box;
}
.up_names{
    margin-top: .4rem;
}
.left_names div{
    margin-right: .15rem;
}
.left_names h3{
    width: 1rem;
    height: 1rem;
    line-height: 1rem;
    font-size: .6rem;
    color: #424040;
    background: url(../images/x_tian.png) no-repeat center;
    background-size: 1rem auto;
    margin-right: .04rem;
    font-family: '楷体';
}
.left_names span p{
    font-size: .22rem;
    color: #9f9191;
    margin: 0.01rem 0;
}
.left_names span p em{
    color: #424040;
}
.r_grade{
    font-size: .8rem;
    color: #e25822;
}
.r_grade em{
    font-size: .35rem;
    color: #484848;
}
.names_explain{
    margin-top: .4rem;
    border-radius: .1rem;
    padding: .35rem .22rem;
    background: #fef8f2;
}
.names_explain b{
    color: #333333;
    margin-right: .1rem;
}
.names_explain span{
    flex: 1;
}
.names_explain span i{
    color: #b73422;
    font-style: initial;
}
.names_explain p{
    color: #424040;
    margin: .15rem 0;
}
.names_explain span strong{
    padding-right: .34rem;
    position: relative;
}
.names_explain span strong:after{
    content: '';
    width: .32rem;
    height: .32rem;
    position: absolute;
    right: 0;
    top:3px;
}

.names_explain span strong.mu{
    color: #569f5f;
}
.names_explain span strong.mu:after{
    background: url(../images/wx2.png) no-repeat;
    background-size: .32rem auto;
}

.names_explain span strong.huo{
    color: #ff0000;
}
.names_explain span strong.huo:after{
    background: url(../images/wx4.png) no-repeat;
    background-size: .32rem auto;
}

.names_explain span strong.jin{
    color: #ffdc19;
}
.names_explain span strong.jin:after{
    background: url(../images/wx1.png) no-repeat;
    background-size: .32rem auto;
}

.names_explain span strong.shui{
    color: #93b7ff;
}
.names_explain span strong.shui:after{
    background: url(../images/wx3.png) no-repeat;
    background-size: .32rem auto;
}

.names_explain span strong.tu{
    color: rgb(205,133,63);
}
.names_explain span strong.tu:after{
    background: url(../images/wx5.png) no-repeat;
    background-size: .32rem auto;
}
.result_item{
    border-bottom: 1px solid #f4f4f4;
    padding-bottom: .5rem;
    margin-bottom: .5rem;
}
.more_name{
    width: 94%;
    height: .82rem;
    line-height: .82rem;
    color: #fff;
    background: #b73422;
    display: block;
    font-size: .36rem;
    font-weight: bold;
    text-align: center;
    border-radius: .1rem;
    letter-spacing: 1px;
    max-width: 750px;
    margin: .55rem auto 0;
}

.footer_warp{
    width: 100%;
    height: 1.5rem;
    background: url(../images/footer_bg.jpg) no-repeat center;
    margin-top: .5rem;
    font-size: .28rem;
    text-align: center;
    line-height: 1.03rem;
}
.my_modal_bg{ position: fixed; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none; top: 0; left: 0; bottom: 0; right: 0; z-index: 9999; }

.Introduction_qm{
    max-width: 750px;
    margin: .5rem auto 0;
    box-shadow: 2px 3px 12px -1px #e5e5e5;
    border-radius: 10px;
    overflow: hidden;
}
.Introduction_qm img{
    width: 100%;
    display: block;
    margin: auto;
}

.result_name h3 i{
    width: .45rem;
    height: .18rem;
    display: inline-block;
    background: url(../images/bt_bg.png) no-repeat center;
    background-size: .45rem auto;
    vertical-align: middle;
}

.red_title{
    font-size: .32rem;
    padding: 0.03rem .4rem;
    background: #f16351;
    display: inline-block;
    border-radius: .5rem;
    margin-top: .4rem;
    color: #fff;
}

.table_warp{
    width: 100%;
    margin-top: .3rem;
}
.table_warp th{
    padding: 0 .1rem;
    color: #0f0e0e;
    line-height: .88rem;
    border: 1px solid #f9bcb5;
}

.wx_tool{
    margin-top: .35rem;
}
.wx_tool span{
    font-size: .28rem;
    margin-right: .3rem;
}
.wx_tool span i{
    width: .44rem;
    height: .44rem;
    display: block;
    vertical-align: middle;
}

.wx_tool span.jin{
    color: #ffdc19;
}
.wx_tool span.jin i{
    background: url(../images/wx1.png) no-repeat center;
    background-size: .44rem auto;
}

.wx_tool span.mu{
    color: #71b271;
}
.wx_tool span.mu i{
    background: url(../images/wx2.png) no-repeat center;
    background-size: .44rem auto;
}

.wx_tool span.shui{
    color: #93b7ff;
}
.wx_tool span.shui i{
    background: url(../images/wx3.png) no-repeat center;
    background-size: .44rem auto;
}

.wx_tool span.huo{
    color: #ff0000;
}
.wx_tool span.huo i{
    background: url(../images/wx4.png) no-repeat center;
    background-size: .44rem auto;
}

.wx_tool span.tu{
    color:rgb(205,133,63);;
}
.wx_tool span.tu i{
    background: url(../images/wx5.png) no-repeat center;
    background-size: .44rem auto;
}


.wx_p{
    margin-top: .2rem;
    color: #2e2a29;
    line-height: .5rem;
}
.wx_p i{
    color: #f16351;
    font-style: inherit;
}
.names_explain b{
    display: block;
    font-size: .34rem;
    margin-bottom: .1rem;
}
.names_explain p.flex{
    display: block;
}

.hmb_banner .banner_m{
    width: 100%;
    display: block;
}
.hmb_banner .banner_pc{
    display: none;
}

.tips_ajax{
    text-align: center;
    margin-top: .4rem;
}

/*pc样式*/
@media screen and (min-width: 1200px) {
    body{
        font-size: .38rem;
    }
    .logo_nav{
        width: 1079px;
        padding: 0;
    }
    .hmb_banner .banner_m{
        display: none;
    }
    .hmb_banner .banner_pc{
        display: block;
    }
}
@media screen and (min-width: 1024px) {
    .wx_p{
        line-height: .6rem;
    }
    .tips_result{
        line-height: .6rem;
        padding: .1rem 0;
    }

    .names_explain b{
        display: inline-block;
    }
    .names_explain span strong{
        padding-right: .48rem;
    }
    .names_explain span strong:after{
        width: .44rem;
        height: .44rem;
    }
    .names_explain span strong.jin:after,
    .names_explain span strong.mu:after,
    .names_explain span strong.shui:after,
    .names_explain span strong.huo:after,
    .names_explain span strong.tu:after{
        background-size: .44rem auto;
    }

    .r_grade{
        font-size: 1.1rem;
    }
    .result_item.fu_xing .left_names h3{
        width: 1rem;
        height: 1rem;
        line-height: 1rem;
        font-size: .65rem;
        background-size: 1rem auto;
        margin-right: 0.2rem;
    }

    .footer_warp{
        height: 2.8rem;
        line-height: 2rem;
        font-size: .32rem;
    }
    .word_explain_info .word_fx{
        width: 2.86rem;
        height: 2.86rem;
        line-height: 2.86rem;
        background-size: 2.86rem auto;
        font-size: 1.8rem;
    }
    .user_info{
        margin-left: .34rem;
    }
    .user_info p{
        margin: 0.17rem 0;
    }
    .submit_btn button,.submit_btn a{
        font-size: .45rem;
    }
    #PoPy ._citys0 li{
        font-size: .34rem;
    }
    #PoPy ._citys1 a{
        height: .8rem;
        line-height: .8rem;
        margin: 3% 0 0 4%;
        font-size: .32rem;
        cursor: pointer;
    }
    .left_names h3{
        width: 1.3rem;
        height: 1.3rem;
        line-height: 1.3rem;
        font-size: .75rem;
        background-size: 1.3rem auto;
        margin-right: .2rem;
    }
    .left_names div{
        margin-right: .25rem;
    }
    .left_names span p{
        font-size: .3rem;
    }
    .up_names{
        margin-top: .6rem;
    }
    .names_explain{
        padding: 0.35rem 0.42rem;
    }

    .more_name{
        height: 0.96rem;
        line-height: .96rem;
    }

    /*#PoPy{background: none}*/
    #PoPy ._citys1{height: auto}
    #PoPy ._citys0{padding-top: 0}
    #PoPy ._citys1 a{border:0}
    #PoPy ._citys0 .citySel{
        border-bottom: 2px solid #17925c !important;
        color: #17925c !important;
    }
    #PoPy ._citys0::after{content: '';}
    #PoPy ._citys{
        width: 568px!important;
        height: 329px !important;
        top: 50%;
        margin-top: -150px;
    }
    #PoPy{ position: fixed !important; left: 0 !important; right: 0 !important; top: 0 !important; bottom: 0 !important; margin: auto;  }
    ._citys{ width: auto !important; border: 0 !important; padding: 0 !important; background: #373d41 !important; border-radius: 3px !important; display: block !important; }
    ._citys span{position: fixed !important; left: 0 !important; right: 0 !important; top: 0 !important; bottom: 0 !important; text-indent: -300px !important; border: 0 !important; width: auto !important; height: auto !important; cursor: auto !important; text-align: left !important; overflow: hidden !important;}
    .citySel,.AreaS{background-color: #17925c !important; color: #fff !important; }
    ._citys0,._citys1{position: relative !important; z-index: 1 !important; }
    ._citys0{ border-bottom-color: #17925c !important; border-top-left-radius: 3px !important; overflow: hidden !important; height: auto !important;}
    ._citys0 li{ height: 38px !important; line-height: 38px !important; }
    ._citys1{ padding-top:5px !important; min-height: 80px !important; }
    ._citys1 a{width: 83px !important; font-size: 14px !important; background: #282c2f !important; color: #dfe0e0 !important; border-radius: 3px !important; margin: 5px 0 0 10px !important; }
    ._citys1 a:hover{color: #fff !important; background-color: #17925c !important; }

}

/*手机端*/
@media screen and (orientation:portrait) {
    .left_names span{
        display: none;
    }
    .form_bbqm .item_input input{
        width: 60%;
    }
    .form_bbqm,.result_name{
        width: 100%;
        padding: 0.6rem .44rem;
    }


    .logo_nav{
        width: 100%;
        height: 100%;
        padding: 0 20px;
        box-sizing: border-box;
    }
    .hmb_nav{
        height: 100%;
        display: flex;
        align-items: center;
    }
    .hmb_nav a{
        display: block;
        font-size: .3rem;
        border: 0;
        padding-right: 0;
    }
    .logo_nav a img{
        height: 49px;
    }
    .head_bg{
        height: 60px;
        background-size: 100% auto;
    }
    .znqm_bg{
        width: 100%;
        height: 190px;
        background-size: 100% auto;
    }
}
.none{display: none}