@charset "utf-8";
* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    height: 100%;
    background: transparent;
    position: relative;
    margin: 0 auto;
    /*text-align: center;*/
    padding: 0;

}
.yahu section {
    position: relative;
    width: 100%;
    min-width: 1220px;
    max-width: 100%;
    font-size: 16px;
}
.container {
    position: relative;
    width: 1220px;
    margin: 0 auto;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    line-height: 1.5;
}

h1 {
    font-size: 50px;
}

h2 {
    font-size: 40px;
}

h3{
    font-size: 24px;
}
h4 {
    font-size: 20px;
}
p {
    font-size: 16px;
    line-height: 1.75;
}
.fl{
    float: left;
}
.fr{
    float: right;
}
.pc{
    display: block;
    margin: 0px auto;
}
.mobile{
    display: none;
}
.txt1{
    color: #333;
    font-size: 16px;
    line-height: 35px;
}
/*banner*/

#banner{
    position: relative;
    height: 500px;
    background: url("/project/yahu/images/bannerbg.png") no-repeat center center;
    background-size: cover;
    margin: 0 auto;
}
#banner .fl,#banner .fr{
    width: 50%;
}
#banner .fr{
    text-align: center;
    margin: 0 auto;
}
#banner .fr img{
    margin-top: 160px;
}
#banner h3{
    color: #8fccfa;
    padding-top: 30px;
}
#banner h1{
    color: #fff;
    padding-top: 35px;
    font-weight: 800;
}
#banner .h2txt{
    color: #0087e8;
    padding-top: 25px;
    font-size: 30px;
    line-height: 1.8;
    font-weight: 700;
}
#banner .txt1{
    color: #fff;
    padding-top: 35px;
 }
#banner .txt1 br{
    display: none;
}
.groupbtn {
    width: 100%;
    margin: 0 auto;
}
.bframe{
    width: 286px;
    height: 64px;
    line-height: 64px;
    border: none;
    background: linear-gradient(#15639c,#2095eb);
    padding: 0;
    margin-top: 20px;
    margin-bottom: 80px;
    box-sizing: border-box;
}
.bf_b{
    border: 3px solid #fff;
    background: none;
    margin-left: 20px;
}
.bframe a{
    display: block;
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 20px;
    line-height: 40px;
}

#blush{
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
    background: #e6e6e6;
    text-align: center;
}
#blush h2,#benefit h2,#L_benefit h2,
#w_into h2{
    color: #2097f0;
    padding: 80px 0 0;
}
#blush h2 span{
    font-weight: bold;
}
#blush .big_img{
    margin: 70px auto;
}
#blush .wbtn{
    width: 289px;
    height: 47px;
    line-height: 47px;
    background: none;
    border: 4px solid #000;
    border-radius: 20px;
    box-sizing: border-box;
}
#blush .wbtn a{
    font-size: 24px;
    display: inline-block;
    color:#000;
    text-align: center;
    margin: 0px auto;
}

