*{margin: 0;padding: 0;}

a{
    color: #333;
}
.error{
    border: 1px solid red!important;
}
.mr_0{
    margin-right: 0!important;
}

.error{
    border: 1px solid red!important;
}
.header{
    background-color: #fff;
    height: 60px;
    width: 63%;
    min-width: 870px;
    margin: 0 auto;
}
.header .logo{
    display: inline-block;
    width: 10%;
    height: 60px;
}
.header .logo img{
    display: inline-block;
    width: 90%;
    margin-top: 11px;
}
.parentmenu{
    width: 65%;
}
.parentmenu li{
    list-style: none;
    width: 14%;
    float: left;
    text-align: center;
    height: 60px;
    line-height: 60px;
}
.parentmenu li a{
    font-size: 16px;
    padding-bottom: 10px;
}
.parentmenu li a:hover{
    color: #fa7566;
    border-bottom: 1px solid #fa7566;
}
.header span{
    font-size: 16px;
    margin-top: 19px;
    color: #fa7566;
    background: url(images/tell.png) no-repeat left center;
    padding-left: 30px;
}
img.m_bannerImg{
    display: none;
}
/*手机品牌区*/
.mobiles{
    background-color: #f6f6f6;
    overflow: hidden;
}
.mobiles .wrap{
    width: 63%;
    min-width: 1200px;
    margin: 4% auto 0;
}
.mobiles li{
    width: 19.2%;
    height: 200px;
    border: 1px solid #ececec;
    margin-bottom: 1%;
    margin-right: 1%;
    background-color: #fff;
    position: relative;
    transition: all .4s linear;
    bottom: 0;
}
.mobiles li:hover{
    bottom: 1px;
    box-shadow: 0 0 10px 2px #999999;
}
.mobiles p{
    height: 50px;
    padding: 0 10px;
    border-top: 1px solid #ececec;
    line-height: 50px;
    font-size: 14px;
}
.mobiles p span{
    float: left;
}
.mobiles p label{
    float: right;
    color: #f10215;
}
.mobiles h3{
    height: 50px;
    padding-top: 15px;
}
.mobiles h3 i{
    display: block;
    height: 20px;
    width: 100%;
    background-size: auto 20px;
}
.mobiles h3.icon01 i{
    background: url("images/icon01.png") no-repeat center center;
}
.mobiles h3.icon02 i{
    background: url("images/icon02.png") no-repeat center center;
}
.mobiles h3.icon03 i{
    background: url("images/icon03.png") no-repeat center center;
}
.mobiles h3.icon04 i{
    background: url("images/icon04.png") no-repeat center center;
}
.mobiles h3.icon05 i{
    background: url("images/icon05.png") no-repeat center center;
}
.mobiles h3.icon06 i{
    background: url("images/icon06.png") no-repeat center center;
}
.mobiles h3.icon07 i{
    background: url("images/icon07.png") no-repeat center center;
}
.mobiles h3.icon08 i{
    background: url("images/icon08.png") no-repeat center center;
}
.mobiles h3.icon09 i{
    background: url("images/icon09.png") no-repeat center center;
}
.mobiles h3.icon10 i{
    background: url("images/icon10.png") no-repeat center center;
}
.mobiles h3.icon11 i{
    background: url("images/icon11.png") no-repeat center center;
}
.mobiles h3.icon12 i{
    background: url("images/icon12.png") no-repeat center center;
}
.mobiles h3.icon13 i{
    background: url("images/icon13.png") no-repeat center center;
}
.mobiles h3.icon14 i{
    background: url("images/icon14.png") no-repeat center center;
}
.mobiles h3.icon15 i{
    background: url("images/icon15.png") no-repeat center center;
}
.mobiles .notice{
    clear: both;
    text-align: center;
    font-size: 14px;
    color: #888;
    margin: 25px 0;
}
.mobiles .notice span{
    vertical-align: -5px;
}
.mobiles .btn_more{
    font-size: 16px;
    color: #888;
    text-align: center;
    cursor: pointer;
    display: none;
}
.mobiles .samsung{
    width: 97px;
    line-height: 23px;
    text-align: right;
}
.mobiles .samsung i{
    font-style: normal;
}
.mobiles .vivo{
    width: 78%;
    text-align: right;
}
.mobiles .vivo i{
    font-style: normal;
}
/*远程操作流程*/
.farStep{
    background-color: #01b5ac;
    overflow: hidden;
}
.m_engineer{
    color: #fff;
}
.m_engineer h2{
    font-size: 20px;
    letter-spacing: 0.3rem;
    margin-bottom: 10px;
    font-family: '黑体';
}
.m_engineer p{
    margin-bottom: 13px;
}
.m_engineer span{
    border: 1px solid #fff;
    padding: 2px 10px;
    border-radius: 15px;
}
.farStep h3{
    font-weight: 400;
    font-size: 40px;
    color: #fff;
    margin: 5% 0;
}
.steps{
    width: 64%;
    padding: 0 3%;
    min-width: 870px;
    margin: 0 auto;
}
.engineer{
    width: 69%;
    padding: 0 3%;
    min-width: 870px;
    margin: 0 auto;
}
.steps img,.engineer img{
    width: 100%;
}
.engineer{
    margin-top: 3%;
}
.farStep .p_step{display: block;}
.farStep .m_step{display: none;}
.farStep .p_engineer{display: block;}
.farStep .m_engineer{display: none;}
/*我要预约*/
.bookOrder .wrap{
    width: 54%;
    min-width: 670px;
    margin: 0 auto;
    overflow: hidden;
}
.bookOrder .wrap h3{
    font-size: 36px;
    text-align: center;
    font-weight: 400;
    margin: 6% 0 5%;
}
.bookOrder .wrap li{
    height: 50px;
    margin-bottom: 20px;
}
.bookOrder .wrap li>label{
    line-height: 50px;
    display: inline-block;
    width: 15%;
    min-width: 80px;
    text-align: center;
}
.bookOrder .wrap li input[type=text]{
    height: 50px;
    border: 1px solid #ececec;
    font-size: 16px;
    border-radius: 0;
}
.select_models input{
    padding-left: 15px;
    width: 85%;
    border-radius: 0;
}
.table_div{
    width: 85%;
    display: inline-block;
    float: right;
    height: 100%;
}
.table_div textarea{
    width: 66%;
    height: 50px;
    padding: 13px 10px;
    border: 1px solid #ececec;
    font-size: 16px;
    resize: none;
    outline: none;
    box-shadow:0px 0px 0px rgba(0,0,0,0);
    -webkit-appearance:none;
    font-family: "Microsoft YaHei","Arial Narrow",HELVETICA;
}
.table_div .qqNum{
    width: 32%;
    margin-right: 2%;
    float: left;
    padding-left: 10px;
}
.areaName,.emlay{
    width: 32%;
    border: 1px solid #ececec;
    float: left;
    height: 100%;
    padding-left: 10px;
    position: relative;
}
.areaName:after{
    content: '';
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url(images/arrow_down.png) no-repeat center center;
    position: absolute;
    right: 15px;
    top: 17px;
}
.emlay input{
    width: 100%;
    padding-left: 15px;
}
.City,.mobilePhone{
    margin: 0 2%;
}
.areaName span{
    display: inline-block;
    height: 100%;
    width: 100%;
    line-height: 46px;
}
.yzm{
    width: 20%;
}
.yzm_img{
    float: right;
    display: inline-block;
    width: 12%;
    height: 100%;
}
.agreement{
    padding-left: 15%;
}