#benefit{
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
    background: #dceafc;
    text-align: center;
    margin: 0 auto;
}
#benefit h2 br{
    display: none;
}
.min_img{
    margin-top: 50px;
    margin-bottom: 20px;
}
.bg_img{
    position: relative;
    height:763px;
    background: url("/project/yahu/images/benefit2.png") no-repeat center center;
    overflow: hidden;
}
 .zwl{
     position: absolute;
    width: 310px;
    height: 239px;
    top:160px;
    left: 25px;
}
.zwl h4{
    display: block;
    color: #b50046;
    z-index: 10;
    margin-left: -70px;
    margin-top: -10px;
    font-weight: bold;
    letter-spacing: 4px;
}
.zwl .c_box{
    width: 283px;
    height: 104px;
    margin-left: 82px;
    margin-top: 10px;
    background: rgba(181,0,70,.46);
    border-radius: 10px;
    z-index: 9;
}
.zwl .c1{
    height: 100px;
    margin-top: 6px;
}
.zwl .c_box p,.zpg .c_box p,
.zyf .c_box p,.zcj .c_box p{
    color: #fff;
    line-height: 24px;
    padding:10px;
    text-align: justify;
}
.zwl img{
    z-index: 8;
    margin-left: -140px;
    margin-top: -245px;
}
.zpg{
    position: absolute;
    width: 368px;
    height: 249px;
    top:160px;
    left: 600px;
}
.zpg h4{
    display: block;
    color: #92e04c;
    z-index: 10;
    margin-left: 100px;
    margin-top: -6px;
    font-weight: bold;
    letter-spacing: 4px;
}
.zpg .c_box{
    width: 283px;
    height: 104px;
    margin-left: 198px;
    margin-top: 10px;
    background: rgba(67,112,26,.46);
    border-radius: 10px;
    z-index: 9;
}
.zpg .c1{
    height: 100px;
    margin-top: 6px;
}
.zpg img{
    z-index: 8;
    margin-left: -5px;
    margin-top: -242px;
}
.zyf{
    position: absolute;
    width:310px;
    height: 238px;
    top:370px;
    left: 393px;
}
.zyf h4{
    display: block;
    color: #db0cf3;
    margin-left: -10px;
    margin-top: -8px;
    font-weight: bold;
    letter-spacing: 4px;
}
.zyf .c_box{
    width: 283px;
    height: 104px;
    margin-left: 115px;
    margin-top: 10px;
    background: rgba(219,12,243,.46);
    border-radius: 10px;
    z-index: 9;
}
.zyf img{
    z-index: 8;
    margin-left: 0px;
    margin-top: -136px;
}
.zcj{
    position: absolute;
    width: 310px;
    height: 176px;
    top:0;
    left: 308px;
}
.zcj h4{
    display: block;
    color: #0062ac;
    margin-left: 95px;
    font-weight: bold;
    letter-spacing: 4px;
}
.zcj .c_box{
    width: 283px;
    height: 134px;
    margin-left: 165px;
    margin-top: 10px;
    background: rgba(0,98,172,.46);
    border-radius: 10px;
    z-index: 9;
}
.zcj img{
    z-index: 8;
    margin-left: 5px;
    margin-top: -165px;
}
#benefit .wbtn,#w_into .wbtn,#other .wbtn{
    width: 420px;
    height: 64px;
}
#benefit .wbtn{
    margin-top:10px;
}
#L_benefit{
    position: relative;
    width: 100%;
    height: 1150px;
    background: url("/project/yahu/images/L_bebg.png") no-repeat center center;
    background-size: cover;
    text-align: center;
    margin: 0px auto;
}
#L_benefit h2{
    color: #fff;
}
#L_benefit .txt1{
    color: #fff;
}
#L_benefit ul{
    width: 1220px;
    position: relative;
    margin: 0 auto;
    margin-top:80px ;
    text-align: center;
    overflow: hidden;
}
#L_benefit ul li{
    margin: 0 auto;
    float: left;
    width: 283px;
    height: 672px;
    margin-left: 25px;
}
#L_benefit ul li:first-child{
    margin-left:0;
}
#L_benefit ul li:hover{

    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    box-shadow: 0 0 10px 8px rgba(51,51,51,.5);
}
#L_benefit .wbox{
    height: 260px;
    background: #fff;
}
#L_benefit .wbox h4{
    color: #333;
    font-weight: bold;
    padding: 15px 37px 10px;
    text-align: justify;
}
#L_benefit .wbox p{
    padding: 0px 37px;
    color: #333;
    text-align: justify;
}
#L_benefit .bf_b{
    margin: 0px auto;
    margin-top: 65px;
}
#w_into{
    position: relative;
    width: 100%;
    height: 1422px;
    background: url("/project/yahu/images/w_bg.png") no-repeat center center;
    background-size: cover;
    text-align: center;
    margin: 0px auto;
}
#w_into h2{
    color: #2097ef;
}
#w_into .img_12{
    margin: 50px auto;
}
.w_s_box{
    position: relative;
    width: 100%;
    height: 527px;
    background:linear-gradient(#2095eb,#15639c) ;
    margin: 0px auto;
}
.w_s_box h3{
    font-size: 30px;
    color: #fff;
    padding-top: 30px;
    padding-bottom: 30px;
}
.w_s_box .swiper-slide{
    width:930px;
    margin: 0px auto;
    text-align: center;
    overflow: hidden;
}
.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 33px;
    height: 60px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 33px 60px;
    background-position: center;
    background-repeat: no-repeat;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    background: url(../images/lrow.png);
    left: 70px;
    right: auto;
    top:150px;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    background: url("/project/yahu/images/rrow.png");
    right: 70px;
    left: auto;
    top:150px;
}
#w_into .txt1{
    padding-bottom: 50px;
    padding-top: 50px;
}

#other{
    position: relative;
    width: 100%;
    height: 1636px;
    background: url("/project/yahu/images/other_bg.png") no-repeat center center;
    background-size: cover;
    text-align: center;
    margin: 0px auto;
    overflow: hidden;
}
/*.swiper2{*/
    /*height: 570px;*/
/*}*/

/*.swiper2 .i_box{*/
    /*!*width: 387px;*!*/
    /*height:540px;*/
    /*background: url("../images/wxg.png") no-repeat;*/
    /*overflow: hidden;*/
/*}*/
/*.swiper2 .i_box1{*/
    /*!*width: 387px;*!*/
    /*height:540px;*/
    /*background: url("../images/lb.png") no-repeat;*/
    /*overflow: hidden;*/
/*}*/
/*.swiper2 .i_box2{*/
    /*!*width: 387px;*!*/
    /*height:540px;*/
    /*background: url("../images/zzh.png") no-repeat;*/
    /*overflow: hidden;*/
/*}*/
/*.swiper2 .i_box3{*/
    /*!*width: 387px;*!*/
    /*height:540px;*/
    /*background: url("../images/crw.png") no-repeat;*/
    /*overflow: hidden;*/
/*}*/
#other .img_box{
    margin: 0px auto;
    margin-top: 105px;
}
#other .img_box li{
    width: 33.33%;
    height: 540px;
    float: left;
    background: url("/project/yahu/images/lb.png") no-repeat;
}
#other .img_box li:first-child{
    background: url("/project/yahu/images/wxg.png") no-repeat;
}
#other .img_box li:last-child{
    background: url("/project/yahu/images/zzh.png") no-repeat;
}
/*.swiper2 h4{*/
    /*color: #0087ee;*/
    /*padding-top: 265px;*/
    /*font-weight: bold;*/
/*}*/
/*.swiper2 .ptx{*/
    /*color: #333;*/
/*}*/
/*.swiper2 h5{*/
    /*font-size: 16px;*/
    /*font-weight: 700;*/
    /*color: #333;*/
    /*padding-top: 25px;*/
    /*padding-bottom: 5px;*/
/*}*/
/*.swiper2 .ptxt{*/
    /*!*display: inline-block;*!*/
    /*padding: 0px 50px;*/
    /*font-weight: lighter;*/
    /*text-align: justify;*/
    /*color: #333;*/
/*}*/
/*.swiper2 .l_img{*/
    /*margin-top: 22px;*/
/*}*/
/*.swiper-container-horizontal>.swiper-pagination-bullets,*/
/*.swiper-pagination-custom, .swiper-pagination-fraction {*/
    /*bottom: 0;*/
    /*left: 0;*/
    /*width: 100%;*/
/*}*/
#other .img_box li h4{
    color: #0087ee;
    padding-top: 265px;
    font-weight: bold;
}
#other .img_box li .ptx{
    color: #333;
}
#other .img_box li h5{
    font-size: 16px;
    font-weight: 700;
    color: #333;
    padding-top: 25px;
    padding-bottom: 5px;
}
#other .img_box li .ptxt{
    display: inline-block;
    width: 312px;
    font-weight: lighter;
    text-align: justify;
    color: #333;
}
#other .img_box li .l_img{
    margin-top: 22px;
}