input[type="checkbox"] + label::before {
    margin-right: 3px;
    content: '';
    width: 16px;
    height: 16px;
    background: #999;
    display: inline-block;
    vertical-align: -2px;
}
input[type="checkbox"]:checked + label::before {
    background: url(images/img3.png) no-repeat!important;
}
.btn{
    display: block;
    width: 280px;
    height: 55px;
    background-color: #f10215;
    margin: 0 auto 6%;
    font-size: 22px;
    color: #fff;
    outline: none;
}
.btn{
    display: block;
    width: 280px;
    height: 55px;
    background-color: #f10215;
    margin: 0 auto 6%;
    font-size: 22px;
    color: #fff;
    cursor: pointer;
}
/*我要预约--隐藏地区选框样式*/
.areaBox{
    width: 315%;
    border: 1px solid #ececec;
    position: absolute;
    top: 48px;
    left: -1px;
    background-color: #fff;
    z-index: 9999;
    padding: 10px 5px;
}
.bookOrder .wrap .areaBox li{
    padding: 8px 14px;
    line-height: 20px;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 0;
    height: 36px;
}
.areaBox li:hover{
    color: #fa7566;
}
.cityBox{
    left: -107.5%;
}
.countyBox{
    left: -214.5%;
}
.bookOrder .m_area{
    display: none;
}
.bookOrder .m_area>div{
    border: 1px solid #ececec;
    height: 50px;
    line-height: 50px;
    padding:0 10px;
    color: #888;
    font-size: 16px;
}
.bookOrder .wrap .areaBox .m_areaTitle{
    text-align: center;
    color: #ff5500;
    font-size: 18px;
    display: none;
}
.bookOrder .m_areaTitle i{
    margin-top: -4px;
    font-size: 28px;
    font-style: normal;
    color: #333;
}
/*滚动字幕*/
.scroll_news_l li {
    height: 44px;
    line-height: 44px;
    font-size: 12px;
    color: rgb(153, 153, 153);
    overflow: hidden;
}
.scroll_news_l li p {
    width: 33%;
    float: left;
    text-align: center;
}
.scroll_news {
    margin: 0 auto 40px;
    width: 54%;
    min-width: 870px;
    height: 44px;
    overflow: hidden;
    background-color: #fff;
}
.scroll_news_l li span {
    padding-right: 2em;
}
/*常见问题*/
.commonQuestion{
    background-color: #fdca1c;
    overflow: hidden;
    padding-bottom: 5%;
}
.commonQuestion .wrap{
    width: 64%;
    min-width: 990px;
    margin: 0 auto;
}
.commonQuestion h3{
    color: #fff;
    font-size: 38px;
    font-weight: 400;
    text-align: center;
    margin: 5% 0;
}
.commonQuestion .ques{
    width: 43.3%;
    height: 320px;
}
.commonQuestion .ques h4{
    height: 60px;
    background-color: #fff;
    font-size: 20px;
    position: relative;
    padding-left: 8%;
    line-height: 60px;
    font-weight: 400;
}
.commonQuestion .ques h4:before{
    content: '';
    display: inline-block;
    height: 60px;
    width: 8px;
    background-color: #fdca1c;
    position: absolute;
    left: 10px;
    top: 0;
}
.commonQuestion .ques h4:after{
    content: '';
    display: inline-block;
    height: 0;
    width: 0;
    border-right: 30px solid #fdca1c;
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
    position: absolute;
    right: 0;
    top: 0;
}
.commonQuestion .ques p{
    margin-top: 40px;
    height: 222px;
    border: 1px solid #fff;
    padding: 30px 20px;
    font-size: 14px;
    line-height: 30px;
}
/*刷机注意事项*/
.note{
    padding: 0 0 4%;
}
.note .wrap{
    width: 63%;
    margin: 0 auto;
}
.note .wrap h3{
    text-align: center;
    margin: 5% auto;
    font-size: 38px;
    font-weight: 400;
}
.note .wrap p{
    font-size: 14px;
    line-height: 36px;
    color: #888;
}
.note .wrap p {
    position: relative;
    padding-left: 40px;
}
.note .wrap p span{
    position: absolute;
    left: 0;
    top: 0;
}
/*悬浮按钮--快速下单*/
.btn_fastBook{
    background: #fff;
    height: 56px;
    position: fixed;
    bottom: 0;
    padding-top: 8px;
    width: 100%;
    border-top: 1px solid #ccc;
    display: none;
}
.btn_fastBook a{
    background: #f10215;
    height: 40px;
    width: 70%;
    font-size: 18px;
    line-height: 40px;
    text-align: center;
    display: block;
    margin: 0 auto;
    color: #fff;
}
/*新增报价覆盖阴影*/
.bg_box{
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.4);
    position: absolute;
    top: 0;
    right: 0;
}
.bg_box a{
    display: block;
    height: 38px;
    text-align: center;
    line-height: 38px;
    background-color: #f10215;
    border-radius: 18px;
    width: 130px;
    margin: 81px auto 0;
    color: #fff;
    font-size: 16px;
}