#other .line_img{
    margin-top:70px;
}
#other h2{
    color: #0087ee;
    font-weight: bold;
    padding: 55px 0;
}
#other .line_box{
    width: 912px;
    height: 77px;
    line-height: 77px;
    border-top: 1px solid #0087ee;
    border-bottom:1px solid #0087ee;
    margin: 0px auto;
}
#other .line_box .h4txt{
    font-size: 20px;
    color: #333;
    line-height: 77px;
}
.li_w{
    width: 912px;
    overflow: hidden;
    margin: 0px auto;
    margin-top: 40px;
    margin-bottom: 80px;
}
.li_w .li_box{
    width: 210px;
    height: 150px;
    background: #0087ee;
    float: left;
    margin-right: 23px;
    cursor: pointer;
}
.li_w .li_box:last-child{
    margin-right: 0;
}
.li_w .li_box h4{
    color: #fff;
    padding-top: 30px;
}
.li_w .li_box i{
    display: block;
    line-height: 0;
}
.li_w .li_box i:after{
    content:url("/project/yahu/images/line1.png");
}
.li_w .li_box .h4tx{
    font-size: 20px;
    color: #fff;
    padding-top: 20px;
}
.li_w .li_box:hover{
    background: #fff;
    border: 1px solid #0087ee;
}
.li_w .li_box:hover i:after{
    content:url("/project/yahu/images/line2.png");
}
.li_w .li_box:hover h4,.li_w .li_box:hover .h4tx{
    color: #0087ee;
}