@media screen and (max-width: 1800px){
    .vivo{min-width: 147px;}
    .header{min-width: 990px;}
}
@media screen and (max-width: 1200px){
    .header{min-width: 870px;}
    .parentmenu {width: 64%;}
    .header .parentmenu li a {font-size: 16px;}
    .header .parentmenu li {width: 15%;}
    .header span {font-size: 14px;margin-top: 20px;}
    .mobiles .wrap {width: 96%;min-width: 0;}
    .mobiles li {height: 165px;}
    .bg_box a{margin: 64px auto 0;}
    .mobiles p {height: 40px;line-height: 40px;}
    .mobiles h3{height: 40px;padding-top: 10px;}
    .mobiles .samsung{line-height: 17px;}
    .vivo{min-width: 90px;}
    .vivo .gray_1{position: absolute;right: 0;top: 7px;}
    .vivo .pri{position: absolute;top:-7px;right: 0;}
    .farStep h3{font-size: 20px;padding-top: 6px;}
    .commonQuestion .wrap{min-width: 870px;}
    .commonQuestion .ques p{line-height: 25px;}
}
@media screen and (max-width: 870px){
    .header{min-width: 0;width: 100%;padding: 0 3%;}
    .header .logo{width: 85px;}
    .header .logo img{width: 100%;margin-top: 12px;}
    .header span{background: none;color: #333;font-size: 16px;}
    .header span label{display: none;}
    img.m_bannerImg{display: block;}
    img.bannerImg{display: none;}
    .mobiles .wrap ul{height: 427px;overflow: hidden;margin-bottom: 20px;}
    .mobiles h3{height: 32px;padding-top: 6px;}
    .mobiles .vivo{line-height: 30px;}
    .mobiles li {width: 49%;margin-right: 0;height: 133px;margin-bottom: 10px;}
    .mobiles li:nth-child(2n-1){margin-right: 2%!important;}
    .mobiles p{font-size: 14px;height: 32px;line-height: 32px;}
    .mobiles .samsung {width: 94px;line-height: 15px;}
    .mobiles .notice{margin: 10px 0;}
    .farStep .steps,.farStep .engineer{width: 100%;min-width: 0;}
    .note .wrap {width: 95%;margin: 0 auto;padding-bottom: 40px;}
    .commonQuestion .wrap {min-width: 0;width: 90%;margin: 0 auto;}
    .commonQuestion .ques {width: 100%;height: auto;}
    .commonQuestion .ques p {border: 0;margin-top: 0;padding: 15px 0;height: auto;text-indent: 2em;}
    .commonQuestion .ques h4{font-size: 18px;height: 40px;line-height: 40px;}
    .commonQuestion .ques h4:after {border-right: 20px solid #fdca1c;border-top: 20px solid transparent;border-bottom: 20px solid transparent;}
    .bookOrder .wrap h3,.commonQuestion h3,.note .wrap h3 {font-size: 26px;}
    .bookOrder .wrap{min-width: 0;width: 94%;}
    .bookOrder .wrap li {margin-bottom: 10px;}
    .bookOrder .wrap .m_info{height: 110px;}
    .bookOrder .select_models input{width: 100%;}
    .bookOrder .m_userName,.bookOrder .m_Tell{width: 49%;float: left;margin: 0;}
    .bookOrder .m_userName{margin-right: 2%;}
    .bookOrder .m_yzm{width: 65%;margin-top: 10px;}
    .bookOrder .yzm_img{width: 35%;margin-top: 10px;height: 50px;}
    .bookOrder .table_div{width: 100%;}
    .bookOrder .wrap .p_area{height: 0;overflow: hidden;margin-bottom: 0;}
    .bookOrder .agreement {padding-left: 0;}
    .bookOrder .areaBox{width: 70%;height: 70%;position: fixed;left: 15%;top: 15%;background-color: #fff;z-index: 999;padding: 0;border: 1px solid #acacac;overflow: scroll;}
    .bookOrder .wrap .areaBox li{width: 100%;height: 40px;line-height: 40px;padding: 0 5%;border-top: 1px solid #ececec;}
    .bookOrder .m_area {display: list-item;}
    .bookOrder .qqNum{width: 100%;margin-bottom: 10px;}
    .bookOrder .wrap .otherInfoBox{height: 110px}
    .bookOrder textarea{width: 100%;}
    .farStep .m_engineer,.farStep .m_step,.bookOrder .wrap .areaBox .m_areaTitle,.btn_fastBook,.mobiles .btn_more{display: block;}
    .farStep .p_engineer,.farStep .p_step,.bookOrder .wrap li>label,.scroll_news,.header .parentmenu{display: none;}
    .btn {width: 200px;height: 45px;}
}
@media screen and (max-width: 330px){
    .mobiles p,.mobiles .notice{font-size: 12px;}
}
/*移动端地区选择样式*/
.areaContainer{
    height: 355px;
    width: 100%;
    color: #666;
    font-size: 16px;
    position: fixed;
    bottom: -355px;
    z-index: 9999;
    overflow: hidden;
}
.areaContainer h5{
    font-weight: 400;
    padding: 5px 11px;
}
.areaContainer h3{
    height: 40px;
    padding: 0 15px;
    background: #f8f9fa;
    line-height: 40px;
    font-size: 14px;
    font-weight: 400;
    border-bottom: #e0e0e0 solid 1px;
}
.areaContainer li h4{
    font-weight: 400;
    line-height: 44px;
}
.areaContainer .provinceName{
    height: 315px;
    float: left;
    width: 26%;
    overflow: scroll;
    background-color: #fff;
}
.provinceName li{
    background: #f8f9fa;
    border-right: 1px solid #e9ebee;
}
.areaContainer li.active h4{
    color: #f10215;
}
.provinceName li.active{
    border-left: 4px solid #f10215;
}
.areaContainer .cityName{
    float: left;
    width: 74%;
    background: #fff;
    padding-left: 15px;
    height: 315px;
    overflow: scroll;
}
.areaContainer li{
    float: left;
    width: 100%;
    border-bottom: #e9ebee solid 1px;
    overflow: hidden;
}
.areaContainer li ul:after{
    content: '';
    display: block;
    clear: both;
}
.areaContainer li li{
    border-radius: 5px;
    display: inline-block;
    background: #f8f9fa;
    border: #d4d8dd solid 1px;
    width: auto;
    margin: 0 15px 8px 0;
}/*移动端地区选择样式结束*/

/*弹框样式*/
.submitTip{
    overflow: hidden;
    text-align: center;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    background: rgba(0,0,0,.7);
    z-index: 9999999;
}
.tipContent{
    background: #fff;
    width: 74%;
    padding: 15px;
    border-radius: 15px;
    margin-left: 13%;
    margin-top: 40%;
}
.tipContent h3{
    font-size: 20px;
}
.tipContent p{
    font-size: 14px;
    margin: 10px 0;
}
.btn_index{
    width: 50%;
    padding: 8px 0;
    text-align: center;
    border: 1px solid red;
    border-radius: 8px;
    display: block;
    margin: 0 auto;
    font-size: 14px;
}