@media (max-width:768px){
    .yahu section {
        min-width: 100%;
        max-width: 100%;
    }
    .container {
        width: 100%;
    }
    h1 {
        font-size: 36px;
    }

    h2 {
        font-size: 28px;
    }

    h3{
        font-size: 22px;
    }
    h4 {
        font-size: 18px;
    }
    p {
        font-size: 16px;
        line-height: 1.75;
    }
    .pc{
        display: none;
    }
    .mobile{
        display: block;
    }
    #banner{
        position: relative;
        height: 500px;
        background: url("/project/yahu/images/mbannerbg.jpg") no-repeat center center;
        background-size: cover;
        overflow: hidden;
    }
    #banner .fl,#banner .fr{
        float: none;
        width: 100%;
     }
    #banner h3{
        padding: 0 5%;
        padding-top: 90px;
        padding-bottom: 30px;
    }
    #banner h1 {
        color: #fff;
        font-size: 42px;
        padding: 0 5%;
    }
    #banner .h2txt{
        font-size: 20px;
        padding:3% 5% ;
    }
    #banner .txt1{
        padding:3% 5% 0;
        line-height: 1.6;
        font-size: 16px;
    }
    #banner .txt1 br{
        display: block;
    }
    .groupbtn{
        margin-bottom:20px;
    }
    .bframe {
        width: 164px;
        height: 37px;
        line-height: 37px;
        border: none;
        background: linear-gradient(#15639c,#2095eb);
        padding: 0;
        margin-left: 5%;
        margin-top: 20px;
        margin-bottom: 80px;
        box-sizing: border-box;
    }
    .bf_b {
        border: 1px solid #fff;
        background: none;
        margin-left: 10px;
    }
    .bframe a {
        font-size: 16px;
        line-height: 37px;
    }

    .htxt {
        font-size: 16px;
        line-height: 1.75;
        padding: 0 5%;
        text-align: justify;
    }
    #banner .mobile img{
        position: absolute;
        margin-top: -72%;
        margin-left: 62%;
    }
    #blush {
        background: #fff;
    }

    #blush h2, #benefit h2, #L_benefit h2, #w_into h2 {
        color: #2097f0;
        padding: 8% 5%;
    }
    #blush .y_list{
        width: 100%;
        margin: 0px auto;
    }
    .y_on{
        width: 100%;
        height: 40px;
        background: #2097f0;
        margin-bottom: 1px;
        text-align: left;
        padding: 0px 30px;
    }
    .y_on p{
        display: inline-block;
        width: 300px;
        color: #fff;
        line-height: 40px;
    }

    .cb{
        background: #197fcc;
    }
    .y_in{
        height: 255px;
        background: url("/project/yahu/images/mybg.png") no-repeat center center;
        background-size: cover;
    }
    .y_in .y_title{
        color: #333;
        /*height: 28px;*/
        /*line-height: 28px;*/
        padding-top: 20px;
    }
    .y_in .y_title i{
        display: inline-block;
        width: 24px;
        height: 21px;
        background: url("/project/yahu/images/ld.png") no-repeat;
        text-align: center;
    }
    .y_in .y_title b{
        display: inline-block;
        width: 24px;
        height: 21px;
        background: url("/project/yahu/images/rd.png") no-repeat;
        text-align: center;
    }
    .y_txt{
        padding: 0px 60px;
        text-align: justify;
    }
    #blush .bframe,#benefit .bframe{
        margin-bottom: 0;
    }
    #blush .wbtn ,#benefit .wbtn{
        width: 208px;
        height: 39px;
        line-height: 39px;
        background: linear-gradient(#2095eb,#15639c);
        border: none;
        border-radius: 0;
        box-sizing: border-box;
        margin-left: 0;
    }
    #blush .wbtn a,#benefit .wbtn a{
        font-size: 16px;
        color: #fff;
    }
    #benefit{
        background: #fff;
    }
    #benefit h2 br{
        display:block;
    }
    #benefit .txt1 br{
        display: none;
    }
    #benefit .txt1{
        padding:0 5% 2%;
        text-align: justify;
    }
    .tab_box{
        margin: 0 auto;
        overflow: hidden;
        margin-bottom: 20px;
    }
    .tab_box ul,.tab_box .m_boxs{
        width: 300px;
        margin: 0px auto;
    }
    .tab_box .m_boxs{
        margin-bottom: 33px;
    }
    .tab_box ul li{
        float: left;
        width: 150px;
        height: 27px;
        background: #fff;
        border: 1px solid #2097f0;
    }
    .tab_box .m_boxs li{
        float: left;
        width: 75px;
        height: 33px;
        background: #fff;
        border: 1px solid #2097f0;
    }
    .tab_box ul .mat{
        background: #2097f0;
        box-sizing: border-box;
    }
    .tab_box ul li p{
        color: #000;
        height: 25px;
        line-height: 27px;
        text-align: center;
    }
    .tab_box .m_boxs li p{
        color: #000;
        height: 33px;
        line-height: 33px;
        text-align: center;
    }
    .tab_box ul .mat p,.tab_box .m_boxs .mat{
        color: #fff;
    }
    .tab_box_a{
        width: 300px;
        background: #dbd9d9;
        margin: 0px auto;
        margin-top: 27px;
    }
    .tab_box_a p{
        padding: 2%;
        font-size: 14px;
        text-align: justify;
    }
    .hide{
        display: none;
    }
    #benefit .groupbtn{
        margin-bottom: 60px;
    }
    #L_benefit{
        background: #fff;
        height: auto;
        margin-bottom: 50px;
        overflow: hidden;
    }
    .m_lbox{
        width: 301px;
        height: 890px;
        border: 1px solid #2097f0;
        margin: 0px auto;
        border-radius: 10px;
    }
    .m_lbox h3{
        font-size: 20px;
        font-weight: 900;
        color: #2099f3;
        line-height: 2.8;
    }
    #w_into{
        height:1055px;
        background: url("/project/yahu/images/mwbg.jpg") no-repeat center center;
        background-size: cover;
        margin: 0px auto;
        overflow: hidden;
    }
    .w_s_box{
        width: 298px;
        height: 329px;
        overflow: hidden;
    }
    .w_s_box h3 {
        font-size:18px;
        color: #fff;
        padding-top: 15px;
        padding-bottom: 10px;
    }
    .swiper-button-next, .swiper-button-prev {
        position: absolute;
        top: 50%;
        width: 14px;
        height: 26px;
        margin-top: -22px;
        z-index: 10;
        cursor: pointer;
        background-size: 14px 26px;
        background-position: center;
        background-repeat: no-repeat;
    }
    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        background: url(/project/yahu/images/mlr.png);
        left: 0;
        right: auto;
    }
    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        background: url(/project/yahu/images/mrr.png);
        right: 0;
        left: auto;
    }
    #w_into .txt1 {
       padding: 10px 36px;
        text-align: justify;
        line-height: 24px;
    }
    #w_into .txt1 br{
        display: none;
    }
    #w_into .groupbtn{
        margin-top: -20%;
    }
    #w_into .groupbtn .wbtn{
        margin-bottom: 0;
    }
    #w_into .groupbtn .wbtn,#other .groupbtn .wbtn{
        width: 274px;
        height: 42px;
        line-height: 42px;
        margin-left: 0;
    }
    #other{
        height: 1910px;
        background: url("/project/yahu/images/mother_bg.png") no-repeat center center;
        background-size: cover;
    }
    #other h2 {
        color: #0087ee;
        font-weight: bold;
        padding: 20px 0;
    }
    .m_box_m{
        position: relative;
        margin: 0px auto;
    }
    .m1{
        height:303px;
        background: url("/project/yahu/images/mwxg.png") no-repeat center center;
        background-size: contain;
        margin-bottom: 20px;
    }
    .m2{
        height:303px;
        background: url("/project/yahu/images/mlb.png") no-repeat center center;
        background-size: contain;
        margin-bottom: 20px;
    }
    .m3{
        height:303px;
        background: url("/project/yahu/images/mzzh.png") no-repeat center center;
        background-size: contain;
        margin-bottom: 20px;
    }
    .m4{
        height:303px;
        background: url("/project/yahu/images/mcrw.png") no-repeat center center;
        background-size: contain;
        margin-bottom: 20px;
    }
    .m_box_m h4{
        color: #0087ee;
        font-size: 16px;
        font-weight: 900;
    }
    .m_box_m h5{
        padding-top: 50px;
        font-size: 16px;
        font-weight: 900;
    }
    .m_box_m .ptx{
        font-size: 16px;
        font-weight: 900;
    }
    .m_box_m .ptxt{
        padding: 0px 12%;
        text-align: justify;
        line-height: 24px;
    }
    .m1 h4,.m3 h4{
        padding-top: 60px;
    }
    .m1 h4,.m1 .ptx,.m3 h4,.m3 .ptx{
        padding-left: 120px;
    }
    .m2 h4,.m4 h4{
        padding-top: 60px;
    }
    .m2 h4,.m2 .ptx,.m4 h4,.m4 .ptx{
        padding-right: 120px;
    }
    .l_img{
        margin-top: 10px;
        margin-left: 180px;
    }
    #other .line_box {
        width: 300px;
        height: 36px;
        line-height: 36px;
        border-top: 1px solid #0087ee;
        border-bottom: 1px solid #0087ee;
        margin: 0px auto;
    }
    #other .line_box .h4txt {
        font-size: 13px;
        color: #333;
        line-height: 36px;
    }
    .li_w {
        width: 300px;
        overflow: hidden;
        margin: 0px auto;
        margin-top: 10px;
        margin-bottom: 20px;
    }
    .li_w .li_box {
        width: 300px;
        height: 32px;
        background: #0087ee;
        float: none;
        margin-right: 0;
        cursor: pointer;
        margin-bottom: 10px;
    }
    .li_w .li_box i:after {
        content: "";
    }
    .li_w .li_box:hover i:after{
        content:"";
    }
    .li_w .li_box h4 {
        color: #fff;
        line-height: 32px;
        padding-top: 0px;
    }

}